Edit panes should not need to create own tray content div

This commit is contained in:
Nick O'Leary 2021-09-02 21:44:06 +01:00
parent c3d0b1114f
commit 4e92492165
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
8 changed files with 27 additions and 31 deletions

View File

@ -26,7 +26,7 @@ RED.editor = (function() {
var customEditTypes = {};
var editPanes = {};
var filteredEditPanes = [];
var filteredEditPanes = {};
var editTrayWidthCache = {};
@ -414,10 +414,10 @@ RED.editor = (function() {
element:editorTabEl,
onchange:function(tab) {
editorContent.children().hide();
tab.content.show();
if (tab.onchange) {
tab.onchange.call(tab);
}
tab.content.show();
if (finishedBuilding) {
RED.tray.resize();
}
@ -427,6 +427,16 @@ RED.editor = (function() {
});
var activeEditPanes = [];
nodeEditPanes = nodeEditPanes.slice();
for (var i in filteredEditPanes) {
if (filteredEditPanes.hasOwnProperty(i)) {
if (filteredEditPanes[i](node)) {
nodeEditPanes.push(i);
}
}
}
nodeEditPanes.forEach(function(id) {
try {
var editPaneDefinition = editPanes[id];
@ -434,15 +444,17 @@ RED.editor = (function() {
if (typeof editPaneDefinition === 'function') {
editPaneDefinition = editPaneDefinition.call(editPaneDefinition);
}
var editPaneContent = $('<div>', {class:"red-ui-tray-content"}).appendTo(editorContent).hide();
editPaneDefinition.create.call(editPaneDefinition,editPaneContent,node);
var editTab = {
id: id,
label: editPaneDefinition.label,
name: editPaneDefinition.name,
iconClass: editPaneDefinition.iconClass,
content: editPaneDefinition.create.call(editPaneDefinition,editorContent,node).hide(),
content: editPaneContent,
onchange: function() {
if (editPaneDefinition.onchange) {
editPaneDefinition.onchange.call(editPaneDefinition,node)
if (editPaneDefinition.show) {
editPaneDefinition.show.call(editPaneDefinition,node)
}
}
}
@ -1901,10 +1913,9 @@ RED.editor = (function() {
registerEditorPane: function(type, definition, filter) {
if (filter) {
filteredEditPanes.push({type, definition, filter})
} else {
editPanes[type] = definition;
filteredEditPanes[type] = filter
}
editPanes[type] = definition;
}
}
})();

View File

@ -6,7 +6,7 @@
name: RED._("editor-tab.appearance"),
iconClass: "fa fa-object-group",
create: function(container, node) {
this.content = $('<div>', {class:"red-ui-tray-content"}).appendTo(container);
this.content = container;
buildAppearanceForm(this.content,node);
if (node.type === 'subflow') {
@ -20,7 +20,6 @@
this.isDefaultIcon = true;
}
}
return this.content;
},
resize: function(node, size) {

View File

@ -7,9 +7,8 @@
iconClass: "fa fa-file-text-o",
create: function(container, node) {
var content = $('<div>', {class:"red-ui-tray-content"}).appendTo(container);
this.editor = buildDescriptionForm(content,node);
return content;
this.editor = buildDescriptionForm(container,node);
RED.e = this.editor;
},
resize: function(node, size) {
this.editor.resize();

View File

@ -6,12 +6,10 @@
name: RED._("editor-tab.envProperties"),
iconClass: "fa fa-list",
create: function(container, node) {
var content = $('<div>', {class:"red-ui-tray-content"}).appendTo(container);
var form = $('<form class="dialog-form form-horizontal"></form>').appendTo(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);
this.list = $('<ol></ol>').appendTo(listContainer);
RED.editor.envVarList.create(this.list, node);
return content;
},
resize: function(node, size) {
this.list.editableList('height',size.height);

View File

@ -6,9 +6,7 @@
name: RED._("editor-tab.properties"),
iconClass: "fa fa-cog",
create: function(container, node) {
var content = $('<div>', {class:"red-ui-tray-content"}).appendTo(container);
var dialogForm = $('<form id="dialog-form" class="form-horizontal"></form>').appendTo(content);
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">'+
@ -30,7 +28,6 @@
$("#node-input-name").val(node.label);
RED.text.bidi.prepareInput($("#node-input-name"));
this.tabflowEditor.getSession().setValue(node.info || "", -1);
return content;
},
resize: function(node, size) {
$("#node-input-info").css("height", (size.height-70)+"px");

View File

@ -6,7 +6,6 @@
name: RED._("editor-tab.properties"),
iconClass: "fa fa-cog",
create: function(container, node) {
var content = $('<div>', {class:"red-ui-tray-content"}).appendTo(container);
var nodeType = node.type;
if (node.type === "subflow") {
@ -28,9 +27,7 @@
this.inputClass = "node-config-input";
formStyle = "node-config-dialog-edit-form";
}
RED.editor.buildEditForm(content,formStyle,nodeType,i18nNamespace,node);
return content;
RED.editor.buildEditForm(container,formStyle,nodeType,i18nNamespace,node);
},
resize: function(node, size) {
if (node && node._def.oneditresize) {

View File

@ -36,9 +36,7 @@
name: RED._("editor-tab.module"),
iconClass: "fa fa-cube",
create: function(container, node) {
var content = $('<div>', {class:"red-ui-tray-content"}).appendTo(container);
buildModuleForm(content, node);
return content;
buildModuleForm(container, node);
},
resize: function(node, size) {
},

View File

@ -6,9 +6,7 @@
name: RED._("editor-tab.properties"),
iconClass: "fa fa-cog",
create: function(container, node) {
var content = $('<div>', {class:"red-ui-tray-content"}).appendTo(container);
var dialogForm = $('<form id="dialog-form" class="form-horizontal"></form>').appendTo(content);
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">'+
@ -30,7 +28,6 @@
$("#node-input-name").val(node.label);
RED.text.bidi.prepareInput($("#node-input-name"));
this.tabflowEditor.getSession().setValue(node.info || "", -1);
return content;
},
resize: function(node, size) {
$("#node-input-info").css("height", (size.height-70)+"px");