WordPress.org

Make WordPress Core

Changeset 29463


Ignore:
Timestamp:
08/10/2014 04:21:46 AM (4 years ago)
Author:
azaozz
Message:

TinyMCE: update wpview and editimage plugins for 4.1.3. Add show/hide of the Edit and Delete buttons on views and images on 'touchend'. See #28595, #29166

Location:
trunk/src/wp-includes
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/css/media-views.css

    r29456 r29463  
    17881788.image-details .embed-media-settings,
    17891789.image-details .embed-media-settings div {
     1790    -webkit-box-sizing: border-box;
     1791    -moz-box-sizing: border-box;
    17901792    box-sizing: border-box;
    17911793}
     
    23202322        height: auto;
    23212323        max-width: 65%;
     2324        max-width: -webkit-calc(100% - 38px);
    23222325        max-width: calc(100% - 38px);
    23232326    }
     
    23602363        max-width: 70%;
    23612364        bottom: 120%;
     2365        -webkit-box-sizing: border-box;
     2366        -moz-box-sizing: border-box;
    23622367        box-sizing: border-box;
    23632368        padding-bottom: 0;
  • trunk/src/wp-includes/js/tinymce/plugins/wpeditimage/plugin.js

    r29380 r29463  
    436436
    437437            editor.selection.collapse( true );
    438             editor.nodeChanged();
    439438            editor.dom.remove( wrap );
    440439        } else {
    441440            editor.dom.remove( node );
    442441        }
     442
    443443        removeToolbar();
     444        editor.nodeChanged();
     445        editor.undoManager.add();
    444446    }
    445447
     
    458460        rectangle = dom.getRect( node );
    459461
    460         toolbarHtml = '<i class="dashicons dashicons-edit edit" data-mce-bogus="1"></i>' +
    461             '<i class="dashicons dashicons-no-alt remove" data-mce-bogus="1"></i>';
     462        toolbarHtml = '<i class="dashicons dashicons-edit edit" data-mce-bogus="all"></i>' +
     463            '<i class="dashicons dashicons-no-alt remove" data-mce-bogus="all"></i>';
    462464
    463465        toolbar = dom.create( 'p', {
    464466            'id': 'wp-image-toolbar',
    465             'data-mce-bogus': '1',
     467            'data-mce-bogus': 'all',
    466468            'contenteditable': false
    467469        }, toolbarHtml );
     
    928930    });
    929931
    930     editor.on( 'mouseup', function( event ) {
     932    editor.on( 'mouseup touchend', function( event ) {
    931933        var image,
    932934            node = event.target,
     
    957959    });
    958960
    959     // Remove toolbar from undo levels
     961    // Remove from undo levels
    960962    editor.on( 'BeforeAddUndo', function( event ) {
    961         event.level.content = event.level.content.replace( /<p [^>]*data-mce-bogus[^>]+>[\s\S]*?<\/p>/g, '' );
     963        event.level.content = event.level.content.replace( / data-wp-imgselect="1"/g, '' );
    962964    });
    963965
    964     editor.on( 'cut', function() {
     966    // After undo/redo FF seems to set the image height very slowly when it is set to 'auto' in the CSS.
     967    // This causes image.getBoundingClientRect() to return wrong values and the resize handles are shown in wrong places.
     968    // Collapse the selection to remove the resize handles.
     969    if ( tinymce.Env.gecko ) {
     970        editor.on( 'undo redo', function() {
     971            if ( editor.selection.getNode().nodeName === 'IMG' ) {
     972                editor.selection.collapse();
     973            }
     974        });
     975    }
     976
     977    editor.on( 'cut wpview-selected', function() {
    965978        removeToolbar();
    966979    });
  • trunk/src/wp-includes/js/tinymce/plugins/wpview/plugin.js

    r29302 r29463  
    1212        firstFocus = true,
    1313        _noop = function() { return false; },
     14        isTouchDevice = ( 'ontouchend' in document ),
    1415        cursorInterval, lastKeyDownNode, setViewCursorTries, focus, execCommandView;
    1516
     
    141142
    142143        // select the hidden div
    143         editor.selection.select( clipboard, true );
     144        if ( isTouchDevice ) {
     145            editor.selection.select( clipboard );
     146        } else {
     147            editor.selection.select( clipboard, true );
     148        }
     149
    144150        editor.nodeChanged();
     151        editor.fire( 'wpview-selected', viewNode );
    145152    }
    146153
     
    257264
    258265    editor.on( 'init', function() {
    259         var selection = editor.selection;
     266        var scrolled = false,
     267            selection = editor.selection;
    260268
    261269        // When a view is selected, ensure content that is being pasted
     
    286294        });
    287295
    288         editor.dom.bind( editor.getBody().parentNode, 'mousedown mouseup click', function( event ) {
    289             var view = getView( event.target );
     296        editor.dom.bind( editor.getDoc(), 'touchmove', function() {
     297            scrolled = true;
     298        });
     299
     300        editor.on( 'mousedown mouseup click touchend', function( event ) {
     301            var view = getView( event.target ),
     302                type = isTouchDevice ? 'touchend' : 'mousedown';
    290303
    291304            firstFocus = false;
     
    293306            // Contain clicks inside the view wrapper
    294307            if ( view ) {
    295                 event.stopPropagation();
    296 
    297                 if ( event.type === 'mousedown' && ! event.metaKey && ! event.ctrlKey ) {
     308                event.stopImmediatePropagation();
     309                event.preventDefault();
     310
     311                if ( event.type === type && ! event.metaKey && ! event.ctrlKey ) {
    298312                    if ( editor.dom.hasClass( event.target, 'edit' ) ) {
    299313                        wp.mce.views.edit( view );
     
    306320                }
    307321
    308                 select( view );
     322                if ( event.type === 'touchend' && scrolled ) {
     323                    scrolled = false;
     324                } else {
     325                    select( view );
     326                }
    309327
    310328                // Returning false stops the ugly bars from appearing in IE11 and stops the view being selected as a range in FF.
     
    312330                return false;
    313331            } else {
    314                 if ( event.type === 'mousedown' ) {
     332                if ( event.type === type ) {
    315333                    deselect();
    316334                }
    317335            }
    318         });
     336
     337            if ( event.type === 'touchend' && scrolled ) {
     338                scrolled = false;
     339            }
     340        }, true );
    319341    });
    320342
     
    565587        });
    566588
    567         if ( focus ) {
    568             if ( view ) {
    569                 if ( ( className === 'wpview-selection-before' || className === 'wpview-selection-after' ) && editor.selection.isCollapsed() ) {
    570                     setViewCursorTries = 0;
    571 
    572                     deselect();
    573 
    574                     // Make sure the cursor arrived in the right node.
    575                     // This is necessary for Firefox.
    576                     if ( lKDN === view.previousSibling ) {
    577                         setViewCursor( true, view );
    578                         return;
    579                     } else if ( lKDN === view.nextSibling ) {
    580                         setViewCursor( false, view );
    581                         return;
    582                     }
    583 
    584                     dom.addClass( view, className );
    585 
    586                     cursorInterval = setInterval( function() {
    587                         if ( dom.hasClass( view, 'wpview-cursor-hide' ) ) {
    588                             dom.removeClass( view, 'wpview-cursor-hide' );
    589                         } else {
    590                             dom.addClass( view, 'wpview-cursor-hide' );
    591                         }
    592                     }, 500 );
    593                 // If the cursor lands anywhere else in the view, set the cursor before it.
    594                 // Only try this once to prevent a loop. (You never know.)
    595                 } else if ( ! getParent( event.element, 'wpview-clipboard' ) && ! setViewCursorTries ) {
    596                     deselect();
    597                     setViewCursorTries++;
     589        if ( focus && view ) {
     590            if ( ( className === 'wpview-selection-before' || className === 'wpview-selection-after' ) &&
     591                editor.selection.isCollapsed() ) {
     592
     593                setViewCursorTries = 0;
     594
     595                deselect();
     596
     597                // Make sure the cursor arrived in the right node.
     598                // This is necessary for Firefox.
     599                if ( lKDN === view.previousSibling ) {
    598600                    setViewCursor( true, view );
    599                 }
    600             } else {
     601                    return;
     602                } else if ( lKDN === view.nextSibling ) {
     603                    setViewCursor( false, view );
     604                    return;
     605                }
     606
     607                dom.addClass( view, className );
     608
     609                cursorInterval = setInterval( function() {
     610                    if ( dom.hasClass( view, 'wpview-cursor-hide' ) ) {
     611                        dom.removeClass( view, 'wpview-cursor-hide' );
     612                    } else {
     613                        dom.addClass( view, 'wpview-cursor-hide' );
     614                    }
     615                }, 500 );
     616            // If the cursor lands anywhere else in the view, set the cursor before it.
     617            // Only try this once to prevent a loop. (You never know.)
     618            } else if ( ! getParent( event.element, 'wpview-clipboard' ) && ! setViewCursorTries ) {
    601619                deselect();
     620                setViewCursorTries++;
     621                setViewCursor( true, view );
    602622            }
    603623        }
Note: See TracChangeset for help on using the changeset viewer.