DOM.addEventListener("click", function(e) {
var el = e.target;
var isHagridComponent = u(el).attr('hagrid-role');
u('.open').each(function(el){
u(el).removeClass('open')
});
if(isHagridComponent){
if(e.target.tagName.toLowerCase() === 'a') e.preventDefault();
_getComponent(el);
}
});
/**
* Hagrid parent root component
* @param {Object} el html element
* @return {Object} Parent element
*/
function _parentComponent(el){
var parent = el;
var i = 0;
var hasAttr = u(el).attr('hagrid-component');
while (!hasAttr && i < 20){
var o = parent || {};
parent = o.parentNode;
hasAttr = u(parent).attr('hagrid-component');
i++;
}
return parent;
}
function getConfCompoment(el){
var hasAttr = u(el).attr('hagrid-role');
if(hasAttr){
var hagridComponent = components[hasAttr];
if(hagridComponent){
return hagridComponent.component.set(el);
}
}
return {};
}
/**
* Get hagrid component
* @param {String} el Element string
* @return {fn} component function
*/
function _getComponent(el){
var getConf = getConfCompoment(el);
var hagridTarget = u(el).attr('hagrid-target') || getConf.hagridTarget || u(el).attr('href'),
parentTarget = (!!hagridTarget && hagridTarget !== '#') ? null : _parentComponent(el),
hagridRole = getConf.hagridRole || u(el).attr('hagrid-role') || 'open',
elTarget = (!!hagridTarget && hagridTarget !== '#') ? u(hagridTarget).first() :parentTarget,
firstElement = elTarget,
parentComponent = _parentComponent(firstElement),
componentType = u(firstElement).attr('hagrid-component') || u(parentComponent).attr('hagrid-component'),
component = components[componentType][hagridRole];
var _self = el;
var _target = firstElement;
component(_target, _self, parentComponent);
}
u('.open').each(function(el){
u(el).removeClass('open')
});
close: function($target, $seft){
u($parentComponent).removeClass('open');
},
toggle: function($target, $seft, $parentComponent){
u($parentComponent).toggleClass('navbar-open');
},
open: function($target, $seft, $parentComponent){
u($parentComponent).addClass('open');
},
close: function(el){
u(el).removeClass('alert-show');
},
close: function($target, $seft){
u($seft).removeClass('tab-show');
u($target).removeClass('tab-show');
},
open: function($target, $seft, $parentComponent){
var $childrenTabShow = u($parentComponent).find('.tab-show');
$childrenTabShow.removeClass('tab-show');
u($seft).addClass('tab-show');
u($target).addClass('tab-show');
},
close: function(el){
u(el).removeClass('tooltip-show');
},
open: function(el){
u(el).addClass('tooltip-show');
},
close: function(el){
u(el).removeClass('modal-show');
},
open: function(el){
u(el).addClass('modal-show');
},
set: function(el){
return {
hagridTarget: u(el).siblings('.navbar-menu').first(),
hagridRole: 'toggle',
}
},
open: function(el){
u(el).addClass('alert-show');
},