Downloads containing contextmenu.js

Downloads
Name Author Game Mode Rating
WebJCS 1.3.3Featured Download djazz Utility 10 Download file

File preview

  1. "use strict";
  2.  
  3. var contextmenu = (function (global, undefined) {
  4.         var menus = {};
  5.         var currentMenu = false;
  6.         var menuOrigin = [0, 0];
  7.         var currentNode = null;
  8.         var menusContainer = global.document.createElement('div');
  9.         menusContainer.id = 'contextmenuStorage';
  10.         global.document.body.appendChild(menusContainer);
  11.         var that = {};
  12.        
  13.         var hideMenu = function () {
  14.                 if(currentMenu !== false) {
  15.                         menusContainer.style.display = 'none';
  16.                         menus[currentMenu].node.style.display = 'none';
  17.                         currentMenu = false;
  18.                         menuOrigin = [0, 0];
  19.                 }
  20.         };
  21.        
  22.         that.bind = function (node, menuname, precheck) {
  23.                 node.addEventListener('contextmenu', function (e) {
  24.                         var bounding = node.getBoundingClientRect();
  25.                         var xpos = e.pageX;
  26.                         var ypos = e.pageY;
  27.                         var offx = xpos - bounding.left;
  28.                         var offy = ypos - bounding.top;
  29.                         if(precheck(offx, offy) !== false) {
  30.                                 currentMenu = menuname;
  31.                                 menuOrigin = [offx, offy];
  32.                                 menusContainer.style.display = 'block';
  33.                                 menus[menuname].node.style.display = 'block';
  34.                                 menus[menuname].node.style.left = xpos + "px";
  35.                                 menus[menuname].node.style.top = ypos + "px";
  36.                                 currentNode = node;
  37.                         }
  38.                         e.preventDefault();
  39.                         e.returnValue = false;
  40.                         return false;
  41.                 }, false);
  42.         };
  43.        
  44.         that.create = function (name, structure) {
  45.                 if(menus.hasOwnProperty(name)) {
  46.                         throw "Error: Contextmenu \""+name+"\" already exists!";
  47.                 };
  48.                 menus[name] = {};
  49.                 var container = global.document.createElement('div');
  50.                 var menu = global.document.createElement('ul');
  51.                 container.className = 'contextmenu';
  52.                
  53.                 var clickItem = function (item) {
  54.                         return function (e) {
  55.                                 if(item.node.className !== 'disabled' && item.onclick) {
  56.                                         if(item.onclick(menuOrigin[0], menuOrigin[1], currentNode) !== false)
  57.                                                 hideMenu();
  58.                                 }
  59.                         };
  60.                 };
  61.                 var createRecursive = function (tree, parent) {
  62.                         var itemTitle, listItem, subList;
  63.                         for(var i = 0; i < tree.length; i+=1) {
  64.                                 listItem = global.document.createElement('li');
  65.                                 if(tree[i] === undefined) {
  66.                                         listItem.appendChild(global.document.createElement('hr'));
  67.                                 }
  68.                                 else {
  69.                                         if(tree[i].disabled === true) {
  70.                                                 listItem.className = 'disabled';
  71.                                         }
  72.                                         itemTitle = global.document.createElement('div');
  73.                                         itemTitle.textContent = tree[i].title;
  74.                                         listItem.appendChild(itemTitle);
  75.                                         if(tree[i].sub !== undefined) {
  76.                                                 itemTitle.style.background = "url(media/icons/arrow_right.png) right center no-repeat";
  77.                                                 subList = global.document.createElement('ul');
  78.                                                 createRecursive(tree[i].sub, subList);
  79.                                                 listItem.appendChild(subList);
  80.                                         }
  81.                                         tree[i].node = listItem;
  82.                                         listItem.addEventListener('click', clickItem(tree[i]), false);
  83.                                 }
  84.                                 parent.appendChild(listItem);
  85.                         }
  86.                 };
  87.                 createRecursive(structure, menu);
  88.                 container.appendChild(menu);
  89.                 menusContainer.appendChild(container);
  90.                 menus[name].node = container;
  91.                 return structure;
  92.         };
  93.        
  94.         global.document.body.addEventListener("mousedown", function (e) {
  95.                 if(currentMenu === false) return;
  96.                 var t = e.target;
  97.                 while(t !== global.document.body) {
  98.                         if(t === menus[currentMenu].node) {
  99.                                 return;
  100.                         }
  101.                         t = t.parentNode;
  102.                 }
  103.                 hideMenu();
  104.         }, false);
  105.         global.addEventListener("keydown", function (e) {
  106.                 var kc = e.keyCode;
  107.                 if(kc === 27 && currentMenu !== false) {
  108.                         hideMenu();
  109.                 }
  110.         }, false);
  111.         global.addEventListener("blur", function (e) {
  112.                 hideMenu();
  113.         }, false);
  114.        
  115.         return that;
  116.        
  117. })(this);
  118.  
  119.