WordPress.org

Make WordPress Core

Changeset 29022


Ignore:
Timestamp:
07/08/14 04:15:00 (3 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:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/js/tinymce/plugins/wpview/plugin.js

    r29010 r29022  
    1313 
    1414    function getView( node ) { 
    15         return editor.dom.getParent( node, function( node ) { 
    16             return editor.dom.hasClass( node, 'wpview-wrap' ); 
    17         }); 
     15        // Doing this directly is about 40% faster 
     16        while ( node && node.parentNode ) { 
     17            if ( node.className && (' ' + node.className + ' ').indexOf(' wpview-wrap ') !== -1 ) { 
     18                return node; 
     19            } 
     20 
     21            node = node.parentNode; 
     22        } 
     23 
     24        return false; 
    1825    } 
    1926 
     
    5663        var location = before ? 'before' : 'after', 
    5764            offset = before ? 0 : 1; 
     65        deselect(); 
    5866        editor.selection.setCursorLocation( editor.dom.select( '.wpview-selection-' + location, view )[0], offset ); 
    5967        editor.nodeChanged(); 
     
    111119        dom.bind( clipboard, 'beforedeactivate focusin focusout', _stop ); 
    112120        dom.bind( selected, 'beforedeactivate focusin focusout', _stop ); 
     121 
     122        tinymce.DOM.addClass( editor.getContainer(), 'wpview-selected' ); 
    113123 
    114124        // Make sure that the editor is focused. 
     
    275285                deselectEventType; 
    276286 
     287            firstFocus = false; 
     288 
    277289            // Contain clicks inside the view wrapper 
    278290            if ( view ) { 
     
    485497        if ( keyCode === VK.LEFT ) { 
    486498            setViewCursor( true, view ); 
    487             deselect(); 
    488499        } else if ( keyCode === VK.UP ) { 
    489500            if ( view.previousSibling ) { 
     
    491502                    setViewCursor( true, view.previousSibling ); 
    492503                } else { 
     504                    deselect(); 
    493505                    selection.select( view.previousSibling, true ); 
    494506                    selection.collapse(); 
     
    497509                setViewCursor( true, view ); 
    498510            } 
    499             deselect(); 
     511             
    500512        } else if ( keyCode === VK.RIGHT ) { 
    501513            setViewCursor( false, view ); 
    502             deselect(); 
    503514        } else if ( keyCode === VK.DOWN ) { 
    504515            if ( view.nextSibling ) { 
     
    506517                    setViewCursor( false, view.nextSibling ); 
    507518                } else { 
     519                    deselect(); 
    508520                    selection.setCursorLocation( view.nextSibling, 0 ); 
    509521                } 
     
    511523                setViewCursor( false, view ); 
    512524            } 
    513             deselect(); 
    514525        } else if ( keyCode === VK.ENTER ) { 
    515526            handleEnter( view ); 
     
    587598        dom.removeClass( views, 'wpview-cursor-hide' ); 
    588599 
    589         if ( view && editor.selection.isCollapsed() && focus ) { 
    590             if ( className === 'wpview-selection-before' || className === 'wpview-selection-after' ) { 
    591                 setViewCursorTries = 0; 
    592  
    593                 // Make sure the cursor arrived in the right node. 
    594                 // This is necessary for Firefox. 
    595                 if ( lKDN === view.previousSibling ) { 
     600        if ( ! selected ) { 
     601            tinymce.DOM.removeClass( editor.getContainer(), 'wpview-selected' ); 
     602        } 
     603 
     604        if ( focus ) { 
     605            if ( view ) { 
     606                if ( className === 'wpview-selection-before' || className === 'wpview-selection-after' && editor.selection.isCollapsed() ) { 
     607                    setViewCursorTries = 0; 
     608 
     609                    deselect(); 
     610 
     611                    tinymce.DOM.addClass( editor.getContainer(), 'wpview-selected' ); 
     612 
     613                    // Make sure the cursor arrived in the right node. 
     614                    // This is necessary for Firefox. 
     615                    if ( lKDN === view.previousSibling ) { 
     616                        setViewCursor( true, view ); 
     617                        return; 
     618                    } else if ( lKDN === view.nextSibling ) { 
     619                        setViewCursor( false, view ); 
     620                        return; 
     621                    } 
     622 
     623                    dom.addClass( view, className ); 
     624 
     625                    cursorInterval = setInterval( function() { 
     626                        if ( dom.hasClass( view, 'wpview-cursor-hide' ) ) { 
     627                            dom.removeClass( view, 'wpview-cursor-hide' ); 
     628                        } else { 
     629                            dom.addClass( view, 'wpview-cursor-hide' ); 
     630                        } 
     631                    }, 500 ); 
     632                // If the cursor lands anywhere else in the view, set the cursor before it. 
     633                // Only try this once to prevent a loop. (You never know.) 
     634                } else if ( className !== 'wpview-clipboard' && ! setViewCursorTries ) { 
     635                    deselect(); 
     636                    setViewCursorTries++; 
    596637                    setViewCursor( true, view ); 
    597                     return; 
    598                 } else if ( lKDN === view.nextSibling ) { 
    599                     setViewCursor( false, view ); 
    600                     return; 
    601                 } 
    602  
    603                 dom.addClass( view, className ); 
    604  
    605                 cursorInterval = setInterval( function() { 
    606                     if ( dom.hasClass( view, 'wpview-cursor-hide' ) ) { 
    607                         dom.removeClass( view, 'wpview-cursor-hide' ); 
    608                     } else { 
    609                         dom.addClass( view, 'wpview-cursor-hide' ); 
    610                     } 
    611                 }, 500 ); 
    612             // If the cursor happens to be anywhere around the view, then set the cursor properly. 
    613             // Only try this once to prevent a loop. (You never know.) 
    614             } else if ( ! selected && ! setViewCursorTries ) { 
    615                 setViewCursorTries++; 
    616                 setViewCursor( true, view ); 
    617             } 
     638                } 
     639            } else { 
     640                deselect(); 
     641            } 
     642        } 
     643    }); 
     644 
     645    editor.on( 'resolvename', function( event ) { 
     646        if ( editor.dom.hasClass( event.target, 'wpview-wrap' ) ) { 
     647            event.name = editor.dom.getAttrib( event.target, 'data-wpview-type' ) || 'wpview'; 
     648            event.stopPropagation(); 
     649        } else if ( getView( event.target ) ) { 
     650            event.preventDefault(); 
     651            event.stopPropagation(); 
    618652        } 
    619653    }); 
Note: See TracChangeset for help on using the changeset viewer.