Cleanup after [29179]:

* `_WP_Editors::editor_settings()` no longer needs to load MEjs styles
* Make sure each identical shortcode with multiple instances also has an iframe sandbox for each instance
* For the time being, make audio and video shortcodes bypass the loading placeholder to avoid whiplash visually

Props avryl, wonderboymusic.
See #28905.


git-svn-id: https://develop.svn.wordpress.org/trunk@29187 602fd350-edb4-49c9-b593-d223f7449a82

src/wp-includes/class-wp-editor.php

@@ -503,14 +503,10 @@ final class _WP_Editors {
 				$suffix = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ? '' : '.min';
 				$version = 'ver=' . $GLOBALS['wp_version'];
 				$dashicons = includes_url( "css/dashicons$suffix.css?$version" );
-				$mediaelement = includes_url( "js/mediaelement/mediaelementplayer.min.css?$version" );
-				$wpmediaelement = includes_url( "js/mediaelement/wp-mediaelement.css?$version" );
 
 				// WordPress default stylesheet and dashicons
 				$mce_css = array(
 					$dashicons,
-					$mediaelement,
-					$wpmediaelement,
 					self::$baseurl . '/skins/wordpress/wp-content.css?' . $version
 				);
 

src/wp-includes/js/mce-view.js

@@ -69,95 +69,115 @@ window.wp = window.wp || {};
 			);
 		},
 		unbind: function() {},
-		setContent: function( html, callback, option ) {
+		getNodes: function( callback ) {
+			var nodes = [];
+
 			_.each( tinymce.editors, function( editor ) {
-				var self = this;
 				if ( editor.plugins.wpview ) {
 					$( editor.getBody() )
 					.find( '[data-wpview-text="' + this.encodedText + '"]' )
-					.each( function ( i, element ) {
+					.each( function ( i, node ) {
-						var contentWrap = $( element ).find( '.wpview-content' ),
+						if ( callback ) {
-							wrap = element;
+							callback( editor, node );
-
-						if ( contentWrap.length && option !== 'wrap' ) {
-							element = contentWrap = contentWrap[0];
 						}
 
-						if ( _.isString( html ) ) {
+						nodes.push( node );
-							if ( option === 'replace' ) {
-								element = editor.dom.replace( editor.dom.createFragment( html ), wrap );
-							} else {
-								editor.dom.setHTML( element, html );
-							}
-						} else {
-							if ( option === 'replace' ) {
-								element = editor.dom.replace( html, wrap );
-							} else {
-								$( element ).empty().append( html );
-							}
-						}
-
-						if ( _.isFunction( callback ) ) {
-							callback( self, editor, $( element ).find( '.wpview-content' )[0] );
-						}
 					} );
 				}
 			}, this );
+
+			return nodes;
+		},
+		setContent: function( html, callback, option ) {
+			var self = this;
+
+			this.getNodes( function ( editor, element ) {
+				var contentWrap = $( element ).find( '.wpview-content' ),
+					wrap = element;
+
+				if ( contentWrap.length && option !== 'wrap' ) {
+					element = contentWrap = contentWrap[0];
+				}
+
+				if ( _.isString( html ) ) {
+					if ( option === 'replace' ) {
+						element = editor.dom.replace( editor.dom.createFragment( html ), wrap );
+					} else {
+						editor.dom.setHTML( element, html );
+					}
+				} else {
+					if ( option === 'replace' ) {
+						element = editor.dom.replace( html, wrap );
+					} else {
+						$( element ).empty().append( html );
+					}
+				}
+
+				if ( _.isFunction( callback ) ) {
+					callback( self, editor, $( element ).find( '.wpview-content' )[0] );
+				}
+			} );
 		},
 
 		/* jshint scripturl: true */
 		createIframe: function ( content ) {
-			var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver,
+			var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;
-				iframe, iframeDoc, i, resize,
-				dom = tinymce.DOM;
 
 			if ( content.indexOf( '<script' ) !== -1 ) {
-				iframe = dom.create( 'iframe', {
+				this.getNodes( function ( editor, node ) {
-					src: tinymce.Env.ie ? 'javascript:""' : '',
+					var dom = editor.dom,
-					frameBorder: '0',
+						iframe, iframeDoc, i, resize;
-					allowTransparency: 'true',
-					scrolling: 'no',
-					style: {
-						width: '100%',
-						display: 'block'
-					}
-				} );
 
-				this.setContent( iframe );
+					node = $( node ).find( '.wpview-content' )[0];
-				iframeDoc = iframe.contentWindow.document;
 
-				iframeDoc.open();
+					node.innerHTML = '';
-				iframeDoc.write(
-					'<!DOCTYPE html>' +
-					'<html>' +
-						'<head>' +
-							'<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />' +
-						'</head>' +
-						'<body style="padding: 0; margin: 0;" class="' + dom.doc.body.className + '">' +
-							content +
-						'</body>' +
-					'</html>'
-				);
-				iframeDoc.close();
 
-				resize = function() {
+					iframe = dom.add( node, 'iframe', {
-					$( iframe ).height( $( iframeDoc.body ).height() );
+						src: tinymce.Env.ie ? 'javascript:""' : '',
-				};
+						frameBorder: '0',
-
+						allowTransparency: 'true',
-				if ( MutationObserver ) {
+						scrolling: 'no',
-					new MutationObserver( _.debounce( function() {
+						style: {
-						resize();
+							width: '100%',
-					}, 100 ) )
+							display: 'block'
-					.observe( iframeDoc.body, {
+						}
-						attributes: true,
-						childList: true,
-						subtree: true
 					} );
-				} else {
+
-					for ( i = 1; i < 6; i++ ) {
+					iframeDoc = iframe.contentWindow.document;
-						setTimeout( resize, i * 700 );
+
+					iframeDoc.open();
+					iframeDoc.write(
+						'<!DOCTYPE html>' +
+						'<html>' +
+							'<head>' +
+								'<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />' +
+							'</head>' +
+							'<body style="padding: 0; margin: 0;" class="' + /* editor.getBody().className + */ '">' +
+								content +
+							'</body>' +
+						'</html>'
+					);
+					iframeDoc.close();
+
+					resize = function() {
+						$( iframe ).height( $( iframeDoc.body ).height() );
+					};
+
+					if ( MutationObserver ) {
+						new MutationObserver( _.debounce( function() {
+							resize();
+						}, 100 ) )
+						.observe( iframeDoc.body, {
+							attributes: true,
+							childList: true,
+							subtree: true
+						} );
+					} else {
+						for ( i = 1; i < 6; i++ ) {
+							setTimeout( resize, i * 700 );
+						}
 					}
-				}
+				});
 			} else {
 				this.setContent( content );
 			}
@@ -478,8 +498,6 @@ window.wp = window.wp || {};
 	 * @mixin
 	 */
 	wp.mce.av = {
-		loaded: false,
-
 		View: {
 			overlay: true,
 
@@ -537,13 +555,13 @@ window.wp = window.wp || {};
 			},
 
 			/**
-			 * Pass data to the View's Underscore template and return the compiled output
+			 * Return parsed response
 			 *
 			 * @returns {string}
 			 */
 			getHtml: function() {
 				if ( ! this.parsed ) {
-					return '';
+					return ' ';
 				}
 				return this.parsed;
 			}
@@ -639,6 +657,18 @@ window.wp = window.wp || {};
 
 				_.bindAll( this, 'createIframe', 'setNode', 'fetch' );
 				$( this ).on( 'ready', this.setNode );
+			},
+
+			/**
+			 * Return parsed response
+			 *
+			 * @returns {string}
+			 */
+			getHtml: function() {
+				if ( ! this.parsed ) {
+					return '';
+				}
+				return this.parsed;
 			}
 		} ),
 		edit: function( node ) {