frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2025-03-01 10:36:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

add support of environtment variable for tab & group

Browse Source
This commit is contained in:
Hiroyasu Nishiyama
2021-08-19 21:15:13 +09:00
parent f1e7ec0c6b
commit 6aecc3915c
15 changed files with 673 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
packages/node_modules/@node-red/editor-client/src/js/nodes.js vendored
View File

@@ -53,7 +53,8 @@ RED.nodes = (function() {
defaults: {
label: {value:""},
disabled: {value: false},
info: {value: ""}
info: {value: ""},
env: {value: []}
}
};
@@ -1387,7 +1388,8 @@ RED.nodes = (function() {
type: "tab",
disabled: false,
label: RED._("clipboard.recoveredNodes"),
info: RED._("clipboard.recoveredNodesInfo")
info: RED._("clipboard.recoveredNodesInfo"),
env: []
}
addWorkspace(recoveryWorkspace);
RED.workspaces.add(recoveryWorkspace);
@@ -1518,7 +1520,7 @@ RED.nodes = (function() {
// Add a tab if there isn't one there already
if (defaultWorkspace == null) {
defaultWorkspace = { type:"tab", id:getID(), disabled: false, info:"", label:RED._('workspace.defaultName',{number:1})};
defaultWorkspace = { type:"tab", id:getID(), disabled: false, info:"", label:RED._('workspace.defaultName',{number:1}), env:[]};
addWorkspace(defaultWorkspace);
RED.workspaces.add(defaultWorkspace);
new_workspaces.push(defaultWorkspace);

45
packages/node_modules/@node-red/editor-client/src/js/ui/editor.js vendored
View File

@@ -2637,6 +2637,28 @@ var buildingEditDialog = false;
}
}
}
{
var old_env = editing_node.env;
var new_env = RED.subflow.exportSubflowInstanceEnv(editing_node);
if (new_env && new_env.length > 0) {
new_env.forEach(function(prop) {
if (prop.type === "cred") {
editing_node.credentials = editing_node.credentials || {_:{}};
editing_node.credentials[prop.name] = prop.value;
editing_node.credentials['has_'+prop.name] = (prop.value !== "");
if (prop.value !== '__PWRD__') {
changed = true;
}
delete prop.value;
}
});
}
if (!isSameObj(old_env, new_env)) {
editing_node.env = new_env;
changes.env = editing_node.env;
changed = true;
}
}
if (changed) {
var wasChanged = editing_node.changed;
editing_node.changed = true;
@@ -2668,6 +2690,16 @@ var buildingEditDialog = false;
// console.log("oneditresize",editing_node.id,editing_node.type,err.toString());
// }
// }
var envContainer = $("#red-ui-editor-group-env-list");
if (envContainer.length) {
var rows = $("#dialog-form>div:not(#group-env-tabs-content)");
var height = size.height;
for (var i=0; i<rows.size(); i++) {
height -= $(rows[i]).outerHeight(true);
}
$("#red-ui-editor-group-env-list").editableList('height',height-30);
}
},
open: function(tray, done) {
var trayFooter = tray.find(".red-ui-tray-footer");
@@ -2707,6 +2739,18 @@ var buildingEditDialog = false;
editorTabs.addTab(nodePropertiesTab);
var groupPropertiesTab = {
id: "editor-group-envProperties",
label: RED._("editor-tab.envProperties"),
name: RED._("editor-tab.envProperties"),
content: $('<div>', {
id: "editor-group-envProperties-content",
class: "red-ui-tray-content"
}).appendTo(editorContent).hide(),
iconClass: "fa fa-list",
};
editorTabs.addTab(groupPropertiesTab);
var descriptionTab = {
id: "editor-tab-description",
label: RED._("editor-tab.description"),
@@ -2725,6 +2769,7 @@ var buildingEditDialog = false;
buildingEditDialog = false;
done();
});
},
close: function() {
if (RED.view.state() != RED.state.IMPORT_DRAGGING) {

7
packages/node_modules/@node-red/editor-client/src/js/ui/group.js vendored
View File

@@ -87,14 +87,18 @@ RED.group = (function() {
"label-position": "nw"
};
var groupDef = {
defaults:{
name:{value:""},
style:{value:{label:true}},
nodes:{value:[]}
nodes:{value:[]},
env: {value:[]},
},
category: "config",
oneditprepare: function() {
RED.subflow.buildPropertiesForm(this);
var style = this.style || {};
RED.colorPicker.create({
id:"node-input-style-stroke",
@@ -144,7 +148,6 @@ RED.group = (function() {
})
$("#node-input-style-label").prop("checked", this.style.label)
$("#node-input-style-label").trigger("change");
},
oneditresize: function(size) {
},

62
packages/node_modules/@node-red/editor-client/src/js/ui/subflow.js vendored
View File

@@ -980,6 +980,9 @@ RED.subflow = (function() {
function buildPropertiesList(envContainer, node) {
var isTemplateNode = (node.type === "subflow");
var isGroup = (node.type === "group");
var isTab = (node.type === "tab");
var kind = isGroup ? "group" : (isTab ? "tab" : "subflow");
if (isTemplateNode) {
buildEnvControl(envContainer, node);
@@ -1841,27 +1844,30 @@ RED.subflow = (function() {
function exportSubflowInstanceEnv(node) {
var env = [];
var isGroup = (node.type === "group");
var isTab = (node.type === "tab");
// First, get the values for the SubflowTemplate defined properties
// - these are the ones with custom UI elements
var parentEnv = getSubflowInstanceParentEnv(node);
parentEnv.forEach(function(data) {
var item;
var ui = data.ui || {};
if (!ui.type) {
if (data.parent && data.parent.type === "cred") {
ui.type = "cred";
if (!isGroup && !isTab) {
// First, get the values for the SubflowTemplate defined properties
// - these are the ones with custom UI elements
var parentEnv = getSubflowInstanceParentEnv(node);
parentEnv.forEach(function(data) {
var item;
var ui = data.ui || {};
if (!ui.type) {
if (data.parent && data.parent.type === "cred") {
ui.type = "cred";
} else {
ui.type = "input";
ui.opts = {types:DEFAULT_ENV_TYPE_LIST}
}
} else {
ui.type = "input";
ui.opts = {types:DEFAULT_ENV_TYPE_LIST}
ui.opts = ui.opts || {};
}
} else {
ui.opts = ui.opts || {};
}
var input = $("#"+getSubflowEnvPropertyName(data.name));
if (input.length || ui.type === "cred") {
item = { name: data.name };
switch(ui.type) {
var input = $("#"+getSubflowEnvPropertyName(data.name));
if (input.length || ui.type === "cred") {
item = { name: data.name };
switch(ui.type) {
case "input":
if (ui.opts.types && ui.opts.types.length > 0) {
item.value = input.typedInput('value');
@@ -1887,14 +1893,16 @@ RED.subflow = (function() {
item.type = 'bool';
item.value = ""+input.prop("checked");
break;
}
if (ui.type === "cred" || item.type !== data.parent.type || item.value !== data.parent.value) {
env.push(item);
}
}
if (ui.type === "cred" || item.type !== data.parent.type || item.value !== data.parent.value) {
env.push(item);
}
}
})
})
}
// Second, get the values from the Properties table tab
var items = $('#red-ui-editor-subflow-env-list').editableList('items');
var kind = isGroup ? "group" : (isTab ? "tab" : "subflow");
var items = $("#red-ui-editor-"+kind+"-env-list").editableList('items');
items.each(function (i,el) {
var data = el.data('data');
var item;
@@ -1947,11 +1955,13 @@ RED.subflow = (function() {
buildEnvUI($("#subflow-input-ui"), getSubflowInstanceParentEnv(node), node);
}
}
function buildPropertiesForm(node) {
var container = $('#editor-subflow-envProperties-content');
var kind = (node.type === "group") ? "group" : ((node.type === "tab") ? "tab": "subflow");
var container = $("#editor-"+kind+"-envProperties-content");
var form = $('<form class="dialog-form form-horizontal"></form>').appendTo(container);
var listContainer = $('<div class="form-row node-input-env-container-row"></div>').appendTo(form);
var list = $('<ol id="red-ui-editor-subflow-env-list" class="red-ui-editor-subflow-env-list"></ol>').appendTo(listContainer);
var list = $('<ol id="red-ui-editor-'+kind+'-env-list" class="red-ui-editor-subflow-env-list"></ol>').appendTo(listContainer);
buildPropertiesList(list, node);
}

169
packages/node_modules/@node-red/editor-client/src/js/ui/workspaces.js vendored
View File

@@ -23,6 +23,9 @@ RED.workspaces = (function() {
var viewStack = [];
var viewStackPos = 0;
function isSameObj(env0, env1) {
return (JSON.stringify(env0) === JSON.stringify(env1));
}
function addToViewStack(id) {
if (viewStackPos !== viewStack.length) {
@@ -43,7 +46,7 @@ RED.workspaces = (function() {
workspaceIndex += 1;
} while ($("#red-ui-workspace-tabs a[title='"+RED._('workspace.defaultName',{number:workspaceIndex})+"']").size() !== 0);
ws = {type:"tab",id:tabId,disabled: false,info:"",label:RED._('workspace.defaultName',{number:workspaceIndex})};
ws = {type:"tab",id:tabId,disabled: false,info:"",label:RED._('workspace.defaultName',{number:workspaceIndex}),env:[]};
RED.nodes.addWorkspace(ws,targetIndex);
workspace_tabs.addTab(ws,targetIndex);
workspace_tabs.activateTab(tabId);
@@ -55,6 +58,7 @@ RED.workspaces = (function() {
RED.view.focus();
return ws;
}
function deleteWorkspace(ws) {
if (workspaceTabCount === 1) {
return;
@@ -71,6 +75,51 @@ RED.workspaces = (function() {
RED.sidebar.config.refresh();
}
var tabflowEditor;
function buildProperties(container, workspace) {
var dialogForm = $('<form id="dialog-form" class="form-horizontal"></form>').appendTo(container);
$('<div class="form-row">'+
'<label for="node-input-name" data-i18n="[append]editor:common.label.name"><i class="fa fa-tag"></i> </label>'+
'<input type="text" id="node-input-name" data-i18n="[placeholder]common.label.name">'+
'</div>').appendTo(dialogForm);
var row = $('<div class="form-row node-text-editor-row">'+
'<label for="node-input-info" data-i18n="editor:workspace.info" style="width:300px;"></label>'+
'<div style="min-height:250px;" class="node-text-editor" id="node-input-info"></div>'+
'</div>').appendTo(dialogForm);
tabflowEditor = RED.editor.createEditor({
id: 'node-input-info',
mode: 'ace/mode/markdown',
value: ""
});
$('#node-info-input-info-expand').on("click", function(e) {
e.preventDefault();
var value = tabflowEditor.getValue();
RED.editor.editMarkdown({
value: value,
width: "Infinity",
cursor: tabflowEditor.getCursorPosition(),
complete: function(v,cursor) {
tabflowEditor.setValue(v, -1);
tabflowEditor.gotoLine(cursor.row+1,cursor.column,false);
setTimeout(function() {
tabflowEditor.focus();
},300);
}
})
});
$('<input type="text" style="display: none;" />').prependTo(dialogForm);
dialogForm.on("submit", function(e) { e.preventDefault();});
$("#node-input-name").val(workspace.label);
RED.text.bidi.prepareInput($("#node-input-name"));
tabflowEditor.getSession().setValue(workspace.info || "", -1);
dialogForm.i18n();
}
function showEditWorkspaceDialog(id) {
var workspace = RED.nodes.workspace(id);
if (!workspace) {
@@ -81,7 +130,6 @@ RED.workspaces = (function() {
return;
}
RED.view.state(RED.state.EDITING);
var tabflowEditor;
var trayOptions = {
title: RED._("workspace.editFlow",{name:RED.utils.sanitize(workspace.label)}),
buttons: [
@@ -130,6 +178,28 @@ RED.workspaces = (function() {
$("#red-ui-tab-"+(workspace.id.replace(".","-"))).toggleClass('red-ui-workspace-disabled',!!workspace.disabled);
$("#red-ui-workspace").toggleClass("red-ui-workspace-disabled",!!workspace.disabled);
var old_env = workspace.env;
var new_env = RED.subflow.exportSubflowInstanceEnv(workspace);
console.log("; NE", new_env);
if (new_env && (new_env.length > 0)) {
new_env.forEach(function(prop) {
if (prop.type === "cred") {
workspace.credentials = workspace.credentials || {_:{}};
workspace.credentials[prop.name] = prop.value;
workspace.credentials['has_'+prop.name] = (prop.value !== "");
if (prop.value !== '__PWRD__') {
changed = true;
}
delete prop.value;
}
});
}
if (!isSameObj(old_env, new_env)) {
workspace.env = new_env;
changes.env = old_env;
changed = true;
}
if (changed) {
var historyEvent = {
t: "edit",
@@ -156,27 +226,67 @@ RED.workspaces = (function() {
}
],
resize: function(dimensions) {
var height = dimensions.height;
var rows = $("#dialog-form>div:not(.node-text-editor-row)");
var editorRow = $("#dialog-form>div.node-text-editor-row");
var height = $("#dialog-form").height();
for (var i=0; i<rows.size(); i++) {
height -= $(rows[i]).outerHeight(true);
}
height -= (parseInt($("#dialog-form").css("marginTop"))+parseInt($("#dialog-form").css("marginBottom")));
$(".node-text-editor").css("height",height+"px");
var editorHeight = height -(parseInt($("#dialog-form").css("marginTop"))+parseInt($("#dialog-form").css("marginBottom"))) -100;
$(".node-text-editor").css("height", editorHeight+"px");
tabflowEditor.resize();
$("#red-ui-editor-tab-env-list").editableList("height", height -70);
},
open: function(tray) {
var trayFooter = tray.find(".red-ui-tray-footer");
var trayBody = tray.find('.red-ui-tray-body');
var trayFooterLeft = $('<div class="red-ui-tray-footer-left"></div>').appendTo(trayFooter)
var dialogForm = $('<form id="dialog-form" class="form-horizontal"></form>').appendTo(trayBody);
$('<div class="form-row">'+
'<label for="node-input-name" data-i18n="[append]editor:common.label.name"><i class="fa fa-tag"></i> </label>'+
'<input type="text" id="node-input-name" data-i18n="[placeholder]common.label.name">'+
'</div>').appendTo(dialogForm);
var editorTabEl = $('<ul></ul>').appendTo(trayBody);
var editorContent = $('<div></div>').appendTo(trayBody);
var finishedBuilding = false;
var editorTabs = RED.tabs.create({
element:editorTabEl,
onchange:function(tab) {
editorContent.children().hide();
if (tab.onchange) {
tab.onchange.call(tab);
}
tab.content.show();
if (finishedBuilding) {
RED.tray.resize();
}
},
collapsible: true,
menu: false
});
var nodePropertiesTab = {
id: "editor-tab-properties",
label: RED._("editor-tab.properties"),
name: RED._("editor-tab.properties"),
content: $('<div>', {class:"red-ui-tray-content"}).appendTo(editorContent).hide(),
iconClass: "fa fa-cog"
};
buildProperties(nodePropertiesTab.content, workspace);
editorTabs.addTab(nodePropertiesTab);
var tabPropertiesTab = {
id: "editor-tab-envProperties",
label: RED._("editor-tab.envProperties"),
name: RED._("editor-tab.envProperties"),
content: $('<div>', {
id: "editor-tab-envProperties-content",
class: "red-ui-tray-content"
}).appendTo(editorContent).hide(),
iconClass: "fa fa-list",
};
RED.subflow.buildPropertiesForm(workspace);
editorTabs.addTab(tabPropertiesTab);
if (!workspace.hasOwnProperty("disabled")) {
workspace.disabled = false;
@@ -187,43 +297,8 @@ RED.workspaces = (function() {
disabledIcon: "fa-ban",
invertState: true
})
var row = $('<div class="form-row node-text-editor-row">'+
'<label for="node-input-info" data-i18n="editor:workspace.info" style="width:300px;"></label>'+
'<div style="min-height:250px;" class="node-text-editor" id="node-input-info"></div>'+
'</div>').appendTo(dialogForm);
tabflowEditor = RED.editor.createEditor({
id: 'node-input-info',
mode: 'ace/mode/markdown',
value: ""
});
$('#node-info-input-info-expand').on("click", function(e) {
e.preventDefault();
var value = tabflowEditor.getValue();
RED.editor.editMarkdown({
value: value,
width: "Infinity",
cursor: tabflowEditor.getCursorPosition(),
complete: function(v,cursor) {
tabflowEditor.setValue(v, -1);
tabflowEditor.gotoLine(cursor.row+1,cursor.column,false);
setTimeout(function() {
tabflowEditor.focus();
},300);
}
})
});
$('<input type="text" style="display: none;" />').prependTo(dialogForm);
dialogForm.on("submit", function(e) { e.preventDefault();});
$("#node-input-name").val(workspace.label);
RED.text.bidi.prepareInput($("#node-input-name"));
tabflowEditor.getSession().setValue(workspace.info || "", -1);
dialogForm.i18n();
finishedBuilding = true;
RED.tray.resize();
},
close: function() {
if (RED.view.state() != RED.state.IMPORT_DRAGGING) {