jqLite.on(document, 'click', function(ev) {
var targetEl = ev.target;
if (targetEl.tagName === 'LABEL' &&
jqLite.hasClass(targetEl.parentNode, floatingLabelClass)) {
var inputEl = targetEl.previousElementSibling;
if (inputEl) inputEl.focus();
}
});
/**
* Activate the tab controlled by the toggle element.
* @param {Element} toggleEl - The toggle element.
*/
function activateTab(currToggleEl) {
var currTabEl = currToggleEl.parentNode,
currPaneId = currToggleEl.getAttribute(controlsAttrKey),
currPaneEl = document.getElementById(currPaneId),
prevTabEl,
prevPaneEl,
prevPaneId,
prevToggleEl,
currData,
prevData,
ev1,
ev2,
cssSelector;
// exit if already active
if (jqLite.hasClass(currTabEl, activeClass)) return;
// raise error if pane doesn't exist
if (!currPaneEl) util.raiseError('Tab pane "' + currPaneId + '" not found');
// get previous pane
prevPaneEl = getActiveSibling(currPaneEl);
prevPaneId = prevPaneEl.id;
// get previous toggle and tab elements
cssSelector = '[' + controlsAttrKey + '="' + prevPaneId + '"]';
prevToggleEl = document.querySelectorAll(cssSelector)[0];
prevTabEl = prevToggleEl.parentNode;
// define event data
currData = {paneId: currPaneId, relatedPaneId: prevPaneId};
prevData = {paneId: prevPaneId, relatedPaneId: currPaneId};
// dispatch 'hidestart', 'showstart' events
ev1 = util.dispatchEvent(prevToggleEl, hidestartKey, true, true, prevData);
ev2 = util.dispatchEvent(currToggleEl, showstartKey, true, true, currData);
// let events bubble
setTimeout(function() {
// exit if either event was canceled
if (ev1.defaultPrevented || ev2.defaultPrevented) return;
// de-activate previous
if (prevTabEl) jqLite.removeClass(prevTabEl, activeClass);
if (prevPaneEl) jqLite.removeClass(prevPaneEl, activeClass);
// activate current
jqLite.addClass(currTabEl, activeClass);
jqLite.addClass(currPaneEl, activeClass);
// dispatch 'hideend', 'showend' events
util.dispatchEvent(prevToggleEl, hideendKey, true, false, prevData);
util.dispatchEvent(currToggleEl, showendKey, true, false, currData);
}, 0);
}
/**
* Get previous active sibling.
* @param {Element} el - The anchor element.
*/
function getActiveSibling(el) {
var elList = el.parentNode.children,
q = elList.length,
activeEl = null,
tmpEl;
while (q-- && !activeEl) {
tmpEl = elList[q];
if (tmpEl !== el && jqLite.hasClass(tmpEl, activeClass)) activeEl = tmpEl
}
return activeEl;
}
/**
* Toggle the dropdown.
* @param {Element} toggleEl - The dropdown toggle element.
*/
function toggleDropdown(toggleEl) {
var wrapperEl = toggleEl.parentNode,
menuEl = toggleEl.nextElementSibling,
doc = wrapperEl.ownerDocument;
// exit if no menu element
if (!menuEl || !jqLite.hasClass(menuEl, menuClass)) {
return util.raiseError('Dropdown menu element not found');
}
// method to close dropdown
function closeDropdownFn() {
jqLite.removeClass(menuEl, openClass);
// remove event handlers
jqLite.off(doc, 'click', closeDropdownFn);
}
// method to open dropdown
function openDropdownFn() {
// position menu element below toggle button
var wrapperRect = wrapperEl.getBoundingClientRect(),
toggleRect = toggleEl.getBoundingClientRect();
var top = toggleRect.top - wrapperRect.top + toggleRect.height;
jqLite.css(menuEl, 'top', top + 'px');
// add open class to wrapper
jqLite.addClass(menuEl, openClass);
// close dropdown when user clicks outside of menu
jqLite.on(doc, 'click', closeDropdownFn);
}
// toggle dropdown
if (jqLite.hasClass(menuEl, openClass)) closeDropdownFn();
else openDropdownFn();
}
/**
* Event handler
* @param {Event} ev - The DOM event
*/
function eventHandler(ev) {
// only left clicks
if (ev.button !== 0) return;
var buttonEl = this;
// exit if button is disabled
if (buttonEl.disabled === true) return;
// de-dupe touchstart and mousedown with 100msec flag
if (buttonEl.touchFlag === true) {
return;
} else {
buttonEl.touchFlag = true;
setTimeout(function() {
buttonEl.touchFlag = false;
}, 100);
}
var rippleEl = document.createElement('div');
rippleEl.className = rippleClass;
var offset = jqLite.offset(buttonEl),
xPos = ev.pageX - offset.left,
yPos = ev.pageY - offset.top,
diameter,
radius;
// get height
if (jqLite.hasClass(buttonEl, btnFABClass)) diameter = offset.height / 2;
else diameter = offset.height;
radius = diameter / 2;
jqLite.css(rippleEl, {
height: diameter + 'px',
width: diameter + 'px',
top: yPos - radius + 'px',
left: xPos - radius + 'px'
});
buttonEl.appendChild(rippleEl);
window.setTimeout(function() {
buttonEl.removeChild(rippleEl);
}, 2000);
}
util.onNodeInserted(function(el) {
if (jqLite.hasClass(el, btnClass)) initialize(el);
});
util.onNodeInserted(function(el) {
if (el.tagName === 'SELECT' &&
jqLite.hasClass(el.parentNode, wrapperClass)) {
initialize(el);
}
});