mirror of
				https://github.com/node-red/node-red.git
				synced 2025-03-01 10:36:34 +00:00 
			
		
		
		
	Enable individual flow nodes to be disabled
This commit is contained in:
		| @@ -463,7 +463,9 @@ RED.nodes = (function() { | ||||
|         node.id = n.id; | ||||
|         node.type = n.type; | ||||
|         node.z = n.z; | ||||
|  | ||||
|         if (n.d === true) { | ||||
|             node.d = true; | ||||
|         } | ||||
|         if (node.type == "unknown") { | ||||
|             for (var p in n._orig) { | ||||
|                 if (n._orig.hasOwnProperty(p)) { | ||||
| @@ -1016,6 +1018,9 @@ RED.nodes = (function() { | ||||
|                     if (n.hasOwnProperty('l')) { | ||||
|                         node.l = n.l; | ||||
|                     } | ||||
|                     if (n.hasOwnProperty('d')) { | ||||
|                         node.d = n.d; | ||||
|                     } | ||||
|                     if (createNewIds) { | ||||
|                         if (subflow_blacklist[n.z]) { | ||||
|                             continue; | ||||
|   | ||||
| @@ -42,12 +42,11 @@ | ||||
|             var enabledLabel = this.options.enabledLabel || RED._("editor:workspace.enabled"); | ||||
|             var disabledLabel = this.options.disabledLabel || RED._("editor:workspace.disabled"); | ||||
|  | ||||
|             this.element.addClass("red-ui-toggleButton"); | ||||
|             this.element.css("display","none"); | ||||
|             this.element.on("focus", function() { | ||||
|                 that.button.focus(); | ||||
|             }); | ||||
|             this.button = $('<button type="button" class="'+baseClass+' toggle single"><i class="fa"></i> <span></span></button>'); | ||||
|             this.button = $('<button type="button" class="red-ui-toggleButton '+baseClass+' toggle single"><i class="fa"></i> <span></span></button>'); | ||||
|             if (this.options.class) { | ||||
|                 this.button.addClass(this.options.class) | ||||
|             } | ||||
|   | ||||
| @@ -955,34 +955,19 @@ RED.editor = (function() { | ||||
|  | ||||
|         $('<div class="form-row">'+ | ||||
|             '<label for="node-input-show-label-btn" data-i18n="editor.label"></label>'+ | ||||
|             '<button type="button" id="node-input-show-label-btn" class="red-ui-button" style="min-width: 80px; text-align: left;" type="button"><i id="node-input-show-label-btn-i" class="fa fa-toggle-on"></i> <span id="node-input-show-label-label"></span></button> '+ | ||||
|             '<input type="checkbox" id="node-input-show-label" style="display: none;"/>'+ | ||||
|             '<input type="checkbox" id="node-input-show-label"/>'+ | ||||
|         '</div>').appendTo(dialogForm); | ||||
|  | ||||
|         var setToggleState = function(state) { | ||||
|             var i = $("#node-input-show-label-btn-i"); | ||||
|             if (!state) { | ||||
|                 i.addClass('fa-toggle-off'); | ||||
|                 i.removeClass('fa-toggle-on'); | ||||
|                 $("#node-input-show-label").prop("checked",false); | ||||
|                 $("#node-input-show-label-label").text(RED._("editor.hide")); | ||||
|             } else { | ||||
|                 i.addClass('fa-toggle-on'); | ||||
|                 i.removeClass('fa-toggle-off'); | ||||
|                 $("#node-input-show-label").prop("checked",true); | ||||
|                 $("#node-input-show-label-label").text(RED._("editor.show")); | ||||
|             } | ||||
|         } | ||||
|         dialogForm.find('#node-input-show-label-btn').on("click",function(e) { | ||||
|             e.preventDefault(); | ||||
|             var i = $("#node-input-show-label-btn-i"); | ||||
|             setToggleState(i.hasClass('fa-toggle-off')); | ||||
|         $("#node-input-show-label").toggleButton({ | ||||
|             enabledLabel: RED._("editor.show"), | ||||
|             disabledLabel: RED._("editor.hide") | ||||
|         }) | ||||
|  | ||||
|         if (!node.hasOwnProperty("l")) { | ||||
|             // Show label if type not link | ||||
|             node.l = !/^link (in|out)$/.test(node._def.type); | ||||
|         } | ||||
|         setToggleState(node.l); | ||||
|         $("#node-input-show-label").prop("checked",node.l).trigger("change"); | ||||
|  | ||||
|         // If a node has icon property in defaults, the icon of the node cannot be modified. (e.g, ui_button node in dashboard) | ||||
|         if ((!node._def.defaults || !node._def.defaults.hasOwnProperty("icon"))) { | ||||
| @@ -1396,6 +1381,20 @@ RED.editor = (function() { | ||||
|                                 node.l = true; | ||||
|                             } | ||||
|                         } | ||||
|                         if ($("#node-input-node-disabled").prop('checked')) { | ||||
|                             if (node.d !== true) { | ||||
|                                 changes.d = node.d; | ||||
|                                 changed = true; | ||||
|                                 node.d = true; | ||||
|                             } | ||||
|                         } else { | ||||
|                             if (node.d === true) { | ||||
|                                 changes.d = node.d; | ||||
|                                 changed = true; | ||||
|                                 delete node.d; | ||||
|                             } | ||||
|                         } | ||||
|  | ||||
|                         node.resize = true; | ||||
|  | ||||
|                         var oldInfo = node.info; | ||||
| @@ -1498,6 +1497,12 @@ RED.editor = (function() { | ||||
|                 var trayBody = tray.find('.red-ui-tray-body'); | ||||
|                 trayBody.parent().css('overflow','hidden'); | ||||
|  | ||||
|                 var trayFooterLeft = $('<div class="red-ui-tray-footer-left"></div>').appendTo(trayFooter) | ||||
|  | ||||
|                 $('<input id="node-input-node-disabled" type="checkbox">').prop("checked",!!node.d).appendTo(trayFooterLeft).toggleButton({ | ||||
|                     invertState: true | ||||
|                 }) | ||||
|  | ||||
|                 var editorTabEl = $('<ul></ul>').appendTo(trayBody); | ||||
|                 var editorContent = $('<div></div>').appendTo(trayBody); | ||||
|  | ||||
| @@ -1675,9 +1680,15 @@ RED.editor = (function() { | ||||
|                 var trayHeader = tray.find(".red-ui-tray-header"); | ||||
|                 var trayBody = tray.find('.red-ui-tray-body'); | ||||
|                 var trayFooter = tray.find(".red-ui-tray-footer"); | ||||
|                 var userCountDiv; | ||||
|  | ||||
|                 var trayFooterLeft = $('<div class="red-ui-tray-footer-left"></div>').appendTo(trayFooter) | ||||
|  | ||||
|                 $('<input type="checkbox">').appendTo(trayFooterLeft).toggleButton({ | ||||
|                     invertState: true | ||||
|                 }) | ||||
|  | ||||
|                 if (node_def.hasUsers !== false) { | ||||
|                     userCountDiv = $('<div class="red-ui-tray-footer-left"><i class="fa fa-info-circle"></i> <span></span></div>').prependTo(trayFooter); | ||||
|                     $('<span><i class="fa fa-info-circle"></i> <span id="red-ui-editor-config-user-count"></span></span>').css("margin-left", "10px").appendTo(trayFooterLeft); | ||||
|                 } | ||||
|                 trayFooter.append('<span class="red-ui-tray-footer-right"><span id="red-ui-editor-config-scope-warning" data-i18n="[title]editor.errors.scopeChange"><i class="fa fa-warning"></i></span><select id="red-ui-editor-config-scope"></select></span>'); | ||||
|  | ||||
| @@ -1771,8 +1782,8 @@ RED.editor = (function() { | ||||
|                             } | ||||
|                         }); | ||||
|                     } | ||||
|                     if (node_def.hasUsers !== false && userCountDiv) { | ||||
|                         userCountDiv.find("span").text(RED._("editor.nodesUse", {count:editing_config_node.users.length})).parent().show(); | ||||
|                     if (node_def.hasUsers !== false) { | ||||
|                         $("#red-ui-editor-config-user-count").text(RED._("editor.nodesUse", {count:editing_config_node.users.length})).parent().show(); | ||||
|                     } | ||||
|                     trayBody.i18n(); | ||||
|                     trayFooter.i18n(); | ||||
|   | ||||
| @@ -2929,6 +2929,7 @@ RED.view = (function() { | ||||
|                             d.resize = false; | ||||
|                         } | ||||
|                         var thisNode = d3.select(this); | ||||
|                         thisNode.classed("red-ui-flow-node-disabled", function(d) { return d.d === true}); | ||||
|                         thisNode.classed("red-ui-flow-subflow",function(d) { return activeSubflow != null; }) | ||||
|  | ||||
|                         //thisNode.selectAll(".centerDot").attr({"cx":function(d) { return d.w/2;},"cy":function(d){return d.h/2}}); | ||||
| @@ -3248,6 +3249,7 @@ RED.view = (function() { | ||||
|                         } | ||||
|                         return path; | ||||
|                     }); | ||||
|                     link.classed("red-ui-flow-node-disabled", function(d) { return d.source.d || d.target.d; }); | ||||
|                 } | ||||
|             }) | ||||
|  | ||||
|   | ||||
| @@ -79,15 +79,20 @@ | ||||
| .red-ui-tray-footer { | ||||
|     @include component-footer; | ||||
|     height: 35px; | ||||
|     font-size: 12px !important; | ||||
|     font-size: 14px !important; | ||||
|     line-height: 35px; | ||||
|     vertical-align: middle; | ||||
|  | ||||
|     button { | ||||
|         @include editor-button; | ||||
|         padding: 3px 7px; | ||||
|         font-size: 11px; | ||||
|     button.red-ui-button { | ||||
|         padding: 0px 8px; | ||||
|         height: 26px; | ||||
|         line-height: 26px; | ||||
|         &.toggle:not(.selected) { | ||||
|             color: $workspace-button-color-selected !important; | ||||
|             background: $workspace-button-background-active; | ||||
|         } | ||||
|     } | ||||
|  | ||||
|     .red-ui-tray-footer-left { | ||||
|         display:inline-block; | ||||
|         margin-right: 20px; | ||||
| @@ -563,8 +568,6 @@ button.red-ui-button-small | ||||
| } | ||||
|  | ||||
|  | ||||
|  | ||||
|  | ||||
| .red-ui-editor-type-json-editor-item-handle { | ||||
|     cursor: move; | ||||
| } | ||||
| @@ -572,3 +575,7 @@ button.red-ui-button-small | ||||
|     position: relative; | ||||
|     height: calc(100% - 40px); | ||||
| } | ||||
|  | ||||
| button.red-ui-toggleButton.toggle { | ||||
|     text-align: left; | ||||
| } | ||||
|   | ||||
| @@ -146,11 +146,11 @@ g.red-ui-flow-node-selected { | ||||
|     border-style: dashed !important; | ||||
|     stroke: $node-selected-color; | ||||
|     stroke-width: 2; | ||||
|     stroke-dasharray: 10, 4; | ||||
|     stroke-dasharray: 8, 3; | ||||
| } | ||||
|  | ||||
| .red-ui-flow-subflow .red-ui-flow-node { | ||||
|     stroke-dasharray:8, 3; | ||||
|     stroke-dasharray:8, 2; | ||||
| } | ||||
| .red-ui-workspace-disabled { | ||||
|     .red-ui-flow-link-line { | ||||
| @@ -159,10 +159,21 @@ g.red-ui-flow-node-selected { | ||||
|         stroke: $link-subflow-color; | ||||
|     } | ||||
|     .red-ui-flow-node { | ||||
|         stroke-dasharray: 10,4; | ||||
|         stroke-dasharray: 8, 3; | ||||
|         fill-opacity: 0.6; | ||||
|     } | ||||
| } | ||||
| .red-ui-flow-node-disabled { | ||||
|     &.red-ui-flow-node, .red-ui-flow-node { | ||||
|         stroke-dasharray: 8, 3; | ||||
|         fill-opacity: 0.6; | ||||
|     } | ||||
|     &.red-ui-flow-link-line { | ||||
|         stroke-dasharray: 10,5 !important; | ||||
|         stroke-width: 2 !important; | ||||
|         stroke: $link-subflow-color; | ||||
|     } | ||||
| } | ||||
|  | ||||
| @each $current-color in red green yellow blue grey { | ||||
|     .red-ui-flow-node-status-dot-#{$current-color} { | ||||
|         fill: map-get($node-status-colors,$current-color); | ||||
|   | ||||
| @@ -192,7 +192,7 @@ | ||||
|     right: 0; | ||||
|     height: 25px; | ||||
|     line-height: 25px; | ||||
|     padding: 0 10px; | ||||
|     padding: 0 6px; | ||||
|     user-select: none; | ||||
|  | ||||
|     .button-group:not(:last-child) { | ||||
|   | ||||
| @@ -171,37 +171,39 @@ class Flow { | ||||
|         for (id in this.flow.nodes) { | ||||
|             if (this.flow.nodes.hasOwnProperty(id)) { | ||||
|                 node = this.flow.nodes[id]; | ||||
|                 if (!node.subflow) { | ||||
|                     if (!this.activeNodes[id]) { | ||||
|                         newNode = flowUtil.createNode(this,node); | ||||
|                         if (newNode) { | ||||
|                             this.activeNodes[id] = newNode; | ||||
|                 if (node.d !== true) { | ||||
|                     if (!node.subflow) { | ||||
|                         if (!this.activeNodes[id]) { | ||||
|                             newNode = flowUtil.createNode(this,node); | ||||
|                             if (newNode) { | ||||
|                                 this.activeNodes[id] = newNode; | ||||
|                             } | ||||
|                         } | ||||
|                     } | ||||
|                 } else { | ||||
|                     if (!this.subflowInstanceNodes[id]) { | ||||
|                         try { | ||||
|                             var subflowDefinition = this.flow.subflows[node.subflow]||this.global.subflows[node.subflow] | ||||
|                             // console.log("NEED TO CREATE A SUBFLOW",id,node.subflow); | ||||
|                             this.subflowInstanceNodes[id] = true; | ||||
|                             var subflow = Subflow.create( | ||||
|                                 this, | ||||
|                                 this.global, | ||||
|                                 subflowDefinition, | ||||
|                                 node | ||||
|                             ); | ||||
|                             this.subflowInstanceNodes[id] = subflow; | ||||
|                             subflow.start(); | ||||
|                             this.activeNodes[id] = subflow.node; | ||||
|                     } else { | ||||
|                         if (!this.subflowInstanceNodes[id]) { | ||||
|                             try { | ||||
|                                 var subflowDefinition = this.flow.subflows[node.subflow]||this.global.subflows[node.subflow] | ||||
|                                 // console.log("NEED TO CREATE A SUBFLOW",id,node.subflow); | ||||
|                                 this.subflowInstanceNodes[id] = true; | ||||
|                                 var subflow = Subflow.create( | ||||
|                                     this, | ||||
|                                     this.global, | ||||
|                                     subflowDefinition, | ||||
|                                     node | ||||
|                                 ); | ||||
|                                 this.subflowInstanceNodes[id] = subflow; | ||||
|                                 subflow.start(); | ||||
|                                 this.activeNodes[id] = subflow.node; | ||||
|  | ||||
|                             // this.subflowInstanceNodes[id] = nodes.map(function(n) { return n.id}); | ||||
|                             // for (var i=0;i<nodes.length;i++) { | ||||
|                             //     if (nodes[i]) { | ||||
|                             //         this.activeNodes[nodes[i].id] = nodes[i]; | ||||
|                             //     } | ||||
|                             // } | ||||
|                         } catch(err) { | ||||
|                             console.log(err.stack) | ||||
|                                 // this.subflowInstanceNodes[id] = nodes.map(function(n) { return n.id}); | ||||
|                                 // for (var i=0;i<nodes.length;i++) { | ||||
|                                 //     if (nodes[i]) { | ||||
|                                 //         this.activeNodes[nodes[i].id] = nodes[i]; | ||||
|                                 //     } | ||||
|                                 // } | ||||
|                             } catch(err) { | ||||
|                                 console.log(err.stack) | ||||
|                             } | ||||
|                         } | ||||
|                     } | ||||
|                 } | ||||
|   | ||||
		Reference in New Issue
	
	Block a user