]> scripts.mit.edu Git - autoinstalls/wordpress.git/blobdiff - wp-admin/js/common.js
WordPress 4.1
[autoinstalls/wordpress.git] / wp-admin / js / common.js
index b61763af06a0e3dd19fc85fad4cef1327f7741fa..01ce8945d41ae9bad743af011d868d12df1f6f1a 100644 (file)
@@ -173,12 +173,38 @@ $('.contextual-help-tabs').delegate('a', 'click', function(e) {
 $(document).ready( function() {
        var checks, first, last, checked, sliced, mobileEvent, transitionTimeout, focusedRowActions,
                lastClicked = false,
-               menu = $('#adminmenu'),
                pageInput = $('input.current-page'),
-               currentPage = pageInput.val();
+               currentPage = pageInput.val(),
+               isIOS = /iPhone|iPad|iPod/.test( navigator.userAgent ),
+               isAndroid = navigator.userAgent.indexOf( 'Android' ) !== -1,
+               isIE8 = $( document.documentElement ).hasClass( 'ie8' ),
+               $document = $( document ),
+               $window = $( window ),
+               $body = $( document.body ),
+               $adminMenuWrap = $( '#adminmenuwrap' ),
+               $wpwrap = $( '#wpwrap' ),
+               $adminmenu = $( '#adminmenu' ),
+               $overlay = $( '#wp-responsive-overlay' ),
+               $toolbar = $( '#wp-toolbar' ),
+               $toolbarPopups = $toolbar.find( 'a[aria-haspopup="true"]' ),
+               $sortables = $('.meta-box-sortables'),
+               wpResponsiveActive = false,
+               $adminbar = $( '#wpadminbar' ),
+               lastScrollPosition = 0,
+               pinnedMenuTop = false,
+               pinnedMenuBottom = false,
+               menuTop = 0,
+               menuIsPinned = false,
+               height = {
+                       window: $window.height(),
+                       wpwrap: $wpwrap.height(),
+                       adminbar: $adminbar.height(),
+                       menu: $adminMenuWrap.height()
+               };
+
 
        // when the menu is folded, make the fly-out submenu header clickable
-       menu.on('click.wp-submenu-head', '.wp-submenu-head', function(e){
+       $adminmenu.on('click.wp-submenu-head', '.wp-submenu-head', function(e){
                $(e.target).parent().siblings('a').get(0).click();
        });
 
@@ -222,133 +248,125 @@ $(document).ready( function() {
                $( document ).trigger( 'wp-collapse-menu', { state: state } );
        });
 
+       /**
+        * Ensure an admin submenu is within the visual viewport.
+        *
+        * @since 4.1.0
+        *
+        * @param {jQuery} $menuItem The parent menu item containing the submenu.
+        */
+       function adjustSubmenu( $menuItem ) {
+               var bottomOffset, pageHeight, adjustment, theFold, menutop, wintop, maxtop,
+                       $submenu = $menuItem.find( '.wp-submenu' );
+
+               menutop = $menuItem.offset().top;
+               wintop = $window.scrollTop();
+               maxtop = menutop - wintop - 30; // max = make the top of the sub almost touch admin bar
+
+               bottomOffset = menutop + $submenu.height() + 1; // Bottom offset of the menu
+               pageHeight = $wpwrap.height(); // Height of the entire page
+               adjustment = 60 + bottomOffset - pageHeight;
+               theFold = $window.height() + wintop - 50; // The fold
+
+               if ( theFold < ( bottomOffset - adjustment ) ) {
+                       adjustment = bottomOffset - theFold;
+               }
+
+               if ( adjustment > maxtop ) {
+                       adjustment = maxtop;
+               }
+
+               if ( adjustment > 1 ) {
+                       $submenu.css( 'margin-top', '-' + adjustment + 'px' );
+               } else {
+                       $submenu.css( 'margin-top', '' );
+               }
+       }
+
        if ( 'ontouchstart' in window || /IEMobile\/[1-9]/.test(navigator.userAgent) ) { // touch screen device
                // iOS Safari works with touchstart, the rest work with click
-               mobileEvent = /Mobile\/.+Safari/.test(navigator.userAgent) ? 'touchstart' : 'click';
+               mobileEvent = isIOS ? 'touchstart' : 'click';
 
                // close any open submenus when touch/click is not on the menu
                $(document.body).on( mobileEvent+'.wp-mobile-hover', function(e) {
-                       if ( menu.data('wp-responsive') ) {
+                       if ( $adminmenu.data('wp-responsive') ) {
                                return;
                        }
 
-                       if ( ! $(e.target).closest('#adminmenu').length ) {
-                               menu.find('li.wp-has-submenu.opensub').removeClass('opensub');
+                       if ( ! $( e.target ).closest( '#adminmenu' ).length ) {
+                               $adminmenu.find( 'li.opensub' ).removeClass( 'opensub' );
                        }
                });
 
-               menu.find('a.wp-has-submenu').on( mobileEvent+'.wp-mobile-hover', function(e) {
-                       var b, h, o, f, menutop, wintop, maxtop,
-                               el = $(this),
-                               parent = el.parent(),
-                               m = parent.find('.wp-submenu');
+               $adminmenu.find( 'a.wp-has-submenu' ).on( mobileEvent + '.wp-mobile-hover', function( event ) {
+                       var $menuItem = $(this).parent();
 
-                       if ( menu.data('wp-responsive') ) {
+                       if ( $adminmenu.data( 'wp-responsive' ) ) {
                                return;
                        }
 
                        // Show the sub instead of following the link if:
                        //      - the submenu is not open
                        //      - the submenu is not shown inline or the menu is not folded
-                       if ( !parent.hasClass('opensub') && ( !parent.hasClass('wp-menu-open') || parent.width() < 40 ) ) {
-                               e.preventDefault();
-
-                               menutop = parent.offset().top;
-                               wintop = $(window).scrollTop();
-                               maxtop = menutop - wintop - 30; // max = make the top of the sub almost touch admin bar
+                       if ( ! $menuItem.hasClass( 'opensub' ) && ( ! $menuItem.hasClass( 'wp-menu-open' ) || $menuItem.width() < 40 ) ) {
+                               event.preventDefault();
+                               adjustSubmenu( $menuItem );
+                               $adminmenu.find( 'li.opensub' ).removeClass( 'opensub' );
+                               $menuItem.addClass('opensub');
+                       }
+               });
+       }
 
-                               b = menutop + m.height() + 1; // Bottom offset of the menu
-                               h = $('#wpwrap').height(); // Height of the entire page
-                               o = 60 + b - h;
-                               f = $(window).height() + wintop - 50; // The fold
+       if ( ! isIOS && ! isAndroid ) {
+               $adminmenu.find( 'li.wp-has-submenu' ).hoverIntent({
+                       over: function() {
+                               var $menuItem = $( this ),
+                                       $submenu = $menuItem.find( '.wp-submenu' ),
+                                       top = parseInt( $submenu.css( 'top' ), 10 );
 
-                               if ( f < (b - o) ) {
-                                       o = b - f;
+                               if ( isNaN( top ) || top > -5 ) { // the submenu is visible
+                                       return;
                                }
 
-                               if ( o > maxtop ) {
-                                       o = maxtop;
+                               if ( $adminmenu.data( 'wp-responsive' ) ) {
+                                       // The menu is in responsive mode, bail
+                                       return;
                                }
 
-                               if ( o > 1 ) {
-                                       m.css('margin-top', '-'+o+'px');
-                               } else {
-                                       m.css('margin-top', '');
+                               adjustSubmenu( $menuItem );
+                               $adminmenu.find( 'li.opensub' ).removeClass( 'opensub' );
+                               $menuItem.addClass( 'opensub' );
+                       },
+                       out: function(){
+                               if ( $adminmenu.data( 'wp-responsive' ) ) {
+                                       // The menu is in responsive mode, bail
+                                       return;
                                }
 
-                               menu.find('li.opensub').removeClass('opensub');
-                               parent.addClass('opensub');
-                       }
+                               $( this ).removeClass( 'opensub' ).find( '.wp-submenu' ).css( 'margin-top', '' );
+                       },
+                       timeout: 200,
+                       sensitivity: 7,
+                       interval: 90
                });
-       }
-
-       menu.find('li.wp-has-submenu').hoverIntent({
-               over: function() {
-                       var b, h, o, f, m = $(this).find('.wp-submenu'), menutop, wintop, maxtop, top = parseInt( m.css('top'), 10 );
 
-                       if ( isNaN(top) || top > -5 ) { // meaning the submenu is visible
-                               return;
-                       }
-
-                       if ( menu.data('wp-responsive') ) {
+               $adminmenu.on( 'focus.adminmenu', '.wp-submenu a', function( event ) {
+                       if ( $adminmenu.data( 'wp-responsive' ) ) {
                                // The menu is in responsive mode, bail
                                return;
                        }
 
-                       menutop = $(this).offset().top;
-                       wintop = $(window).scrollTop();
-                       maxtop = menutop - wintop - 30; // max = make the top of the sub almost touch admin bar
-
-                       b = menutop + m.height() + 1; // Bottom offset of the menu
-                       h = $('#wpwrap').height(); // Height of the entire page
-                       o = 60 + b - h;
-                       f = $(window).height() + wintop - 15; // The fold
-
-                       if ( f < (b - o) ) {
-                               o = b - f;
-                       }
-
-                       if ( o > maxtop ) {
-                               o = maxtop;
-                       }
-
-                       if ( o > 1 ) {
-                               m.css('margin-top', '-'+o+'px');
-                       } else {
-                               m.css('margin-top', '');
-                       }
-
-                       menu.find('li.menu-top').removeClass('opensub');
-                       $(this).addClass('opensub');
-               },
-               out: function(){
-                       if ( menu.data('wp-responsive') ) {
-                               // The menu is in responsive mode, bail
+                       $( event.target ).closest( 'li.menu-top' ).addClass( 'opensub' );
+               }).on( 'blur.adminmenu', '.wp-submenu a', function( event ) {
+                       if ( $adminmenu.data( 'wp-responsive' ) ) {
                                return;
                        }
 
-                       $(this).removeClass('opensub').find('.wp-submenu').css('margin-top', '');
-               },
-               timeout: 200,
-               sensitivity: 7,
-               interval: 90
-       });
-
-       menu.on('focus.adminmenu', '.wp-submenu a', function(e){
-               if ( menu.data('wp-responsive') ) {
-                       // The menu is in responsive mode, bail
-                       return;
-               }
-
-               $(e.target).closest('li.menu-top').addClass('opensub');
-       }).on('blur.adminmenu', '.wp-submenu a', function(e){
-               if ( menu.data('wp-responsive') ) {
-                       // The menu is in responsive mode, bail
-                       return;
-               }
-
-               $(e.target).closest('li.menu-top').removeClass('opensub');
-       });
+                       $( event.target ).closest( 'li.menu-top' ).removeClass( 'opensub' );
+               }).find( 'li.wp-has-submenu.wp-not-current-submenu' ).on( 'focusin.adminmenu', function() {
+                       adjustSubmenu( $( this ) );
+               });
+       }
 
        // Move .updated and .error alert boxes. Don't move boxes designed to be inline.
        $('div.wrap h2:first').nextAll('div.updated, div.error').addClass('below-h2');
@@ -523,71 +541,168 @@ $(document).ready( function() {
                toggleUploadButton();
                input.on('change', toggleUploadButton);
        })();
-});
 
-// Fire a custom jQuery event at the end of window resize
-( function() {
-       var timeout;
+       function pinMenu( event ) {
+               var windowPos = $window.scrollTop(),
+                       resizing = ! event || event.type !== 'scroll';
 
-       function triggerEvent() {
-               $(document).trigger( 'wp-window-resized' );
-       }
+               if ( isIOS || isIE8 || $adminmenu.data( 'wp-responsive' ) ) {
+                       return;
+               }
 
-       function fireOnce() {
-               window.clearTimeout( timeout );
-               timeout = window.setTimeout( triggerEvent, 200 );
-       }
+               if ( height.menu + height.adminbar < height.window ||
+                       height.menu + height.adminbar + 20 > height.wpwrap ) {
+                       unpinMenu();
+                       return;
+               }
 
-       $(window).on( 'resize.wp-fire-once', fireOnce );
-}());
+               menuIsPinned = true;
 
-$(document).ready( function() {
-       var $document = $( document ),
-               $window = $( window ),
-               $body = $( document.body ),
-               $adminMenuWrap = $( '#adminmenuwrap' ),
-               $collapseMenu = $( '#collapse-menu' ),
-               $wpwrap = $( '#wpwrap' ),
-               $adminmenu = $( '#adminmenu' ),
-               $overlay = $( '#wp-responsive-overlay' ),
-               $toolbar = $( '#wp-toolbar' ),
-               $toolbarPopups = $toolbar.find( 'a[aria-haspopup="true"]' ),
-               $sortables = $('.meta-box-sortables'),
-               stickyMenuActive = false,
-               wpResponsiveActive = false;
-
-       window.stickyMenu = {
-               enable: function() {
-                       if ( ! stickyMenuActive ) {
-                               $document.on( 'wp-window-resized.sticky-menu', $.proxy( this.update, this ) );
-                               $collapseMenu.on( 'click.sticky-menu', $.proxy( this.update, this ) );
-                               this.update();
-                               stickyMenuActive = true;
-                       }
-               },
+               if ( height.menu + height.adminbar > height.window ) {
+                       // Check for overscrolling
+                       if ( windowPos < 0 ) {
+                               if ( ! pinnedMenuTop ) {
+                                       pinnedMenuTop = true;
+                                       pinnedMenuBottom = false;
 
-               disable: function() {
-                       if ( stickyMenuActive ) {
-                               $window.off( 'resize.sticky-menu' );
-                               $collapseMenu.off( 'click.sticky-menu' );
-                               $body.removeClass( 'sticky-menu' );
-                               stickyMenuActive = false;
+                                       $adminMenuWrap.css({
+                                               position: 'fixed',
+                                               top: '',
+                                               bottom: ''
+                                       });
+                               }
+
+                               return;
+                       } else if ( windowPos + height.window > $document.height() - 1 ) {
+                               if ( ! pinnedMenuBottom ) {
+                                       pinnedMenuBottom = true;
+                                       pinnedMenuTop = false;
+
+                                       $adminMenuWrap.css({
+                                               position: 'fixed',
+                                               top: '',
+                                               bottom: 0
+                                       });
+                               }
+
+                               return;
                        }
-               },
 
-               update: function() {
-                       // Make the admin menu sticky if the viewport is taller than it
-                       if ( $window.height() > $adminMenuWrap.height() + 32 ) {
-                               if ( ! $body.hasClass( 'sticky-menu' ) ) {
-                                       $body.addClass( 'sticky-menu' );
+                       if ( windowPos > lastScrollPosition ) {
+                               // Scrolling down
+                               if ( pinnedMenuTop ) {
+                                       // let it scroll
+                                       pinnedMenuTop = false;
+                                       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({
+                                               position: 'absolute',
+                                               top: menuTop,
+                                               bottom: ''
+                                       });
+                               } else if ( ! pinnedMenuBottom && $adminMenuWrap.offset().top + height.menu < windowPos + height.window ) {
+                                       // pin the bottom
+                                       pinnedMenuBottom = true;
+
+                                       $adminMenuWrap.css({
+                                               position: 'fixed',
+                                               top: '',
+                                               bottom: 0
+                                       });
                                }
-                       } else {
-                               if ( $body.hasClass( 'sticky-menu' ) ) {
-                                       $body.removeClass( 'sticky-menu' );
+                       } else if ( windowPos < lastScrollPosition ) {
+                               // Scrolling up
+                               if ( pinnedMenuBottom ) {
+                                       // let it scroll
+                                       pinnedMenuBottom = false;
+                                       menuTop = $adminMenuWrap.offset().top - height.adminbar + ( lastScrollPosition - windowPos );
+
+                                       if ( menuTop + height.menu > windowPos + height.window ) {
+                                               menuTop = windowPos;
+                                       }
+
+                                       $adminMenuWrap.css({
+                                               position: 'absolute',
+                                               top: menuTop,
+                                               bottom: ''
+                                       });
+                               } else if ( ! pinnedMenuTop && $adminMenuWrap.offset().top >= windowPos + height.adminbar ) {
+                                       // pin the top
+                                       pinnedMenuTop = true;
+
+                                       $adminMenuWrap.css({
+                                               position: 'fixed',
+                                               top: '',
+                                               bottom: ''
+                                       });
+                               }
+                       } else if ( resizing ) {
+                               // Resizing
+                               pinnedMenuTop = pinnedMenuBottom = false;
+                               menuTop = windowPos + height.window - height.menu - height.adminbar - 1;
+
+                               if ( menuTop > 0 ) {
+                                       $adminMenuWrap.css({
+                                               position: 'absolute',
+                                               top: menuTop,
+                                               bottom: ''
+                                       });
+                               } else {
+                                       unpinMenu();
                                }
                        }
                }
-       };
+
+               lastScrollPosition = windowPos;
+       }
+
+       function resetHeights() {
+               height = {
+                       window: $window.height(),
+                       wpwrap: $wpwrap.height(),
+                       adminbar: $adminbar.height(),
+                       menu: $adminMenuWrap.height()
+               };
+       }
+
+       function unpinMenu() {
+               if ( isIOS || ! menuIsPinned ) {
+                       return;
+               }
+
+               pinnedMenuTop = pinnedMenuBottom = menuIsPinned = false;
+               $adminMenuWrap.css({
+                       position: '',
+                       top: '',
+                       bottom: ''
+               });
+       }
+
+       function setPinMenu() {
+               resetHeights();
+
+               if ( $adminmenu.data('wp-responsive') ) {
+                       $body.removeClass( 'sticky-menu' );
+                       unpinMenu();
+               } else if ( height.menu + height.adminbar > height.window ) {
+                       pinMenu();
+                       $body.removeClass( 'sticky-menu' );
+               } else {
+                       $body.addClass( 'sticky-menu' );
+                       unpinMenu();
+               }
+       }
+
+       if ( ! isIOS ) {
+               $window.on( 'scroll.pin-menu', pinMenu );
+               $document.on( 'tinymce-editor-init.pin-menu', function( event, editor ) {
+                       editor.on( 'wp-autoresize', resetHeights );
+               });
+       }
 
        window.wpResponsive = {
                init: function() {
@@ -638,7 +753,7 @@ $(document).ready( function() {
                },
 
                activate: function() {
-                       window.stickyMenu.disable();
+                       setPinMenu();
 
                        if ( ! $body.hasClass( 'auto-fold' ) ) {
                                $body.addClass( 'auto-fold' );
@@ -649,7 +764,7 @@ $(document).ready( function() {
                },
 
                deactivate: function() {
-                       window.stickyMenu.enable();
+                       setPinMenu();
                        $adminmenu.removeData('wp-responsive');
                        this.enableSortables();
                },
@@ -722,10 +837,28 @@ $(document).ready( function() {
                }
        };
 
-       window.stickyMenu.enable();
        window.wpResponsive.init();
+       setPinMenu();
+
+       $document.on( 'wp-window-resized.pin-menu postboxes-columnchange.pin-menu postbox-toggled.pin-menu wp-collapse-menu.pin-menu wp-scroll-start.pin-menu', setPinMenu );
 });
 
+// Fire a custom jQuery event at the end of window resize
+( function() {
+       var timeout;
+
+       function triggerEvent() {
+               $(document).trigger( 'wp-window-resized' );
+       }
+
+       function fireOnce() {
+               window.clearTimeout( timeout );
+               timeout = window.setTimeout( triggerEvent, 200 );
+       }
+
+       $(window).on( 'resize.wp-fire-once', fireOnce );
+}());
+
 // Make Windows 8 devices play along nicely.
 (function(){
        if ( '-ms-user-select' in document.documentElement.style && navigator.userAgent.match(/IEMobile\/10\.0/) ) {