Merge branch 'master' into testing

# Conflicts:
#	js/build/shortcode-ui.js
#	js/src/shortcode-ui.js
#	js/src/utils/shortcode-view-constructor.js

composer.json

@@ -1,8 +1,9 @@
 {
-    "name": "fusioneng/Shortcake",
+    "name": "fusioneng/shortcake",
     "description": "Shortcake makes using WordPress shortcodes a piece of cake.",
     "type": "wordpress-plugin",
     "homepage": "https://github.com/fusioneng/Shortcake",
+    "license": "GPL-2.0+",
     "authors": [
         {
             "name": "Fusion",
@@ -11,7 +12,7 @@
         }
     ],
     "require-dev": {
-        "squizlabs/php_codesniffer": "2.x-dev",
+        "squizlabs/php_codesniffer": "2.9.*",
         "wp-coding-standards/wpcs": "dev-develop"
     },
     "scripts": {

inc/class-shortcode-ui.php

@@ -73,13 +73,52 @@ private function __construct() {
 	 * Setup plugin actions.
 	 */
 	private function setup_actions() {
+		add_action( 'admin_notices',             array( $this, 'action_admin_notices' ) );
 		add_action( 'admin_enqueue_scripts',     array( $this, 'action_admin_enqueue_scripts' ) );
 		add_action( 'wp_enqueue_editor',         array( $this, 'action_wp_enqueue_editor' ) );
 		add_action( 'media_buttons',             array( $this, 'action_media_buttons' ) );
 		add_action( 'wp_ajax_bulk_do_shortcode', array( $this, 'handle_ajax_bulk_do_shortcode' ) );
 		add_filter( 'wp_editor_settings',        array( $this, 'filter_wp_editor_settings' ), 10, 2 );
 	}
 
+	/**
+	 * Display an admin notice on activation.
+	 *
+	 * If no shortcodes with Shortcake UI are registered, this Will display a link to the plugin's wiki for examples.
+	 * If there are already plugins with UI registered, will just display a success message.
+	 *
+	 * @return void
+	 */
+	public function action_admin_notices() {
+		if ( ! get_option( 'shortcode_ui_activation_notice' ) ) {
+			return;
+		}
+
+		if ( ! $this->has_shortcodes() ) {
+			echo '<div class="notice notice-warning is-dismissable"><p>' .
+				sprintf(
+					wp_kses(
+						/* Translators: link to plugin wiki page with examples of shortcodes supporting Shortcake UI */
+						__( 'The Shortcode UI plugin will not do anything unless UI is registered for shortcodes through a theme or plugins. For examples, see <a href="%s" target="_blank">here</a>.', 'shortcode-ui' ),
+						array(
+							'a' => array(
+								'href' => array(),
+								'target' => array(),
+							),
+						)
+					),
+					'https://github.com/wp-shortcake/shortcake/wiki/Shortcode-UI-Examples'
+				) .
+				'</p></div>' . "\n";
+		} else {
+			echo '<div class="notice notice-info is-dismissable"><p>' .
+				esc_html__( 'Shortcode UI is installed. Try out the shortcode UI through the "Add Post element" button in the post edit screen.', 'shortcode-ui' ) .
+				'</p></div>' . "\n";
+		}
+
+		delete_option( 'shortcode_ui_activation_notice' );
+	}
+
 	/**
 	 * When a WP_Editor is initialized on a page, call the 'register_shortcode_ui' action.
 	 *
@@ -181,6 +220,15 @@ public function get_shortcodes() {
 		return $shortcodes;
 	}
 
+	/**
+	 * Whether any shortcodes with UI are registered
+	 *
+	 * @return bool
+	 */
+	public function has_shortcodes() {
+		return (bool) $this->get_shortcodes();
+	}
+
 	/**
 	 * Get UI configuration parameters for a given shortcode.
 	 *
@@ -305,6 +353,10 @@ public function action_wp_enqueue_editor() {
 	 * Output an "Add Post Element" button with the media buttons.
 	 */
 	public function action_media_buttons( $editor_id ) {
+		if ( ! $this->has_shortcodes() ) {
+			return;
+		}
+
 		printf( '<button type="button" class="button shortcake-add-post-element" data-editor="%s">' .
 			'<span class="wp-media-buttons-icon dashicons dashicons-migrate"></span> %s' .
 			'</button>',

inc/fields/class-shortcode-ui-field-attachment.php

@@ -106,7 +106,7 @@ public function action_shortcode_ui_loaded_editor() {
 
 					<button class="button button-small remove" data-id="{{ data.id }}">×</button>
 
-					<# if ( data.type === 'image' && data.sizes && data.sizes.thumbnail ) { #>
+					<# if ( data.sizes && data.sizes.thumbnail ) { #>
 						<div class="thumbnail">
 							<div class="centered">
 								<img src="{{ data.sizes.thumbnail.url }}" alt="" width="{{ data.sizes.thumbnail.width }}" height="{{ data.sizes.thumbnail.height }}" />

inc/templates/edit-form.tpl.php

@@ -54,11 +54,11 @@
 				<# if ( 'options' in option && 'label' in option ) { #>
 					<optgroup label="{{ option.label }}">
 						<# _.each( option.options, function( optgroupOption ) { #>
-							<option value="{{ optgroupOption.value }}" <# if ( ! _.isEmpty( _.filter( data.value, function(val) { return val === optgroupOption.value; } ) ) ) { print('selected'); } #>>{{ optgroupOption.label }}</option>
+							<option value="{{ optgroupOption.value }}" <# if ( _.contains( _.isArray( data.value ) ? data.value : data.value.split(','), optgroupOption.value ) ) { print('selected'); } #>>{{ optgroupOption.label }}</option>
 						<# }); #>
 					</optgroup>
 				<# } else { #>
-					<option value="{{ option.value }}" <# if ( ! _.isEmpty( _.filter( data.value, function(val) { return val === option.value; } ) ) ) { print('selected'); } #>>{{ option.label }}</option>
+					<option value="{{ option.value }}" <# if ( _.contains( _.isArray( data.value ) ? data.value : data.value.split(','), option.value ) ) { print('selected'); } #>>{{ option.label }}</option>
 				<# } #>
 
 			<# }); #>

js-tests/build/specs.js

@@ -840,7 +840,7 @@ Shortcode = Backbone.Model.extend({
 
 			// Encode textareas incase HTML
 			if ( attr.get( 'encode' ) ) {
-				attr.set( 'value', encodeURIComponent( decodeURIComponent( attr.get( 'value' ).replace( "%", "%" ) ) ), { silent: true } );
+				attr.set( 'value', encodeURIComponent( decodeURIComponent( attr.get( 'value' ).replace( /%/g, "%" ) ) ), { silent: true } );
 			}
 
 			attrs.push( attr.get( 'attr' ) + '="' + attr.get( 'value' ) + '"' );
@@ -1160,7 +1160,7 @@ var shortcodeViewConstructor = {
 	 *
 	 * @param {string} shortcodeString String representation of the shortcode
 	 */
-	edit: function( shortcodeString ) {
+	edit: function( shortcodeString, update ) {
 
 		var currentShortcode = this.parseShortcodeString( shortcodeString );
 
@@ -1170,37 +1170,25 @@ var shortcodeViewConstructor = {
 
 			if ( frame ) {
 				frame.mediaController.setActionUpdate( currentShortcode );
+				frame.mediaController.props.set( 'editor', wpActiveEditor );
 				frame.open();
 			} else {
 				frame = wp.media.editor.open( window.wpActiveEditor, {
 					frame : "post",
 					state : 'shortcode-ui',
 					currentShortcode : currentShortcode,
+					editor : wpActiveEditor,
 				});
 			}
 
+			frame.mediaController.props.set( 'insertCallback', function( shortcode ) {
+				update( shortcode.formatShortcode() );
+			} );
+
 			// Make sure to reset state when closed.
 			frame.once( 'close submit', function() {
-				frame.state().props.set('currentShortcode', false);
-				var menuItem = frame.menu.get().get('shortcode-ui');
-				menuItem.options.text = shortcodeUIData.strings.media_frame_title;
-				menuItem.render();
-				frame.setState( 'insert' );
+				frame.mediaController.reset();
 			} );
-
-			/* Trigger render_edit */
-			/*
-			 * Action run after an edit shortcode overlay is rendered.
-			 *
-			 * Called as `shortcode-ui.render_edit`.
-			 *
-			 * @param shortcodeModel (object)
-			 *           Reference to the shortcode model used in this overlay.
-			 */
-			var hookName = 'shortcode-ui.render_edit';
-			var shortcodeModel = this.shortcodeModel;
-			wp.shortcake.hooks.doAction( hookName, shortcodeModel );
-
 		}
 
 	},

js/build/shortcode-ui.js

@@ -88,7 +88,6 @@ var MediaController = wp.media.controller.State.extend({
 		}
 
 		this.reset();
-		this.resetState();
 		this.frame.close();
 	},
 
@@ -101,12 +100,11 @@ var MediaController = wp.media.controller.State.extend({
 		this.props.set( 'currentShortcode', null );
 		this.props.set( 'search', null );
 		this.props.set( 'insertCallback', this.insertCallback );
-	},
 
-	resetState: function() {
 		var menuItem = this.frame.menu.get().get('shortcode-ui');
 		menuItem.options.text = shortcodeUIData.strings.media_frame_title;
 		menuItem.render();
+
 		this.frame.setState( 'insert' );
 	},
 
@@ -398,7 +396,6 @@ $(document).ready(function(){
 		// Make sure to reset state when closed.
 		frame.once( 'close submit', function() {
 			frame.mediaController.reset();
-			frame.mediaController.resetState();
 		} );
 
 	} );
@@ -712,7 +709,6 @@ var shortcodeViewConstructor = {
 			// Make sure to reset state when closed.
 			frame.once( 'close submit', function() {
 				frame.mediaController.reset();
-				frame.mediaController.resetState();
 			} );
 		}
 
@@ -1560,6 +1556,11 @@ var wp = (typeof window !== "undefined" ? window['wp'] : typeof global !== "unde
 var postMediaFrame = wp.media.view.MediaFrame.Post;
 var mediaFrame = postMediaFrame.extend( {
 
+	events: _.extend( {}, postMediaFrame.prototype.events, {
+			'click .media-menu-item' : 'resetMediaController',
+		}
+	),
+
 	initialize: function() {
 
 		postMediaFrame.prototype.initialize.apply( this, arguments );
@@ -1590,12 +1591,6 @@ var mediaFrame = postMediaFrame.extend( {
 
 	},
 
-	events: function() {
-		return _.extend( {}, postMediaFrame.prototype.events, {
-			'click .media-menu-item' : 'resetMediaController',
-		} );
-	},
-
 	resetMediaController: function( event ) {
 		if ( this.state() && 'undefined' !== typeof this.state().props && this.state().props.get('currentShortcode') ) {
 			this.mediaController.reset();

js/src/controllers/media-controller.js

@@ -51,7 +51,6 @@ var MediaController = wp.media.controller.State.extend({
 		}
 
 		this.reset();
-		this.resetState();
 		this.frame.close();
 	},
 
@@ -64,12 +63,11 @@ var MediaController = wp.media.controller.State.extend({
 		this.props.set( 'currentShortcode', null );
 		this.props.set( 'search', null );
 		this.props.set( 'insertCallback', this.insertCallback );
-	},
 
-	resetState: function() {
 		var menuItem = this.frame.menu.get().get('shortcode-ui');
 		menuItem.options.text = shortcodeUIData.strings.media_frame_title;
 		menuItem.render();
+
 		this.frame.setState( 'insert' );
 	},
 

js/src/shortcode-ui.js

@@ -52,7 +52,6 @@ $(document).ready(function(){
 		// Make sure to reset state when closed.
 		frame.once( 'close submit', function() {
 			frame.mediaController.reset();
-			frame.mediaController.resetState();
 		} );
 
 	} );

js/src/utils/shortcode-view-constructor.js

@@ -188,7 +188,6 @@ var shortcodeViewConstructor = {
 			// Make sure to reset state when closed.
 			frame.once( 'close submit', function() {
 				frame.mediaController.reset();
-				frame.mediaController.resetState();
 			} );
 		}
 

js/src/views/media-frame.js

@@ -7,6 +7,11 @@ var wp = require('wp'),
 var postMediaFrame = wp.media.view.MediaFrame.Post;
 var mediaFrame = postMediaFrame.extend( {
 
+	events: _.extend( {}, postMediaFrame.prototype.events, {
+			'click .media-menu-item' : 'resetMediaController',
+		}
+	),
+
 	initialize: function() {
 
 		postMediaFrame.prototype.initialize.apply( this, arguments );
@@ -37,12 +42,6 @@ var mediaFrame = postMediaFrame.extend( {
 
 	},
 
-	events: function() {
-		return _.extend( {}, postMediaFrame.prototype.events, {
-			'click .media-menu-item' : 'resetMediaController',
-		} );
-	},
-
 	resetMediaController: function( event ) {
 		if ( this.state() && 'undefined' !== typeof this.state().props && this.state().props.get('currentShortcode') ) {
 			this.mediaController.reset();