WordPress.org

Make WordPress Core

Ticket #28328: 28328.25.patch

File 28328.25.patch, 6.5 KB (added by azaozz, 3 years ago)
  • src/wp-admin/css/edit.css

     
    405405} 
    406406/* end editor-expand.js override */ 
    407407 
     408#poststuff #post-body #postbox-container-1.pinned { 
     409        position: fixed; 
     410        margin: 0; 
     411        top: 56px; 
     412        bottom: 0; 
     413        right: 20px; 
     414        transition: top 200ms; 
     415} 
     416 
     417#postbox-container-1 #side-sortables { 
     418        padding-bottom: 1px; 
     419} 
     420 
    408421#timestampdiv select { 
    409422        height: 21px; 
    410423        line-height: 14px; 
  • src/wp-admin/js/editor-expand.js

     
    1616                $textEditorClone = $( '<div id="content-textarea-clone"></div>' ), 
    1717                $bottom = $( '#post-status-info' ), 
    1818                $statusBar, 
     19                $sideSortables = $( '#side-sortables' ), 
     20                $postboxContainer = $('#postbox-container-1'), 
     21                $postBodyContent = $('#post-body-content'), 
     22                $postBody = $('#post-body'), 
    1923                fullscreen = window.wp.editor && window.wp.editor.fullscreen, 
    2024                mceEditor, 
    2125                mceBind = function(){}, 
     
    2226                mceUnbind = function(){}, 
    2327                fixedTop = false, 
    2428                fixedBottom = false, 
    25                 scrollTimer; 
     29                fixedSide = false, 
     30                scrolledSide = false, 
     31                scrollTimer, 
     32                lastScrollPosition = 0, 
     33                pageYOffsetAtTop = 130, 
     34                textEditorClonePaddingTop = 37, 
     35                autoresizeMinHeight = $window.height() - 310; 
    2636 
    2737        $textEditorClone.insertAfter( $textEditor ); 
    2838 
     
    3141                'font-size': $textEditor.css( 'font-size' ), 
    3242                'line-height': $textEditor.css( 'line-height' ), 
    3343                'padding': $textEditor.css( 'padding' ), 
    34                 'padding-top': 37, 
     44                'padding-top': textEditorClonePaddingTop, 
    3545                'white-space': 'pre-wrap', 
    3646                'word-wrap': 'break-word' 
    3747        } ); 
     
    8898 
    8999                hiddenHeight = $textEditorClone.height(); 
    90100 
    91                 if ( hiddenHeight < 300 ) { 
    92                         hiddenHeight = 300; 
     101                if ( hiddenHeight < autoresizeMinHeight ) { 
     102                        hiddenHeight = autoresizeMinHeight; 
    93103                } 
    94104 
    95105                if ( hiddenHeight === textEditorHeight ) { 
     
    112122                mceEditor = editor; 
    113123 
    114124                // Set the minimum height to the initial viewport height. 
    115                 editor.settings.autoresize_min_height = 300; 
     125                editor.settings.autoresize_min_height = autoresizeMinHeight; 
    116126 
    117127                // Get the necessary UI elements. 
    118128                $visualTop = $contentWrap.find( '.mce-toolbar-grp' ); 
     
    218228                        adminBarHeight = windowWidth > 600 ? $adminBar.height() : 0, 
    219229                        resize = type !== 'scroll', 
    220230                        visual = ( mceEditor && ! mceEditor.isHidden() ), 
    221                         buffer = 200, 
     231                        buffer = autoresizeMinHeight + adminBarHeight, 
     232                        postBodyTop = $postBody.offset().top, 
    222233                        $top, $editor, 
    223                         toolsHeight, topPos, topHeight, editorPos, editorHeight, editorWidth, statusBarHeight; 
     234                        toolsHeight, topPos, topHeight, editorPos, editorHeight, editorWidth, statusBarHeight, sideScrollTrigger; 
    224235 
    225236                if ( visual ) { 
    226237                        $top = $visualTop; 
     
    236247                editorPos = $editor.offset().top; 
    237248                editorHeight = $editor.outerHeight(); 
    238249                editorWidth = $editor.outerWidth(); 
     250                borderWidth = 1; 
    239251                statusBarHeight = visual ? $statusBar.outerHeight() : 0; 
    240252 
    241253                // Maybe pin the top. 
     
    256268                        $tools.css( { 
    257269                                position: 'fixed', 
    258270                                top: adminBarHeight, 
    259                                 width: editorWidth + 2 
     271                                width: editorWidth + ( borderWidth * 2 ) 
    260272                        } ); 
    261273                // Maybe unpin the top. 
    262274                } else if ( fixedTop || resize ) { 
     
    287299 
    288300                                $tools.css( { 
    289301                                        position: 'absolute', 
    290                                         top: editorHeight - buffer + 1, // border 
     302                                        top: editorHeight - buffer + borderWidth, // border 
    291303                                        width: $contentWrap.width() 
    292304                                } ); 
    293305                        } 
     
    295307 
    296308                // Maybe adjust the bottom bar. 
    297309                if ( ( ! fixedBottom || resize ) && 
    298                                 // + 1 for the border around the .wp-editor-container. 
    299                                 ( windowPos + windowHeight ) <= ( editorPos + editorHeight + bottomHeight + statusBarHeight + 1 ) ) { 
     310                                // +[n] for the border around the .wp-editor-container. 
     311                                ( windowPos + windowHeight ) <= ( editorPos + editorHeight + bottomHeight + statusBarHeight + borderWidth ) ) { 
    300312                        fixedBottom = true; 
    301313 
    302314                        $bottom.css( { 
    303315                                position: 'fixed', 
    304316                                bottom: 0, 
    305                                 width: editorWidth + 2, 
     317                                width: editorWidth + ( borderWidth * 2 ), 
    306318                                borderTop: '1px solid #dedede' 
    307319                        } ); 
    308320                } else if ( ( fixedBottom || resize ) && 
    309                                 ( windowPos + windowHeight ) > ( editorPos + editorHeight + bottomHeight + statusBarHeight - 1 ) ) { 
     321                                ( windowPos + windowHeight ) > ( editorPos + editorHeight + bottomHeight + statusBarHeight - borderWidth ) ) { 
    310322                        fixedBottom = false; 
    311323 
    312324                        $bottom.css( { 
     
    317329                        } ); 
    318330                } 
    319331 
     332                // The sidebar is on the left and the scrolling height is large enough, pin it. 
     333                if ( $postboxContainer.width() < 300 && windowWidth > 600 && 
     334                        $document.height() > ( $sideSortables.height() + postBodyTop + 120 ) ) { 
     335 
     336                        if ( ! fixedSide && ( postBodyTop - 56 ) < windowPos ) { 
     337                                fixedSide = true; 
     338                                $postboxContainer.addClass( 'pinned' ); 
     339                        } else if ( fixedSide ) { 
     340                                if ( ( postBodyTop - 56 ) >= windowPos ) { 
     341                                        fixedSide = false; 
     342                                        $postboxContainer.removeClass( 'pinned' ); 
     343                                } 
     344                        } 
     345 
     346                        if ( fixedSide && windowPos > lastScrollPosition ) { 
     347                                // Scrolling down 
     348                                sideScrollTrigger = ( $sideSortables.height() - ( windowHeight - 56 ) ); 
     349 
     350                                if ( ! scrolledSide && sideScrollTrigger > 1 && windowPos > sideScrollTrigger && windowPos > $wrap.offset().top ) { 
     351                                        scrolledSide = true; 
     352                                        $postboxContainer.css( 'top', -( sideScrollTrigger - 36 ) ); 
     353                                } 
     354                        } else if ( scrolledSide && windowPos < lastScrollPosition ) { 
     355                                scrolledSide = false; 
     356                                $postboxContainer.css( 'top', '' ); 
     357                        } 
     358 
     359                        lastScrollPosition = windowPos; 
     360                } else { 
     361                        // Unpin 
     362                        $postboxContainer.removeClass( 'pinned' ); 
     363                        $postboxContainer.css( 'top', '' ); 
     364                        scrolledSide = fixedSide = false; 
     365                } 
     366 
    320367                if ( resize ) { 
    321368                        $contentWrap.css( { 
    322369                                paddingTop: $tools.outerHeight() 
     
    354401        function on() { 
    355402                // Scroll to the top when triggering this from JS. 
    356403                // Ensures toolbars are pinned properly. 
    357                 if ( window.pageYOffset && window.pageYOffset > 130 ) { 
     404                if ( window.pageYOffset && window.pageYOffset > pageYOffsetAtTop ) { 
    358405                        window.scrollTo( window.pageXOffset, 0 ); 
    359406                } 
    360407 
     
    397444 
    398445                // Scroll to the top when triggering this from JS. 
    399446                // Ensures toolbars are reset properly. 
    400                 if ( window.pageYOffset && window.pageYOffset > 130 ) { 
     447                if ( window.pageYOffset && window.pageYOffset > pageYOffsetAtTop ) { 
    401448                        window.scrollTo( window.pageXOffset, 0 ); 
    402449                } 
    403450