Keep port label form in sync with output reordering

This commit is contained in:
Nick O'Leary 2017-02-07 22:30:54 +00:00
parent e7e3ed4923
commit 185b16a858
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
4 changed files with 135 additions and 53 deletions

View File

@ -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;
}
}

View File

@ -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);
}

View File

@ -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)");

View File

@ -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"
}