Update info sidebar as trays open/close

editor/js/ui/editor.js

@@ -15,10 +15,6 @@
  **/
 RED.editor = (function() {
 
-
-    var editStack = [];
-
-
     var editing_node = null;
     var editing_config_node = null;
     var subflowEditor;
@@ -396,7 +392,6 @@ RED.editor = (function() {
     }
 
     function showEditDialog(node) {
-        editStack.push({node:node});
         var editing_node = node;
         RED.view.state(RED.state.EDITING);
         var type = node.type;
@@ -421,10 +416,6 @@ RED.editor = (function() {
                     id: "node-dialog-ok",
                     text: RED._("common.label.ok"),
                     click: function() {
-                        var editElement = editStack.pop();
-                        if (editElement) {
-                            var editing_node = editElement.node;
-
                         var changes = {};
                         var changed = false;
                         var wasDirty = RED.nodes.dirty();
@@ -548,7 +539,6 @@ RED.editor = (function() {
                         editing_node.dirty = true;
                         validateNode(editing_node);
                         RED.view.redraw(true);
-                        }
                         RED.tray.close();
                     }
                 },
@@ -556,9 +546,7 @@ RED.editor = (function() {
                     id: "node-dialog-cancel",
                     text: RED._("common.label.cancel"),
                     click: function() {
-                        var editElement = editStack.pop();
+                        if (editing_node._def) {
-                        if (editElement && editElement.node._def) {
-                            var editing_node = editElement.node;
                             if (editing_node._def.oneditcancel) {
                                 editing_node._def.oneditcancel.call(editing_node);
                             }
@@ -588,15 +576,17 @@ RED.editor = (function() {
                 }
             ],
             resize: function() {
-                var editing_node = editStack[editStack.length-1];
+                if (editing_node && editing_node._def.oneditresize) {
-                if (editing_node && editing_node.node._def.oneditresize) {
                     setTimeout(function() {
                         var form = $("#dialog-form");
-                        editing_node.node._def.oneditresize.call(editing_node.node,{width:form.width(),height:form.height()});
+                        editing_node._def.oneditresize.call(editing_node,{width:form.width(),height:form.height()});
                     },0);
                 }
             },
             open: function(tray) {
+                if (editing_node) {
+                    RED.sidebar.info.refresh(editing_node);
+                }
                 var trayBody = tray.find('.editor-tray-body');
                 RED.keyboard.disable();
                 var dialogForm = $('<form id="dialog-form" class="form-horizontal"></form>').appendTo(trayBody);
@@ -653,10 +643,12 @@ RED.editor = (function() {
                 if (RED.view.state() != RED.state.IMPORT_DRAGGING) {
                     RED.view.state(RED.state.DEFAULT);
                 }
+                RED.workspaces.refresh();
+            },
+            show: function() {
                 if (editing_node) {
                     RED.sidebar.info.refresh(editing_node);
                 }
-                RED.workspaces.refresh();
             }
         }
         /*).parent().on('keydown', function(evt) {
@@ -704,16 +696,14 @@ RED.editor = (function() {
             }
             editing_config_node["_"] = node_def._;
         }
-        editStack.push({node:editing_config_node});
         RED.view.state(RED.state.EDITING);
         var trayOptions = {
             title: (adding?RED._("editor.addNewConfig", {type:type}):RED._("editor.editConfig", {type:type})),
             resize: function() {
-                var editing_node = editStack[editStack.length-1];
+                if (editing_config_node && editing_config_node._def.oneditresize) {
-                if (editing_node && editing_node.node._def.oneditresize) {
                     setTimeout(function() {
                         var form = $("#node-config-dialog-edit-form");
-                        editing_node.node._def.oneditresize.call(editing_node.node,{width:form.width(),height:form.height()});
+                        editing_config_node._def.oneditresize.call(editing_config_node,{width:form.width(),height:form.height()});
                     },0);
                 }
             },
@@ -801,6 +791,11 @@ RED.editor = (function() {
                     RED.keyboard.enable();
                 }
                 RED.workspaces.refresh();
+            },
+            show: function() {
+                if (editing_config_node) {
+                    RED.sidebar.info.refresh(editing_config_node);
+                }
             }
         }
         trayOptions.buttons = [
@@ -864,12 +859,11 @@ RED.editor = (function() {
                         var user = editing_config_node.users[i];
                         validateNode(user);
                     }
-
-                    updateConfigNodeSelect(configProperty,configType,editing_config_node.id);
-
                     RED.nodes.dirty(true);
                     RED.view.redraw(true);
-                    RED.tray.close();
+                    RED.tray.close(function() {
+                        updateConfigNodeSelect(configProperty,configType,editing_config_node.id);
+                    });
                 }
             },
             {
@@ -936,11 +930,12 @@ RED.editor = (function() {
                         }
                         validateNode(user);
                     }
-                    updateConfigNodeSelect(configProperty,configType,"");
                     RED.nodes.dirty(true);
                     RED.view.redraw();
                     RED.history.push(historyEvent);
-                    RED.tray.close();
+                    RED.tray.close(function() {
+                        updateConfigNodeSelect(configProperty,configType,"");
+                    });
                 }
             });
         }

editor/js/ui/tray.js

@@ -56,6 +56,7 @@ RED.tray = (function() {
             options.open(el);
         }
 
+        $("#header-shade").show();
         $("#editor-shade").show();
         el.css({
             right: -(el.width()+10)+"px",
@@ -72,6 +73,9 @@ RED.tray = (function() {
             if (options.resize) {
                 options.resize();
             }
+            if (options.show) {
+                options.show();
+            }
             el.css({right:0});
         },0);
     }
@@ -106,7 +110,7 @@ RED.tray = (function() {
             }
 
         },
-        close: function close() {
+        close: function close(done) {
             if (stack.length > 0) {
                 var tray = stack.pop();
                 tray.tray.css({
@@ -122,10 +126,17 @@ RED.tray = (function() {
                         oldTray.tray.appendTo("#editor-stack");
                         setTimeout(function() {
                             oldTray.tray.css({right:0});
+                            if (oldTray.options.show) {
+                                oldTray.options.show();
+                            }
                         },0);
                     }
+                    if (done) {
+                        done();
+                    }
                 },200)
                 if (stack.length === 0) {
+                    $("#header-shade").hide();
                     $("#editor-shade").hide();
                 }
             }

editor/sass/workspace.scss

@@ -105,7 +105,7 @@
     }
 }
 
-#editor-shade {
+#editor-shade, #header-shade  {
     position: absolute;
     top:0;
     bottom:0;
@@ -113,6 +113,8 @@
     right:0;
     background: rgba(220,220,220,0.5);
 }
+
+
 #workspace-add-tab {
     position: absolute;
     box-sizing: border-box;

editor/templates/index.mst

@@ -39,6 +39,7 @@
     <ul class="header-toolbar hide">
         <li><a id="btn-sidemenu" class="button" data-toggle="dropdown" href="#"><i class="fa fa-bars"></i></a></li>
     </ul>
+    <div id="header-shade" class="hide"></div>
 </div>
 <div id="main-container" class="sidebar-closed hide">
     <div id="palette">