Fixed backward compatibility for custom menus where the hovering wouldn't be the default behavior (fixes #1293)

This commit is contained in:
Djamil Legato
2016-05-19 10:53:53 -07:00
parent ef69ed3ea8
commit aeec19f349
4 changed files with 53 additions and 53 deletions
+25 -24
View File
@@ -48,10 +48,11 @@ var Menu = new prime({
this.active = null;
this.location = [];
var mainContainer = $(this.selectors.mainContainer);
var mainContainer = $(this.selectors.mainContainer),
gHoverExpand = mainContainer.data('g-hover-expand');
if (!mainContainer) { return; }
this.hoverExpand = mainContainer.data('g-hover-expand') === 'true';
this.hoverExpand = gHoverExpand === null || gHoverExpand === 'true';
if (hasTouchEvents || !this.hoverExpand) {
mainContainer.addClass(this.states.touchEvents);
}
@@ -60,10 +61,10 @@ var Menu = new prime({
},
attach: function() {
var selectors = this.selectors,
main = $(selectors.mainContainer + ' ' + selectors.item),
var selectors = this.selectors,
main = $(selectors.mainContainer + ' ' + selectors.item),
mobileContainer = $(selectors.mobileContainer),
body = $('body');
body = $('body');
if (!main) { return; }
if (this.hoverExpand) {
@@ -111,11 +112,11 @@ var Menu = new prime({
touchend: function(event) {
var selectors = this.selectors,
states = this.states;
states = this.states;
var target = $(event.target),
indicator = target.parent(selectors.item).find(selectors.touchIndicator),
menuType = target.parent('.g-standard') ? 'standard' : 'megamenu',
var target = $(event.target),
indicator = target.parent(selectors.item).find(selectors.touchIndicator),
menuType = target.parent('.g-standard') ? 'standard' : 'megamenu',
isGoingBack = target.parent('.g-go-back'),
parent, isSelected;
@@ -146,7 +147,7 @@ var Menu = new prime({
if ((menuType == 'megamenu' || !parent.parent(selectors.mainContainer)) && (parent.find(' > ' + selectors.dropdown + ', > * > ' + selectors.dropdown) || isGoingBack)) {
var sublevel = target.parent('.g-sublevel') || target.parent('.g-toplevel'),
slideout = parent.find('.g-sublevel'),
columns = parent.parent('.g-dropdown-column'),
columns = parent.parent('.g-dropdown-column'),
blocks;
if (sublevel) {
@@ -184,7 +185,7 @@ var Menu = new prime({
if (dropdown) {
var sublevels = dropdown.search('.g-sublevel'),
slideouts = dropdown.search('.g-slide-out, .' + this.states.selected),
actives = dropdown.search('.' + this.states.active);
actives = dropdown.search('.' + this.states.active);
if (sublevels) { sublevels.attribute('style', null); }
if (slideouts) { slideouts.removeClass('g-slide-out').removeClass(this.states.selected); }
@@ -196,9 +197,9 @@ var Menu = new prime({
closeAllDropdowns: function() {
var selectors = this.selectors,
states = this.states,
topLevel = $(selectors.mainContainer + ' > .g-toplevel'),
roots = topLevel.search(' >' + selectors.item);
states = this.states,
topLevel = $(selectors.mainContainer + ' > .g-toplevel'),
roots = topLevel.search(' >' + selectors.item);
if (roots) { roots.removeClass(states.selected); }
if (topLevel) {
@@ -212,7 +213,7 @@ var Menu = new prime({
resetStates: function(menu) {
if (!menu) { return; }
var items = menu.search('.g-toplevel, .g-dropdown-column, .g-dropdown, .g-selected, .g-active, .g-slide-out'),
var items = menu.search('.g-toplevel, .g-dropdown-column, .g-dropdown, .g-selected, .g-active, .g-slide-out'),
actives = menu.search('.g-active');
if (!items) { return; }
@@ -237,7 +238,7 @@ var Menu = new prime({
from: parent[0].getBoundingClientRect(),
to: (!isNavMenu ? sublevel.parent('.g-dropdown')[0] : sublevel[0]).getBoundingClientRect()
},
height = Math.max(heights.from.height, heights.to.height);
height = Math.max(heights.from.height, heights.to.height);
if (!isGoingBack) {
// if from height is < than to height set the parent height else, set the target
@@ -247,8 +248,8 @@ var Menu = new prime({
// fix sublevels heights in side menu (offcanvas etc)
if (!isNavMenu) {
var maxHeight = height,
block = $(sublevel).parent('.g-block:not(.size-100)'),
column = block ? block.parent('.g-dropdown-column') : null;
block = $(sublevel).parent('.g-block:not(.size-100)'),
column = block ? block.parent('.g-dropdown-column') : null;
(sublevel.parents('.g-slide-out, .g-dropdown-column') || parent).forEach(function(slideout) {
maxHeight = Math.max(height, parseInt(slideout.style.height || 0, 10));
});
@@ -257,9 +258,9 @@ var Menu = new prime({
column[0].style.height = maxHeight + 'px';
var blocks = column.search('> .g-grid > .g-block'),
diff = maxHeight;
diff = maxHeight;
blocks.forEach(function(block, i){
blocks.forEach(function(block, i) {
if ((i + 1) != blocks.length) {
diff -= block.getBoundingClientRect().height;
} else {
@@ -276,17 +277,17 @@ var Menu = new prime({
},
_calculateBreakpoint: function(value) {
var digit = parseFloat(value.match(/^\d{1,}/).shift()),
unit = value.match(/[a-z]{1,}$/i).shift(),
var digit = parseFloat(value.match(/^\d{1,}/).shift()),
unit = value.match(/[a-z]{1,}$/i).shift(),
tolerance = unit.match(/r?em/) ? -0.062 : -1;
return (digit + tolerance) + unit;
},
_checkQuery: function(mq) {
var selectors = this.options.selectors,
var selectors = this.options.selectors,
mobileContainer = $(selectors.mobileContainer),
mainContainer = $(selectors.mainContainer + selectors.mobileTarget) || $(selectors.mainContainer),
mainContainer = $(selectors.mainContainer + selectors.mobileTarget) || $(selectors.mainContainer),
find, dropdowns;
if (mq.matches) {