htmlelement-contextmenu/distrib/htmlelement-contextmenu.min.js

make a contextmenu on a html element

"use strict";var _createClass=function(){function a(a,b){for(var c=0;c<b.length;c++){var d=b[c];d.enumerable=d.enumerable||false;d.configurable=true;if("value"in d)d.writable=true;Object.defineProperty(a,d.key,d)}}return function(b,c,d){if(c)a(b.prototype,c);if(d)a(b,d);return b}}();function _classCallCheck(a,b){if(!(a instanceof b)){throw new TypeError("Cannot call a class as a function")}}window.webBrowserDetection=function(){var f=window.navigator.userAgent.toLowerCase(),e=/(edge)\/([\w.]+)/.exec(f)||/(opr)[\/]([\w.]+)/.exec(f)||/(chrome)[ \/]([\w.]+)/.exec(f)||/(iemobile)[\/]([\w.]+)/.exec(f)||/(version)(applewebkit)[ \/]([\w.]+).*(safari)[ \/]([\w.]+)/.exec(f)||/(webkit)[ \/]([\w.]+).*(version)[ \/]([\w.]+).*(safari)[ \/]([\w.]+)/.exec(f)||/(webkit)[ \/]([\w.]+)/.exec(f)||/(opera)(?:.*version|)[ \/]([\w.]+)/.exec(f)||/(msie) ([\w.]+)/.exec(f)||0<=f.indexOf("trident")&&/(rv)(?::| )([\w.]+)/.exec(f)||f.indexOf("compatible")<0&&/(mozilla)(?:.*? rv:([\w.]+)|)/.exec(f)||[],g=/(ipad)/.exec(f)||/(ipod)/.exec(f)||/(windows phone)/.exec(f)||/(iphone)/.exec(f)||/(kindle)/.exec(f)||/(silk)/.exec(f)||/(android)/.exec(f)||/(win)/.exec(f)||/(mac)/.exec(f)||/(linux)/.exec(f)||/(cros)/.exec(f)||/(playbook)/.exec(f)||/(bb)/.exec(f)||/(blackberry)/.exec(f)||[],h={},i={browser:e[5]||e[3]||e[1]||"",version:e[2]||e[4]||"0",versionNumber:e[4]||e[2]||"0",platform:g[0]||""};if(i.browser&&(h[i.browser]=!0,h.version=i.version,h.versionNumber=parseInt(i.versionNumber,10)),i.platform&&(h[i.platform]=!0),(h.android||h.bb||h.blackberry||h.ipad||h.iphone||h.ipod||h.kindle||h.playbook||h.silk||h["windows phone"])&&(h.mobile=!0),(h.cros||h.mac||h.linux||h.win)&&(h.desktop=!0),(h.chrome||h.opr||h.safari)&&(h.webkit=!0),h.rv||h.iemobile){var a="msie";h[i.browser=a]=!0}if(h.edge){delete h.edge;var j="msedge";h[i.browser=j]=!0}if(h.safari&&h.blackberry){var b="blackberry";h[i.browser=b]=!0}if(h.safari&&h.playbook){var k="playbook";h[i.browser=k]=!0}if(h.bb){var c="blackberry";h[i.browser=c]=!0}if(h.opr){var m="opera";h[i.browser=m]=!0}if(h.safari&&h.android){var l="android";h[i.browser=l]=!0}if(h.safari&&h.kindle){var d="kindle";h[i.browser=d]=!0}if(h.safari&&h.silk){var n="silk";h[i.browser=n]=!0}return h.name=i.browser,h.platform=i.platform,h};window.isDef=function(a){return a!==null&&typeof a!=="undefined"};var classNames={menuItem:"cmItem",hover:"cmHover",disabled:"cmDisabled",visible:"cmVisible",notSelectable:"cmNoSelect",selectable:"cmSelect",icon:"cmIcon",separator:"cmSeparator"};var shortcutPrefixes={win_msie:"Alt+",win_mozilla:"Alt+Shift+",win_chrome:"Alt+",win_safari:"",win_opera:""};var ContextMenu=function(){function a(b){_classCallCheck(this,a);this.__menuInfo=b;this.targets=document.querySelectorAll(b.targetId);this.makeContextMenu();document.body.appendChild(this.contextmenu);this.registerListeners();this.browser=webBrowserDetection();this.browserKey=this.browser.platform+"_"+this.browser.name}_createClass(a,[{key:"menuOn",value:function b(){var a=this;this.contextmenu.style.display="block";this.contextmenu.selectedIndex=0;document.addEventListener("click",function(){a.menuOff()},{once:true});this.contextmenu.focus()}},{key:"menuOff",value:function a(){this.contextmenu.style.display="none"}},{key:"menuInfo",value:function a(){return this.__menuInfo}},{key:"stopEvent",value:function b(a){a.preventDefault();a.stopImmediatePropagation()}},{key:"moveSelected",value:function d(a){var b=this.contextmenu;if(b.style.display==="block"){var c=b.getElementsByClassName(classNames.selectable);if(b.selectedIndex!==-1){c[b.selectedIndex].classList.remove(classNames.hover)}b.selectedIndex+=a;if(b.selectedIndex===-1){b.selectedIndex=c.length-1}else if(b.selectedIndex>=c.length){b.selectedIndex=0}this.__setClasses(c[b.selectedIndex],classNames.hover)}}},{key:"popup",value:function d(a,b){var c=this;c.onBeforeShow();c.menuOn();c.setMenuPosition({x:a,y:b})}},{key:"registerListeners",value:function d(){var a=this;window.addEventListener("resize",function(){a.menuOff()});this.contextmenu.addEventListener("mousedown",function(b){a.stopEvent(b);if(b.button===0||b.button===1||b.button===2){a.menuOff();b.target.click()}});for(var b=0;b<this.targets.length;b++){var c=this.targets[b];c.addEventListener("contextmenu",function(b){a.stopEvent(b);a.onBeforeShow();a.menuOn();var c=a.getMousePosition(b);a.setMenuPosition(c)})}this.contextmenu.addEventListener("keydown",function(b){a.__keydownManagement(b)})}},{key:"__keydownManagement",value:function d(a){switch(a.keyCode){case 27:self.menuOff();break;case 38:self.moveSelected(-1);break;case 40:self.moveSelected(1);break;case 46:a.cancelBubble=true;self.stopEvent(a);break;case 8:a.cancelBubble=true;self.stopEvent(a);break;case 13:var b=self.contextmenu.getElementsByClassName(classNames.selectable);if(self.contextmenu.selectedIndex>=0){var c=b[self.contextmenu.selectedIndex];self.menuOff();c.click()}break;}}},{key:"getMousePosition",value:function d(a){var b=0;var c=0;if(!a){a=window.event}if(a.pageX||a.pageY){b=a.pageX;c=a.pageY}else if(a.clientX||a.clientY){b=a.clientX+document.body.scrollLeft+document.documentElement.scrollLeft;c=a.clientY+document.body.scrollTop+document.documentElement.scrollTop}return{x:b,y:c}}},{key:"setMenuPosition",value:function f(a){var b=this.contextmenu.offsetWidth+3;var c=this.contextmenu.offsetHeight+3;var d=window.innerWidth;var e=window.innerHeight;if(d-a.x<b){this.contextmenu.style.left=d-b-3+"px"}else{this.contextmenu.style.left=a.x+"px"}if(e-a.y<c){this.contextmenu.style.top=e-c+3+"px"}else{this.contextmenu.style.top=a.y+3+"px"}}},{key:"onBeforeShow",value:function h(){if(window.isDef(this.__menuInfo.beforeShowing)){this.__menuInfo.beforeShowing()}var a=0;var b=this.contextmenu.getElementsByClassName(classNames.menuItem);var c=true;var d=false;var e=undefined;try{for(var f=this.__menuInfo.items[Symbol.iterator](),g;!(c=(g=f.next()).done);c=true){var j=g.value;var k="";if(j.showing){k=j.showing()}this.__setClasses(b[a],k);a++}}catch(a){d=true;e=a}finally{try{if(!c&&f.return){f.return()}}finally{if(d){throw e}}}this.redrawItems()}},{key:"insertItem",value:function c(a,b){if(!window.isDef(b)||b>=this.__menuInfo.items.length){this.__menuInfo.items.push(a)}else{this.__menuInfo.items.splice(b,0,a)}this.redrawItems()}},{key:"removeItem",value:function b(a){this.__menuInfo.items=this.__menuInfo.items.filter(function(b){return b!==a.id})}},{key:"redrawItems",value:function a(){this.contextmenu.innerHTML="";this.contextmenu.contentEditable=true;this.contextmenu.setAttribute("readonly","readonly");this.contextmenu.setAttribute("spellcheck","false");if(this.__menuInfo.items){for(var b=0;b<this.__menuInfo.items.length;b++){this.contextmenu.appendChild(this.makeMenuItem(this.__menuInfo.items[b],b))}}}},{key:"makeContextMenu",value:function a(){this.contextmenu=document.createElement("ul");this.contextmenu.id=this.__menuInfo.menuId;this.contextmenu.classList.add("contextmenu");this.contextmenu.style.display="none";this.redrawItems()}},{key:"__setClasses",value:function j(a,b){if(b){var c=b.split(" ");var d=true;var e=false;var f=undefined;try{for(var g=c[Symbol.iterator](),h;!(d=(h=g.next()).done);d=true){var i=h.value;if(i.indexOf("-")===0){i=i.substring(1);a.classList.remove(i)}else{a.classList.add(i)}}}catch(a){e=true;f=a}finally{try{if(!d&&g.return){g.return()}}finally{if(e){throw f}}}}}},{key:"makeMenuItem",value:function d(a,b){var c=document.createElement("li");c.classList.add(classNames.menuItem);if(a.label==="sep"){this.__setClasses(c,classNames.separator+" "+classNames.notSelectable)}else{if(a.html){c.innerHTML=a.html()}else{c.innerText=a.label}c.id=this.contextmenu.id+"-"+String(b);if(a.accesskey&&!a.disabled){c.setAttribute("accesskey",a.accesskey);if(this.__menuInfo.showAccessKey){var e=document.createElement("span");e.classList.add("contextmenu-shortcut");var f=shortcutPrefixes[this.browserKey];if(!window.isDef(f)){f=""}e.innerText=f+a.accesskey.toUpperCase();c.appendChild(e)}}this.__setClasses(c,a.class);if(window.isDef(a.disabled)&&a.disabled){this.__setClasses(classNames.disabled+" -"+classNames.selectable)}else{this.__setClasses(classNames.selectable+" -"+classNames.disabled);if(window.isDef(a.fn)&&!window.isDef(a.html)){c.onclick=a.fn}if(a.items){for(var g=0;g<a.items.length;g++){var h=a.items[g];var i=this.makeMenuItem(h,g);c.appendChild(i)}}}}return c}}]);return a}();