From 87ac831c8ae0d8e0bff1ec37a606aa047ee34a9d Mon Sep 17 00:00:00 2001 From: Nick O'Leary Date: Thu, 2 Sep 2021 21:59:30 +0100 Subject: [PATCH] Simplify edit pane api --- .../editor-client/src/js/ui/editor.js | 36 +++++------ .../src/js/ui/editors/panes/appearance.js | 12 ++-- .../src/js/ui/editors/panes/description.js | 10 ++-- .../js/ui/editors/panes/envVarProperties.js | 10 ++-- .../src/js/ui/editors/panes/flowProperties.js | 26 ++++---- .../src/js/ui/editors/panes/properties.js | 40 ++++++------- .../src/js/ui/editors/panes/subflowModule.js | 10 ++-- .../js/ui/editors/panes/subflowProperties.js | 60 ------------------- 8 files changed, 72 insertions(+), 132 deletions(-) delete mode 100644 packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/subflowProperties.js diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editor.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editor.js index d03203e6d..4799de739 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/editor.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editor.js @@ -442,10 +442,10 @@ RED.editor = (function() { var editPaneDefinition = editPanes[id]; if (editPaneDefinition) { if (typeof editPaneDefinition === 'function') { - editPaneDefinition = editPaneDefinition.call(editPaneDefinition); + editPaneDefinition = editPaneDefinition.call(editPaneDefinition, node); } var editPaneContent = $('
', {class:"red-ui-tray-content"}).appendTo(editorContent).hide(); - editPaneDefinition.create.call(editPaneDefinition,editPaneContent,node); + editPaneDefinition.create.call(editPaneDefinition,editPaneContent); var editTab = { id: id, label: editPaneDefinition.label, @@ -454,7 +454,7 @@ RED.editor = (function() { content: editPaneContent, onchange: function() { if (editPaneDefinition.show) { - editPaneDefinition.show.call(editPaneDefinition,node) + editPaneDefinition.show.call(editPaneDefinition) } } } @@ -876,7 +876,7 @@ RED.editor = (function() { activeEditPanes.forEach(function(pane) { if (pane.apply) { - pane.apply.call(pane, editing_node, editState); + pane.apply.call(pane, editState); } }) @@ -952,7 +952,7 @@ RED.editor = (function() { var size = {width:form.width(),height:form.height()}; activeEditPanes.forEach(function(pane) { if (pane.resize) { - pane.resize.call(pane,editing_node, size); + pane.resize.call(pane, size); } }) }, @@ -1001,7 +1001,7 @@ RED.editor = (function() { activeEditPanes.forEach(function(pane) { if (pane.close) { - pane.close.call(pane,editing_node); + pane.close.call(pane); } }) @@ -1079,7 +1079,7 @@ RED.editor = (function() { var size = {width:form.width(),height:form.height()}; activeEditPanes.forEach(function(pane) { if (pane.resize) { - pane.resize.call(pane, editing_config_node, size); + pane.resize.call(pane, size); } }) }, @@ -1168,7 +1168,7 @@ RED.editor = (function() { activeEditPanes.forEach(function(pane) { if (pane.close) { - pane.close.call(pane,editing_config_node); + pane.close.call(pane); } }) @@ -1274,7 +1274,7 @@ RED.editor = (function() { activeEditPanes.forEach(function(pane) { if (pane.apply) { - pane.apply.call(pane, editing_config_node, editState); + pane.apply.call(pane, editState); } }) @@ -1441,7 +1441,7 @@ RED.editor = (function() { activeEditPanes.forEach(function(pane) { if (pane.apply) { - pane.apply.call(pane, editing_node, editState); + pane.apply.call(pane, editState); } }) @@ -1524,7 +1524,7 @@ RED.editor = (function() { var size = {width:form.width(),height:form.height()}; activeEditPanes.forEach(function(pane) { if (pane.resize) { - pane.resize.call(pane,editing_node, size); + pane.resize.call(pane, size); } }) }, @@ -1567,7 +1567,7 @@ RED.editor = (function() { RED.workspaces.refresh(); activeEditPanes.forEach(function(pane) { if (pane.close) { - pane.close.call(pane,editing_node); + pane.close.call(pane); } }) editStack.pop(); @@ -1613,7 +1613,7 @@ RED.editor = (function() { activeEditPanes.forEach(function(pane) { if (pane.apply) { - pane.apply.call(pane, editing_node, editState); + pane.apply.call(pane, editState); } }) @@ -1644,7 +1644,7 @@ RED.editor = (function() { var size = {width:form.width(),height:form.height()}; activeEditPanes.forEach(function(pane) { if (pane.resize) { - pane.resize.call(pane,editing_node, size); + pane.resize.call(pane, size); } }) }, @@ -1676,7 +1676,7 @@ RED.editor = (function() { RED.sidebar.info.refresh(editing_node); activeEditPanes.forEach(function(pane) { if (pane.close) { - pane.close.call(pane,editing_node); + pane.close.call(pane); } }) editStack.pop(); @@ -1730,7 +1730,7 @@ RED.editor = (function() { activeEditPanes.forEach(function(pane) { if (pane.apply) { - pane.apply.call(pane, workspace, editState); + pane.apply.call(pane, editState); } }) @@ -1773,7 +1773,7 @@ RED.editor = (function() { var size = {width:form.width(),height:form.height()}; activeEditPanes.forEach(function(pane) { if (pane.resize) { - pane.resize.call(pane,editing_node, size); + pane.resize.call(pane, size); } }) }, @@ -1811,7 +1811,7 @@ RED.editor = (function() { } activeEditPanes.forEach(function(pane) { if (pane.close) { - pane.close.call(pane,editing_node); + pane.close.call(pane); } }) var selection = RED.view.selection(); diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/appearance.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/appearance.js index faca319e2..8d32aa7ab 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/appearance.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/appearance.js @@ -1,11 +1,11 @@ ;(function() { - RED.editor.registerEditorPane("editor-tab-appearance", function() { + RED.editor.registerEditorPane("editor-tab-appearance", function(node) { return { label: RED._("editor-tab.appearance"), name: RED._("editor-tab.appearance"), iconClass: "fa fa-object-group", - create: function(container, node) { + create: function(container) { this.content = container; buildAppearanceForm(this.content,node); @@ -21,16 +21,16 @@ } } }, - resize: function(node, size) { + resize: function(size) { }, - close: function(node) { + close: function() { }, - show: function(node) { + show: function() { refreshLabelForm(this.content, node); }, - apply: function(node, editState) { + apply: function(editState) { if (updateLabels(node, editState.changes, editState.outputMap)) { editState.changed = true; } diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/description.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/description.js index 3163ff23d..cc126dde0 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/description.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/description.js @@ -1,26 +1,26 @@ ;(function() { - RED.editor.registerEditorPane("editor-tab-description", function() { + RED.editor.registerEditorPane("editor-tab-description", function(node) { return { label: RED._("editor-tab.description"), name: RED._("editor-tab.description"), iconClass: "fa fa-file-text-o", - create: function(container, node) { + create: function(container) { this.editor = buildDescriptionForm(container,node); RED.e = this.editor; }, - resize: function(node, size) { + resize: function(size) { this.editor.resize(); }, - close: function(node) { + close: function() { this.editor.destroy(); this.editor = null; }, show: function() { this.editor.focus(); }, - apply: function(node, editState) { + apply: function(editState) { var oldInfo = node.info; var newInfo = this.editor.getValue(); if (!!oldInfo) { diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/envVarProperties.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/envVarProperties.js index 77a00365a..19d7415ce 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/envVarProperties.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/envVarProperties.js @@ -1,23 +1,23 @@ ;(function() { - RED.editor.registerEditorPane("editor-tab-envProperties", function() { + RED.editor.registerEditorPane("editor-tab-envProperties", function(node) { return { label: RED._("editor-tab.envProperties"), name: RED._("editor-tab.envProperties"), iconClass: "fa fa-list", - create: function(container, node) { + create: function(container) { var form = $('
').appendTo(container); var listContainer = $('
').appendTo(form); this.list = $('
    ').appendTo(listContainer); RED.editor.envVarList.create(this.list, node); }, - resize: function(node, size) { + resize: function(size) { this.list.editableList('height',size.height); }, - close: function(node) { + close: function() { }, - apply: function(node, editState) { + apply: function(editState) { var old_env = node.env; var new_env = []; if (/^subflow:/.test(node.type)) { diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/flowProperties.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/flowProperties.js index cd0d2250d..69a4c209c 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/flowProperties.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/flowProperties.js @@ -1,11 +1,11 @@ ;(function() { - RED.editor.registerEditorPane("editor-tab-flow-properties", function() { + RED.editor.registerEditorPane("editor-tab-flow-properties", function(node) { return { label: RED._("editor-tab.properties"), name: RED._("editor-tab.properties"), iconClass: "fa fa-cog", - create: function(container, node) { + create: function(container) { var dialogForm = $('
    ').appendTo(container); $('
    '+ ''+ @@ -29,30 +29,30 @@ RED.text.bidi.prepareInput($("#node-input-name")); this.tabflowEditor.getSession().setValue(node.info || "", -1); }, - resize: function(node, size) { + resize: function(size) { $("#node-input-info").css("height", (size.height-70)+"px"); this.tabflowEditor.resize(); }, - close: function(node) { + close: function() { this.tabflowEditor.destroy(); }, - apply: function(workspace, editState) { + apply: function(editState) { var label = $( "#node-input-name" ).val(); - if (workspace.label != label) { - editState.changes.label = workspace.label; + if (node.label != label) { + editState.changes.label = node.label; editState.changed = true; - workspace.label = label; + node.label = label; } var info = this.tabflowEditor.getValue(); - if (workspace.info !== info) { - editState.changes.info = workspace.info; + if (node.info !== info) { + editState.changes.info = node.info; editState.changed = true; - workspace.info = info; + node.info = info; } - $("#red-ui-tab-"+(workspace.id.replace(".","-"))).toggleClass('red-ui-workspace-disabled',!!workspace.disabled); - $("#red-ui-workspace").toggleClass("red-ui-workspace-disabled",!!workspace.disabled); + $("#red-ui-tab-"+(node.id.replace(".","-"))).toggleClass('red-ui-workspace-disabled',!!node.disabled); + $("#red-ui-workspace").toggleClass("red-ui-workspace-disabled",!!node.disabled); } } diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/properties.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/properties.js index ab3efbd65..230c711ee 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/properties.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/properties.js @@ -1,11 +1,11 @@ ;(function() { - RED.editor.registerEditorPane("editor-tab-properties", function() { + RED.editor.registerEditorPane("editor-tab-properties", function(node) { return { label: RED._("editor-tab.properties"), name: RED._("editor-tab.properties"), iconClass: "fa fa-cog", - create: function(container, node) { + create: function(container) { var nodeType = node.type; if (node.type === "subflow") { @@ -29,7 +29,7 @@ } RED.editor.buildEditForm(container,formStyle,nodeType,i18nNamespace,node); }, - resize: function(node, size) { + resize: function(size) { if (node && node._def.oneditresize) { try { node._def.oneditresize.call(node,size); @@ -38,15 +38,15 @@ } } }, - close: function(node) { + close: function() { }, - apply: function(editing_node, editState) { + apply: function(editState) { var newValue; var d; - if (editing_node._def.defaults) { - for (d in editing_node._def.defaults) { - if (editing_node._def.defaults.hasOwnProperty(d)) { + if (node._def.defaults) { + for (d in node._def.defaults) { + if (node._def.defaults.hasOwnProperty(d)) { var input = $("#"+this.inputClass+"-"+d); if (input.attr('type') === "checkbox") { newValue = input.prop('checked'); @@ -57,7 +57,7 @@ if (newValue == null) { newValue = []; } - } else if ("format" in editing_node._def.defaults[d] && editing_node._def.defaults[d].format !== "" && input[0].nodeName === "DIV") { + } else if ("format" in node._def.defaults[d] && node._def.defaults[d].format !== "" && input[0].nodeName === "DIV") { newValue = input.text(); } else { newValue = input.val(); @@ -102,37 +102,37 @@ newValue = parseInt(newValue); } } - if (editing_node._def.defaults[d].type) { + if (node._def.defaults[d].type) { if (newValue == "_ADD_") { newValue = ""; } } - if (editing_node[d] != newValue) { - if (editing_node._def.defaults[d].type) { + if (node[d] != newValue) { + if (node._def.defaults[d].type) { // Change to a related config node - var configNode = RED.nodes.node(editing_node[d]); + var configNode = RED.nodes.node(node[d]); if (configNode) { var users = configNode.users; - users.splice(users.indexOf(editing_node),1); + users.splice(users.indexOf(node),1); RED.events.emit("nodes:change",configNode); } configNode = RED.nodes.node(newValue); if (configNode) { - configNode.users.push(editing_node); + configNode.users.push(node); RED.events.emit("nodes:change",configNode); } } - editState.changes[d] = editing_node[d]; - editing_node[d] = newValue; + editState.changes[d] = node[d]; + node[d] = newValue; editState.changed = true; } } } } } - if (editing_node._def.credentials) { - var credDefinition = editing_node._def.credentials; - var credsChanged = updateNodeCredentials(editing_node,credDefinition,this.inputClass); + if (node._def.credentials) { + var credDefinition = node._def.credentials; + var credsChanged = updateNodeCredentials(node,credDefinition,this.inputClass); editState.changed = editState.changed || credsChanged; } } diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/subflowModule.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/subflowModule.js index dba482625..8d83807af 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/subflowModule.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/subflowModule.js @@ -30,20 +30,20 @@ '
    '+ ''; - RED.editor.registerEditorPane("editor-tab-subflow-module", function() { + RED.editor.registerEditorPane("editor-tab-subflow-module", function(node) { return { label: RED._("editor-tab.module"), name: RED._("editor-tab.module"), iconClass: "fa fa-cube", - create: function(container, node) { + create: function(container) { buildModuleForm(container, node); }, - resize: function(node, size) { + resize: function(size) { }, - close: function(node) { + close: function() { }, - apply: function(node, editState) { + apply: function(editState) { var newMeta = exportSubflowModuleProperties(node); if (!isSameObj(node.meta,newMeta)) { editState.changes.meta = node.meta; diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/subflowProperties.js b/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/subflowProperties.js deleted file mode 100644 index 33d7c43ff..000000000 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/editors/panes/subflowProperties.js +++ /dev/null @@ -1,60 +0,0 @@ -;(function() { - - RED.editor.registerEditorPane("editor-tab-subflow-properties", function() { - return { - label: RED._("editor-tab.properties"), - name: RED._("editor-tab.properties"), - iconClass: "fa fa-cog", - create: function(container, node) { - var dialogForm = $('
    ').appendTo(container); - $('
    '+ - ''+ - ''+ - '
    ').appendTo(dialogForm); - - var row = $('
    '+ - ''+ - '
    '+ - '
    ').appendTo(dialogForm); - this.tabflowEditor = RED.editor.createEditor({ - id: 'node-input-info', - mode: 'ace/mode/markdown', - value: "" - }); - - $('').prependTo(dialogForm); - dialogForm.on("submit", function(e) { e.preventDefault();}); - - $("#node-input-name").val(node.label); - RED.text.bidi.prepareInput($("#node-input-name")); - this.tabflowEditor.getSession().setValue(node.info || "", -1); - }, - resize: function(node, size) { - $("#node-input-info").css("height", (size.height-70)+"px"); - this.tabflowEditor.resize(); - }, - close: function(node) { - this.tabflowEditor.destroy(); - }, - apply: function(workspace, editState) { - var label = $( "#node-input-name" ).val(); - - if (workspace.label != label) { - editState.changes.label = workspace.label; - editState.changed = true; - workspace.label = label; - } - - var info = this.tabflowEditor.getValue(); - if (workspace.info !== info) { - editState.changes.info = workspace.info; - editState.changed = true; - workspace.info = info; - } - $("#red-ui-tab-"+(workspace.id.replace(".","-"))).toggleClass('red-ui-workspace-disabled',!!workspace.disabled); - $("#red-ui-workspace").toggleClass("red-ui-workspace-disabled",!!workspace.disabled); - - } - } - }); -})();