diff --git src/wp-admin/css/color-schemes/_admin.scss src/wp-admin/css/color-schemes/_admin.scss index f7a4bc2..0a467a4 100644 --- src/wp-admin/css/color-schemes/_admin.scss +++ src/wp-admin/css/color-schemes/_admin.scss @@ -366,11 +366,11 @@ ul#adminmenu > li.current > a.current:after { /* Responsive Component */ -div#moby6-toggle a:before { +div#responsive-toggle a:before { color: $menu-icon; } -.moby6-open div#moby6-toggle a { +.responsive-open div#responsive-toggle a { // ToDo: make inset border border-color: transparent; background: $menu-highlight-background; diff --git src/wp-admin/css/wp-admin.css src/wp-admin/css/wp-admin.css index fadb683..b67a721 100644 --- src/wp-admin/css/wp-admin.css +++ src/wp-admin/css/wp-admin.css @@ -11211,7 +11211,7 @@ li#wp-admin-bar-toggle-button { transition: left .05s ease-in-out, opacity .3s ease-in; } - .auto-fold .moby6-open #adminmenu { + .auto-fold .responsive-open #adminmenu { -moz-opacity: 1; -webkit-opacity: 1; opacity: 1; @@ -11283,7 +11283,7 @@ li#wp-admin-bar-toggle-button { } /* Sidebar Toggle */ - #moby6-toggle { + #responsive-toggle { position: fixed; top: 5px; left: 4px; @@ -11298,16 +11298,16 @@ li#wp-admin-bar-toggle-button { margin-top: -2px; } - .moby6-open #wpadminbar #wp-admin-bar-toggle-button a { + .responsive-open #wpadminbar #wp-admin-bar-toggle-button a { background: #000; } - .moby6-open #wpbody { + .responsive-open #wpbody { right: -190px; } - .auto-fold .moby6-open #adminmenuback, - .auto-fold .moby6-open #adminmenuwrap { + .auto-fold .responsive-open #adminmenuback, + .auto-fold .responsive-open #adminmenuwrap { left: 0; } @@ -12372,7 +12372,7 @@ li#wp-admin-bar-toggle-button { /* Smartphone */ @media screen and (max-width: 480px) { - #moby6-overlay { + #responsive-overlay { position: fixed; top: 0; left: 0; diff --git src/wp-admin/js/common.js src/wp-admin/js/common.js index 3406ee0..fa5b995 100644 --- src/wp-admin/js/common.js +++ src/wp-admin/js/common.js @@ -1,5 +1,5 @@ -/* global setUserSetting, ajaxurl, commonL10n, alert, confirm, toggleWithKeyboard, pagenow */ -var showNotice, adminMenu, columns, validateForm, screenMeta, stickyMenu; +/* global setUserSetting, ajaxurl, commonL10n, alert, confirm, toggleWithKeyboard, pagenow, _ */ +var showNotice, adminMenu, columns, validateForm, screenMeta, stickyMenu, responsive; (function($){ // Removed in 3.3. // (perhaps) needed for back-compat @@ -461,7 +461,7 @@ stickyMenu = { enable: function () { if ( ! this.active ) { - this.$window.on( 'resize.stickyMenu scroll.stickyMenu', this.debounce( + this.$window.on( 'resize.stickyMenu scroll.stickyMenu', _.debounce( $.proxy( this.update, this ), 200 ) ); this.$collapseMenu.on( 'click.stickyMenu', $.proxy( this.update, this ) ); @@ -492,139 +492,105 @@ stickyMenu = { this.$body.removeClass( 'sticky-menu' ); } } - }, - - // Borrowed from Underscore.js - debounce: function( func, wait, immediate ) { - var timeout, args, context, timestamp, result; - return function() { - var later, callNow; - context = this; - args = arguments; - timestamp = new Date().getTime(); - later = function() { - var last = new Date().getTime() - timestamp; - if ( last < wait ) { - timeout = setTimeout( later, wait - last ); - } else { - timeout = null; - if ( ! immediate ) { - result = func.apply( context, args ); - context = args = null; - } - } - }; - callNow = immediate && !timeout; - if ( ! timeout ) { - timeout = setTimeout( later, wait ); - } - if ( callNow ) { - result = func.apply( context, args ); - context = args = null; - } - - return result; - }; } }; stickyMenu.init(); -var moby6 = { +responsive = { init: function() { // cached selectors + this.$window = $( window ); this.$html = $( document.documentElement ); this.$body = $( document.body ); this.$wpwrap = $( '#wpwrap' ); this.$wpbody = $( '#wpbody' ); this.$adminmenu = $( '#adminmenu' ); - this.$overlay = $( '#moby6-overlay' ); + this.$overlay = $( '#responsive-overlay' ); this.$toolbar = $( '#wp-toolbar' ); this.$toolbarPopups = this.$toolbar.find( 'a[aria-haspopup="true"]' ); // Modify functionality based on custom activate/deactivate event this.$html - .on( 'activate.moby6', function() { moby6.activate(); } ) - .on( 'deactivate.moby6', function() { moby6.deactivate(); } ); + .on( 'activate.responsive', function() { + responsive.activate(); + } ) + .on( 'deactivate.responsive', function() { + responsive.deactivate(); + } ); // Toggle sidebar when toggle is clicked - $( '#wp-admin-bar-toggle-button' ).on( 'click', function(evt) { + $( '#wp-admin-bar-toggle-button' ).on( 'click', function( evt ) { evt.preventDefault(); - moby6.$wpwrap.toggleClass( 'moby6-open' ); + responsive.$wpwrap.toggleClass( 'responsive-open' ); } ); // Trigger custom events based on active media query. - this.matchMedia(); - $( window ).on( 'resize', $.proxy( this.matchMedia, this ) ); + this.toggleElements(); + this.$window.on( 'resize', _.debounce( + $.proxy( this.toggleElements, this ), 150 + ) ); }, activate: function() { + stickyMenu.disable(); - window.stickymenu && window.stickymenu.disable(); - - if ( ! moby6.$body.hasClass( 'auto-fold' ) ) - moby6.$body.addClass( 'auto-fold' ); + if ( ! this.$body.hasClass( 'auto-fold' ) ) { + this.$body.addClass( 'auto-fold' ); + } this.modifySidebarEvents(); this.disableDraggables(); this.movePostSearch(); - }, deactivate: function() { - - window.stickymenu && window.stickymenu.enable(); - + stickyMenu.enable(); this.enableDraggables(); - this.removeHamburgerButton(); this.restorePostSearch(); - }, - matchMedia: function() { - clearTimeout( this.resizeTimeout ); - this.resizeTimeout = setTimeout( function() { - - if ( ! window.matchMedia ) + toggleElements: function() { + var width = this.$window.width(); + if ( width <= 782 ) { + if ( responsive.$html.hasClass( 'touch' ) ) { return; - - if ( window.matchMedia( '(max-width: 782px)' ).matches ) { - if ( moby6.$html.hasClass( 'touch' ) ) - return; - moby6.$html.addClass( 'touch' ).trigger( 'activate.moby6' ); - } else { - if ( ! moby6.$html.hasClass( 'touch' ) ) - return; - moby6.$html.removeClass( 'touch' ).trigger( 'deactivate.moby6' ); } - if ( window.matchMedia( '(max-width: 480px)' ).matches ) { - moby6.enableOverlay(); - } else { - moby6.disableOverlay(); + responsive.$html.addClass( 'touch' ).trigger( 'activate.responsive' ); + } else { + if ( ! responsive.$html.hasClass( 'touch' ) ) { + return; } - }, 150 ); + responsive.$html.removeClass( 'touch' ).trigger( 'deactivate.responsive' ); + } + + if ( width <= 480 ) { + responsive.enableOverlay(); + } else { + responsive.disableOverlay(); + } }, enableOverlay: function() { if ( this.$overlay.length === 0 ) { - this.$overlay = $( '
' ) + this.$overlay = $( '
' ) .insertAfter( '#wpcontent' ) .hide() - .on( 'click.moby6', function() { - moby6.$toolbar.find( '.menupop.hover' ).removeClass( 'hover' ); + .on( 'click.responsive', function() { + responsive.$toolbar.find( '.menupop.hover' ).removeClass( 'hover' ); $( this ).hide(); }); } - this.$toolbarPopups.on( 'click.moby6', function() { - moby6.$overlay.show(); + this.$toolbarPopups.on( 'click.responsive', function() { + responsive.$overlay.show(); }); }, disableOverlay: function() { - this.$toolbarPopups.off( 'click.moby6' ); + this.$toolbarPopups.off( 'click.responsive' ); this.$overlay.hide(); }, @@ -633,15 +599,16 @@ var moby6 = { this.$adminmenu.find( 'a.wp-has-submenu' ).off( '.wp-mobile-hover' ); var scrollStart = 0; - this.$adminmenu.on( 'touchstart.moby6', 'li.wp-has-submenu > a', function() { - scrollStart = $( window ).scrollTop(); + this.$adminmenu.on( 'touchstart.responsive', 'li.wp-has-submenu > a', function() { + scrollStart = responsive.$window.scrollTop(); }); - this.$adminmenu.on( 'touchend.moby6', 'li.wp-has-submenu > a', function( e ) { + this.$adminmenu.on( 'touchend.responsive', 'li.wp-has-submenu > a', function( e ) { e.preventDefault(); - if ( $( window ).scrollTop() !== scrollStart ) - return false; + if ( responsive.$window.scrollTop() !== scrollStart ) { + return; + } $( this ).find( 'li.wp-has-submenu' ).removeClass( 'selected' ); $( this ).parent( 'li' ).addClass( 'selected' ); @@ -662,11 +629,6 @@ var moby6 = { .addClass( 'hndle' ); }, - removeHamburgerButton: function() { - if ( this.hamburgerButtonView !== undefined ) - this.hamburgerButtonView.destroy(); - }, - movePostSearch: function() { this.searchBox = this.$wpbody.find( 'p.search-box' ); if ( this.searchBox.length ) { @@ -681,14 +643,15 @@ var moby6 = { restorePostSearch: function() { if ( this.searchBox !== undefined ) { this.searchBox.show(); - if ( this.searchBoxClone !== undefined ) + if ( this.searchBoxClone !== undefined ) { this.searchBoxClone.hide(); + } } } }; -// Fire moby6.init when document is ready -$( document ).ready( $.proxy( moby6.init, moby6 ) ); +// Fire responsive.init when document is ready +$( document ).ready( $.proxy( responsive.init, responsive ) ); // make Windows 8 devices playing along nicely (function(){ diff --git src/wp-includes/css/admin-bar.css src/wp-includes/css/admin-bar.css index 0f1f5d8..35837de 100644 --- src/wp-includes/css/admin-bar.css +++ src/wp-includes/css/admin-bar.css @@ -947,7 +947,7 @@ /* Smartphone */ @media screen and (max-width: 480px) { - #moby6-overlay { + #responsive-overlay { position: fixed; top: 0; left: 0; diff --git src/wp-includes/script-loader.php src/wp-includes/script-loader.php index b1f0680..bfafa83 100644 --- src/wp-includes/script-loader.php +++ src/wp-includes/script-loader.php @@ -72,7 +72,7 @@ function wp_default_scripts( &$scripts ) { 'time' => (string) time(), ) ); - $scripts->add( 'common', "/wp-admin/js/common$suffix.js", array('jquery', 'hoverIntent', 'utils'), false, 1 ); + $scripts->add( 'common', "/wp-admin/js/common$suffix.js", array('jquery', 'hoverIntent', 'utils', 'underscore'), false, 1 ); did_action( 'init' ) && $scripts->localize( 'common', 'commonL10n', array( 'warnDelete' => __("You are about to permanently delete the selected items.\n 'Cancel' to stop, 'OK' to delete.") ) );