WordPress.org

Make WordPress Core

Ticket #32604: 32604.3.patch

File 32604.3.patch, 7.1 KB (added by iseulde, 5 years ago)
  • src/wp-includes/js/tinymce/plugins/wordpress/plugin.js

     
    447447                var Factory = tinymce.ui.Factory,
    448448                        settings = editor.settings,
    449449                        currentToolbar,
    450                         currentSelection;
     450                        currentSelection,
     451                        wpAdminbar = document.getElementById( 'wpadminbar' ),
     452                        wpStatusbar = document.getElementById( 'post-status-info' ),
     453                        mceIframe, mceToolbar, mceStatusbar;
     454
     455                editor.on( 'init', function() {
     456                        mceIframe = document.getElementById( editor.id + '_ifr' );
     457                        mceToolbar = tinymce.$( '.mce-toolbar-grp', editor.getContainer() )[0];
     458                        mceStatusbar = tinymce.$( '.mce-statusbar', editor.getContainer() )[0];
     459                } );
    451460
    452                 function create( buttons ) {
     461                function create( buttons, bottom ) {
    453462                        var toolbar,
    454463                                toolbarItems = [],
    455464                                buttonGroup;
     
    573582                                } ]
    574583                        } );
    575584
     585                        toolbar.bottom = bottom;
     586
    576587                        function hide() {
    577588                                toolbar.hide();
    578589                        }
    579590
    580591                        function reposition() {
    581                                 var top, left, minTop, className,
    582                                         windowPos, adminbar, mceToolbar, boundary,
    583                                         boundaryMiddle, boundaryVerticalMiddle, spaceTop,
    584                                         spaceBottom, windowWidth, toolbarWidth, toolbarHalf,
    585                                         iframe, iframePos, iframeWidth, iframeHeigth,
    586                                         toolbarNodeHeight, verticalSpaceNeeded,
    587                                         toolbarNode = this.getEl(),
     592                                var pageYOffset = window.pageYOffset || document.documentElement.scrollTop,
     593                                        windowWidth = window.innerWidth,
     594                                        windowHeight = window.innerHeight,
     595                                        iframePos = DOM.getPos( mceIframe ),
     596                                        iframeWidth = mceIframe.offsetWidth,
     597                                        toolbar = this.getEl(),
     598                                        toolbarWidth = toolbar.offsetWidth,
     599                                        toolbarHeight = toolbar.offsetHeight,
     600                                        selection = currentSelection.getBoundingClientRect(),
     601                                        selectionMiddle = ( selection.left + selection.right ) / 2,
    588602                                        buffer = 5,
    589603                                        margin = 8,
    590                                         adminbarHeight = 0;
     604                                        spaceNeeded = toolbarHeight + margin + buffer,
     605                                        wpAdminbarBottom = wpAdminbar ? wpAdminbar.getBoundingClientRect().bottom : 0,
     606                                        mceToolbarBottom = mceToolbar ? mceToolbar.getBoundingClientRect().bottom : 0,
     607                                        mceStatusbarTop = mceStatusbar ? mceStatusbar.getBoundingClientRect().top : 0,
     608                                        wpStatusbarTop = wpStatusbar ? wpStatusbar.getBoundingClientRect().top : 0,
     609                                        blockedTop = Math.max( 0, wpAdminbarBottom, mceToolbarBottom ),
     610                                        blockedBottom = Math.max( 0, windowHeight - mceStatusbarTop, windowHeight - wpStatusbarTop ),
     611                                        spaceTop = selection.top + iframePos.y - pageYOffset - blockedTop,
     612                                        spaceBottom = pageYOffset + windowHeight - iframePos.y - selection.bottom - blockedBottom,
     613                                        editorHeight = windowHeight - blockedTop - blockedBottom,
     614                                        className = '',
     615                                        top, left;
    591616
    592                                 if ( ! currentSelection ) {
    593                                         return;
    594                                 }
    595 
    596                                 windowPos = window.pageYOffset || document.documentElement.scrollTop;
    597                                 adminbar = tinymce.$( '#wpadminbar' )[0];
    598                                 mceToolbar = tinymce.$( '.mce-toolbar-grp', editor.getContainer() )[0];
    599                                 boundary = currentSelection.getBoundingClientRect();
    600                                 boundaryMiddle = ( boundary.left + boundary.right ) / 2;
    601                                 boundaryVerticalMiddle = ( boundary.top + boundary.bottom ) / 2;
    602                                 spaceTop = boundary.top;
    603                                 spaceBottom = iframeHeigth - boundary.bottom;
    604                                 windowWidth = window.innerWidth;
    605                                 toolbarWidth = toolbarNode.offsetWidth;
    606                                 toolbarHalf = toolbarWidth / 2;
    607                                 iframe = document.getElementById( editor.id + '_ifr' );
    608                                 iframePos = DOM.getPos( iframe );
    609                                 iframeWidth = iframe.offsetWidth;
    610                                 iframeHeigth = iframe.offsetHeight;
    611                                 toolbarNodeHeight = toolbarNode.offsetHeight;
    612                                 verticalSpaceNeeded = toolbarNodeHeight + margin + buffer;
    613 
    614                                 if ( spaceTop >= verticalSpaceNeeded ) {
    615                                         className = ' mce-arrow-down';
    616                                         top = boundary.top + iframePos.y - toolbarNodeHeight - margin;
    617                                 } else if ( spaceBottom >= verticalSpaceNeeded ) {
    618                                         className = ' mce-arrow-up';
    619                                         top = boundary.bottom + iframePos.y;
    620                                 } else {
    621                                         top = buffer;
    622 
    623                                         if ( boundaryVerticalMiddle >= verticalSpaceNeeded ) {
    624                                                 className = ' mce-arrow-down';
    625                                         } else {
     617                                if ( this.bottom ) {
     618                                        if ( spaceBottom >= spaceNeeded ) {
    626619                                                className = ' mce-arrow-up';
     620                                                top = selection.bottom + iframePos.y;
     621                                        } else if ( spaceTop >= spaceNeeded ) {
     622                                                className = ' mce-arrow-down';
     623                                                top = selection.top + iframePos.y - toolbarHeight - margin;
    627624                                        }
    628                                 }
    629 
    630                                 // Make sure the image toolbar is below the main toolbar.
    631                                 if ( mceToolbar ) {
    632                                         minTop = DOM.getPos( mceToolbar ).y + mceToolbar.clientHeight;
    633625                                } else {
    634                                         minTop = iframePos.y;
    635                                 }
    636 
    637                                 // Make sure the image toolbar is below the adminbar (if visible) or below the top of the window.
    638                                 if ( windowPos ) {
    639                                         if ( adminbar && adminbar.getBoundingClientRect().top === 0 ) {
    640                                                 adminbarHeight = adminbar.clientHeight;
    641                                         }
    642 
    643                                         if ( windowPos + adminbarHeight > minTop ) {
    644                                                 minTop = windowPos + adminbarHeight;
     626                                        if ( spaceTop >= spaceNeeded ) {
     627                                                className = ' mce-arrow-down';
     628                                                top = selection.top + iframePos.y - toolbarHeight - margin;
     629                                        } else if ( spaceBottom >= spaceNeeded && editorHeight / 2 > selection.bottom + iframePos.y - pageYOffset - blockedTop ) {
     630                                                className = ' mce-arrow-up';
     631                                                top = selection.bottom + iframePos.y;
    645632                                        }
    646633                                }
    647634
    648                                 if ( top && minTop && ( minTop + buffer > top ) ) {
    649                                         top = minTop + buffer;
    650                                         className = '';
     635                                if ( typeof top === 'undefined' ) {
     636                                        top = pageYOffset + blockedTop + buffer;
    651637                                }
    652638
    653                                 left = boundaryMiddle - toolbarHalf;
    654                                 left += iframePos.x;
     639                                left = selectionMiddle - toolbarWidth / 2 + iframePos.x;
    655640
    656                                 if ( boundary.left < 0 || boundary.right > iframeWidth ) {
     641                                if ( selection.left < 0 || selection.right > iframeWidth ) {
    657642                                        left = iframePos.x + ( iframeWidth - toolbarWidth ) / 2;
    658643                                } else if ( toolbarWidth >= windowWidth ) {
    659644                                        className += ' mce-arrow-full';
    660645                                        left = 0;
    661                                 } else if ( ( left < 0 && boundary.left + toolbarWidth > windowWidth ) ||
    662                                         ( left + toolbarWidth > windowWidth && boundary.right - toolbarWidth < 0 ) ) {
    663 
     646                                } else if ( ( left < 0 && selection.left + toolbarWidth > windowWidth ) || ( left + toolbarWidth > windowWidth && selection.right - toolbarWidth < 0 ) ) {
    664647                                        left = ( windowWidth - toolbarWidth ) / 2;
    665648                                } else if ( left < iframePos.x ) {
    666649                                        className += ' mce-arrow-left';
    667                                         left = boundary.left + iframePos.x;
     650                                        left = selection.left + iframePos.x;
    668651                                } else if ( left + toolbarWidth > iframeWidth + iframePos.x ) {
    669652                                        className += ' mce-arrow-right';
    670                                         left = boundary.right - toolbarWidth + iframePos.x;
     653                                        left = selection.right - toolbarWidth + iframePos.x;
    671654                                }
    672655
    673                                 toolbarNode.className = toolbarNode.className.replace( / ?mce-arrow-[\w]+/g, '' );
    674                                 toolbarNode.className += className;
     656                                toolbar.className = toolbar.className.replace( / ?mce-arrow-[\w]+/g, '' );
     657                                toolbar.className += className;
    675658
    676                                 DOM.setStyles( toolbarNode, { 'left': left, 'top': top } );
     659                                DOM.setStyles( toolbar, {
     660                                        'left': left,
     661                                        'top': top
     662                                } );
    677663
    678664                                return this;
    679665                        }