Ticket #27389: 27389-why-god-why.2.diff

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

@@ -42 +42 @@
                                         $( doc ).find( '[data-wpview-text="' + this.encodedText + '"]' ).each(function (i, elem) {
                                                 var node = $( elem );
                                                 node.html( html );
+                                                elem.reinit = false;
                                                 $( self ).trigger( 'ready', elem );
                                         });
                                 }
                         }, this );
+                },
+                reinit: function() {
+                        // Search all tinymce editor instances and update the placeholders
+                        _.each( tinymce.editors, function( editor ) {
+                                var doc, self = this;
+                                if ( editor.plugins.wpview ) {
+                                        doc = editor.getDoc();
+                                        $( doc ).find( '[data-wpview-text="' + this.encodedText + '"]' ).each(function (i, elem) {
+                                                elem.reinit = true;
+                                                $( self ).trigger( 'ready', elem );
+                                        });
+                                }
+                        }, this );
+
                 }
         } );
 
@@ -209 +224 @@
                         wp.mce.views.render();
                 },
 
+                /**
+                 * Trigger event that individual views can use to initialize any event bindings
+                 *
+                 * Note: Great care needs to be taken to avoid memory leaks when binding events directly to view nodes.
+                 */
+                reinitializeViews: function() {
+                        _.each( instances, function( instance ) {
+                                instance.reinit();
+                        } );
+                },
+
                 getInstance: function( encodedText ) {
                         return instances[ encodedText ];
                 },
@@ -408 +434 @@
          */
         wp.mce.media.View = wp.mce.View.extend({
                 initialize: function( options ) {
+                        this.player = [];
                         this.shortcode = options.shortcode;
                         _.bindAll( this, 'setPlayer' );
                         $(this).on( 'ready', this.setPlayer );
                 },
 
+                reinitPlayer: function(t, node) {
+                        var domNode,
+                                className = '.wp-' +  this.shortcode.tag + '-shortcode';
+
+                        this.cleanupPlayer( t );
+
+                        domNode = $( node ).find( this.shortcode.tag + className ).clone();
+                        domNode.removeAttr( 'src style' );
+                        $( node ).find( 'div' + className ).replaceWith( domNode );
+                },
+
                 /**
                  * Creates the player instance for the current node
                  *
@@ -428 +466 @@
                                 return;
                         }
 
-                        var self = this,
+                        var t,
+                                self = this,
                                 media,
                                 firefox = this.ua.is( 'ff' ),
                                 className = '.wp-' +  this.shortcode.tag + '-shortcode';
 
-                        if ( this.player ) {
-                                this.unsetPlayer();
+                        if ( node.reinit && node !== this.lastNode ) {
+                                t = _.isArray( this.player ) ? this.player.shift() : this.player;
+                                if ( t ) {
+                                        this.reinitPlayer( t, node );
+                                }
+                        } else {
+                                if ( this.player.length ) {
+                                        this.unsetPlayer();
+                                }
                         }
 
+                        this.lastNode = node;
                         media = $( node ).find( className );
 
                         if ( ! this.isCompatible( media ) ) {
@@ -458 +505 @@
                         media = wp.media.view.MediaDetails.prepareSrc( media.get(0) );
 
                         setTimeout( function() {
-                                self.player = new MediaElementPlayer( media, this.mejsSettings );
+                                self.player.push( new MediaElementPlayer( media, this.mejsSettings ) );
                         }, 75 );
                 },
 

src/wp-includes/js/media-audiovideo.js

@@ -122 +122 @@
 
                         return test;
                 },
-
                 /**
                  * Override the MediaElement method for removing a player.
                  *      MediaElement tries to pull the audio/video tag out of
                  *      its container and re-add it to the DOM.
                  */
-                removePlayer: function() {
-                        var t = this.player, featureIndex, feature;
-
+                cleanupPlayer: function(t) {
+                        var featureIndex, feature;
                         // invoke features cleanup
                         for ( featureIndex in t.options.features ) {
                                 feature = t.options.features[featureIndex];
@@ -165 +163 @@
                 unsetPlayer : function() {
                         if ( this.player ) {
                                 wp.media.mixin.pauseAllPlayers();
-                                wp.media.mixin.removePlayer.apply( this );
-                                this.player = false;
+                                if ( _.isArray( this.player ) ) {
+                                        _.each( this.player, function ( player ) {
+                                                wp.media.mixin.cleanupPlayer( player );
+                                        } );
+                                        this.player = [];
+                                } else {
+                                        wp.media.mixin.cleanupPlayer( this.player );
+                                        this.player = false;
+                                }
                         }
                 }
         };

src/wp-includes/js/tinymce/plugins/wpview/plugin.js

@@ -166 +166 @@
                 // to avoid adding additional undo levels on undo/redo
                 if ( event.format !== 'raw' ) {
                         wp.mce.views.render();
+                } else {
+                        wp.mce.views.reinitializeViews();
                 }
 
                 // Add padding <p> if the noneditable node is last