Changeset 29022

Timestamp:

07/08/2014 04:15:00 AM (10 years ago)

Author:

azaozz

Message:

TinyMCE wpView:

• Improve the fake caret hide/show.
• Improve getView() speed.
• Add callback for showing the proper path when a view is selected. This currently doesn't work, will start working after we update TinyMCE.

props avryl, see #28567, #28595.

File:

• trunk/src/wp-includes/js/tinymce/plugins/wpview/plugin.js (modified) (10 diffs)

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

@@ -13 +13 @@
 
     function getView( node ) {
-        return editor.dom.getParent( node, function( node ) {
-            return editor.dom.hasClass( node, 'wpview-wrap' );
-        });
+        // Doing this directly is about 40% faster
+        while ( node && node.parentNode ) {
+            if ( node.className && (' ' + node.className + ' ').indexOf(' wpview-wrap ') !== -1 ) {
+                return node;
+            }
+
+            node = node.parentNode;
+        }
+
+        return false;
     }
 
@@ -56 +63 @@
         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 +119 @@
         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.
@@ -275 +285 @@
                 deselectEventType;
 
+            firstFocus = false;
+
             // Contain clicks inside the view wrapper
             if ( view ) {
@@ -485 +497 @@
         if ( keyCode === VK.LEFT ) {
             setViewCursor( true, view );
-            deselect();
         } else if ( keyCode === VK.UP ) {
             if ( view.previousSibling ) {
@@ -491 +502 @@
                     setViewCursor( true, view.previousSibling );
                 } else {
+                    deselect();
                     selection.select( view.previousSibling, true );
                     selection.collapse();
@@ -497 +509 @@
                 setViewCursor( true, view );
             }
-            deselect();
+            
         } else if ( keyCode === VK.RIGHT ) {
             setViewCursor( false, view );
-            deselect();
         } else if ( keyCode === VK.DOWN ) {
             if ( view.nextSibling ) {
@@ -506 +517 @@
                     setViewCursor( false, view.nextSibling );
                 } else {
+                    deselect();
                     selection.setCursorLocation( view.nextSibling, 0 );
                 }
@@ -511 +523 @@
                 setViewCursor( false, view );
             }
-            deselect();
         } else if ( keyCode === VK.ENTER ) {
             handleEnter( view );
@@ -587 +598 @@
         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 ) {
+        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;
+
+                    deselect();
+
+                    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;
+                    }
+
+                    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 );
-                    return;
-                } else if ( lKDN === view.nextSibling ) {
-                    setViewCursor( false, view );
-                    return;
-                }
-
-                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 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 );
-            }
+                }
+            } else {
+                deselect();
+            }
+        }
+    });
+
+    editor.on( 'resolvename', function( event ) {
+        if ( editor.dom.hasClass( event.target, 'wpview-wrap' ) ) {
+            event.name = editor.dom.getAttrib( event.target, 'data-wpview-type' ) || 'wpview';
+            event.stopPropagation();
+        } else if ( getView( event.target ) ) {
+            event.preventDefault();
+            event.stopPropagation();
         }
     });