Ticket #28195: 28195.5.patch

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

@@ -8 +8 @@
 // Ensure the global `wp` object exists.
 window.wp = window.wp || {};
 
-(function($){
+( function( $ ) {
         var views = {},
                 instances = {},
                 media = wp.media,
@@ -637 +637 @@
         /**
          * TinyMCE handler for the embed shortcode
          */
-        wp.mce.views.register( 'embed', {
-                shortcode: 'embed',
-                View: _.extend( {}, wp.media.mixin, {
-                        template: media.template( 'editor-embed' ),
-                        initialize: function( options ) {
-                                this.players = [];
-                                this.content = options.content;
-                                this.parsed = false;
-                                this.shortcode = options.shortcode;
-                                _.bindAll( this, 'setHtml', 'setNode', 'fetch' );
-                                $( this ).on( 'ready', this.setNode );
-                        },
-                        unbind: function() {
-                                var self = this;
-                                _.each( this.players, function ( player ) {
-                                        player.pause();
-                                        self.removePlayer( player );
-                                } );
-                                this.players = [];
-                        },
-                        setNode: function ( e, node ) {
-                                this.node = node;
-                                if ( this.parsed ) {
-                                        this.parseMediaShortcodes();
-                                } else {
-                                        this.fetch();
-                                }
-                        },
-                        fetch: function () {
-                                wp.ajax.send( 'parse-embed', {
-                                        data: {
-                                                post_ID: $( '#post_ID' ).val(),
-                                                content: this.shortcode.string()
-                                        }
-                                } ).done( this.setHtml );
-                        },
-                        setHtml: function ( content ) {
-                                this.parsed = content;
-                                $( this.node ).html( this.getHtml() );
+        wp.mce.embedView = _.extend( {}, wp.media.mixin, {
+                template: media.template( 'editor-embed' ),
+                initialize: function( options ) {
+                        this.players = [];
+                        this.content = options.content;
+                        this.parsed = false;
+                        this.original = options.url || options.shortcode.string();
+                        if ( options.url ) {
+                                this.shortcode = '[embed]' + options.url + '[/embed]';
+                        } else {
+                                this.shortcode = options.shortcode.string();
+                        }
+                        _.bindAll( this, 'setHtml', 'setNode', 'fetch' );
+                        $( this ).on( 'ready', this.setNode );
+                },
+                unbind: function() {
+                        var self = this;
+                        _.each( this.players, function ( player ) {
+                                player.pause();
+                                self.removePlayer( player );
+                        } );
+                        this.players = [];
+                },
+                setNode: function ( e, node ) {
+                        this.node = node;
+                        if ( this.parsed ) {
                                 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 ) );
-                                } );
-                        },
-                        getHtml: function() {
-                                if ( ! this.parsed ) {
-                                        return '';
+                        } else {
+                                this.fetch();
+                        }
+                },
+                fetch: function () {
+                        wp.ajax.send( 'parse-embed', {
+                                data: {
+                                        post_ID: $( '#post_ID' ).val(),
+                                        content: this.shortcode
                                 }
-                                return this.template({ content: this.parsed });
+                        } ).done( this.setHtml );
+                },
+                setHtml: function ( content ) {
+                        var test = '<a href',
+                                dom = tinymce.activeEditor.dom;
+
+                        this.parsed = content;
+
+                        if ( content.substring( 0, test.length ) === test ) {
+                                dom.replace( dom.create( 'P', null, this.original ), this.node );
+                        } else {
+                                $( $.trim( this.getHtml() ) ).insertBefore( $( this.node ).find( 'ins' ) );
                         }
-                } ),
+
+                        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 ) );
+                        } );
+                },
+                getHtml: function() {
+                        if ( ! this.parsed ) {
+                                return '';
+                        }
+                        return this.template( { content: this.parsed } );
+                }
+        } );
+
+        wp.mce.views.register( 'embed', {
+                shortcode: 'embed',
+                View: wp.mce.embedView,
+                edit: function() {}
+        } );
+
+        wp.mce.views.register( 'embedURL', {
+                shortcode: 'embed',
+                toView: function( content ) {
+                        var re = /^<p>\s*(https?:\/\/[^\s"]+)\s*<\/p>$/gim,
+                                match = re.exec( content );
+
+                        if ( ! match ) {
+                                return;
+                        }
+
+                        return {
+                                index: match.index,
+                                content: match[0],
+                                options: {
+                                        url: match[1]
+                                }
+                        };
+                },
+                View: wp.mce.embedView,
                 edit: function() {}
         } );
 

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

@@ -158 +158 @@
         // matching view patterns, and transform the matches into
         // view wrappers.
         editor.on( 'BeforeSetContent', function( event ) {
+                var node;
+
                 if ( ! event.content ) {
                         return;
                 }
@@ -166 +168 @@
                         wp.mce.views.unbind( editor );
                 }
 
-                event.content = wp.mce.views.toViews( event.content );
-        });
+                node = editor.selection.getNode();
 
-        editor.on( 'PastePreProcess', function( event ) {
-                if ( event.content.match( /^\s*(https?:\/\/[^\s"]+)\s*$/im ) ) {
-                        event.content = '[embed]' + event.content + '[/embed]';
+                // If a url is inserted in an empty paragraph, wrap the url in p tags so it's detected by wp.mce.views.
+                if ( node.nodeName === 'P' && editor.dom.isEmpty( node ) && event.content.match( /^\s*(https?:\/\/[^\s"]+)\s*$/im ) ) {
+                        event.content = '<p>' + event.content + '</p>';
                 }
-        } );
+
+                event.content = wp.mce.views.toViews( event.content );
+        });
 
         // When the editor's content has been updated and the DOM has been
         // processed, render the views in the document.