Improve the fix for menu shakiness when over-scrolling. Recalculate heights on editor auto-resize.

See #30692.

git-svn-id: https://develop.svn.wordpress.org/trunk@30852 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrew Ozz 2014-12-15 00:10:18 +00:00
parent 326d7f8c5f
commit 284bfd81b9

View File

@ -193,11 +193,9 @@ $(document).ready( function() {
lastScrollPosition = 0, lastScrollPosition = 0,
pinnedMenuTop = false, pinnedMenuTop = false,
pinnedMenuBottom = false, pinnedMenuBottom = false,
isScrolling = false,
scrollTimer,
menuTop = 0, menuTop = 0,
menuIsPinned = false,
height = { height = {
document: $document.height(),
window: $window.height(), window: $window.height(),
wpwrap: $wpwrap.height(), wpwrap: $wpwrap.height(),
adminbar: $adminbar.height(), adminbar: $adminbar.height(),
@ -544,18 +542,22 @@ $(document).ready( function() {
input.on('change', toggleUploadButton); input.on('change', toggleUploadButton);
})(); })();
function pinMenu() { function pinMenu( event ) {
var windowPos = $window.scrollTop(); var windowPos = $window.scrollTop(),
resizing = ! event || event.type !== 'scroll';
if ( isIOS || isIE8 || $adminmenu.data( 'wp-responsive' ) ) { if ( isIOS || isIE8 || $adminmenu.data( 'wp-responsive' ) ) {
return; return;
} }
if ( height.menu + height.adminbar + 20 > height.wpwrap ) { // 20px "buffer" if ( height.menu + height.adminbar < height.window ||
height.menu + height.adminbar + 20 > height.wpwrap ) {
unpinMenu(); unpinMenu();
return; return;
} }
menuIsPinned = true;
if ( height.menu + height.adminbar > height.window ) { if ( height.menu + height.adminbar > height.window ) {
// Check for overscrolling // Check for overscrolling
if ( windowPos < 0 ) { if ( windowPos < 0 ) {
@ -571,7 +573,7 @@ $(document).ready( function() {
} }
return; return;
} else if ( windowPos + height.window > height.document - 1 ) { } else if ( windowPos + height.window > $document.height() - 1 ) {
if ( ! pinnedMenuBottom ) { if ( ! pinnedMenuBottom ) {
pinnedMenuBottom = true; pinnedMenuBottom = true;
pinnedMenuTop = false; pinnedMenuTop = false;
@ -638,7 +640,7 @@ $(document).ready( function() {
bottom: '' bottom: ''
}); });
} }
} else { } else if ( resizing ) {
// Resizing // Resizing
pinnedMenuTop = pinnedMenuBottom = false; pinnedMenuTop = pinnedMenuBottom = false;
menuTop = windowPos + height.window - height.menu - height.adminbar - 1; menuTop = windowPos + height.window - height.menu - height.adminbar - 1;
@ -660,7 +662,6 @@ $(document).ready( function() {
function resetHeights() { function resetHeights() {
height = { height = {
document: $document.height(),
window: $window.height(), window: $window.height(),
wpwrap: $wpwrap.height(), wpwrap: $wpwrap.height(),
adminbar: $adminbar.height(), adminbar: $adminbar.height(),
@ -669,11 +670,11 @@ $(document).ready( function() {
} }
function unpinMenu() { function unpinMenu() {
if ( isIOS ) { if ( isIOS || ! menuIsPinned ) {
return; return;
} }
pinnedMenuTop = pinnedMenuBottom = false; pinnedMenuTop = pinnedMenuBottom = menuIsPinned = false;
$adminMenuWrap.css({ $adminMenuWrap.css({
position: '', position: '',
top: '', top: '',
@ -696,23 +697,10 @@ $(document).ready( function() {
} }
} }
function scrollStart() {
if ( isScrolling ) {
window.clearTimeout( scrollTimer );
scrollTimer = window.setTimeout( function() {
isScrolling = false;
}, 200 );
} else {
isScrolling = true;
$document.triggerHandler( 'wp-scroll-start' );
}
}
if ( ! isIOS ) { if ( ! isIOS ) {
$window.on( 'scroll.pin-menu', function() { $window.on( 'scroll.pin-menu', pinMenu );
scrollStart(); $document.on( 'tinymce-editor-init.pin-menu', function( event, editor ) {
pinMenu(); editor.on( 'wp-autoresize', resetHeights );
}); });
} }