Merge "Revert "MainMenu no longer manages classes on the body tag""
This commit is contained in:
commit
4cbba412d6
|
@ -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 () {
|
||||||
|
|
|
@ -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' );
|
||||||
}
|
}
|
||||||
} );
|
} );
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue