Ticket #28328: 28328.21.patch

src/wp-admin/js/editor-expand.js

@@ -16 +16 @@
                 $textEditorClone = $( '<div id="content-textarea-clone"></div>' ),
                 $bottom = $( '#post-status-info' ),
                 $statusBar,
+                $sideSortables = $( '#side-sortables' ),
                 fullscreen = window.wp.editor && window.wp.editor.fullscreen,
                 mceEditor,
                 mceBind = function(){},
@@ -22 +23 @@
                 mceUnbind = function(){},
                 fixedTop = false,
                 fixedBottom = false,
-                scrollTimer;
+                scrollTimer,
+                pageYOffsetAtTop = 130,
+                textEditorClonePaddingTop = 37,
+                autoresizeMinHeight = $window.height() - 310;
 
         $textEditorClone.insertAfter( $textEditor );
 
@@ -31 +35 @@
                 'font-size': $textEditor.css( 'font-size' ),
                 'line-height': $textEditor.css( 'line-height' ),
                 'padding': $textEditor.css( 'padding' ),
-                'padding-top': 37,
+                'padding-top': textEditorClonePaddingTop,
                 'white-space': 'pre-wrap',
                 'word-wrap': 'break-word'
         } );
@@ -88 +92 @@
 
                 hiddenHeight = $textEditorClone.height();
 
-                if ( hiddenHeight < 300 ) {
-                        hiddenHeight = 300;
+                if ( hiddenHeight < autoresizeMinHeight ) {
+                        hiddenHeight = autoresizeMinHeight;
                 }
 
                 if ( hiddenHeight === textEditorHeight ) {
@@ -112 +116 @@
                 mceEditor = editor;
 
                 // Set the minimum height to the initial viewport height.
-                editor.settings.autoresize_min_height = 300;
+                editor.settings.autoresize_min_height = autoresizeMinHeight;
 
                 // Get the necessary UI elements.
                 $visualTop = $contentWrap.find( '.mce-toolbar-grp' );
@@ -218 +222 @@
                         adminBarHeight = windowWidth > 600 ? $adminBar.height() : 0,
                         resize = type !== 'scroll',
                         visual = ( mceEditor && ! mceEditor.isHidden() ),
-                        buffer = 200,
+                        buffer = autoresizeMinHeight + adminBarHeight,
                         $top, $editor,
                         toolsHeight, topPos, topHeight, editorPos, editorHeight, editorWidth, statusBarHeight;
 
@@ -236 +240 @@
                 editorPos = $editor.offset().top;
                 editorHeight = $editor.outerHeight();
                 editorWidth = $editor.outerWidth();
+                borderWidth = 1;
                 statusBarHeight = visual ? $statusBar.outerHeight() : 0;
 
                 // Maybe pin the top.
@@ -256 +261 @@
                         $tools.css( {
                                 position: 'fixed',
                                 top: adminBarHeight,
-                                width: editorWidth + 2
+                                width: editorWidth + ( borderWidth * 2 )
                         } );
                 // Maybe unpin the top.
                 } else if ( fixedTop || resize ) {
@@ -287 +292 @@
 
                                 $tools.css( {
                                         position: 'absolute',
-                                        top: editorHeight - buffer + 1, // border
+                                        top: editorHeight - buffer + borderWidth, // border
                                         width: $contentWrap.width()
                                 } );
                         }
@@ -295 +300 @@
 
                 // Maybe adjust the bottom bar.
                 if ( ( ! fixedBottom || resize ) &&
-                                // + 1 for the border around the .wp-editor-container.
-                                ( windowPos + windowHeight ) <= ( editorPos + editorHeight + bottomHeight + statusBarHeight + 1 ) ) {
+                                // +[n] for the border around the .wp-editor-container.
+                                ( windowPos + windowHeight ) <= ( editorPos + editorHeight + bottomHeight + statusBarHeight + borderWidth ) ) {
                         fixedBottom = true;
 
                         $bottom.css( {
                                 position: 'fixed',
                                 bottom: 0,
-                                width: editorWidth + 2,
+                                width: editorWidth + ( borderWidth * 2 ),
                                 borderTop: '1px solid #dedede'
                         } );
                 } else if ( ( fixedBottom || resize ) &&
-                                ( windowPos + windowHeight ) > ( editorPos + editorHeight + bottomHeight + statusBarHeight - 1 ) ) {
+                                ( windowPos + windowHeight ) > ( editorPos + editorHeight + bottomHeight + statusBarHeight - borderWidth ) ) {
                         fixedBottom = false;
 
                         $bottom.css( {
@@ -317 +322 @@
                         } );
                 }
 
+                // Handle sidebar pinning
+                if ( $sideSortables.outerHeight() > windowHeight ) {
+                        // If the sidebar is taller than the viewport, pin/unpin the bottom when scrolling
+                        if ( ( windowPos + windowHeight ) <= ( editorPos + editorHeight + bottomHeight + statusBarHeight + borderWidth ) ) {
+                                $sideSortables.css( {
+                                        position: 'relative',
+                                        bottom: 'auto'
+                                } );
+
+                        } else if ( ( windowPos + windowHeight ) > ( editorPos + editorHeight + bottomHeight + statusBarHeight - borderWidth ) ) {
+                                $sideSortables.css( {
+                                        position: 'fixed',
+                                        bottom: 0,
+                                        marginBottom: '20px'
+                                } );
+                        }
+                } else {
+                        // if the sidebar container is smaller than the viewport, then pin/unpin the top when scrolling
+                        if ( windowPos >= ( toolsHeight + adminBarHeight ) ) {
+                                $sideSortables.css( {
+                                        position: 'fixed',
+                                        top: toolsHeight
+                                } );
+                        } else {
+                                $sideSortables.css( {
+                                        position: 'relative',
+                                        top: 'auto'
+                                } );
+                        }
+                }
+
                 if ( resize ) {
                         $contentWrap.css( {
                                 paddingTop: $tools.outerHeight()
@@ -354 +390 @@
         function on() {
                 // Scroll to the top when triggering this from JS.
                 // Ensures toolbars are pinned properly.
-                if ( window.pageYOffset && window.pageYOffset > 130 ) {
+                if ( window.pageYOffset && window.pageYOffset > pageYOffsetAtTop ) {
                         window.scrollTo( window.pageXOffset, 0 );
                 }
 
@@ -397 +433 @@
 
                 // Scroll to the top when triggering this from JS.
                 // Ensures toolbars are reset properly.
-                if ( window.pageYOffset && window.pageYOffset > 130 ) {
+                if ( window.pageYOffset && window.pageYOffset > pageYOffsetAtTop ) {
                         window.scrollTo( window.pageXOffset, 0 );
                 }