arnaucube
arnaucube/thoughtsPublic Self-hosted repository
thoughts/web/libraries/class2context.js
web/libraries/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//if the div 'contextMenus' exist, deletes
18if(document.getElementById('contextMenus'))
19{
20  removeElemById('contextMenus');
21}
22
23//creates the div where the context menus will place
24document.body.innerHTML+="<div id='contextMenus'></div>";
25//
26
27function removeElemById(id) {
28    return (elem=document.getElementById(id)).parentNode.removeChild(elem);
29}
30
31function class2context(classgiv, title, options){
32    classgiv=JSON.parse(JSON.stringify(classgiv));
33    if(document.getElementById("context"+classgiv))
34    {
35        //toastr.success("alreadyExist");
36    }else{
37        var aux="";
38        aux+="<div id='context"+classgiv+"' class='contextMenu'>";
39        aux+="  <ul class='c2c-dropdown c2c-border' style='display:block;position:static;margin-bottom:5px;'>";
40        aux+="<div class='contextTitle'>" + title + "</div>";
41        for(var i=0; i<options.length; i++)
42        {
43            //aux+="    <a onmousedown='"+options[i][1]+";' href='javascript:void(0);'>"+options[i][0]+"</a>";
44            aux+="    <a onmousedown='"+options[i][1]+"; ContextMenus();' href='javascript:void(0);'>"+options[i][0]+"</a>";
45
46        }
47        aux+="  </ul>";
48        aux+="</div>";
49        document.getElementById('contextMenus').innerHTML+=aux; //adds the div context menu into the context menus div place
50    }
51
52    for(var i=0; i<document.getElementsByClassName(classgiv).length; i++)
53    {
54        classgiv=JSON.parse(JSON.stringify(classgiv));
55        //toastr.info(document.getElementsByClassName(classgiv)[i].oncontextmenu);
56        document.getElementsByClassName(classgiv)[i].addEventListener("contextmenu", function(e){
57            // Avoid the real one
58            e.preventDefault();
59            e.stopPropagation();
60            setTimeout(function(){
61                //classaux=this.className.split(" ")[0];
62                document.getElementById('context'+classgiv).style.display='block';
63                document.getElementById('context'+classgiv).style.left=e.pageX + "px";
64                document.getElementById('context'+classgiv).style.top=e.pageY + "px";
65            }, 150);
66        });
67
68        /*document.getElementsByClassName(classgiv)[i].oncontextmenu+= function(e){
69            // Avoid the real one
70            e.preventDefault();
71            setTimeout(function(){
72                //classaux=this.className.split(" ")[0];
73                document.getElementById('context'+classgiv).style.display='block';
74                document.getElementById('context'+classgiv).style.left=e.pageX + "px";
75                document.getElementById('context'+classgiv).style.top=e.pageY + "px";
76            }, 150);
77        };*/
78    }
79
80    document.body.addEventListener("mousedown", function(e){
81        // Avoid the real one
82        //e.preventDefault();
83        if(document.getElementById('context'+classgiv))
84        {
85            setTimeout(function(){
86                document.getElementById('context'+classgiv).style.display='none';
87            }, 70);
88            //ContextMenus();
89
90        }
91        return false;
92    }, false);
93
94}