WordPress.org

Make WordPress Core

Ticket #28905: 28905.diff

File 28905.diff, 12.0 KB (added by wonderboymusic, 7 years ago)
  • src/wp-includes/js/mce-view.js

     
    104104                                }
    105105                        }, this );
    106106                },
     107
     108                /* jshint scripturl: true */
     109                createIframe: function ( content ) {
     110                        var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver,
     111                                iframe, iframeDoc, i, resize,
     112                                dom = tinymce.DOM;
     113
     114                        if ( content.indexOf( '<script' ) !== -1 ) {
     115                                iframe = dom.create( 'iframe', {
     116                                        src: tinymce.Env.ie ? 'javascript:""' : '',
     117                                        frameBorder: '0',
     118                                        allowTransparency: 'true',
     119                                        style: {
     120                                                width: '100%',
     121                                                display: 'block'
     122                                        }
     123                                } );
     124
     125                                this.setContent( iframe );
     126                                iframeDoc = iframe.contentWindow.document;
     127
     128                                iframeDoc.open();
     129                                iframeDoc.write(
     130                                        '<!DOCTYPE html>' +
     131                                        '<html>' +
     132                                                '<head>' +
     133                                                        '<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />' +
     134                                                '</head>' +
     135                                                '<body>' +
     136                                                        content +
     137                                                '</body>' +
     138                                        '</html>'
     139                                );
     140                                iframeDoc.close();
     141
     142                                resize = function() {
     143                                        $( iframe ).height( $( iframeDoc ).height() );
     144                                };
     145
     146                                if ( MutationObserver ) {
     147                                        new MutationObserver( _.debounce( function() {
     148                                                resize();
     149                                        }, 100 ) )
     150                                        .observe( iframeDoc.body, {
     151                                                attributes: true,
     152                                                childList: true,
     153                                                subtree: true
     154                                        } );
     155                                } else {
     156                                        for ( i = 1; i < 6; i++ ) {
     157                                                setTimeout( resize, i * 700 );
     158                                        }
     159                                }
     160                        } else {
     161                                this.setContent( content );
     162                        }
     163                },
     164
    107165                setError: function( message, dashicon ) {
    108166                        this.setContent(
    109167                                '<div class="wpview-error">' +
     
    424482                View: _.extend( {}, wp.media.mixin, {
    425483                        overlay: true,
    426484
     485                        styles: [
     486                                _wpmejsSettings.pluginPath + 'mediaelementplayer.min.css',
     487                                _wpmejsSettings.pluginPath + 'wp-mediaelement.css'
     488                        ],
     489
     490                        scripts: [
     491                                _wpmejsSettings.pluginPath + '../jquery/jquery.js',
     492                                _wpmejsSettings.pluginPath + 'mediaelement-and-player.min.js',
     493                                _wpmejsSettings.pluginPath + 'wp-mediaelement.js'
     494                        ],
     495
    427496                        initialize: function( options ) {
     497                                this.parsed = '';
    428498                                this.players = [];
    429499                                this.shortcode = options.shortcode;
    430                                 _.bindAll( this, 'setPlayer', 'pausePlayers' );
    431                                 $( this ).on( 'ready', this.setPlayer );
    432                                 $( this ).on( 'ready', function( event, editor ) {
    433                                         editor.on( 'hide', this.pausePlayers );
    434                                 } );
     500                                _.bindAll( this, 'pausePlayers' );
     501                                $( this ).on( 'ready', this.setHtml );
    435502                                $( document ).on( 'media:edit', this.pausePlayers );
    436503                        },
    437504
    438                         /**
    439                          * Creates the player instance for the current node
    440                          *
    441                          * @global MediaElementPlayer
    442                          *
    443                          * @param {Event} event
    444                          * @param {Object} editor
    445                          * @param {HTMLElement} node
    446                          */
    447                         setPlayer: function( event, editor, node ) {
    448                                 var self = this,
    449                                         media;
     505                        getScripts: function() {
     506                                var scripts = [];
     507                                _.each( this.scripts, function( script ) {
     508                                        scripts.push( '<script type="text/javascript" src="' + script + '"></script>' );
     509                                } );
     510                                return scripts.join( '' );
     511                        },
    450512
    451                                 media = $( node ).find( '.wp-' +  this.shortcode.tag + '-shortcode' );
     513                        getStyles: function() {
     514                                var styles = [];
     515                                _.each( this.styles, function( style ) {
     516                                        styles.push( '<link rel="stylesheet" href="' + style + '" />' );
     517                                } );
     518                                return styles.join( '' );
     519                        },
    452520
    453                                 if ( ! this.isCompatible( media ) ) {
    454                                         media.closest( '.wpview-wrap' ).addClass( 'wont-play' );
    455                                         media.replaceWith( '<p>' + media.find( 'source' ).eq(0).prop( 'src' ) + '</p>' );
    456                                         return;
    457                                 } else {
    458                                         media.closest( '.wpview-wrap' ).removeClass( 'wont-play' );
    459                                         if ( this.ua.is( 'ff' ) ) {
    460                                                 media.prop( 'preload', 'metadata' );
    461                                         } else {
    462                                                 media.prop( 'preload', 'none' );
    463                                         }
    464                                 }
     521                        setHtml: function() {
     522                                var template, attrs = this.shortcode.attrs.named;
     523                                attrs.content = this.shortcode.content;
    465524
    466                                 media = wp.media.view.MediaDetails.prepareSrc( media.get(0) );
    467 
    468                                 setTimeout( function() {
    469                                         wp.mce.av.loaded = true;
    470                                         self.players.push( new MediaElementPlayer( media, self.mejsSettings ) );
    471                                 }, wp.mce.av.loaded ? 10 : 500 );
     525                                template = this.getStyles();
     526                                template += this.template( {
     527                                        scripts: true,
     528                                        model: _.defaults(
     529                                                attrs,
     530                                                wp.media[ this.shortcode.tag ].defaults
     531                                        )
     532                                } );
     533                                template += this.getScripts();
     534                                this.parsed = template;
     535                                return this.createIframe( template );
    472536                        },
    473537
    474538                        /**
     
    477541                         * @returns {string}
    478542                         */
    479543                        getHtml: function() {
    480                                 var attrs = this.shortcode.attrs.named;
    481                                 attrs.content = this.shortcode.content;
    482 
    483                                 return this.template({ model: _.defaults(
    484                                         attrs,
    485                                         wp.media[ this.shortcode.tag ].defaults )
    486                                 });
     544                                if ( ! this.parsed ) {
     545                                        return this.loadingPlaceholder();
     546                                }
     547                                return this.parsed;
    487548                        },
    488549
    489550                        unbind: function() {
     
    578639                                $( document ).on( 'media:edit', this.pausePlayers );
    579640
    580641                                this.fetch();
    581 
    582                                 $( this ).on( 'ready', this.setPlaylist );
    583642                        },
    584643
    585644                        /**
     
    590649                                this.dfd = this.attachments.more().done( _.bind( this.render, this ) );
    591650                        },
    592651
    593                         setPlaylist: function( event, editor, element ) {
    594                                 if ( ! this.data.tracks ) {
    595                                         return;
    596                                 }
    597 
    598                                 this.players.push( new WPPlaylistView( {
    599                                         el: $( element ).find( '.wp-playlist' ).get( 0 ),
    600                                         metadata: this.data
    601                                 } ).player );
    602                         },
    603 
    604652                        /**
    605653                         * Set the data that will be used to compile the Underscore template,
    606654                         *  compile the template, and then return it.
     
    612660                                        model = wp.media.playlist,
    613661                                        options,
    614662                                        attachments,
    615                                         tracks = [];
     663                                        tracks = [],
     664                                        template;
    616665
    617666                                // Don't render errors while still fetching attachments
    618667                                if ( this.dfd && 'pending' === this.dfd.state() && ! this.attachments.length ) {
     
    680729
    681730                                options.tracks = tracks;
    682731                                this.data = options;
     732                                template = this.template( options );
    683733
    684                                 return this.template( options );
     734                                return this.createIframe( template );
    685735                        },
    686736
    687737                        unbind: function() {
     
    708758                                this.shortcode = options.shortcode.string();
    709759                        }
    710760
    711                         _.bindAll( this, 'setHtml', 'setNode', 'fetch' );
     761                        _.bindAll( this, 'createIframe', 'setNode', 'fetch' );
    712762                        $( this ).on( 'ready', this.setNode );
    713763                },
    714764                unbind: function() {
     
    721771                },
    722772                setNode: function () {
    723773                        if ( this.parsed ) {
    724                                 this.setHtml( this.parsed );
    725                                 this.parseMediaShortcodes();
     774                                this.createIframe( this.parsed );
    726775                        } else if ( ! this.fetching ) {
    727776                                this.fetch();
    728777                        }
     
    744793                        .done( function( response ) {
    745794                                if ( response ) {
    746795                                        self.parsed = response;
    747                                         self.setHtml( response );
     796                                        self.createIframe( response );
    748797                                }
    749798                        } )
    750799                        .fail( function( response ) {
     
    760809                                        self.setError( response.statusText, 'admin-media' );
    761810                                }
    762811                        } );
    763                 },
    764                 /* jshint scripturl: true */
    765                 setHtml: function ( content ) {
    766                         var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver,
    767                                 iframe, iframeDoc, i, resize,
    768                                 dom = tinymce.DOM;
    769 
    770                         if ( content.indexOf( '<script' ) !== -1 ) {
    771                                 iframe = dom.create( 'iframe', {
    772                                         src: tinymce.Env.ie ? 'javascript:""' : '',
    773                                         frameBorder: '0',
    774                                         allowTransparency: 'true',
    775                                         style: {
    776                                                 width: '100%',
    777                                                 display: 'block'
    778                                         }
    779                                 } );
    780 
    781                                 this.setContent( iframe );
    782                                 iframeDoc = iframe.contentWindow.document;
    783 
    784                                 iframeDoc.open();
    785                                 iframeDoc.write(
    786                                         '<!DOCTYPE html>' +
    787                                         '<html>' +
    788                                                 '<head>' +
    789                                                         '<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />' +
    790                                                 '</head>' +
    791                                                 '<body>' +
    792                                                         content +
    793                                                 '</body>' +
    794                                         '</html>'
    795                                 );
    796                                 iframeDoc.close();
    797 
    798                                 resize = function() {
    799                                         $( iframe ).height( $( iframeDoc ).height() );
    800                                 };
    801 
    802                                 if ( MutationObserver ) {
    803                                         new MutationObserver( _.debounce( function() {
    804                                                 resize();
    805                                         }, 100 ) )
    806                                         .observe( iframeDoc.body, {
    807                                                 attributes: true,
    808                                                 childList: true,
    809                                                 subtree: true
    810                                         } );
    811                                 } else {
    812                                         for ( i = 1; i < 6; i++ ) {
    813                                                 setTimeout( resize, i * 700 );
    814                                         }
    815                                 }
    816                         } else {
    817                                 this.setContent( content );
    818                         }
    819 
    820                         this.parseMediaShortcodes();
    821                 },
    822                 parseMediaShortcodes: function () {
    823                         var self = this;
    824                         $( '.wp-audio-shortcode, .wp-video-shortcode', this.node ).each( function ( i, element ) {
    825                                 self.players.push( new MediaElementPlayer( element, self.mejsSettings ) );
    826                         } );
    827812                }
    828813        } );
    829814
  • src/wp-includes/media.php

     
    15311531                'src'      => '',
    15321532                'loop'     => '',
    15331533                'autoplay' => '',
    1534                 'preload'  => 'none'
     1534                'preload'  => 'none',
     1535                'scripts'  => false
    15351536        );
    15361537        foreach ( $default_types as $type ) {
    15371538                $defaults_atts[$type] = '';
     
    15731574                array_unshift( $default_types, 'src' );
    15741575        }
    15751576
     1577        $scripts = '';
    15761578        /**
    15771579         * Filter the media library used for the audio shortcode.
    15781580         *
     
    15821584         */
    15831585        $library = apply_filters( 'wp_audio_shortcode_library', 'mediaelement' );
    15841586        if ( 'mediaelement' === $library && did_action( 'init' ) ) {
    1585                 wp_enqueue_style( 'wp-mediaelement' );
    1586                 wp_enqueue_script( 'wp-mediaelement' );
     1587                if ( $atts['scripts'] ) {
     1588                        ob_start();
     1589                        wp_print_styles( 'wp-mediaelement' );
     1590                        wp_print_scripts( 'wp-mediaelement' );
     1591                        $scripts = ob_get_clean();
     1592                } else {
     1593                        wp_enqueue_style( 'wp-mediaelement' );
     1594                        wp_enqueue_script( 'wp-mediaelement' );
     1595                }
    15871596        }
    15881597
    15891598        /**
     
    16371646                $html .= wp_mediaelement_fallback( $fileurl );
    16381647        }
    16391648        $html .= '</audio>';
    1640 
     1649        if ( ! empty( $scripts ) ) {
     1650                $html .= $scripts;
     1651        }
    16411652        /**
    16421653         * Filter the audio shortcode output.
    16431654         *
     
    17361747                'preload'  => 'metadata',
    17371748                'width'    => 640,
    17381749                'height'   => 360,
     1750                'scripts'  => false,
    17391751        );
    17401752
    17411753        foreach ( $default_types as $type ) {
     
    17961808                array_unshift( $default_types, 'src' );
    17971809        }
    17981810
     1811        $scripts = '';
    17991812        /**
    18001813         * Filter the media library used for the video shortcode.
    18011814         *
     
    18051818         */
    18061819        $library = apply_filters( 'wp_video_shortcode_library', 'mediaelement' );
    18071820        if ( 'mediaelement' === $library && did_action( 'init' ) ) {
    1808                 wp_enqueue_style( 'wp-mediaelement' );
    1809                 wp_enqueue_script( 'wp-mediaelement' );
     1821                if ( $atts['scripts'] ) {
     1822                        ob_start();
     1823                        wp_print_styles( 'wp-mediaelement' );
     1824                        wp_print_scripts( 'wp-mediaelement' );
     1825                        $scripts = ob_get_clean();
     1826                } else {
     1827                        wp_enqueue_style( 'wp-mediaelement' );
     1828                        wp_enqueue_script( 'wp-mediaelement' );
     1829                }
    18101830        }
    18111831
    18121832        /**
     
    18731893                $html .= wp_mediaelement_fallback( $fileurl );
    18741894        }
    18751895        $html .= '</video>';
     1896        if ( ! empty( $scripts ) ) {
     1897                $html .= $scripts;
     1898        }
    18761899
    18771900        $output = sprintf( '<div style="width: %dpx; max-width: 100%%;" class="wp-video">%s</div>', $atts['width'], $html );
    18781901
     
    23242347 * @return string The embed HTML.
    23252348 */
    23262349function wp_embed_handler_audio( $matches, $attr, $url, $rawattr ) {
    2327         $audio = sprintf( '[audio src="%s" /]', esc_url( $url ) );
     2350        if ( defined( 'DOING_AJAX' ) && DOING_AJAX && 'parse-embed' === $_REQUEST['action'] ) {
     2351                $audio = sprintf( '[audio scripts="1" src="%s"]', esc_url( $url ) );
     2352        } else {
     2353                $audio = sprintf( '[audio src="%s"]', esc_url( $url ) );
     2354        }
    23282355
    23292356        /**
    23302357         * Filter the audio embed output.
     
    23562383                $dimensions .= sprintf( 'width="%d" ', (int) $rawattr['width'] );
    23572384                $dimensions .= sprintf( 'height="%d" ', (int) $rawattr['height'] );
    23582385        }
    2359         $video = sprintf( '[video %s src="%s" /]', $dimensions, esc_url( $url ) );
     2386        if ( defined( 'DOING_AJAX' ) && DOING_AJAX && 'parse-embed' === $_REQUEST['action'] ) {
     2387                $video = sprintf( '[video scripts="1" %s src="%s"]', $dimensions, esc_url( $url ) );
     2388        } else {
     2389                $video = sprintf( '[video %s src="%s"]', $dimensions, esc_url( $url ) );
     2390        }
    23602391
    23612392        /**
    23622393         * Filter the video embed output.