Ticket #28595: 28595.10.patch

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

@@ -8 +8 @@
                 VK = tinymce.util.VK,
                 TreeWalker = tinymce.dom.TreeWalker,
                 toRemove = false,
-                cursorInterval, lastKeyDownNode, setViewCursorTries;
+                cursorInterval, lastKeyDownNode, setViewCursorTries, focus;
 
         function getView( node ) {
                 return editor.dom.getParent( node, function( node ) {
@@ -349 +349 @@
                         selection = editor.selection,
                         node = selection.getNode(),
                         view = getView( node ),
-                        cursorBefore, cursorAfter;
+                        cursorBefore, cursorAfter,
+                        range, clonedRange, tempRange;
 
                 lastKeyDownNode = node;
 
+                // Make sure we don't delete part of a view.
+                // If the range ends or starts with the view, we'll need to trim it.
+                if ( ! selection.isCollapsed() ) {
+                        range = selection.getRng();
+
+                        if ( view = getView( range.endContainer ) ) {
+                                clonedRange = range.cloneRange();
+                                selection.select( view.previousSibling, true );
+                                selection.collapse();
+                                tempRange = selection.getRng();
+                                clonedRange.setEnd( tempRange.endContainer, tempRange.endOffset );
+                                selection.setRng( clonedRange );
+
+                                return;
+                        } else if ( view = getView( range.startContainer ) ) {
+                                clonedRange = range.cloneRange();
+                                clonedRange.setStart( view.nextSibling, 0 );
+                                selection.setRng( clonedRange );
+
+                                return;
+                        }
+                }
+
                 if ( ! view ) {
                         return;
                 }
@@ -465 +489 @@
                         return;
                 }
 
-                if ( keyCode === VK.LEFT || keyCode === VK.UP ) {
+                if ( keyCode === VK.LEFT ) {
                         setViewCursor( true, view );
                         deselect();
-                } else if ( keyCode === VK.RIGHT || keyCode === VK.DOWN ) {
+                } else if ( keyCode === VK.UP ) {
+                        if ( view.previousSibling ) {
+                                if ( getView( view.previousSibling ) ) {
+                                        setViewCursor( true, view.previousSibling );
+                                } else {
+                                        selection.select( view.previousSibling, true );
+                                        selection.collapse();
+                                }
+                        } else {
+                                handleEnter( view, true );
+                        }
+                        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 {
+                                        selection.setCursorLocation( view.nextSibling, 0 );
+                                }
+                        } else {
+                                handleEnter( view );
+                        }
+                        deselect();
                 } else if ( keyCode === VK.ENTER ) {
                         handleEnter( view );
                 } else if ( keyCode === VK.DELETE || keyCode === VK.BACKSPACE ) {
@@ -511 +558 @@
                 }
         });
 
+        editor.on( 'focus', function() {
+                focus = true;
+                editor.dom.addClass( editor.getBody(), 'has-focus' );
+        } );
+
+        editor.on( 'blur', function() {
+                focus = false;
+                editor.dom.removeClass( editor.getBody(), 'has-focus' );
+        } );
+
         editor.on( 'nodechange', function( event ) {
                 var dom = editor.dom,
                         views = editor.dom.select( '.wpview-wrap' ),
@@ -526 +583 @@
                 dom.removeClass( views, 'wpview-selection-after' );
                 dom.removeClass( views, 'wpview-cursor-hide' );
 
-                if ( view ) {
+                if ( view && editor.selection.isCollapsed() && focus ) {
                         if ( className === 'wpview-selection-before' || className === 'wpview-selection-after' ) {
                                 setViewCursorTries = 0;
 

src/wp-includes/js/tinymce/skins/wordpress/wp-content.css

@@ -241 +241 @@
         user-select: text;
 }
 
-.wpview-wrap.wpview-selection-before:before,
-.wpview-wrap.wpview-selection-after:before {
+.has-focus .wpview-wrap.wpview-selection-before:before,
+.has-focus .wpview-wrap.wpview-selection-after:before {
         content: '';
         margin: 0;
         padding: 0;
@@ -258 +258 @@
         opacity: 1;
 }
 
-.wpview-wrap.wpview-selection-after:before {
+.has-focus .wpview-wrap.wpview-selection-after:before {
         left: auto;
         right: -3px;
 }
 
-.wpview-wrap.wpview-cursor-hide:before {
+.has-focus .wpview-wrap.wpview-cursor-hide:before {
         opacity: 0;
 }