mirror of
https://github.com/node-red/node-red.git
synced 2023-10-10 13:36:53 +02:00
Keep port label form in sync with output reordering
This commit is contained in:
parent
e7e3ed4923
commit
185b16a858
@ -191,7 +191,7 @@ RED.history = (function() {
|
||||
} else if (ev.t == "edit") {
|
||||
for (i in ev.changes) {
|
||||
if (ev.changes.hasOwnProperty(i)) {
|
||||
if (ev.node._def.defaults[i].type) {
|
||||
if (ev.node._def.defaults[i] && ev.node._def.defaults[i].type) {
|
||||
// This is a config node property
|
||||
var currentConfigNode = RED.nodes.node(ev.node[i]);
|
||||
if (currentConfigNode) {
|
||||
@ -239,7 +239,7 @@ RED.history = (function() {
|
||||
if (ev.outputMap) {
|
||||
outputMap = {};
|
||||
for (var port in ev.outputMap) {
|
||||
if (ev.outputMap.hasOwnProperty(port) && ev.outputMap[port] !== -1) {
|
||||
if (ev.outputMap.hasOwnProperty(port) && ev.outputMap[port] !== "-1") {
|
||||
outputMap[ev.outputMap[port]] = port;
|
||||
}
|
||||
}
|
||||
|
@ -191,7 +191,7 @@ RED.editor = (function() {
|
||||
if (outputMap) {
|
||||
RED.nodes.eachLink(function(l) {
|
||||
if (l.source === node && outputMap.hasOwnProperty(l.sourcePort)) {
|
||||
if (outputMap[l.sourcePort] === -1) {
|
||||
if (outputMap[l.sourcePort] === "-1") {
|
||||
removedLinks.push(l);
|
||||
} else {
|
||||
l.sourcePort = outputMap[l.sourcePort];
|
||||
@ -549,17 +549,10 @@ RED.editor = (function() {
|
||||
}
|
||||
|
||||
function refreshLabelForm(container,node) {
|
||||
var inputCount = node.inputs || node._def.inputs || 0;
|
||||
var outputCount;
|
||||
var i;
|
||||
var formOutputs = parseInt($("#node-input-outputs").val());
|
||||
if (isNaN(formOutputs)) {
|
||||
outputCount = node.outputs || node._def.outputs || 0;
|
||||
} else {
|
||||
outputCount = Math.max(0,formOutputs);
|
||||
}
|
||||
var inputsDiv = $("#node-label-form-inputs");
|
||||
var outputsDiv = $("#node-label-form-outputs");
|
||||
|
||||
var inputCount = node.inputs || node._def.inputs || 0;
|
||||
var children = inputsDiv.children();
|
||||
if (children.length < inputCount) {
|
||||
for (i = children.length;i<inputCount;i++) {
|
||||
@ -571,23 +564,53 @@ RED.editor = (function() {
|
||||
}
|
||||
}
|
||||
|
||||
var children = outputsDiv.children();
|
||||
var outputCount;
|
||||
var i;
|
||||
var formOutputs = $("#node-input-outputs").val();
|
||||
|
||||
if (formOutputs === undefined) {
|
||||
outputCount = node.outputs || node._def.outputs || 0;
|
||||
} else if (isNaN(formOutputs)) {
|
||||
var outputMap = JSON.parse(formOutputs);
|
||||
var keys = Object.keys(outputMap);
|
||||
outputCount = 0;
|
||||
var rows = [];
|
||||
keys.forEach(function(p) {
|
||||
var row = $("#node-label-form-output-"+p).parent();
|
||||
if (row.length === 0 && outputMap[p] !== -1) {
|
||||
row = buildLabelRow("output",p,"");
|
||||
}
|
||||
if (outputMap[p] !== -1) {
|
||||
outputCount++;
|
||||
rows.push({i:parseInt(outputMap[p]),r:row});
|
||||
}
|
||||
});
|
||||
rows.sort(function(A,B) {
|
||||
return A.i-B.i;
|
||||
})
|
||||
outputsDiv.empty();
|
||||
rows.forEach(function(r,i) {
|
||||
r.r.find("label").html((i+1)+".");
|
||||
r.r.appendTo(outputsDiv);
|
||||
})
|
||||
} else {
|
||||
outputCount = Math.max(0,parseInt(formOutputs));
|
||||
}
|
||||
children = outputsDiv.children();
|
||||
if (children.length < outputCount) {
|
||||
for (i = children.length;i<outputCount;i++) {
|
||||
buildLabelRow("output",i,"").appendTo(inputsDiv);
|
||||
buildLabelRow("output",i,"").appendTo(outputsDiv);
|
||||
}
|
||||
} else if (children.length > outputCount) {
|
||||
for (i=outputCount;i<children.length;i++) {
|
||||
$(children[i]).remove();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
function buildLabelRow(type, index, value) {
|
||||
var result = $('<div>');
|
||||
var result = $('<div>',{style:"margin: 5px 0px"});
|
||||
var id = "node-label-form-"+type+"-"+index;
|
||||
$('<label>',{for:id}).html(index+1).appendTo(result);
|
||||
$('<label>',{for:id,style:"margin-right: 20px; text-align: right; width: 30px;"}).html((index+1)+".").appendTo(result);
|
||||
$('<input>',{type:"text",id:id}).val(value).appendTo(result);
|
||||
return result;
|
||||
//' id="node-label-form-input-'+i+'">)
|
||||
@ -603,7 +626,8 @@ RED.editor = (function() {
|
||||
|
||||
|
||||
var i,row;
|
||||
var inputsDiv = $('<div class="form-row" id="node-label-form-inputs">Inputs</div>').appendTo(dialogForm);
|
||||
$('<div class="form-row"><i class="fa fa-tag"></i> <span data-i18n="editor.labelInputs"></span><div id="node-label-form-inputs"></div></div>').appendTo(dialogForm);
|
||||
var inputsDiv = $("#node-label-form-inputs");
|
||||
if (inputCount > 0) {
|
||||
for (i=0;i<inputCount;i++) {
|
||||
buildLabelRow("input",i,inputLabels[i]).appendTo(inputsDiv);
|
||||
@ -611,7 +635,8 @@ RED.editor = (function() {
|
||||
} else {
|
||||
|
||||
}
|
||||
var outputsDiv = $('<div class="form-row" id="node-label-form-outputs">Outputs</div>').appendTo(dialogForm);
|
||||
$('<div class="form-row"><i class="fa fa-tag"></i> <span data-i18n="editor.labelOutputs"></span><div id="node-label-form-outputs"></div></div>').appendTo(dialogForm);
|
||||
var outputsDiv = $("#node-label-form-outputs");
|
||||
if (outputCount > 0) {
|
||||
for (i=0;i<outputCount;i++) {
|
||||
buildLabelRow("output",i,outputLabels[i]).appendTo(outputsDiv);
|
||||
@ -743,11 +768,11 @@ RED.editor = (function() {
|
||||
}
|
||||
}
|
||||
|
||||
var newValue;
|
||||
if (editing_node._def.defaults) {
|
||||
for (d in editing_node._def.defaults) {
|
||||
if (editing_node._def.defaults.hasOwnProperty(d)) {
|
||||
var input = $("#node-input-"+d);
|
||||
var newValue;
|
||||
if (input.attr('type') === "checkbox") {
|
||||
newValue = input.prop('checked');
|
||||
} else if ("format" in editing_node._def.defaults[d] && editing_node._def.defaults[d].format !== "" && input[0].nodeName === "DIV") {
|
||||
@ -756,8 +781,42 @@ RED.editor = (function() {
|
||||
newValue = input.val();
|
||||
}
|
||||
if (newValue != null) {
|
||||
if (d === "outputs" && (newValue.trim() === "" || isNaN(newValue))) {
|
||||
continue;
|
||||
if (d === "outputs") {
|
||||
if (newValue.trim() === "") {
|
||||
continue;
|
||||
}
|
||||
if (isNaN(newValue)) {
|
||||
outputMap = JSON.parse(newValue);
|
||||
var outputCount = 0;
|
||||
var outputsChanged = false;
|
||||
var keys = Object.keys(outputMap);
|
||||
keys.forEach(function(p) {
|
||||
if (isNaN(p)) {
|
||||
// New output;
|
||||
outputCount ++;
|
||||
delete outputMap[p];
|
||||
} else {
|
||||
outputMap[p] = outputMap[p]+"";
|
||||
if (outputMap[p] !== "-1") {
|
||||
outputCount++;
|
||||
if (outputMap[p] !== p) {
|
||||
// Output moved
|
||||
outputsChanged = true;
|
||||
} else {
|
||||
delete outputMap[p];
|
||||
}
|
||||
} else {
|
||||
// Output removed
|
||||
outputsChanged = true;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
newValue = outputCount;
|
||||
if (outputsChanged) {
|
||||
changed = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
if (editing_node[d] != newValue) {
|
||||
if (editing_node._def.defaults[d].type) {
|
||||
@ -789,20 +848,30 @@ RED.editor = (function() {
|
||||
var credsChanged = updateNodeCredentials(editing_node,credDefinition,prefix);
|
||||
changed = changed || credsChanged;
|
||||
}
|
||||
if (editing_node.hasOwnProperty("_outputs")) {
|
||||
outputMap = editing_node._outputs;
|
||||
delete editing_node._outputs;
|
||||
if (Object.keys(outputMap).length > 0) {
|
||||
changed = true;
|
||||
}
|
||||
}
|
||||
// if (editing_node.hasOwnProperty("_outputs")) {
|
||||
// outputMap = editing_node._outputs;
|
||||
// delete editing_node._outputs;
|
||||
// if (Object.keys(outputMap).length > 0) {
|
||||
// changed = true;
|
||||
// }
|
||||
// }
|
||||
var removedLinks = updateNodeProperties(editing_node,outputMap);
|
||||
|
||||
var inputLabels = $("#node-label-form-inputs").children().find("input");
|
||||
var outputLabels = $("#node-label-form-outputs").children().find("input");
|
||||
|
||||
editing_node.inputLabels = inputLabels.map(function() { return $(this).val();}).toArray();
|
||||
editing_node.outputLabels = outputLabels.map(function() { return $(this).val();}).toArray();
|
||||
newValue = inputLabels.map(function() { return $(this).val();}).toArray().slice(0,editing_node.inputs);
|
||||
if (JSON.stringify(newValue) !== JSON.stringify(editing_node.inputLabels)) {
|
||||
changes.inputLabels = editing_node.inputLabels;
|
||||
editing_node.inputLabels = newValue;
|
||||
changed = true;
|
||||
}
|
||||
newValue = outputLabels.map(function() { return $(this).val();}).toArray().slice(0,editing_node.outputs);
|
||||
if (JSON.stringify(newValue) !== JSON.stringify(editing_node.outputLabels)) {
|
||||
changes.outputLabels = editing_node.outputLabels;
|
||||
editing_node.outputLabels = newValue;
|
||||
changed = true;
|
||||
}
|
||||
|
||||
if (changed) {
|
||||
var wasChanged = editing_node.changed;
|
||||
@ -872,11 +941,11 @@ RED.editor = (function() {
|
||||
singleExpanded: true
|
||||
});
|
||||
var nodeProperties = stack.add({
|
||||
title: "node properties",
|
||||
title: RED._("editor.nodeProperties"),
|
||||
expanded: true
|
||||
});
|
||||
var portLabels = stack.add({
|
||||
title: "port labels",
|
||||
title: RED._("editor.portLabels"),
|
||||
onexpand: function() {
|
||||
refreshLabelForm(this.content,node);
|
||||
}
|
||||
|
@ -22,6 +22,7 @@
|
||||
<div class="form-row">
|
||||
<label data-i18n="switch.label.property"></label>
|
||||
<input type="text" id="node-input-property" style="width: 70%"/>
|
||||
<input type="hidden" id="node-input-outputs"/>
|
||||
</div>
|
||||
<div class="form-row node-input-rule-container-row">
|
||||
<ol id="node-input-rule-container"></ol>
|
||||
@ -115,7 +116,7 @@
|
||||
var previousValueType = {value:"prev",label:this._("inject.previous"),hasValue:false};
|
||||
|
||||
$("#node-input-property").typedInput({default:this.propertyType||'msg',types:['msg','flow','global','jsonata']});
|
||||
|
||||
var outputCount = $("#node-input-outputs").val("{}");
|
||||
|
||||
var andLabel = this._("switch.and");
|
||||
var caseLabel = this._("switch.ignorecase");
|
||||
@ -157,6 +158,9 @@
|
||||
if (!rule.hasOwnProperty('t')) {
|
||||
rule.t = 'eq';
|
||||
}
|
||||
if (!opt.hasOwnProperty('i')) {
|
||||
opt._i = Math.floor((0x99999-0x10000)*Math.random()).toString(16)
|
||||
}
|
||||
var row = $('<div/>').appendTo(container);
|
||||
var row2 = $('<div/>',{style:"padding-top: 5px; padding-left: 175px;"}).appendTo(container);
|
||||
var row3 = $('<div/>',{style:"padding-top: 5px; padding-left: 102px;"}).appendTo(container);
|
||||
@ -213,21 +217,36 @@
|
||||
caseSensitive.prop('checked',false);
|
||||
}
|
||||
selectField.change();
|
||||
|
||||
var currentOutputs = JSON.parse(outputCount.val()||"{}");
|
||||
currentOutputs[opt.hasOwnProperty('i')?opt.i:opt._i] = i;
|
||||
outputCount.val(JSON.stringify(currentOutputs));
|
||||
},
|
||||
removeItem: function(opt) {
|
||||
var currentOutputs = JSON.parse(outputCount.val()||"{}");
|
||||
if (opt.hasOwnProperty('i')) {
|
||||
var removedList = $("#node-input-rule-container").data('removedList')||[];
|
||||
removedList.push(opt.i);
|
||||
$("#node-input-rule-container").data('removedList',removedList);
|
||||
currentOutputs[opt.i] = -1;
|
||||
} else {
|
||||
delete currentOutputs[opt._i];
|
||||
}
|
||||
|
||||
var rules = $("#node-input-rule-container").editableList('items');
|
||||
rules.each(function(i) { $(this).find(".node-input-rule-index").html(i+1); });
|
||||
rules.each(function(i) {
|
||||
$(this).find(".node-input-rule-index").html(i+1);
|
||||
var data = $(this).data('data');
|
||||
currentOutputs[data.hasOwnProperty('i')?data.i:data._i] = i;
|
||||
});
|
||||
outputCount.val(JSON.stringify(currentOutputs));
|
||||
},
|
||||
resizeItem: resizeRule,
|
||||
sortItems: function(rules) {
|
||||
var currentOutputs = JSON.parse(outputCount.val()||"{}");
|
||||
var rules = $("#node-input-rule-container").editableList('items');
|
||||
rules.each(function(i) { $(this).find(".node-input-rule-index").html(i+1); });
|
||||
rules.each(function(i) {
|
||||
$(this).find(".node-input-rule-index").html(i+1);
|
||||
var data = $(this).data('data');
|
||||
currentOutputs[data.hasOwnProperty('i')?data.i:data._i] = i;
|
||||
});
|
||||
outputCount.val(JSON.stringify(currentOutputs));
|
||||
},
|
||||
sortable: true,
|
||||
removable: true
|
||||
@ -243,11 +262,6 @@
|
||||
var ruleset;
|
||||
var node = this;
|
||||
node.rules = [];
|
||||
var changedOutputs = {};
|
||||
var removedList = $("#node-input-rule-container").data('removedList')||[];
|
||||
removedList.forEach(function(i) {
|
||||
changedOutputs[i] = -1;
|
||||
});
|
||||
rules.each(function(i) {
|
||||
var ruleData = $(this).data('data');
|
||||
var rule = $(this);
|
||||
@ -267,16 +281,10 @@
|
||||
r.case = rule.find(".node-input-rule-case").prop("checked");
|
||||
}
|
||||
}
|
||||
if (ruleData.hasOwnProperty('i')) {
|
||||
if (ruleData.i !== i) {
|
||||
changedOutputs[ruleData.i] = i;
|
||||
}
|
||||
}
|
||||
node.rules.push(r);
|
||||
});
|
||||
this._outputs = changedOutputs;
|
||||
this.outputs = node.rules.length;
|
||||
this.propertyType = $("#node-input-property").typedInput('type');
|
||||
console.log(JSON.parse($("#node-input-outputs").val()||"{}"));
|
||||
},
|
||||
oneditresize: function(size) {
|
||||
var rows = $("#dialog-form>div:not(.node-input-rule-container-row)");
|
||||
|
@ -185,6 +185,11 @@
|
||||
"editNode": "Edit __type__ node",
|
||||
"editConfig": "Edit __type__ config node",
|
||||
"addNewType": "Add new __type__...",
|
||||
"nodeProperties": "node properties",
|
||||
"portLabels": "port labels",
|
||||
"labelInputs": "Inputs",
|
||||
"labelOutputs": "Outputs",
|
||||
|
||||
"errors": {
|
||||
"scopeChange": "Changing the scope will make it unavailable to nodes in other flows that use it"
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user