frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00
Code Issues Releases Wiki Activity

Basic node label editor

Browse Source
This commit is contained in:
Nick O'Leary 2017-02-06 13:23:42 +00:00
parent 47df5476ba
commit e7e3ed4923
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
5 changed files with 116 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
editor/js/nodes.js
View File

@ -431,6 +431,7 @@ RED.nodes = (function() {
node.id = n.id;
node.type = n.type;
node.z = n.z;
if (node.type == "unknown") {
for (var p in n._orig) {
if (n._orig.hasOwnProperty(p)) {
@ -478,6 +479,14 @@ RED.nodes = (function() {
node.wires[w.sourcePort].push(w.target.id);
}
}
var labelCount;
if (n.inputs > 0 && n.inputLabels && !/^\s*$/.test(n.inputLabels.join(""))) {
node.inputLabels = n.inputLabels.slice();
}
if (n.outputs > 0 && n.outputLabels && !/^\s*$/.test(n.outputLabels.join(""))) {
node.outputLabels = n.outputLabels.slice();
}
}
return node;
}
@ -893,7 +902,17 @@ RED.nodes = (function() {
if (n.type !== "workspace" && n.type !== "tab" && n.type !== "subflow") {
def = registry.getNodeType(n.type);
if (!def || def.category != "config") {
var node = {x:n.x,y:n.y,z:n.z,type:0,wires:n.wires,changed:false,_config:{}};
var node = {
x:n.x,
y:n.y,
z:n.z,
type:0,
wires:n.wires,
inputLabels: n.inputLabels,
outputLabels: n.outputLabels,
changed:false,
_config:{}
};
if (createNewIds) {
if (subflow_blacklist[n.z]) {
continue;

3
editor/js/ui/common/stack.js
View File

@ -62,6 +62,9 @@ RED.stack = (function() {
};
entry.expand = function() {
if (!entry.isExpanded()) {
if (entry.onexpand) {
entry.onexpand.call(entry);
}
icon.addClass("expanded");
entry.content.slideDown(200);
return true;

93
editor/js/ui/editor.js
View File

@ -548,6 +548,79 @@ RED.editor = (function() {
return dialogForm;
}
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 children = inputsDiv.children();
if (children.length < inputCount) {
for (i = children.length;i<inputCount;i++) {
buildLabelRow("input",i,"").appendTo(inputsDiv);
}
} else if (children.length > inputCount) {
for (i=inputCount;i<children.length;i++) {
$(children[i]).remove();
}
}
var children = outputsDiv.children();
if (children.length < outputCount) {
for (i = children.length;i<outputCount;i++) {
buildLabelRow("output",i,"").appendTo(inputsDiv);
}
} else if (children.length > outputCount) {
for (i=outputCount;i<children.length;i++) {
$(children[i]).remove();
}
}
}
function buildLabelRow(type, index, value) {
var result = $('<div>');
var id = "node-label-form-"+type+"-"+index;
$('<label>',{for:id}).html(index+1).appendTo(result);
$('<input>',{type:"text",id:id}).val(value).appendTo(result);
return result;
//' id="node-label-form-input-'+i+'">)
}
function buildLabelForm(container,node) {
var dialogForm = $('<form class="dialog-form form-horizontal" autocomplete="off"></form>').appendTo(container);
var inputCount = node.inputs || node._def.inputs || 0;
var outputCount = node.outputs || node._def.outputs || 0;
var inputLabels = node.inputLabels || [];
var outputLabels = node.outputLabels || [];
var i,row;
var inputsDiv = $('<div class="form-row" id="node-label-form-inputs">Inputs</div>').appendTo(dialogForm);
if (inputCount > 0) {
for (i=0;i<inputCount;i++) {
buildLabelRow("input",i,inputLabels[i]).appendTo(inputsDiv);
}
} else {
}
var outputsDiv = $('<div class="form-row" id="node-label-form-outputs">Outputs</div>').appendTo(dialogForm);
if (outputCount > 0) {
for (i=0;i<outputCount;i++) {
buildLabelRow("output",i,outputLabels[i]).appendTo(outputsDiv);
}
} else {
}
}
function showEditDialog(node) {
var editing_node = node;
editStack.push(node);
@ -724,6 +797,13 @@ RED.editor = (function() {
}
}
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();
if (changed) {
var wasChanged = editing_node.changed;
editing_node.changed = true;
@ -773,7 +853,7 @@ RED.editor = (function() {
resize: function(dimensions) {
editTrayWidthCache[type] = dimensions.width;
$(".editor-tray-content").height(dimensions.height - 78);
var form = $("#dialog-form").height(dimensions.height - 78 - 40);
var form = $(".editor-tray-content form").height(dimensions.height - 78 - 40);
if (editing_node && editing_node._def.oneditresize) {
try {
editing_node._def.oneditresize.call(editing_node,{width:form.width(),height:form.height()});
@ -793,10 +873,13 @@ RED.editor = (function() {
});
var nodeProperties = stack.add({
title: "node properties",
expanded: true,
expanded: true
});
var portLabels = stack.add({
title: "port labels"
title: "port labels",
onexpand: function() {
refreshLabelForm(this.content,node);
}
});
if (editing_node) {
@ -808,7 +891,9 @@ RED.editor = (function() {
} else {
ns = node._def.set.id;
}
var dialogForm = buildEditForm(nodeProperties.content,"dialog-form",type,ns);
buildEditForm(nodeProperties.content,"dialog-form",type,ns);
buildLabelForm(portLabels.content,node);
prepareEditDialog(node,node._def,"node-input");
trayBody.i18n();
},

4
editor/js/ui/view.js
View File

@ -1487,6 +1487,10 @@ RED.view = (function() {
function getPortLabel(node,portType,portIndex) {
var result;
var nodePortLabels = (portType === PORT_TYPE_INPUT)?node.inputLabels:node.outputLabels;
if (nodePortLabels && nodePortLabels[portIndex]) {
return nodePortLabels[portIndex];
}
var portLabels = (portType === PORT_TYPE_INPUT)?node._def.inputLabels:node._def.outputLabels;
if (typeof portLabels === 'string') {
result = portLabels;

11
editor/sass/editor.scss
View File

@ -216,17 +216,6 @@
padding: 0 5px;
}
.dialog-form {
.button-group {
.editor-button {
&:first-child {
}
}
}
}
#node-config-dialog-scope-container {
cursor: auto;
float: right;