Merge "Revert "MainMenu no longer manages classes on the body tag""

This commit is contained in:
jenkins-bot 2019-08-08 00:45:05 +00:00 committed by Gerrit Code Review
commit 4cbba412d6
2 changed files with 18 additions and 49 deletions

View File

@ -1,29 +1,6 @@
var MainMenu = require( './menu/MainMenu.js' ), var MainMenu = require( './menu/MainMenu.js' ),
util = mw.mobileFrontend.require( 'mobile.startup' ).util,
mainMenu = createMainMenu(); mainMenu = createMainMenu();
/**
* Update body tag with appropriate classes for a closed drawer.
*/
function onClose() {
$( document.body ).removeClass(
[ 'navigation-enabled', 'secondary-navigation-enabled',
'primary-navigation-enabled' ].join( ' ' )
);
}
/**
* Update body tag with appropriate classes for an open drawer.
* @param {string} drawerType A name that identifies the navigation drawer that
* should be opened. Either primary or secondary.
*/
function onOpen( drawerType ) {
// FIXME: We should be moving away from applying classes to the body
$( document.body ).addClass(
[ 'navigation-enabled', drawerType + '-navigation-enabled' ].join( ' ' )
);
}
/** /**
* Creates an instance of the `MainMenu`, using the `wgMinervaMenuData` for configuration. * Creates an instance of the `MainMenu`, using the `wgMinervaMenuData` for configuration.
* *
@ -39,14 +16,7 @@ function createMainMenu() {
options.activator = '.header .main-menu-button'; options.activator = '.header .main-menu-button';
return new MainMenu( return new MainMenu( options );
util.extend( options, {
onClose: onClose,
onOpen: function () {
onOpen( 'primary' );
}
} )
);
} }
$( function () { $( function () {

View File

@ -3,7 +3,6 @@
mobile = M.require( 'mobile.startup' ), mobile = M.require( 'mobile.startup' ),
mfExtend = mobile.mfExtend, mfExtend = mobile.mfExtend,
browser = mobile.Browser.getSingleton(), browser = mobile.Browser.getSingleton(),
util = mobile.util,
View = mobile.View; View = mobile.View;
/** /**
@ -12,17 +11,10 @@
* @class MainMenu * @class MainMenu
* @extends View * @extends View
* @param {Object} options Configuration options * @param {Object} options Configuration options
* @param {Function} options.onOpen executed when the menu opens
* @param {Function} options.onClose executed when the menu closes
*/ */
function MainMenu( options ) { function MainMenu( options ) {
this.activator = options.activator; this.activator = options.activator;
View.call( this, View.call( this, options );
util.extend( {
onOpen: function () {},
onClose: function () {}
}, options )
);
} }
mfExtend( MainMenu, View, { mfExtend( MainMenu, View, {
@ -83,34 +75,41 @@
* @memberof MainMenu * @memberof MainMenu
* @instance * @instance
* @return {boolean} * @return {boolean}
* @private
*/ */
isOpen: function () { isOpen: function () {
return this.$el.hasClass( 'menu--open' ); // FIXME: We should be moving away from applying classes to the body
return $( document.body ).hasClass( 'navigation-enabled' );
}, },
/** /**
* Close all open navigation drawers * Close all open navigation drawers
* @memberof MainMenu * @memberof MainMenu
* @instance * @instance
* @private
*/ */
closeNavigationDrawers: function () { closeNavigationDrawers: function () {
this.$el.removeClass( 'menu--open' ); // FIXME: We should be moving away from applying classes to the body
this.options.onClose(); $( document.body ).removeClass( 'navigation-enabled' )
.removeClass( 'secondary-navigation-enabled' )
.removeClass( 'primary-navigation-enabled' );
}, },
/** /**
* Toggle open navigation drawer * Toggle open navigation drawer
* @param {string} [drawerType] A name that identifies the navigation drawer that
* should be toggled open. Defaults to 'primary'.
* @fires MainMenu#open
* @memberof MainMenu * @memberof MainMenu
* @instance * @instance
* @private
*/ */
openNavigationDrawer: function () { openNavigationDrawer: function ( drawerType ) {
// close any existing ones first. // close any existing ones first.
this.closeNavigationDrawers(); this.closeNavigationDrawers();
this.$el.addClass( 'menu--open' ); drawerType = drawerType || 'primary';
this.options.onOpen(); // FIXME: We should be moving away from applying classes to the body
$( document.body ).toggleClass( 'navigation-enabled' )
.toggleClass( drawerType + '-navigation-enabled' );
this.emit( 'open' );
} }
} ); } );