modern-dropdown/dropdown.min.js

Utility javascript that handles all modern usecases for dropdown menus

window.Dropdown=function(){"use strict";var e=0,t={addClass:function(e,t){e.classList?e.classList.add(t):e.className+=" "+t},removeClass:function(e,t){e.classList?e.classList.remove(t):e.className=e.className.replace(new RegExp("(^|\\b)"+t.split(" ").join("|")+"(\\b|$)","gi")," ")},preventDefault:function(e){e.preventDefault?e.preventDefault():e.returnValue=!1},hasTouch:function(){if("ontouchstart"in window)return!0;var e,t=document.body,n=!1,o=document.createElement("div"),i=document.createElement("style"),s=["@media (",["-webkit-","-moz-","-o-","-ms-"].join("touch-enabled),("),"heartz",")","{#hasTouchNode{top:9px;position:absolute}}"].join("");return t||(t=document.createElement("body"),n=!0),o.id="hasTouchNode",i.styleSheet?i.styleSheet.cssText=s:i.appendChild(document.createTextNode(s)),(n?t:o).appendChild(i),t.appendChild(o),n&&document.documentElement.appendChild(t),e=9===o.offsetTop,o.parentNode.removeChild(o),i.parentNode.removeChild(i),n&&t.parentNode.removeChild(t),e}()},n=function(n,o){var i=this,s={},a=!1,r=!1;if(n){this.container="string"==typeof n?document.querySelector(n):n,this.opts={delay:250,openClass:"dropdown--open",menu:"> ul",spa:!1};for(var u in o)o.hasOwnProperty(u)&&(this.opts[u]=o[u]);this.container.id||(a=!0,e++,this.container.id="dropdown-temp-id-"+e),this.mainLink=document.querySelector("#"+this.container.id+" > a"),this.menu=document.querySelector("#"+this.container.id+" "+this.opts.menu),a&&this.container.removeAttribute("id"),this.menu&&(this.menuLinks=this.menu.querySelectorAll("a"),this.timeout={enter:null,leave:null},this.active=!1,s.touch=function(e){i.active?i.close():(t.preventDefault(e),e.stopPropagation(),i.open())},s.mouseenter=function(){"number"==typeof i.timeout.leave?window.clearTimeout(i.timeout.leave):i.timeout.enter=window.setTimeout(function(){i.open()},i.opts.delay)},s.mouseleave=function(){"number"==typeof i.timeout.enter?window.clearTimeout(i.timeout.enter):i.timeout.leave=window.setTimeout(function(){i.close()},i.opts.delay)},s.pointerenter=function(e){switch(e.pointerType){case"touch":r=!0,i.mainLink.addEventListener("click",s.touch),document.addEventListener("click",s.maybeClose);break;default:s.mouseenter(e)}},s.pointerleave=function(e){switch(e.pointerType){case"touch":r?r=!1:s.touch(e);break;default:s.mouseleave(e)}},s.handleTouchClose=function(e){e.preventDefault(),"A"===e.target.tagName&&i.close()},s.maybeClose=function(e){var t=e.target||e.srcElement;if(i.active){for(;t&&"A"!==t.tagName;){if(t===this.node)return;t=t.parentNode}i.close(),document.removeEventListener("click",s.maybeClose)}},s.focus=function(){i.active||i.open()},s.blur=function(){return i.menuLinks.length<1?void i.close():void window.setTimeout(function(){for(var e=0;e<i.menuLinks.length;e++)if(document.activeElement===i.menuLinks[e])return;i.close()},0)},this.container.addEventListener&&(this.container.addEventListener("focus",s.focus,!0),this.container.addEventListener("blur",s.blur,!0)),window.PointerEvent?(this.container.addEventListener("pointerenter",s.pointerenter),this.container.addEventListener("pointerleave",s.pointerleave),this.opts.spa&&this.menu.addEventListener("click",s.handleTouchClose)):(t.hasTouch&&(this.mainLink.addEventListener("click",function(e){s.touch(e)}),this.opts.spa&&this.menu.addEventListener("click",s.handleTouchClose)),this.container.addEventListener?(this.container.addEventListener("mouseenter",s.mouseenter),this.container.addEventListener("mouseleave",s.mouseleave)):this.container.attachEvent&&(this.container.attachEvent("onmouseenter",s.mouseenter),this.container.attachEvent("onmouseleave",s.mouseleave))))}};n.prototype={open:function(){("function"!=typeof this.opts.beforeOpen||this.opts.beforeOpen.call(this)!==!1)&&(this.active=!0,"number"==typeof this.timeout.enter&&(window.clearTimeout(this.timeout.enter),this.timeout.enter=null),t.addClass(this.container,this.opts.openClass),"function"==typeof this.opts.afterOpen&&this.opts.afterOpen.call(this))},close:function(){("function"!=typeof this.opts.beforeClose||this.opts.beforeClose.call(this)!==!1)&&(this.active=!1,"number"==typeof this.timeout.leave&&(window.clearTimeout(this.timeout.leave),this.timeout.leave=null),t.removeClass(this.container,this.opts.openClass),"function"==typeof this.opts.afterClose&&this.opts.afterClose.call(this))}};var o=function(e,t){return new n(e,t)};return"function"==typeof window.jQuery&&(window.jQuery.fn.dropdown=function(e){window.jQuery(this).each(function(){window.jQuery(this).data("dropdown",new o(this,e))})}),o}();