Refinements to Unknown-node handling

Refinement to #113

nodes/core/core/98-unknown.html

@@ -15,35 +15,35 @@
 -->
 
 <script type="text/x-red" data-template-name="unknown">
-    <div class="form-tips">This node is currently unknown to Node-RED. <i>DO NOT Deploy while in this state or the flow file may well be trashed...</i>. Usually this can be resolved by installing the npm module that this node relies on. To do this - stop Node-RED and restart. Look at the errors shown for one that matches this missing node. Stop Node-RED again and type <b>npm install {missing module name}</b>. Restart Node-RED, and hopefully this will have resolved it.</div>
+    <div class="form-tips"><p>This node is a type unknown to your installation of Node-RED.</p>
+    <p><i>If you deploy with the node in this state, it will lose all of its configuration.</i></p>
+    <p>See the Info side bar for more help</p></div>
 </script>
 
 <script type="text/x-red" data-help-name="unknown">
-    <p>This node is currently unknown to Node-RED.</p>
+    <p>This node is a type unknown to your installation of Node-RED.</p>
-    <p><i>DO NOT Deploy while in this state or the flow file may well be trashed...</i></p>
+    <p><i>If you deploy with the node in this state, it will lose all of its configuration.</i></p>
-    <p>Usually this can be resolved by installing the npm module that this node relies on. To do this, stop Node-RED and restart.</p>
+    <p>It is possible this node type is already installed, but is missing a dependency. Check the Node-RED start-up log for
-    <p>Look at the errors shown in the console for one that matches the name of this missing node.</p>
+       any error messages associated with the missing node type. Use <b>npm install &lt;module&gt;</b> to install any missing modules
-    <p>Stop Node-RED again and type <b>npm install {missing module name}</b>. Restart Node-RED, and hopefully this will have resolved it.</p>
+       and restart Node-RED and reimport the nodes.</p>
-    <p>If not then you will need to obtain that Node-RED module from somewhere... ask the author of the flow where they got it from.</p>
+    <p>Otherwise, you should contact the author of the flow to obtain a copy of the missing node type.</p>
-    <p>(hopefully soon we will have a central repository where all nodes can be registered. work in progress.)</p>
 </script>
 
 <script type="text/javascript">
     RED.nodes.registerType('unknown',{
-            category: 'unknown',
+        category: 'unknown',
-            color:"#C00000",
+        color:"#fff0f0",
-            defaults: {
+        defaults: {
-            name: {value:""},
+            name: {value:""}
-            foo: {value:"",required:true}
         },
         inputs:1,
         outputs:1,
         icon: "",
         label: function() {
-            return this.name||"unknown";
+            return "("+this.name+")"||"unknown";
         },
         labelStyle: function() {
-            return "node_label_white";
+            return "node_label_unknown";
         }
     });
 </script>

public/index.html

@@ -151,9 +151,14 @@
 
 <div id="node-dialog-confirm-deploy" class="hide">
     <form class="form-horizontal">
-        <div style="text-align: center; padding-top: 30px;">
+        <div id="node-dialog-confirm-deploy-config" style="text-align: center; padding-top: 30px;">
          Some of the nodes are not properly configured. Are you sure you want to deploy?
         </div>
+        <div id="node-dialog-confirm-deploy-unknown" style="text-align: center; padding-top: 10px;">
+         The workspace contains some unknown node types:
+         <ul style="width: 300px; margin: auto; text-align: left;" id="node-dialog-confirm-deploy-unknown-list"></ul>
+         Are you sure you want to deploy?
+        </div>
     </form>
 </div>
 

public/red/main.js

@@ -22,14 +22,26 @@ var RED = function() {
 
             if (!force) {
                 var invalid = false;
+                var unknownNodes = [];
                 RED.nodes.eachNode(function(node) {
                         invalid = invalid || !node.valid;
                         if (node.type === "unknown") {
-                            RED.notify('Unknown node type <b>'+node.name+'</b> found',"error");
+                            if (unknownNodes.indexOf(node.name) == -1) {
+                                unknownNodes.push(node.name);
+                            }
                             invalid = true;
                         }
                 });
                 if (invalid) {
+                    if (unknownNodes.length > 0) {
+                        $( "#node-dialog-confirm-deploy-config" ).hide();
+                        $( "#node-dialog-confirm-deploy-unknown" ).show();
+                        var list = "<li>"+unknownNodes.join("</li><li>")+"</li>";
+                        $( "#node-dialog-confirm-deploy-unknown-list" ).html(list);
+                    } else {
+                        $( "#node-dialog-confirm-deploy-config" ).show();
+                        $( "#node-dialog-confirm-deploy-unknown" ).hide();
+                    }
                     $( "#node-dialog-confirm-deploy" ).dialog( "open" );
                     return;
                 }

public/red/nodes.js

@@ -222,20 +222,26 @@ RED.nodes = function() {
             if (!$.isArray(newNodes)) {
                 newNodes = [newNodes];
             }
+            var unknownTypes = [];
             for (var i in newNodes) {
                 var n = newNodes[i];
                 // TODO: remove workspace in next release+1
                 if (n.type != "workspace" && n.type != "tab" && !getType(n.type)) {
                     // TODO: get this UI thing out of here! (see below as well)
-                    //return null;              //
+                    n.name = n.type;
-                    n.name = "( "+n.type+" )";  // DCJ - mod to make it load, but will lose all "self knowledge".
+                    n.type = "unknown";
-                    n.type = "unknown";         //
+                    if (unknownTypes.indexOf(n.name)==-1) {
-                }                               //
+                        unknownTypes.push(n.name);
-                if (n.type == "unknown") {      //
+                    }
-                    RED.notify("<strong>Failed to import node</strong>: unrecognised type <b>'"+n.name+"'</b><br/>DO NOT DEPLOY while in this state.<br/>Either, add missing types to Node-RED, restart and then reload page,<br/>or delete unknown "+n.name+", rewire as required, and then deploy.","error");
+                }
-                }                               //
-
             }
+            if (unknownTypes.length > 0) {
+                var typeList = "<ul><li>"+unknownTypes.join("</li><li>")+"</li></ul>";
+                var type = "type"+(unknownTypes.length > 1?"s":"");
+                RED.notify("<strong>Imported unrecognised "+type+":</strong>"+typeList,"error",false,10000);
+                //"DO NOT DEPLOY while in this state.<br/>Either, add missing types to Node-RED, restart and then reload page,<br/>or delete unknown "+n.name+", rewire as required, and then deploy.","error");
+            }
+
             for (var i in newNodes) {
                 var n = newNodes[i];
                 // TODO: remove workspace in next release+1

public/red/ui/notifications.js

@@ -16,7 +16,7 @@
 RED.notify = function() {
     var currentNotifications = [];
     var c = 0;
-    return function(msg,type,fixed) {
+    return function(msg,type,fixed,timeout) {
         if (currentNotifications.length > 4) {
             var ll = currentNotifications.length;
             for (var i = 0;ll > 4 && i<currentNotifications.length;i+=1) {
@@ -49,7 +49,7 @@ RED.notify = function() {
             };
         }();
         if (!fixed) {
-            n.timeoutid = window.setTimeout(n.close,3000);
+            n.timeoutid = window.setTimeout(n.close,timeout||3000);
         }
         currentNotifications.push(n);
         c+=1;

public/red/ui/view.js

@@ -722,6 +722,7 @@ RED.view = function() {
 
                     var mainRect = node.append("rect")
                         .attr("class", "node")
+                        .classed("node_unknown",function(d) { return d.type == "unknown"; }) 
                         .attr("rx", 6)
                         .attr("ry", 6)
                         .attr("fill",function(d) { return d._def.color;})
@@ -952,7 +953,8 @@ RED.view = function() {
         })
 
         link.classed("link_selected", function(d) { return d === selected_link || d.selected; });
-
+        link.classed("link_unknown",function(d) { return d.target.type == "unknown" || d.source.type == "unknown"});
+        
         if (d3.event) {
             d3.event.preventDefault();
         }

public/style.css

@@ -246,7 +246,11 @@ a.brand img {
 }
 
 .node_label_italic {
-  font-style: italic;
+    font-style: italic;
+}
+.node_label_unknown {
+    font-style: italic;
+    fill: #e00 !important;
 }
 .node_label_white {
   fill: #eee !important;
@@ -272,6 +276,10 @@ a.brand img {
   cursor: move;
   stroke-width: 2;
 }
+.node_unknown {
+    stroke-dasharray:10,4;
+    stroke: #f33;
+}
 .tool_arrow {
    stroke-width: 1;
    stroke: #999;
@@ -365,7 +373,11 @@ a.brand img {
 .link_selected {
   stroke: #ff7f0e;
 }
-
+.link_unknown {
+   stroke: #f00;
+   stroke-width: 2;
+   stroke-dasharray: 10, 4;
+}
 #shade {
    position: absolute;
    top:0;