Index: src/wp-includes/class-wp-editor.php =================================================================== --- src/wp-includes/class-wp-editor.php (revision 29172) +++ src/wp-includes/class-wp-editor.php (working copy) @@ -516,35 +516,12 @@ // load editor_style.css if the current theme supports it if ( ! empty( $GLOBALS['editor_styles'] ) && is_array( $GLOBALS['editor_styles'] ) ) { - $editor_styles = $GLOBALS['editor_styles']; - - $editor_styles = array_unique( array_filter( $editor_styles ) ); - $style_uri = get_stylesheet_directory_uri(); - $style_dir = get_stylesheet_directory(); - - // Support externally referenced styles (like, say, fonts). - foreach ( $editor_styles as $key => $file ) { - if ( preg_match( '~^(https?:)?//~', $file ) ) { - $mce_css[] = esc_url_raw( $file ); - unset( $editor_styles[ $key ] ); + $editor_styles = get_editor_stylesheets(); + if ( ! empty( $editor_styles ) ) { + foreach ( $editor_styles as $style ) { + $mce_css[] = $style; } } - - // Look in a parent theme first, that way child theme CSS overrides. - if ( is_child_theme() ) { - $template_uri = get_template_directory_uri(); - $template_dir = get_template_directory(); - - foreach ( $editor_styles as $key => $file ) { - if ( $file && file_exists( "$template_dir/$file" ) ) - $mce_css[] = "$template_uri/$file"; - } - } - - foreach ( $editor_styles as $file ) { - if ( $file && file_exists( "$style_dir/$file" ) ) - $mce_css[] = "$style_uri/$file"; - } } /** Index: src/wp-includes/js/mce-view.js =================================================================== --- src/wp-includes/js/mce-view.js (revision 29172) +++ src/wp-includes/js/mce-view.js (working copy) @@ -104,6 +104,65 @@ } }, this ); }, + + /* jshint scripturl: true */ + createIframe: function ( content ) { + var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver, + iframe, iframeDoc, i, resize, + dom = tinymce.DOM; + + if ( content.indexOf( '' + + '' + + '' + + '' + + '' + + '' + + content + + '' + + '' + ); + 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 ); + } + }, + setError: function( message, dashicon ) { this.setContent( '
' + @@ -111,6 +170,24 @@ '

' + message + '

' + '
' ); + }, + + getScripts: function() { + var scripts = []; + _.each( this.scripts, function( script ) { + scripts.push( '' ); + } ); + return scripts.join( '' ); + }, + + getStyles: function() { + var styles = []; + _.each( [ this.styles, _wpmejsSettings.editorStylesheets ], function( stylesheets ) { + _.each( stylesheets, function( style ) { + styles.push( '' ); + } ); + } ); + return styles.join( '' ); } } ); @@ -424,51 +501,41 @@ View: _.extend( {}, wp.media.mixin, { overlay: true, + styles: [ + _wpmejsSettings.pluginPath + 'mediaelementplayer.min.css', + _wpmejsSettings.pluginPath + 'wp-mediaelement.css' + ], + + scripts: [ + _wpmejsSettings.includesPath + 'jquery/jquery.js', + _wpmejsSettings.pluginPath + 'mediaelement-and-player.min.js', + _wpmejsSettings.pluginPath + 'wp-mediaelement.js' + ], + initialize: function( options ) { + this.parsed = ''; this.players = []; this.shortcode = options.shortcode; - _.bindAll( this, 'setPlayer', 'pausePlayers' ); - $( this ).on( 'ready', this.setPlayer ); - $( this ).on( 'ready', function( event, editor ) { - editor.on( 'hide', this.pausePlayers ); - } ); + _.bindAll( this, 'pausePlayers' ); + $( this ).on( 'ready', this.setHtml ); $( document ).on( 'media:edit', this.pausePlayers ); }, - /** - * Creates the player instance for the current node - * - * @global MediaElementPlayer - * - * @param {Event} event - * @param {Object} editor - * @param {HTMLElement} node - */ - setPlayer: function( event, editor, node ) { - var self = this, - media; + setHtml: function() { + var template, attrs = this.shortcode.attrs.named; + attrs.content = this.shortcode.content; - media = $( node ).find( '.wp-' + this.shortcode.tag + '-shortcode' ); - - if ( ! this.isCompatible( media ) ) { - media.closest( '.wpview-wrap' ).addClass( 'wont-play' ); - media.replaceWith( '

' + media.find( 'source' ).eq(0).prop( 'src' ) + '

' ); - return; - } else { - media.closest( '.wpview-wrap' ).removeClass( 'wont-play' ); - if ( this.ua.is( 'ff' ) ) { - media.prop( 'preload', 'metadata' ); - } else { - media.prop( 'preload', 'none' ); - } - } - - media = wp.media.view.MediaDetails.prepareSrc( media.get(0) ); - - setTimeout( function() { - wp.mce.av.loaded = true; - self.players.push( new MediaElementPlayer( media, self.mejsSettings ) ); - }, wp.mce.av.loaded ? 10 : 500 ); + template = this.getStyles(); + template += this.template( { + scripts: true, + model: _.defaults( + attrs, + wp.media[ this.shortcode.tag ].defaults + ) + } ); + template += this.getScripts(); + this.parsed = template; + return this.createIframe( template ); }, /** @@ -477,13 +544,10 @@ * @returns {string} */ getHtml: function() { - var attrs = this.shortcode.attrs.named; - attrs.content = this.shortcode.content; - - return this.template({ model: _.defaults( - attrs, - wp.media[ this.shortcode.tag ].defaults ) - }); + if ( ! this.parsed ) { + return this.loadingPlaceholder(); + } + return this.parsed; }, unbind: function() { @@ -571,34 +635,55 @@ this.data = {}; this.attachments = []; this.shortcode = options.shortcode; + this.dfd = false; + this.fetching = false; - $( this ).on( 'ready', function( event, editor ) { - editor.on( 'hide', this.pausePlayers ); - } ); - $( document ).on( 'media:edit', this.pausePlayers ); + $( this ).on( 'ready', _.bind( this.setNode, this ) ); + }, - this.fetch(); + styles: [ + _wpmejsSettings.pluginPath + 'mediaelementplayer.min.css', + _wpmejsSettings.pluginPath + 'wp-mediaelement.css' + ], - $( this ).on( 'ready', this.setPlaylist ); + scripts: [ + _wpmejsSettings.includesPath + 'jquery/jquery.js', + _wpmejsSettings.includesPath + 'underscore.min.js', + _wpmejsSettings.includesPath + 'backbone.min.js', + _wpmejsSettings.includesPath + 'wp-util.js', + _wpmejsSettings.pluginPath + 'mediaelement-and-player.min.js', + _wpmejsSettings.pluginPath + 'wp-playlist.js' + ], + + setNode: function () { + if ( this.parsed ) { + this.createIframe( this.parsed ); + } else if ( ! this.fetching ) { + this.fetch(); + } }, /** * Asynchronously fetch the shortcode's attachments */ - fetch: function() { + fetch: function () { + var self = this; + + this.fetching = true; + this.attachments = wp.media.playlist.attachments( this.shortcode ); - this.dfd = this.attachments.more().done( _.bind( this.render, this ) ); - }, + this.dfd = this.attachments.more(); - setPlaylist: function( event, editor, element ) { - if ( ! this.data.tracks ) { - return; - } - - this.players.push( new WPPlaylistView( { - el: $( element ).find( '.wp-playlist' ).get( 0 ), - metadata: this.data - } ).player ); + this.dfd + .always( function() { + self.fetching = false; + } ) + .done( function( response ) { + if ( response ) { + self.parsed = self.setHtml( response ); + self.createIframe( self.parsed ); + } + } ); }, /** @@ -607,16 +692,18 @@ * * @returns {string} */ - getHtml: function() { + setHtml: function() { var data = this.shortcode.attrs.named, model = wp.media.playlist, options, attachments, - tracks = []; + tracks = [], + template; // Don't render errors while still fetching attachments if ( this.dfd && 'pending' === this.dfd.state() && ! this.attachments.length ) { - return ''; + this.parsed = ''; + return; } _.each( model.defaults, function( value, key ) { @@ -680,8 +767,18 @@ options.tracks = tracks; this.data = options; + template = this.getStyles(); + template += this.template( options ); + template += this.getScripts(); + this.parsed = template; + return template; + }, - return this.template( options ); + getHtml: function() { + if ( ! this.parsed ) { + return this.loadingPlaceholder(); + } + return this.parsed; }, unbind: function() { @@ -708,7 +805,7 @@ this.shortcode = options.shortcode.string(); } - _.bindAll( this, 'setHtml', 'setNode', 'fetch' ); + _.bindAll( this, 'createIframe', 'setNode', 'fetch' ); $( this ).on( 'ready', this.setNode ); }, unbind: function() { @@ -721,8 +818,7 @@ }, setNode: function () { if ( this.parsed ) { - this.setHtml( this.parsed ); - this.parseMediaShortcodes(); + this.createIframe( this.parsed ); } else if ( ! this.fetching ) { this.fetch(); } @@ -744,7 +840,7 @@ .done( function( response ) { if ( response ) { self.parsed = response; - self.setHtml( response ); + self.createIframe( response ); } } ) .fail( function( response ) { @@ -760,70 +856,6 @@ self.setError( response.statusText, 'admin-media' ); } } ); - }, - /* jshint scripturl: true */ - setHtml: function ( content ) { - var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver, - iframe, iframeDoc, i, resize, - dom = tinymce.DOM; - - if ( content.indexOf( '' + - '' + - '' + - '' + - '' + - '' + - content + - '' + - '' - ); - iframeDoc.close(); - - resize = function() { - $( iframe ).height( $( iframeDoc ).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 ); - } - - this.parseMediaShortcodes(); - }, - parseMediaShortcodes: function () { - var self = this; - $( '.wp-audio-shortcode, .wp-video-shortcode', this.node ).each( function ( i, element ) { - self.players.push( new MediaElementPlayer( element, self.mejsSettings ) ); - } ); } } ); Index: src/wp-includes/media.php =================================================================== --- src/wp-includes/media.php (revision 29172) +++ src/wp-includes/media.php (working copy) @@ -1531,7 +1531,8 @@ 'src' => '', 'loop' => '', 'autoplay' => '', - 'preload' => 'none' + 'preload' => 'none', + 'scripts' => false ); foreach ( $default_types as $type ) { $defaults_atts[$type] = ''; @@ -1573,6 +1574,7 @@ array_unshift( $default_types, 'src' ); } + $scripts = ''; /** * Filter the media library used for the audio shortcode. * @@ -1582,8 +1584,15 @@ */ $library = apply_filters( 'wp_audio_shortcode_library', 'mediaelement' ); if ( 'mediaelement' === $library && did_action( 'init' ) ) { - wp_enqueue_style( 'wp-mediaelement' ); - wp_enqueue_script( 'wp-mediaelement' ); + if ( $atts['scripts'] ) { + ob_start(); + wp_print_styles( 'wp-mediaelement' ); + wp_print_scripts( 'wp-mediaelement' ); + $scripts = ob_get_clean(); + } else { + wp_enqueue_style( 'wp-mediaelement' ); + wp_enqueue_script( 'wp-mediaelement' ); + } } /** @@ -1637,7 +1646,9 @@ $html .= wp_mediaelement_fallback( $fileurl ); } $html .= ''; - + if ( ! empty( $scripts ) ) { + $html .= $scripts; + } /** * Filter the audio shortcode output. * @@ -1736,6 +1747,7 @@ 'preload' => 'metadata', 'width' => 640, 'height' => 360, + 'scripts' => false, ); foreach ( $default_types as $type ) { @@ -1796,6 +1808,7 @@ array_unshift( $default_types, 'src' ); } + $scripts = ''; /** * Filter the media library used for the video shortcode. * @@ -1805,8 +1818,15 @@ */ $library = apply_filters( 'wp_video_shortcode_library', 'mediaelement' ); if ( 'mediaelement' === $library && did_action( 'init' ) ) { - wp_enqueue_style( 'wp-mediaelement' ); - wp_enqueue_script( 'wp-mediaelement' ); + if ( $atts['scripts'] ) { + ob_start(); + wp_print_styles( 'wp-mediaelement' ); + wp_print_scripts( 'wp-mediaelement' ); + $scripts = ob_get_clean(); + } else { + wp_enqueue_style( 'wp-mediaelement' ); + wp_enqueue_script( 'wp-mediaelement' ); + } } /** @@ -1873,6 +1893,9 @@ $html .= wp_mediaelement_fallback( $fileurl ); } $html .= ''; + if ( ! empty( $scripts ) ) { + $html .= $scripts; + } $output = sprintf( '
%s
', $atts['width'], $html ); @@ -2324,7 +2347,11 @@ * @return string The embed HTML. */ function wp_embed_handler_audio( $matches, $attr, $url, $rawattr ) { - $audio = sprintf( '[audio src="%s" /]', esc_url( $url ) ); + if ( defined( 'DOING_AJAX' ) && DOING_AJAX && 'parse-embed' === $_REQUEST['action'] ) { + $audio = sprintf( '[audio scripts="1" src="%s"]', esc_url( $url ) ); + } else { + $audio = sprintf( '[audio src="%s"]', esc_url( $url ) ); + } /** * Filter the audio embed output. @@ -2356,7 +2383,11 @@ $dimensions .= sprintf( 'width="%d" ', (int) $rawattr['width'] ); $dimensions .= sprintf( 'height="%d" ', (int) $rawattr['height'] ); } - $video = sprintf( '[video %s src="%s" /]', $dimensions, esc_url( $url ) ); + if ( defined( 'DOING_AJAX' ) && DOING_AJAX && 'parse-embed' === $_REQUEST['action'] ) { + $video = sprintf( '[video scripts="1" %s src="%s"]', $dimensions, esc_url( $url ) ); + } else { + $video = sprintf( '[video %s src="%s"]', $dimensions, esc_url( $url ) ); + } /** * Filter the video embed output. Index: src/wp-includes/script-loader.php =================================================================== --- src/wp-includes/script-loader.php (revision 29172) +++ src/wp-includes/script-loader.php (working copy) @@ -323,7 +323,9 @@ $scripts->add( 'wp-mediaelement', "/wp-includes/js/mediaelement/wp-mediaelement.js", array('mediaelement'), false, 1 ); did_action( 'init' ) && $scripts->localize( 'mediaelement', '_wpmejsSettings', array( + 'includesPath' => includes_url( 'js/', 'relative' ), 'pluginPath' => includes_url( 'js/mediaelement/', 'relative' ), + 'editorStylesheets' => get_editor_stylesheets() ) ); $scripts->add( 'wp-playlist', "/wp-includes/js/mediaelement/wp-playlist.js", array( 'wp-util', 'backbone', 'mediaelement' ), false, 1 ); @@ -510,7 +512,7 @@ $scripts->add( 'dashboard', "/wp-admin/js/dashboard$suffix.js", array( 'jquery', 'admin-comments', 'postbox' ), false, 1 ); $scripts->add( 'list-revisions', "/wp-includes/js/wp-list-revisions$suffix.js" ); - + $scripts->add( 'media-grid', "/wp-includes/js/media-grid$suffix.js", array( 'media-editor' ), false, 1 ); $scripts->add( 'media', "/wp-admin/js/media$suffix.js", array( 'jquery' ), false, 1 ); did_action( 'init' ) && $scripts->localize( 'media', 'attachMediaBoxL10n', array( @@ -1033,6 +1035,45 @@ } } +function get_editor_stylesheets() { + $stylesheets = array(); + // load editor_style.css if the current theme supports it + if ( ! empty( $GLOBALS['editor_styles'] ) && is_array( $GLOBALS['editor_styles'] ) ) { + $editor_styles = $GLOBALS['editor_styles']; + + $editor_styles = array_unique( array_filter( $editor_styles ) ); + $style_uri = get_stylesheet_directory_uri(); + $style_dir = get_stylesheet_directory(); + + // Support externally referenced styles (like, say, fonts). + foreach ( $editor_styles as $key => $file ) { + if ( preg_match( '~^(https?:)?//~', $file ) ) { + $stylesheets[] = esc_url_raw( $file ); + unset( $editor_styles[ $key ] ); + } + } + + // Look in a parent theme first, that way child theme CSS overrides. + if ( is_child_theme() ) { + $template_uri = get_template_directory_uri(); + $template_dir = get_template_directory(); + + foreach ( $editor_styles as $key => $file ) { + if ( $file && file_exists( "$template_dir/$file" ) ) { + $stylesheets[] = "$template_uri/$file"; + } + } + } + + foreach ( $editor_styles as $file ) { + if ( $file && file_exists( "$style_dir/$file" ) ) { + $stylesheets[] = "$style_uri/$file"; + } + } + } + return $stylesheets; +} + add_action( 'wp_default_scripts', 'wp_default_scripts' ); add_filter( 'wp_print_scripts', 'wp_just_in_time_script_localization' ); add_filter( 'print_scripts_array', 'wp_prototype_before_jquery' );