Moar changes

packages/node_modules/@node-red/editor-client/src/js/history.js

@@ -331,10 +331,12 @@ RED.history = (function() {
                             var currentConfigNode = RED.nodes.node(ev.node[i]);
                             if (currentConfigNode) {
                                 currentConfigNode.users.splice(currentConfigNode.users.indexOf(ev.node),1);
+                                RED.events.emit("nodes:change",currentConfigNode);
                             }
                             var newConfigNode = RED.nodes.node(ev.changes[i]);
                             if (newConfigNode) {
                                 newConfigNode.users.push(ev.node);
+                                RED.events.emit("nodes:change",newConfigNode);
                             }
                         }
                         ev.node[i] = ev.changes[i];

packages/node_modules/@node-red/editor-client/src/js/ui/common/treeList.js

@@ -360,7 +360,7 @@
                 }
                 processChildren(item,newItem);
 
-                if (!item.deferBuild) {
+                if (!item.deferBuild && item.treeList.childList) {
                     item.treeList.childList.editableList('insertItemAt',newItem,position)
                     if (select) {
                         setTimeout(function() {

packages/node_modules/@node-red/editor-client/src/js/ui/editor.js

@@ -1283,10 +1283,12 @@ RED.editor = (function() {
                                                 if (configNode) {
                                                     var users = configNode.users;
                                                     users.splice(users.indexOf(editing_node),1);
+                                                    RED.events.emit("nodes:change",configNode);
                                                 }
                                                 configNode = RED.nodes.node(newValue);
                                                 if (configNode) {
                                                     configNode.users.push(editing_node);
+                                                    RED.events.emit("nodes:change",configNode);
                                                 }
                                             }
                                             changes[d] = editing_node[d];
@@ -1911,10 +1913,12 @@ RED.editor = (function() {
                                     if (configNode) {
                                         var users = configNode.users;
                                         users.splice(users.indexOf(editing_config_node),1);
+                                        RED.events.emit("nodes:change",configNode);
                                     }
                                     configNode = RED.nodes.node(newValue);
                                     if (configNode) {
                                         configNode.users.push(editing_config_node);
+                                        RED.events.emit("nodes:change",configNode);
                                     }
                                 }
                                 editing_config_node[d] = newValue;
@@ -2503,10 +2507,12 @@ RED.editor = (function() {
                                                 if (configNode) {
                                                     var users = configNode.users;
                                                     users.splice(users.indexOf(editing_node),1);
+                                                    RED.events.emit("nodes:change",configNode);
                                                 }
                                                 configNode = RED.nodes.node(newValue);
                                                 if (configNode) {
                                                     configNode.users.push(editing_node);
+                                                    RED.events.emit("nodes:change",configNode);
                                                 }
                                             }
                                             changes[d] = editing_node[d];

packages/node_modules/@node-red/editor-client/src/js/ui/search.js

@@ -79,6 +79,18 @@ RED.search = (function() {
         return val;
     }
 
+    function extractValue(val, flagName, flags) {
+        // flagName:XYZ
+        var regEx = new RegExp("(?:^| )"+flagName+":([^ ]+)(?: |$)");
+        var m
+        while(m = regEx.exec(val)) {
+            val = val.replace(regEx," ").trim();
+            flags[flagName] = flags[flagName] || [];
+            flags[flagName].push(m[1]);
+        }
+        return val;
+    }
+
     function search(val) {
         var results = [];
         var keys = Object.keys(index);
@@ -93,6 +105,8 @@ RED.search = (function() {
         val = extractFlag(val,"unused",flags);
         val = extractFlag(val,"config",flags);
         val = extractFlag(val,"subflow",flags);
+        // uses:<node-id>
+        val = extractValue(val,"uses",flags);
 
         var hasFlags = Object.keys(flags).length > 0;
 

packages/node_modules/@node-red/editor-client/src/js/ui/tab-info-outliner.js

@@ -11,6 +11,8 @@ RED.sidebar.info.outliner = (function() {
 
     var objects = {};
     var missingParents = {};
+    var configNodeTypes;
+
 
     function getFlowData() {
         var flowData = [
@@ -29,6 +31,7 @@ RED.sidebar.info.outliner = (function() {
             {
                 id: "__global__",
                 label: RED._("sidebar.info.globalConfig"),
+                types: {},
                 children: [
                     getEmptyItem("__global__")
                 ]
@@ -38,6 +41,7 @@ RED.sidebar.info.outliner = (function() {
         flowList = flowData[0];
         subflowList = flowData[1];
         globalConfigNodes = flowData[2];
+        configNodeTypes = { __global__: globalConfigNodes};
 
         return flowData;
     }
@@ -141,6 +145,16 @@ RED.sidebar.info.outliner = (function() {
 
     function addControls(n,div) {
         var controls = $('<div>',{class:"red-ui-info-outline-item-controls red-ui-info-outline-item-hover-controls"}).appendTo(div);
+
+        if (n._def.category === "config" && n.type !== "group") {
+            var userCountBadge = $('<button type="button" class="red-ui-info-outline-item-control-users red-ui-button red-ui-button-small"><i class="fa fa-toggle-right"></i></button>').text(n.users.length).appendTo(controls).on("click",function(evt) {
+                evt.preventDefault();
+                evt.stopPropagation();
+                RED.search.show("uses:"+n.id);
+            })
+            RED.popover.tooltip(userCountBadge,function() { return RED._('editor.nodesUse',{count:n.users.length})});
+        }
+
         if (n._def.button) {
             var triggerButton = $('<button type="button" class="red-ui-info-outline-item-control-action red-ui-button red-ui-button-small"><i class="fa fa-toggle-right"></i></button>').appendTo(controls).on("click",function(evt) {
                 evt.preventDefault();
@@ -395,18 +409,58 @@ RED.sidebar.info.outliner = (function() {
             existingObject.element.find(".red-ui-info-outline-item-label").html("&nbsp;");
         }
         if (parent !== existingObject.parent.id) {
+            var parentItem = existingObject.parent;
             existingObject.treeList.remove(true);
-            if (parent === "__global__") {
-                globalConfigNodes.treeList.addChild(existingObject);
+            if (parentItem.children.length === 0) {
+                if (parentItem.config) {
+                    // this is a config
+                    parentItem.treeList.remove();
+                    // console.log("Removing",n.type,"from",parentItem.parent.id||parentItem.parent.parent.id)
+
+                    delete configNodeTypes[parentItem.parent.id||parentItem.parent.parent.id].types[n.type];
+
+
+                    if (parentItem.parent.children.length === 0) {
+                        if (parentItem.parent.id === "__global__") {
+                            parentItem.parent.treeList.addChild(getEmptyItem(parentItem.parent.id));
                         } else {
-                if (empties[parent]) {
-                    empties[parent].treeList.remove();
-                    delete empties[parent];
+                            delete configNodeTypes[parentItem.parent.parent.id];
+                            parentItem.parent.treeList.remove();
                         }
-                objects[parent].treeList.addChild(existingObject)
                     }
+                } else {
+                    parentItem.treeList.addChild(getEmptyItem(parentItem.id));
+                }
+            }
+            // This must be a config node that has been rescoped
+            createFlowConfigNode(parent,n.type);
+            configNodeTypes[parent].types[n.type].treeList.addChild(objects[n.id]);
+
+            // if (parent === "__global__") {
+            //     // Global always exists here
+            //     if (!configNodeTypes[parent][n.type]) {
+            //         configNodeTypes[parent][n.type] = {
+            //             config: true,
+            //             label: n.type,
+            //             children: []
+            //         }
+            //         globalConfigNodes.treeList.addChild(configNodeTypes[parent][n.type])
+            //     }
+            //     configNodeTypes[parent][n.type].treeList.addChild(existingObject);
+            // } else {
+            //     if (empties[parent]) {
+            //         empties[parent].treeList.remove();
+            //         delete empties[parent];
+            //     }
+            //     objects[parent].treeList.addChild(existingObject)
+            // }
         }
         existingObject.element.toggleClass("red-ui-info-outline-item-disabled", !!n.d)
+
+        if (n._def.category === "config" && n.type !== 'group') {
+            existingObject.element.find(".red-ui-info-outline-item-control-users").text(n.users.length);
+        }
+
         updateSearch();
     }
     function onObjectRemove(n) {
@@ -418,12 +472,25 @@ RED.sidebar.info.outliner = (function() {
         if (empties[n.id]) {
             delete empties[n.id];
         }
-
         var parent = existingObject.parent;
         if (parent.children.length === 0) {
+            if (parent.config) {
+                // this is a config
+                parent.treeList.remove();
+                delete configNodeTypes[parent.parent.id||n.z].types[n.type];
+                if (parent.parent.children.length === 0) {
+                    if (parent.parent.id === "__global__") {
+                        parent.parent.treeList.addChild(getEmptyItem(parent.parent.id));
+                    } else {
+                        delete configNodeTypes[n.z];
+                        parent.parent.treeList.remove();
+                    }
+                }
+            } else {
                 parent.treeList.addChild(getEmptyItem(parent.id));
             }
         }
+    }
     function getGutter(n) {
         var span = $("<span>",{class:"red-ui-info-outline-gutter"});
         var revealButton = $('<button type="button" class="red-ui-info-outline-item-control-reveal red-ui-button red-ui-button-small"><i class="fa fa-search"></i></button>').appendTo(span).on("click",function(evt) {
@@ -434,6 +501,34 @@ RED.sidebar.info.outliner = (function() {
         RED.popover.tooltip(revealButton,RED._("sidebar.info.find"));
         return span;
     }
+
+    function createFlowConfigNode(parent,type) {
+        // console.log("createFlowConfig",parent,type,configNodeTypes[parent]);
+        if (empties[parent]) {
+            empties[parent].treeList.remove();
+            delete empties[parent];
+        }
+        if (!configNodeTypes[parent]) {
+            // There is no 'config nodes' item in the parent flow
+            configNodeTypes[parent] = {
+                config: true,
+                types: {},
+                label: RED._("menu.label.displayConfig"),
+                children: []
+            }
+            objects[parent].treeList.insertChildAt(configNodeTypes[parent],0);
+            // console.log("CREATED", parent)
+        }
+        if (!configNodeTypes[parent].types[type]) {
+            configNodeTypes[parent].types[type] = {
+                config: true,
+                label: type,
+                children: []
+            }
+            configNodeTypes[parent].treeList.addChild(configNodeTypes[parent].types[type]);
+            // console.log("CREATED", parent,type)
+        }
+    }
     function onNodeAdd(n) {
         objects[n.id] = {
             id: n.id,
@@ -449,7 +544,8 @@ RED.sidebar.info.outliner = (function() {
             }
         }
         var parent = n.g||n.z||"__global__";
-        if (parent !== "__global__") {
+
+        if (n._def.category !== "config" || n.type === 'group') {
             if (objects[parent]) {
                 if (empties[parent]) {
                     empties[parent].treeList.remove();
@@ -465,12 +561,8 @@ RED.sidebar.info.outliner = (function() {
                 missingParents[parent].push(objects[n.id])
             }
         } else {
-            if (empties[parent]) {
-                empties[parent].treeList.remove();
-                delete empties[parent];
-            }
-            // No parent - add to Global flow list
-            globalConfigNodes.treeList.addChild(objects[n.id]);
+            createFlowConfigNode(parent,n.type);
+            configNodeTypes[parent].types[n.type].treeList.addChild(objects[n.id]);
         }
         objects[n.id].element.toggleClass("red-ui-info-outline-item-disabled", !!n.d)
         updateSearch();