sergiotarxz
/
Wordpress
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Editor expand: 

- Adjust calculation when comparing sidebar position to wpfooter top. Fixes an annoying jumping when the user scrolls off the bottom.
- Use a var for the 'bottom' distance of the sidebar.
- Fix sidebar pinning when it's height is nearly the same as the viewport height.
Fixes #29349

git-svn-id: https://develop.svn.wordpress.org/trunk@29656 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrew Ozz 2014-09-01 18:48:07 +00:00
parent 14313673d5
commit c3222171cd
1 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/wp-admin/js/editor-expand.js
View File

@ -33,6 +33,7 @@ jQuery( document ).ready( function($) {
lastScrollPosition = 0, lastScrollPosition = 0,
pageYOffsetAtTop = 130, pageYOffsetAtTop = 130,
pinnedToolsTop = 56, pinnedToolsTop = 56,
sidebarBottom = 20,
autoresizeMinHeight = 300, autoresizeMinHeight = 300,
initialMode = window.getUserSetting( 'editor' ), initialMode = window.getUserSetting( 'editor' ),
// These are corrected when adjust() runs, except on scrolling if already set. // These are corrected when adjust() runs, except on scrolling if already set.
@ -432,7 +433,7 @@ jQuery( document ).ready( function($) {
$document.height() > ( $sideSortables.height() + postBodyTop + 120 ) && // the sidebar is not the tallest element $document.height() > ( $sideSortables.height() + postBodyTop + 120 ) && // the sidebar is not the tallest element
heights.windowHeight < editorHeight ) { // the editor is taller than the viewport heights.windowHeight < editorHeight ) { // the editor is taller than the viewport
if ( heights.sideSortablesHeight > heights.windowHeight || fixedSideTop || fixedSideBottom ) { if ( ( heights.sideSortablesHeight + pinnedToolsTop + sidebarBottom ) > heights.windowHeight || fixedSideTop || fixedSideBottom ) {
// Reset when scrolling to the top // Reset when scrolling to the top
if ( windowPos + pinnedToolsTop <= postBodyTop ) { if ( windowPos + pinnedToolsTop <= postBodyTop ) {
$sideSortables.attr( 'style', '' ); $sideSortables.attr( 'style', '' );
@ -447,8 +448,8 @@ jQuery( document ).ready( function($) {
footerTop = $footer.offset().top; footerTop = $footer.offset().top;
// don't get over the footer // don't get over the footer
if ( footerTop < sidebarTop + heights.sideSortablesHeight + 20 ) { if ( footerTop < sidebarTop + heights.sideSortablesHeight + sidebarBottom ) {
sidebarTop = footerTop - heights.sideSortablesHeight - 20; sidebarTop = footerTop - heights.sideSortablesHeight - 12;
} }
$sideSortables.css({ $sideSortables.css({
@ -456,14 +457,14 @@ jQuery( document ).ready( function($) {
top: sidebarTop, top: sidebarTop,
bottom: '' bottom: ''
}); });
} else if ( ! fixedSideBottom && heights.sideSortablesHeight + $sideSortables.offset().top + 20 < windowPos + heights.windowHeight ) { } else if ( ! fixedSideBottom && heights.sideSortablesHeight + $sideSortables.offset().top + sidebarBottom < windowPos + heights.windowHeight ) {
// pin the bottom // pin the bottom
fixedSideBottom = true; fixedSideBottom = true;
$sideSortables.css({ $sideSortables.css({
position: 'fixed', position: 'fixed',
top: 'auto', top: 'auto',
bottom: '20px' bottom: sidebarBottom
}); });
} }
} else if ( windowPos < lastScrollPosition ) { } else if ( windowPos < lastScrollPosition ) {
@ -471,12 +472,12 @@ jQuery( document ).ready( function($) {
if ( fixedSideBottom ) { if ( fixedSideBottom ) {
// let it scroll // let it scroll
fixedSideBottom = false; fixedSideBottom = false;
sidebarTop = $sideSortables.offset().top - 20; sidebarTop = $sideSortables.offset().top - sidebarBottom;
footerTop = $footer.offset().top; footerTop = $footer.offset().top;
// don't get over the footer // don't get over the footer
if ( footerTop < sidebarTop + heights.sideSortablesHeight + 20 ) { if ( footerTop < sidebarTop + heights.sideSortablesHeight + sidebarBottom ) {
sidebarTop = footerTop - heights.sideSortablesHeight - 20; sidebarTop = footerTop - heights.sideSortablesHeight - 12;
} }
$sideSortables.css({ $sideSortables.css({
@ -499,6 +500,7 @@ jQuery( document ).ready( function($) {
} else { } else {
// if the sidebar container is smaller than the viewport, then pin/unpin the top when scrolling // if the sidebar container is smaller than the viewport, then pin/unpin the top when scrolling
if ( windowPos >= ( postBodyTop - pinnedToolsTop ) ) { if ( windowPos >= ( postBodyTop - pinnedToolsTop ) ) {
$sideSortables.css( { $sideSortables.css( {
position: 'fixed', position: 'fixed',
top: pinnedToolsTop top: pinnedToolsTop
@ -569,7 +571,7 @@ jQuery( document ).ready( function($) {
// Adjust when collapsing the menu, changing the columns, changing the body class. // Adjust when collapsing the menu, changing the columns, changing the body class.
$document.on( 'wp-collapse-menu.editor-expand postboxes-columnchange.editor-expand editor-classchange.editor-expand', adjust ) $document.on( 'wp-collapse-menu.editor-expand postboxes-columnchange.editor-expand editor-classchange.editor-expand', adjust )
.on( 'postbox-toggled.editor-expand', function() { .on( 'postbox-toggled.editor-expand', function() {
if ( ! fixedSideTop && ! fixedSideBottom && window.pageYOffset > 20 ) { if ( ! fixedSideTop && ! fixedSideBottom && window.pageYOffset > pinnedToolsTop ) {
fixedSideBottom = true; fixedSideBottom = true;
window.scrollBy( 0, -1 ); window.scrollBy( 0, -1 );
adjust(); adjust();