Changeset 29978

Timestamp:

10/21/2014 06:11:07 AM (10 years ago)

Author:

azaozz

Message:

Admin menu:

• Fix scrolling the pinned menu with a mouse wheel.
• Fix pinning when the menu is only slightly taller than the viewport.
• Disable pinning on IE8, updating CSS top makes it jump when scrolling with a mouse wheel.

See #29806

File:

• trunk/src/wp-admin/js/common.js (modified) (8 diffs)

trunk/src/wp-admin/js/common.js

@@ -178 +178 @@
         isIOS = /iPhone|iPad|iPod/.test( navigator.userAgent ),
         isAndroid = navigator.userAgent.indexOf( 'Android' ) !== -1,
+        isIE8 = $( document.documentElement ).hasClass( 'ie8' ),
         $document = $( document ),
         $window = $( window ),
@@ -196 +197 @@
         height = {
             window: $window.height(),
+            wpwrap: $wpwrap.height(),
             adminbar: $adminbar.height(),
             menu: $adminMenuWrap.height()
@@ -536 +538 @@
         var windowPos = $window.scrollTop();
 
-        if ( isIOS || $adminmenu.data('wp-responsive') ) {
+        if ( isIOS || isIE8 || $adminmenu.data( 'wp-responsive' ) ) {
+            return;
+        }
+
+        if ( height.menu + height.adminbar + 20 > height.wpwrap ) { // 20px "buffer"
+            unpinMenu();
             return;
         }
@@ -546 +553 @@
                     // let it scroll
                     pinnedMenuTop = false;
-                    menuTop = $adminMenuWrap.offset().top - height.adminbar;
+                    menuTop = $adminMenuWrap.offset().top - height.adminbar - ( windowPos - lastScrollPosition );
+
+                    if ( menuTop + height.menu + height.adminbar < windowPos + height.window ) {
+                        menuTop = windowPos + height.window - height.menu - height.adminbar;
+                    }
 
                     $adminMenuWrap.css({
@@ -568 +579 @@
                     // let it scroll
                     pinnedMenuBottom = false;
-                    menuTop = $adminMenuWrap.offset().top - height.adminbar;
+                    menuTop = $adminMenuWrap.offset().top - height.adminbar + ( lastScrollPosition - windowPos );
+
+                    if ( menuTop + height.menu > windowPos + height.window ) {
+                        menuTop = windowPos;
+                    }
 
                     $adminMenuWrap.css({
@@ -588 +603 @@
                 // Resizing
                 pinnedMenuTop = pinnedMenuBottom = false;
-                menuTop = $adminMenuWrap.offset().top - height.adminbar;
-
-                $adminMenuWrap.css({
-                    position: 'absolute',
-                    top: menuTop,
-                    bottom: ''
-                });
+                menuTop = windowPos + height.window - height.menu - height.adminbar - 1;
+
+                if ( menuTop > 0 ) {
+                    $adminMenuWrap.css({
+                        position: 'absolute',
+                        top: menuTop,
+                        bottom: ''
+                    });
+                } else {
+                    unpinMenu();
+                }
             }
         }
@@ -627 +646 @@
     }
 
-    setPinMenu();
-
     if ( ! isIOS ) {
         $window.on( 'scroll.pin-menu', pinMenu );
     }
-
-    $document.on( 'wp-window-resized.pin-menu', function() {
-        height.window = $window.height();
-        height.adminbar = $adminbar.height();
-        setPinMenu();
-    }).on( 'wp-collapse-menu.pin-menu', function() {
-        height.menu = $adminMenuWrap.height();
-        setPinMenu();
-    });
 
     window.wpResponsive = {
@@ -776 +784 @@
 
     window.wpResponsive.init();
+    setPinMenu();
+
+    $document.on( 'wp-window-resized.pin-menu postboxes-columnchange.pin-menu postbox-toggled.pin-menu', function() {
+        height.wpwrap = $wpwrap.height();
+        height.window = $window.height();
+        height.adminbar = $adminbar.height();
+        setPinMenu();
+    }).on( 'wp-collapse-menu.pin-menu', function() {
+        height.wpwrap = $wpwrap.height();
+        height.menu = $adminMenuWrap.height();
+        setPinMenu();
+    });
+
 });