Ticket #28567: 28567.4.patch

src/wp-includes/css/editor.css

@@ -169 +169 @@
         margin: 0;
 }
 
+.wpview-selected .mce-statusbar .mce-divider,
+.wpview-selected .mce-statusbar .mce-path-item {
+        display: none;
+}
+
+.wpview-selected .mce-statusbar .mce-path-item.mce-last {
+        display: inline-block;
+        pointer-events: none;
+}
+
 .mce-toolbar .mce-btn,
 .qt-fullscreen {
         border-color: transparent;

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

@@ -55 +55 @@
         function setViewCursor( before, view ) {
                 var location = before ? 'before' : 'after',
                         offset = before ? 0 : 1;
+                deselect();
                 editor.selection.setCursorLocation( editor.dom.select( '.wpview-selection-' + location, view )[0], offset );
                 editor.nodeChanged();
         }
@@ -111 +112 @@
                 dom.bind( clipboard, 'beforedeactivate focusin focusout', _stop );
                 dom.bind( selected, 'beforedeactivate focusin focusout', _stop );
 
+                tinymce.DOM.addClass( editor.getContainer(), 'wpview-selected' );
+
                 // Make sure that the editor is focused.
                 // It is possible that the editor is not focused when the mouse event fires
                 // without focus, the selection will not work properly.
@@ -274 +277 @@
                         var view = getView( event.target ),
                                 deselectEventType;
 
+                        firstFocus = false;
+
                         // Contain clicks inside the view wrapper
                         if ( view ) {
                                 event.stopPropagation();
@@ -484 +489 @@
 
                 if ( keyCode === VK.LEFT ) {
                         setViewCursor( true, view );
-                        deselect();
                 } else if ( keyCode === VK.UP ) {
                         if ( view.previousSibling ) {
                                 if ( getView( view.previousSibling ) ) {
                                         setViewCursor( true, view.previousSibling );
                                 } else {
+                                        deselect();
                                         selection.select( view.previousSibling, true );
                                         selection.collapse();
                                 }
                         } else {
                                 setViewCursor( true, view );
                         }
-                        deselect();
+                        
                 } else if ( keyCode === VK.RIGHT ) {
                         setViewCursor( false, view );
-                        deselect();
                 } else if ( keyCode === VK.DOWN ) {
                         if ( view.nextSibling ) {
                                 if ( getView( view.nextSibling ) ) {
                                         setViewCursor( false, view.nextSibling );
                                 } else {
+                                        deselect();
                                         selection.setCursorLocation( view.nextSibling, 0 );
                                 }
                         } else {
                                 setViewCursor( false, view );
                         }
-                        deselect();
                 } else if ( keyCode === VK.ENTER ) {
                         handleEnter( view );
                 } else if ( keyCode === VK.DELETE || keyCode === VK.BACKSPACE ) {
@@ -586 +590 @@
                 dom.removeClass( views, 'wpview-selection-after' );
                 dom.removeClass( views, 'wpview-cursor-hide' );
 
-                if ( view && editor.selection.isCollapsed() && focus ) {
-                        if ( className === 'wpview-selection-before' || className === 'wpview-selection-after' ) {
-                                setViewCursorTries = 0;
-
-                                // Make sure the cursor arrived in the right node.
-                                // This is necessary for Firefox.
-                                if ( lKDN === view.previousSibling ) {
-                                        setViewCursor( true, view );
-                                        return;
-                                } else if ( lKDN === view.nextSibling ) {
-                                        setViewCursor( false, view );
-                                        return;
-                                }
+                if ( ! selected ) {
+                        tinymce.DOM.removeClass( editor.getContainer(), 'wpview-selected' );
+                }
+
+                if ( focus ) {
+                        if ( view ) {
+                                if ( className === 'wpview-selection-before' || className === 'wpview-selection-after' && editor.selection.isCollapsed() ) {
+                                        setViewCursorTries = 0;
 
-                                dom.addClass( view, className );
+                                        deselect();
 
-                                cursorInterval = setInterval( function() {
-                                        if ( dom.hasClass( view, 'wpview-cursor-hide' ) ) {
-                                                dom.removeClass( view, 'wpview-cursor-hide' );
-                                        } else {
-                                                dom.addClass( view, 'wpview-cursor-hide' );
+                                        tinymce.DOM.addClass( editor.getContainer(), 'wpview-selected' );
+
+                                        // Make sure the cursor arrived in the right node.
+                                        // This is necessary for Firefox.
+                                        if ( lKDN === view.previousSibling ) {
+                                                setViewCursor( true, view );
+                                                return;
+                                        } else if ( lKDN === view.nextSibling ) {
+                                                setViewCursor( false, view );
+                                                return;
                                         }
-                                }, 500 );
-                        // If the cursor happens to be anywhere around the view, then set the cursor properly.
-                        // Only try this once to prevent a loop. (You never know.)
-                        } else if ( ! selected && ! setViewCursorTries ) {
-                                setViewCursorTries++;
-                                setViewCursor( true, view );
+
+                                        dom.addClass( view, className );
+
+                                        cursorInterval = setInterval( function() {
+                                                if ( dom.hasClass( view, 'wpview-cursor-hide' ) ) {
+                                                        dom.removeClass( view, 'wpview-cursor-hide' );
+                                                } else {
+                                                        dom.addClass( view, 'wpview-cursor-hide' );
+                                                }
+                                        }, 500 );
+                                // If the cursor lands anywhere else in the view, set the cursor before it.
+                                // Only try this once to prevent a loop. (You never know.)
+                                } else if ( className !== 'wpview-clipboard' && ! setViewCursorTries ) {
+                                        deselect();
+                                        setViewCursorTries++;
+                                        setViewCursor( true, view );
+                                }
+                        } else {
+                                deselect();
                         }
                 }
         });
 
+        editor.on( 'resolvename', function( event ) {
+                var className = event.target.className;
+
+                if ( className === 'wpview-clipboard' || className === 'wpview-selection-before' || className === 'wpview-selection-after' ) {
+                        event.name = editor.dom.getAttrib( getView( event.target ), 'data-wpview-type' );
+                }
+        });
+
         return {
                 getViewText: getViewText,
                 setViewText: setViewText