Ticket #32604: 32604.2.patch
File 32604.2.patch, 6.6 KB (added by , 6 years ago) |
---|
-
src/wp-includes/js/tinymce/plugins/wordpress/plugin.js
447 447 var Factory = tinymce.ui.Factory, 448 448 settings = editor.settings, 449 449 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 } ); 451 460 452 461 function create( buttons ) { 453 462 var toolbar, … … 578 587 } 579 588 580 589 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(), 590 var pageYOffset = window.pageYOffset || document.documentElement.scrollTop, 591 windowWidth = window.innerWidth, 592 windowHeight = window.innerHeight, 593 iframePos = DOM.getPos( mceIframe ), 594 iframeWidth = mceIframe.offsetWidth, 595 toolbar = this.getEl(), 596 toolbarWidth = toolbar.offsetWidth, 597 toolbarHeight = toolbar.offsetHeight, 598 selection = currentSelection.getBoundingClientRect(), 599 selectionMiddle = ( selection.left + selection.right ) / 2, 588 600 buffer = 5, 589 601 margin = 8, 590 adminbarHeight = 0; 591 592 if ( ! currentSelection ) { 593 return; 594 } 602 spaceNeeded = toolbarHeight + margin + buffer, 603 wpAdminbarBottom = wpAdminbar ? wpAdminbar.getBoundingClientRect().bottom : 0, 604 mceToolbarBottom = mceToolbar ? mceToolbar.getBoundingClientRect().bottom : 0, 605 mceStatusbarTop = mceStatusbar ? mceStatusbar.getBoundingClientRect().top : 0, 606 wpStatusbarTop = wpStatusbar ? wpStatusbar.getBoundingClientRect().top : 0, 607 blockedTop = Math.max( 0, wpAdminbarBottom, mceToolbarBottom ), 608 blockedBottom = Math.max( 0, windowHeight - mceStatusbarTop, windowHeight - wpStatusbarTop ), 609 spaceTop = selection.top + iframePos.y - pageYOffset - blockedTop, 610 spaceBottom = pageYOffset + windowHeight - iframePos.y - selection.bottom - blockedBottom, 611 editorHeight = windowHeight - blockedTop - blockedBottom, 612 className = '', 613 top, left; 595 614 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 if ( spaceTop >= spaceNeeded ) { 615 616 className = ' mce-arrow-down'; 616 top = boundary.top + iframePos.y - toolbarNodeHeight - margin;617 } else if ( spaceBottom >= verticalSpaceNeeded) {617 top = selection.top + iframePos.y - toolbarHeight - margin; 618 } else if ( spaceBottom >= spaceNeeded && editorHeight / 2 > selection.bottom + iframePos.y - pageYOffset - blockedTop ) { 618 619 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 { 626 className = ' mce-arrow-up'; 627 } 620 top = selection.bottom + iframePos.y; 628 621 } 629 622 630 // Make sure the image toolbar is below the main toolbar. 631 if ( mceToolbar ) { 632 minTop = DOM.getPos( mceToolbar ).y + mceToolbar.clientHeight; 633 } else { 634 minTop = iframePos.y; 623 if ( ! top ) { 624 top = pageYOffset + blockedTop + buffer; 635 625 } 636 626 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; 645 } 646 } 627 left = selectionMiddle - toolbarWidth / 2 + iframePos.x; 647 628 648 if ( top && minTop && ( minTop + buffer > top ) ) { 649 top = minTop + buffer; 650 className = ''; 651 } 652 653 left = boundaryMiddle - toolbarHalf; 654 left += iframePos.x; 655 656 if ( boundary.left < 0 || boundary.right > iframeWidth ) { 629 if ( selection.left < 0 || selection.right > iframeWidth ) { 657 630 left = iframePos.x + ( iframeWidth - toolbarWidth ) / 2; 658 631 } else if ( toolbarWidth >= windowWidth ) { 659 632 className += ' mce-arrow-full'; 660 633 left = 0; 661 } else if ( ( left < 0 && boundary.left + toolbarWidth > windowWidth ) || 662 ( left + toolbarWidth > windowWidth && boundary.right - toolbarWidth < 0 ) ) { 663 634 } else if ( ( left < 0 && selection.left + toolbarWidth > windowWidth ) || ( left + toolbarWidth > windowWidth && selection.right - toolbarWidth < 0 ) ) { 664 635 left = ( windowWidth - toolbarWidth ) / 2; 665 636 } else if ( left < iframePos.x ) { 666 637 className += ' mce-arrow-left'; 667 left = boundary.left + iframePos.x;638 left = selection.left + iframePos.x; 668 639 } else if ( left + toolbarWidth > iframeWidth + iframePos.x ) { 669 640 className += ' mce-arrow-right'; 670 left = boundary.right - toolbarWidth + iframePos.x;641 left = selection.right - toolbarWidth + iframePos.x; 671 642 } 672 643 673 toolbar Node.className = toolbarNode.className.replace( / ?mce-arrow-[\w]+/g, '' );674 toolbar Node.className += className;644 toolbar.className = toolbar.className.replace( / ?mce-arrow-[\w]+/g, '' ); 645 toolbar.className += className; 675 646 676 DOM.setStyles( toolbarNode, { 'left': left, 'top': top } ); 647 DOM.setStyles( toolbar, { 648 'left': left, 649 'top': top 650 } ); 677 651 678 652 return this; 679 653 }