MDL-48805 theme: Collapse now collapses all data-target

This commit is contained in:
Brian Barnes
2015-01-26 11:24:57 +13:00
parent cccb0c0722
commit 33f9b3b1e1
4 changed files with 43 additions and 34 deletions
@@ -707,18 +707,21 @@ NS.setup_toggle_show = function() {
NS.toggle_show = function(e) {
// Toggle the active class on both the clicked .btn-navbar and the
// associated target, defined by a CSS selector string set as the
// data-target attribute on the .btn-navbar element in question.
//
// This will allow for us to have multiple .btn-navbar elements
// each with their own collapse/expand targets - these targets
// should be of class .nav-collapse.
var myTarget = this.get('parentNode').one(this.getAttribute('data-target'));
if (myTarget) {
this.siblings(".btn-navbar").removeClass(CSS.ACTIVE);
myTarget.siblings(".nav-collapse").removeClass(CSS.ACTIVE);
myTarget.toggleClass(CSS.ACTIVE);
// data-target attribute on the .btn-navbar element in question.
var navButtons = Y.all(SELECTORS.NAVBAR_BUTTON);
var currentOpen = this.hasClass(CSS.ACTIVE);
// Close all nav sections.
Y.each(navButtons, function(navButton) {
Y.all(navButton.getAttribute('data-target')).removeClass(CSS.ACTIVE);
});
navButtons.removeClass(CSS.ACTIVE);
if (!currentOpen) {
// Open the current Nav section
this.addClass(CSS.ACTIVE);
Y.all(this.getAttribute('data-target')).addClass(CSS.ACTIVE);
}
e.currentTarget.toggleClass(CSS.ACTIVE);
};
File diff suppressed because one or more lines are too long
@@ -697,18 +697,21 @@ NS.setup_toggle_show = function() {
NS.toggle_show = function(e) {
// Toggle the active class on both the clicked .btn-navbar and the
// associated target, defined by a CSS selector string set as the
// data-target attribute on the .btn-navbar element in question.
//
// This will allow for us to have multiple .btn-navbar elements
// each with their own collapse/expand targets - these targets
// should be of class .nav-collapse.
var myTarget = this.get('parentNode').one(this.getAttribute('data-target'));
if (myTarget) {
this.siblings(".btn-navbar").removeClass(CSS.ACTIVE);
myTarget.siblings(".nav-collapse").removeClass(CSS.ACTIVE);
myTarget.toggleClass(CSS.ACTIVE);
// data-target attribute on the .btn-navbar element in question.
var navButtons = Y.all(SELECTORS.NAVBAR_BUTTON);
var currentOpen = this.hasClass(CSS.ACTIVE);
// Close all nav sections.
Y.each(navButtons, function(navButton) {
Y.all(navButton.getAttribute('data-target')).removeClass(CSS.ACTIVE);
});
navButtons.removeClass(CSS.ACTIVE);
if (!currentOpen) {
// Open the current Nav section
this.addClass(CSS.ACTIVE);
Y.all(this.getAttribute('data-target')).addClass(CSS.ACTIVE);
}
e.currentTarget.toggleClass(CSS.ACTIVE);
};
+14 -11
View File
@@ -97,16 +97,19 @@ NS.setup_toggle_show = function() {
NS.toggle_show = function(e) {
// Toggle the active class on both the clicked .btn-navbar and the
// associated target, defined by a CSS selector string set as the
// data-target attribute on the .btn-navbar element in question.
//
// This will allow for us to have multiple .btn-navbar elements
// each with their own collapse/expand targets - these targets
// should be of class .nav-collapse.
var myTarget = this.get('parentNode').one(this.getAttribute('data-target'));
if (myTarget) {
this.siblings(".btn-navbar").removeClass(CSS.ACTIVE);
myTarget.siblings(".nav-collapse").removeClass(CSS.ACTIVE);
myTarget.toggleClass(CSS.ACTIVE);
// data-target attribute on the .btn-navbar element in question.
var navButtons = Y.all(SELECTORS.NAVBAR_BUTTON);
var currentOpen = this.hasClass(CSS.ACTIVE);
// Close all nav sections.
Y.each(navButtons, function(navButton) {
Y.all(navButton.getAttribute('data-target')).removeClass(CSS.ACTIVE);
});
navButtons.removeClass(CSS.ACTIVE);
if (!currentOpen) {
// Open the current Nav section
this.addClass(CSS.ACTIVE);
Y.all(this.getAttribute('data-target')).addClass(CSS.ACTIVE);
}
e.currentTarget.toggleClass(CSS.ACTIVE);
};