Skip to content

Commit

Permalink
Display parent subflow properties in edit dialog
Browse files Browse the repository at this point in the history
  • Loading branch information
knolleary committed Feb 5, 2019
1 parent 79f3669 commit 2a8f0a4
Show file tree
Hide file tree
Showing 2 changed files with 113 additions and 34 deletions.
Expand Up @@ -277,6 +277,10 @@
"deleteSubflow": "delete subflow",
"info": "Description",
"category": "Category",
"env": {
"restore": "Restore to subflow default",
"remove": "Remove environment variable"
},
"errors": {
"noNodesSelected": "<strong>Cannot create subflow</strong>: no nodes selected",
"multipleInputsToSelection": "<strong>Cannot create subflow</strong>: multiple inputs to selection"
Expand Down
143 changes: 109 additions & 34 deletions packages/node_modules/@node-red/editor-client/src/js/ui/editor.js
Expand Up @@ -550,54 +550,129 @@ RED.editor = (function() {
.editableList({
addItem: function(container, i, opt) {
var row = $('<div/>').appendTo(container);
var nameField = $('<input/>', {
class: "node-input-env-name",
type: "text",
style: "margin-left: 5px; width: calc(40% - 5px)",
placeholder: RED._("common.label.name")
}).appendTo(row);
if (opt.parent) {
$('<div/>', {
class:"uneditable-input",
style: "margin-left: 5px; width: calc(40% - 8px)",
}).appendTo(row).text(opt.name);
} else {
$('<input/>', {
class: "node-input-env-name",
type: "text",
style: "margin-left: 5px; width: calc(40% - 8px)",
placeholder: RED._("common.label.name")
}).appendTo(row).val(opt.name);
}
var valueField = $('<input/>',{
class: "node-input-env-value",
type: "text",
style: "margin-left: 5px; width: calc(60% - 5px)"
style: "margin-left: 5px; width: calc(60% - 8px)"
}).appendTo(row)

valueField.typedInput({default:'str',
types:['str','num','bool','json','bin','re','date']
});
if (opt) {
nameField.val(opt.name);
valueField.typedInput('type', opt.type);
valueField.typedInput('value', opt.value);

valueField.typedInput('type', opt.parent?(opt.type||opt.parent.type):opt.type);
valueField.typedInput('value', opt.parent?(opt.value||opt.parent.value):opt.value);

var actionButton = $('<a/>',{href:"#",class:"red-ui-editableList-item-remove editor-button editor-button-small"}).appendTo(container);
$('<i/>',{class:"fa "+(opt.parent?"fa-reply":"fa-remove")}).appendTo(actionButton);
container.parent().addClass("red-ui-editableList-item-removable");
if (opt.parent) {
if (opt.value && (opt.value !== opt.parent.value || opt.type !== opt.parent.type)) {
actionButton.show();
} else {
actionButton.hide();
}
var restoreTip = RED.popover.tooltip(actionButton,RED._("subflow.env.restore"));
valueField.change(function(evt) {
var newType = valueField.typedInput('type');
var newValue = valueField.typedInput('value');
if (newType === opt.parent.type && newValue === opt.parent.value) {
actionButton.hide();
} else {
actionButton.show();
}
})
actionButton.click(function(evt) {
evt.preventDefault();
restoreTip.close();
valueField.typedInput('type', opt.parent.type);
valueField.typedInput('value', opt.parent.value);
})
} else {
var removeTip = RED.popover.tooltip(actionButton,RED._("subflow.env.remove"));
actionButton.click(function(evt) {
evt.preventDefault();
removeTip.close();
container.parent().addClass("red-ui-editableList-item-deleting")
container.fadeOut(300, function() {
env_container.editableList('removeItem',opt);
});
});
}
},
sortable: true,
removable: true
sortable: false,
removable: false
});
var envs = node.env;
if (envs) {
for (var i = 0; i < envs.length; i++) {
var env = envs[i];
env_container.editableList('addItem', env);
var parentEnv = {};
var envList = [];
if (/^subflow:/.test(node.type)) {
var subflowDef = RED.nodes.subflow(node.type.substring(8));
if (subflowDef.env) {
subflowDef.env.forEach(function(env) {
var item = {
name:env.name,
parent: {
type: env.type,
value: env.value
}
}
envList.push(item);
parentEnv[env.name] = item;
})
}
}

if (node.env) {
for (var i = 0; i < node.env.length; i++) {
var env = node.env[i];
if (parentEnv.hasOwnProperty(env.name)) {
parentEnv[env.name].type = env.type;
parentEnv[env.name].value = env.value;
} else {
envList.push({
name: env.name,
type: env.type,
value: env.value
});
}
}
}
envList.forEach(function(env) {
env_container.editableList('addItem', env);
})
}

function convEnv(editable_list) {
if (editable_list) {
function exportEnvList(list) {
if (list) {
var env = [];
editable_list.each(function(i) {
list.each(function(i) {
var entry = $(this);
var nf = entry.find(".node-input-env-name");
var vf = entry.find(".node-input-env-value");
var name = nf.val();
var value = vf.typedInput("value");
var type = vf.typedInput("type");
var item = {
name: name,
type: type,
value: value
};
env.push(item);
var item = entry.data('data');
var name = item.parent?item.name:entry.find(".node-input-env-name").val();
var valueInput = entry.find(".node-input-env-value");
var value = valueInput.typedInput("value");
var type = valueInput.typedInput("type");
if (!item.parent || (item.parent.value !== value || item.parent.type !== type)) {
var item = {
name: name,
type: type,
value: value
};
env.push(item);
}
});
return env;
}
Expand Down Expand Up @@ -1343,7 +1418,7 @@ RED.editor = (function() {

if (type === "subflow") {
var old_env = editing_node.env;
var new_env = convEnv($("#node-input-env-container").editableList("items"));
var new_env = exportEnvList($("#node-input-env-container").editableList("items"));
if (!isSameEnv(old_env, new_env)) {
editing_node.env = new_env;
changes.env = editing_node.env;
Expand Down Expand Up @@ -2070,7 +2145,7 @@ RED.editor = (function() {
}

var old_env = editing_node.env;
var new_env = convEnv($("#node-input-env-container").editableList("items"));
var new_env = exportEnvList($("#node-input-env-container").editableList("items"));
if (!isSameEnv(old_env, new_env)) {
editing_node.env = new_env;
changes.env = editing_node.env;
Expand Down

0 comments on commit 2a8f0a4

Please sign in to comment.