arnaucube
arnaucube/class2contextPublic Self-hosted repository
class2context/class2context.js
class2context.jsRaw
 1/* class2context.js
 2creator: Arnau
 3July 2016
 4version: v0.1
 5
 6
 7usage:
 8class2context(
 9  'className',
10  "title",
11  [["option1", "functionoption1()"], ["option 2","functionoption2()"]]
12);
13*/
14
15
16
17
18//creates the div where the context menus will place
19document.body.innerHTML+="<div id='contextMenus'></div>";
20//
21
22function class2context(classgiv, title, options){
23    classgiv=JSON.parse(JSON.stringify(classgiv));
24    if(document.getElementById("context"+classgiv))
25    {
26        //toastr.success("alreadyExist");
27    }else{
28        var aux="";
29        aux+="<div id='context"+classgiv+"' class='contextMenu'>";
30        aux+="  <ul class='c2c-dropdown c2c-border' style='display:block;position:static;margin-bottom:5px;'>";
31        aux+="<div class='contextTitle'>" + title + "</div>";
32        for(var i=0; i<options.length; i++)
33        {
34            //aux+="    <a onmousedown='"+options[i][1]+";' href='javascript:void(0);'>"+options[i][0]+"</a>";
35            aux+="    <a onmousedown='"+options[i][1]+"; ContextMenus();' href='javascript:void(0);'>"+options[i][0]+"</a>";
36
37        }
38        aux+="  </ul>";
39        aux+="</div>";
40        document.getElementById('contextMenus').innerHTML+=aux; //adds the div context menu into the context menus div place
41    }
42
43    for(var i=0; i<document.getElementsByClassName(classgiv).length; i++)
44    {
45        classgiv=JSON.parse(JSON.stringify(classgiv));
46        //toastr.info(document.getElementsByClassName(classgiv)[i].oncontextmenu);
47        document.getElementsByClassName(classgiv)[i].addEventListener("contextmenu", function(e){
48            // Avoid the real one
49            e.preventDefault();
50            e.stopPropagation();
51            setTimeout(function(){
52                //classaux=this.className.split(" ")[0];
53                document.getElementById('context'+classgiv).style.display='block';
54                document.getElementById('context'+classgiv).style.left=e.pageX + "px";
55                document.getElementById('context'+classgiv).style.top=e.pageY + "px";
56            }, 150);
57        });
58
59        /*document.getElementsByClassName(classgiv)[i].oncontextmenu+= function(e){
60            // Avoid the real one
61            e.preventDefault();
62            setTimeout(function(){
63                //classaux=this.className.split(" ")[0];
64                document.getElementById('context'+classgiv).style.display='block';
65                document.getElementById('context'+classgiv).style.left=e.pageX + "px";
66                document.getElementById('context'+classgiv).style.top=e.pageY + "px";
67            }, 150);
68        };*/
69    }
70
71    document.body.addEventListener("mousedown", function(e){
72        // Avoid the real one
73        //e.preventDefault();
74        if(document.getElementById('context'+classgiv))
75        {
76            setTimeout(function(){
77                document.getElementById('context'+classgiv).style.display='none';
78            }, 70);
79            //ContextMenus();
80
81        }
82        return false;
83    }, false);
84
85}