non-functional buttons added to interface

grapheditorxblock/src/js/grapheditorxblock.js

@@ -131,14 +131,13 @@ ArrangePanel.prototype.old_init = ArrangePanel.prototype.init;
 ArrangePanel.prototype.init = function()
 {
     this.old_init();
-    this.container.appendChild(this.addTestText(this.createPanel()));
-    this.container.appendChild(this.addEventDropdown(this.createPanel()));
+    this.container.appendChild(this.addInteractionPanel(this.createPanel()));
 };
 
 ArrangePanel.prototype.addTestText = function(div)
 {
     var name = "Test text"
-    btn = mxUtils.button(name, function(evt)
+    var btn = mxUtils.button(name, function(evt)
     {
         // ui.actions.get('removeFromGroup').funct();
         console.log("Test button pressed");
@@ -153,11 +152,6 @@ ArrangePanel.prototype.addTestText = function(div)
 
 ArrangePanel.prototype.addEventDropdown = function(div)
 {
-    var title = this.createTitle("Interaction");
-    // title.style.paddingLeft = '18px';
-    title.style.paddingTop = '10px';
-    title.style.paddingBottom = '6px';
-    div.appendChild(title);
 
     // Event selector
     var eventSelect = document.createElement('select');
@@ -165,8 +159,9 @@ ArrangePanel.prototype.addEventDropdown = function(div)
     //eventSelect.style.right = '20px';
     eventSelect.style.width = '60px';
     eventSelect.style.marginTop = '-2px';
+    eventSelect.title = "Select event";
 
-    var events = ['-- event --', 'onhover', 'onclick'];
+    var events = ['onclick', 'onhover'];
 
     for (var i = 0; i < events.length; i++)
     {
@@ -184,9 +179,10 @@ ArrangePanel.prototype.addEventDropdown = function(div)
     actionSelect.style.right = '93px';
     actionSelect.style.width = '60px';
     actionSelect.style.marginTop = '-2px';
+    actionSelect.title = "Select action";
 
     // TODO More actions later
-    var actions = ['-- action --', 'popup'];
+    var actions = ['popup'];
 
     for (var i = 0; i < actions.length; i++)
     {
@@ -199,7 +195,8 @@ ArrangePanel.prototype.addEventDropdown = function(div)
     div.appendChild(actionSelect);
 
     // Button
-    btn = mxUtils.button("Pick node", function(evt)
+    var name = "Pick node";
+    var btn = mxUtils.button(name, function(evt)
     {
         console.log(eventSelect.value + actionSelect.value);
     })
@@ -207,8 +204,43 @@ ArrangePanel.prototype.addEventDropdown = function(div)
     btn.style.right = '20px';
     btn.style.width = '60px';
     btn.style.marginTop = '-2px';
+    btn.title = name;
 
     div.appendChild(btn);
 
     return div;
 };
+
+ArrangePanel.prototype.addInteractionPanel = function(div)
+{
+    var title = this.createTitle("Interaction");
+    // title.style.paddingLeft = '18px';
+    title.style.paddingTop = '10px';
+    title.style.paddingBottom = '6px';
+    div.appendChild(title);
+
+    div = this.addEventDropdown(div);
+
+    div = this.addInteractionPlusButton(div);
+
+    return div;
+}
+
+ArrangePanel.prototype.addInteractionPlusButton = function (div)
+{
+    var btn = document.createElement('div');
+    btn.class = "geSprite geSprite-plus";
+    mxEvent.addListener(btn, 'click', function(evt)
+    {
+        if (graph.isEnabled())
+        {
+            // TODO
+        }
+    });
+    div.appendChild(btn);
+    btn.style.position = 'absolute';
+    btn.style.right = '20px';
+    btn.style.width = '60px';
+    btn.style.marginTop = '-2px';
+    return div;
+}