mirror of
https://github.com/node-red/node-red.git
synced 2023-10-10 13:36:53 +02:00
Namespace type editors CSS
This commit is contained in:
parent
bc540eefb6
commit
b98e85016a
@ -21,6 +21,7 @@ RED.panels = (function() {
|
|||||||
var container = options.container || $("#"+options.id);
|
var container = options.container || $("#"+options.id);
|
||||||
var children = container.children();
|
var children = container.children();
|
||||||
if (children.length !== 2) {
|
if (children.length !== 2) {
|
||||||
|
console.log(options.id);
|
||||||
throw new Error("Container must have exactly two children");
|
throw new Error("Container must have exactly two children");
|
||||||
}
|
}
|
||||||
var vertical = (!options.dir || options.dir === "vertical");
|
var vertical = (!options.dir || options.dir === "vertical");
|
||||||
|
@ -720,8 +720,8 @@ RED.editor = (function() {
|
|||||||
var inputPlaceholder = node._def.inputLabels?RED._("editor.defaultLabel"):RED._("editor.noDefaultLabel");
|
var inputPlaceholder = node._def.inputLabels?RED._("editor.defaultLabel"):RED._("editor.noDefaultLabel");
|
||||||
var outputPlaceholder = node._def.outputLabels?RED._("editor.defaultLabel"):RED._("editor.noDefaultLabel");
|
var outputPlaceholder = node._def.outputLabels?RED._("editor.defaultLabel"):RED._("editor.noDefaultLabel");
|
||||||
|
|
||||||
var inputsDiv = $("#node-label-form-inputs");
|
var inputsDiv = $("#red-ui-editor-node-label-form-inputs");
|
||||||
var outputsDiv = $("#node-label-form-outputs");
|
var outputsDiv = $("#red-ui-editor-node-label-form-outputs");
|
||||||
|
|
||||||
var inputCount;
|
var inputCount;
|
||||||
if (node.type === 'subflow') {
|
if (node.type === 'subflow') {
|
||||||
@ -732,7 +732,7 @@ RED.editor = (function() {
|
|||||||
|
|
||||||
var children = inputsDiv.children();
|
var children = inputsDiv.children();
|
||||||
var childCount = children.length;
|
var childCount = children.length;
|
||||||
if (childCount === 1 && $(children[0]).hasClass('node-label-form-none')) {
|
if (childCount === 1 && $(children[0]).hasClass('red-ui-editor-node-label-form-none')) {
|
||||||
childCount--;
|
childCount--;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -768,14 +768,14 @@ RED.editor = (function() {
|
|||||||
var keys = Object.keys(outputMap);
|
var keys = Object.keys(outputMap);
|
||||||
children = outputsDiv.children();
|
children = outputsDiv.children();
|
||||||
childCount = children.length;
|
childCount = children.length;
|
||||||
if (childCount === 1 && $(children[0]).hasClass('node-label-form-none')) {
|
if (childCount === 1 && $(children[0]).hasClass('red-ui-editor-node-label-form-none')) {
|
||||||
childCount--;
|
childCount--;
|
||||||
}
|
}
|
||||||
|
|
||||||
outputCount = 0;
|
outputCount = 0;
|
||||||
var rows = [];
|
var rows = [];
|
||||||
keys.forEach(function(p) {
|
keys.forEach(function(p) {
|
||||||
var row = $("#node-label-form-output-"+p).parent();
|
var row = $("#red-ui-editor-node-label-form-output-"+p).parent();
|
||||||
if (row.length === 0 && outputMap[p] !== -1) {
|
if (row.length === 0 && outputMap[p] !== -1) {
|
||||||
if (childCount === 0) {
|
if (childCount === 0) {
|
||||||
$(children[0]).remove();
|
$(children[0]).remove();
|
||||||
@ -807,7 +807,7 @@ RED.editor = (function() {
|
|||||||
}
|
}
|
||||||
children = outputsDiv.children();
|
children = outputsDiv.children();
|
||||||
childCount = children.length;
|
childCount = children.length;
|
||||||
if (childCount === 1 && $(children[0]).hasClass('node-label-form-none')) {
|
if (childCount === 1 && $(children[0]).hasClass('red-ui-editor-node-label-form-none')) {
|
||||||
childCount--;
|
childCount--;
|
||||||
}
|
}
|
||||||
if (childCount < outputCount) {
|
if (childCount < outputCount) {
|
||||||
@ -828,13 +828,13 @@ RED.editor = (function() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
function buildLabelRow(type, index, value, placeHolder) {
|
function buildLabelRow(type, index, value, placeHolder) {
|
||||||
var result = $('<div>',{class:"node-label-form-row"});
|
var result = $('<div>',{class:"red-ui-editor-node-label-form-row"});
|
||||||
if (type === undefined) {
|
if (type === undefined) {
|
||||||
$('<span>').text(RED._("editor.noDefaultLabel")).appendTo(result);
|
$('<span>').text(RED._("editor.noDefaultLabel")).appendTo(result);
|
||||||
result.addClass("node-label-form-none");
|
result.addClass("red-ui-editor-node-label-form-none");
|
||||||
} else {
|
} else {
|
||||||
result.addClass("");
|
result.addClass("");
|
||||||
var id = "node-label-form-"+type+"-"+index;
|
var id = "red-ui-editor-node-label-form-"+type+"-"+index;
|
||||||
$('<label>',{for:id}).text((index+1)+".").appendTo(result);
|
$('<label>',{for:id}).text((index+1)+".").appendTo(result);
|
||||||
var input = $('<input>',{type:"text",id:id, placeholder: placeHolder}).val(value).appendTo(result);
|
var input = $('<input>',{type:"text",id:id, placeholder: placeHolder}).val(value).appendTo(result);
|
||||||
var clear = $('<button type="button" class="editor-button editor-button-small"><i class="fa fa-times"></i></button>').appendTo(result);
|
var clear = $('<button type="button" class="editor-button editor-button-small"><i class="fa fa-times"></i></button>').appendTo(result);
|
||||||
@ -977,7 +977,7 @@ RED.editor = (function() {
|
|||||||
var iconRow = $('<div class="form-row"></div>').appendTo(dialogForm);
|
var iconRow = $('<div class="form-row"></div>').appendTo(dialogForm);
|
||||||
$('<label data-i18n="editor.settingIcon">').appendTo(iconRow);
|
$('<label data-i18n="editor.settingIcon">').appendTo(iconRow);
|
||||||
|
|
||||||
var iconButton = $('<button type="button" class="editor-button" id="node-settings-icon-button">').appendTo(iconRow);
|
var iconButton = $('<button type="button" class="editor-button" id="red-ui-editor-node-icon-button">').appendTo(iconRow);
|
||||||
|
|
||||||
var nodeDiv = $('<div>',{class:"red-ui-search-result-node"}).appendTo(iconButton);
|
var nodeDiv = $('<div>',{class:"red-ui-search-result-node"}).appendTo(iconButton);
|
||||||
var colour = RED.utils.getNodeColor(node.type, node._def);
|
var colour = RED.utils.getNodeColor(node.type, node._def);
|
||||||
@ -989,19 +989,19 @@ RED.editor = (function() {
|
|||||||
iconButton.on("click", function(e) {
|
iconButton.on("click", function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
var iconPath;
|
var iconPath;
|
||||||
var icon = $("#node-settings-icon").text()||"";
|
var icon = $("#red-ui-editor-node-icon").text()||"";
|
||||||
if (icon) {
|
if (icon) {
|
||||||
iconPath = RED.utils.separateIconPath(icon);
|
iconPath = RED.utils.separateIconPath(icon);
|
||||||
} else {
|
} else {
|
||||||
iconPath = RED.utils.getDefaultNodeIcon(node._def, node);
|
iconPath = RED.utils.getDefaultNodeIcon(node._def, node);
|
||||||
}
|
}
|
||||||
showIconPicker(iconRow,node,iconPath,function(newIcon) {
|
showIconPicker(iconRow,node,iconPath,function(newIcon) {
|
||||||
$("#node-settings-icon").text(newIcon||"");
|
$("#red-ui-editor-node-icon").text(newIcon||"");
|
||||||
var icon_url = RED.utils.getNodeIcon(node._def,{type:node.type,icon:newIcon});
|
var icon_url = RED.utils.getNodeIcon(node._def,{type:node.type,icon:newIcon});
|
||||||
RED.utils.createIconElement(icon_url, iconContainer, true);
|
RED.utils.createIconElement(icon_url, iconContainer, true);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
$('<div id="node-settings-icon">').text(node.icon).appendTo(iconButton);
|
$('<div id="red-ui-editor-node-icon">').text(node.icon).appendTo(iconButton);
|
||||||
}
|
}
|
||||||
|
|
||||||
$('<div class="form-row"><span data-i18n="editor.portLabels"></span></div>').appendTo(dialogForm);
|
$('<div class="form-row"><span data-i18n="editor.portLabels"></span></div>').appendTo(dialogForm);
|
||||||
@ -1019,8 +1019,8 @@ RED.editor = (function() {
|
|||||||
var inputPlaceholder = node._def.inputLabels?RED._("editor.defaultLabel"):RED._("editor.noDefaultLabel");
|
var inputPlaceholder = node._def.inputLabels?RED._("editor.defaultLabel"):RED._("editor.noDefaultLabel");
|
||||||
var outputPlaceholder = node._def.outputLabels?RED._("editor.defaultLabel"):RED._("editor.noDefaultLabel");
|
var outputPlaceholder = node._def.outputLabels?RED._("editor.defaultLabel"):RED._("editor.noDefaultLabel");
|
||||||
|
|
||||||
$('<div class="form-row"><span style="margin-left: 50px;" data-i18n="editor.labelInputs"></span><div id="node-label-form-inputs"></div></div>').appendTo(dialogForm);
|
$('<div class="form-row"><span style="margin-left: 50px;" data-i18n="editor.labelInputs"></span><div id="red-ui-editor-node-label-form-inputs"></div></div>').appendTo(dialogForm);
|
||||||
var inputsDiv = $("#node-label-form-inputs");
|
var inputsDiv = $("#red-ui-editor-node-label-form-inputs");
|
||||||
if (inputCount > 0) {
|
if (inputCount > 0) {
|
||||||
for (i=0;i<inputCount;i++) {
|
for (i=0;i<inputCount;i++) {
|
||||||
buildLabelRow("input",i,inputLabels[i],inputPlaceholder).appendTo(inputsDiv);
|
buildLabelRow("input",i,inputLabels[i],inputPlaceholder).appendTo(inputsDiv);
|
||||||
@ -1028,8 +1028,8 @@ RED.editor = (function() {
|
|||||||
} else {
|
} else {
|
||||||
buildLabelRow().appendTo(inputsDiv);
|
buildLabelRow().appendTo(inputsDiv);
|
||||||
}
|
}
|
||||||
$('<div class="form-row"><span style="margin-left: 50px;" data-i18n="editor.labelOutputs"></span><div id="node-label-form-outputs"></div></div>').appendTo(dialogForm);
|
$('<div class="form-row"><span style="margin-left: 50px;" data-i18n="editor.labelOutputs"></span><div id="red-ui-editor-node-label-form-outputs"></div></div>').appendTo(dialogForm);
|
||||||
var outputsDiv = $("#node-label-form-outputs");
|
var outputsDiv = $("#red-ui-editor-node-label-form-outputs");
|
||||||
if (outputCount > 0) {
|
if (outputCount > 0) {
|
||||||
for (i=0;i<outputCount;i++) {
|
for (i=0;i<outputCount;i++) {
|
||||||
buildLabelRow("output",i,outputLabels[i],outputPlaceholder).appendTo(outputsDiv);
|
buildLabelRow("output",i,outputLabels[i],outputPlaceholder).appendTo(outputsDiv);
|
||||||
@ -1040,8 +1040,8 @@ RED.editor = (function() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function updateLabels(editing_node, changes, outputMap) {
|
function updateLabels(editing_node, changes, outputMap) {
|
||||||
var inputLabels = $("#node-label-form-inputs").children().find("input");
|
var inputLabels = $("#red-ui-editor-node-label-form-inputs").children().find("input");
|
||||||
var outputLabels = $("#node-label-form-outputs").children().find("input");
|
var outputLabels = $("#red-ui-editor-node-label-form-outputs").children().find("input");
|
||||||
|
|
||||||
var hasNonBlankLabel = false;
|
var hasNonBlankLabel = false;
|
||||||
var changed = false;
|
var changed = false;
|
||||||
@ -1059,7 +1059,7 @@ RED.editor = (function() {
|
|||||||
hasNonBlankLabel = false;
|
hasNonBlankLabel = false;
|
||||||
newValue = new Array(editing_node.outputs);
|
newValue = new Array(editing_node.outputs);
|
||||||
outputLabels.each(function() {
|
outputLabels.each(function() {
|
||||||
var index = $(this).attr('id').substring(23); // node-label-form-output-<index>
|
var index = $(this).attr('id').substring(23); // red-ui-editor-node-label-form-output-<index>
|
||||||
if (outputMap && outputMap.hasOwnProperty(index)) {
|
if (outputMap && outputMap.hasOwnProperty(index)) {
|
||||||
index = parseInt(outputMap[index]);
|
index = parseInt(outputMap[index]);
|
||||||
if (index === -1) {
|
if (index === -1) {
|
||||||
@ -1326,7 +1326,7 @@ RED.editor = (function() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (!editing_node._def.defaults || !editing_node._def.defaults.hasOwnProperty("icon")) {
|
if (!editing_node._def.defaults || !editing_node._def.defaults.hasOwnProperty("icon")) {
|
||||||
var icon = $("#node-settings-icon").text()||""
|
var icon = $("#red-ui-editor-node-icon").text()||""
|
||||||
if (!isDefaultIcon) {
|
if (!isDefaultIcon) {
|
||||||
if (icon !== editing_node.icon) {
|
if (icon !== editing_node.icon) {
|
||||||
changes.icon = editing_node.icon;
|
changes.icon = editing_node.icon;
|
||||||
@ -1663,11 +1663,11 @@ RED.editor = (function() {
|
|||||||
var trayHeader = tray.find(".red-ui-tray-header");
|
var trayHeader = tray.find(".red-ui-tray-header");
|
||||||
var trayBody = tray.find('.red-ui-tray-body');
|
var trayBody = tray.find('.red-ui-tray-body');
|
||||||
var trayFooter = tray.find(".red-ui-tray-footer");
|
var trayFooter = tray.find(".red-ui-tray-footer");
|
||||||
|
var userCountDiv;
|
||||||
if (node_def.hasUsers !== false) {
|
if (node_def.hasUsers !== false) {
|
||||||
trayFooter.prepend('<div id="node-config-dialog-user-count"><i class="fa fa-info-circle"></i> <span></span></div>');
|
userCountDiv = $('<div class="red-ui-tray-footer-left"><i class="fa fa-info-circle"></i> <span></span></div>').prependTo(trayFooter);
|
||||||
}
|
}
|
||||||
trayFooter.append('<span id="node-config-dialog-scope-container"><span id="node-config-dialog-scope-warning" data-i18n="[title]editor.errors.scopeChange"><i class="fa fa-warning"></i></span><select id="node-config-dialog-scope"></select></span>');
|
trayFooter.append('<span class="red-ui-tray-footer-right"><span id="red-ui-editor-config-scope-warning" data-i18n="[title]editor.errors.scopeChange"><i class="fa fa-warning"></i></span><select id="red-ui-editor-config-scope"></select></span>');
|
||||||
|
|
||||||
var editorTabEl = $('<ul></ul>').appendTo(trayBody);
|
var editorTabEl = $('<ul></ul>').appendTo(trayBody);
|
||||||
var editorContent = $('<div></div>').appendTo(trayBody);
|
var editorContent = $('<div></div>').appendTo(trayBody);
|
||||||
@ -1715,18 +1715,18 @@ RED.editor = (function() {
|
|||||||
|
|
||||||
prepareEditDialog(editing_config_node,node_def,"node-config-input", function() {
|
prepareEditDialog(editing_config_node,node_def,"node-config-input", function() {
|
||||||
if (editing_config_node._def.exclusive) {
|
if (editing_config_node._def.exclusive) {
|
||||||
$("#node-config-dialog-scope").hide();
|
$("#red-ui-editor-config-scope").hide();
|
||||||
} else {
|
} else {
|
||||||
$("#node-config-dialog-scope").show();
|
$("#red-ui-editor-config-scope").show();
|
||||||
}
|
}
|
||||||
$("#node-config-dialog-scope-warning").hide();
|
$("#red-ui-editor-config-scope-warning").hide();
|
||||||
|
|
||||||
var nodeUserFlows = {};
|
var nodeUserFlows = {};
|
||||||
editing_config_node.users.forEach(function(n) {
|
editing_config_node.users.forEach(function(n) {
|
||||||
nodeUserFlows[n.z] = true;
|
nodeUserFlows[n.z] = true;
|
||||||
});
|
});
|
||||||
var flowCount = Object.keys(nodeUserFlows).length;
|
var flowCount = Object.keys(nodeUserFlows).length;
|
||||||
var tabSelect = $("#node-config-dialog-scope").empty();
|
var tabSelect = $("#red-ui-editor-config-scope").empty();
|
||||||
tabSelect.off("change");
|
tabSelect.off("change");
|
||||||
tabSelect.append('<option value=""'+(!editing_config_node.z?" selected":"")+' data-i18n="sidebar.config.global"></option>');
|
tabSelect.append('<option value=""'+(!editing_config_node.z?" selected":"")+' data-i18n="sidebar.config.global"></option>');
|
||||||
tabSelect.append('<option disabled data-i18n="sidebar.config.flows"></option>');
|
tabSelect.append('<option disabled data-i18n="sidebar.config.flows"></option>');
|
||||||
@ -1750,17 +1750,17 @@ RED.editor = (function() {
|
|||||||
var newScope = $(this).val();
|
var newScope = $(this).val();
|
||||||
if (newScope === '') {
|
if (newScope === '') {
|
||||||
// global scope - everyone can use it
|
// global scope - everyone can use it
|
||||||
$("#node-config-dialog-scope-warning").hide();
|
$("#red-ui-editor-config-scope-warning").hide();
|
||||||
} else if (!nodeUserFlows[newScope] || flowCount > 1) {
|
} else if (!nodeUserFlows[newScope] || flowCount > 1) {
|
||||||
// a user will loose access to it
|
// a user will loose access to it
|
||||||
$("#node-config-dialog-scope-warning").show();
|
$("#red-ui-editor-config-scope-warning").show();
|
||||||
} else {
|
} else {
|
||||||
$("#node-config-dialog-scope-warning").hide();
|
$("#red-ui-editor-config-scope-warning").hide();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
if (node_def.hasUsers !== false) {
|
if (node_def.hasUsers !== false && userCountDiv) {
|
||||||
$("#node-config-dialog-user-count").find("span").text(RED._("editor.nodesUse", {count:editing_config_node.users.length})).parent().show();
|
userCountDiv.find("span").text(RED._("editor.nodesUse", {count:editing_config_node.users.length})).parent().show();
|
||||||
}
|
}
|
||||||
trayBody.i18n();
|
trayBody.i18n();
|
||||||
trayFooter.i18n();
|
trayFooter.i18n();
|
||||||
@ -1826,7 +1826,7 @@ RED.editor = (function() {
|
|||||||
var configTypeDef = RED.nodes.getType(configType);
|
var configTypeDef = RED.nodes.getType(configType);
|
||||||
var d;
|
var d;
|
||||||
var input;
|
var input;
|
||||||
var scope = $("#node-config-dialog-scope").val();
|
var scope = $("#red-ui-editor-config-scope").val();
|
||||||
|
|
||||||
if (configTypeDef.oneditsave) {
|
if (configTypeDef.oneditsave) {
|
||||||
try {
|
try {
|
||||||
@ -2118,7 +2118,7 @@ RED.editor = (function() {
|
|||||||
if (updateLabels(editing_node, changes, null)) {
|
if (updateLabels(editing_node, changes, null)) {
|
||||||
changed = true;
|
changed = true;
|
||||||
}
|
}
|
||||||
var icon = $("#node-settings-icon").text()||"";
|
var icon = $("#red-ui-editor-node-icon").text()||"";
|
||||||
if ((editing_node.icon === undefined && icon !== "node-red/subflow.png") ||
|
if ((editing_node.icon === undefined && icon !== "node-red/subflow.png") ||
|
||||||
(editing_node.icon !== undefined && editing_node.icon !== icon)) {
|
(editing_node.icon !== undefined && editing_node.icon !== icon)) {
|
||||||
changes.icon = editing_node.icon;
|
changes.icon = editing_node.icon;
|
||||||
@ -2342,7 +2342,7 @@ RED.editor = (function() {
|
|||||||
function createEditor(options) {
|
function createEditor(options) {
|
||||||
var el = options.element || $("#"+options.id)[0];
|
var el = options.element || $("#"+options.id)[0];
|
||||||
var toolbarRow = $("<div>").appendTo(el);
|
var toolbarRow = $("<div>").appendTo(el);
|
||||||
el = $("<div>").appendTo(el).addClass("node-text-editor-container")[0];
|
el = $("<div>").appendTo(el).addClass("red-ui-editor-text-container")[0];
|
||||||
var editor = ace.edit(el);
|
var editor = ace.edit(el);
|
||||||
editor.setTheme("ace/theme/tomorrow");
|
editor.setTheme("ace/theme/tomorrow");
|
||||||
var session = editor.getSession();
|
var session = editor.getSession();
|
||||||
@ -2392,7 +2392,7 @@ RED.editor = (function() {
|
|||||||
},100);
|
},100);
|
||||||
}
|
}
|
||||||
if (options.mode === 'ace/mode/markdown') {
|
if (options.mode === 'ace/mode/markdown') {
|
||||||
$(el).addClass("node-text-editor-container-toolbar");
|
$(el).addClass("red-ui-editor-text-container-toolbar");
|
||||||
editor.toolbar = customEditTypes['_markdown'].buildToolbar(toolbarRow,editor);
|
editor.toolbar = customEditTypes['_markdown'].buildToolbar(toolbarRow,editor);
|
||||||
if (options.expandable !== false) {
|
if (options.expandable !== false) {
|
||||||
var expandButton = $('<button type="button" class="editor-button" style="float: right;"><i class="fa fa-expand"></i></button>').appendTo(editor.toolbar);
|
var expandButton = $('<button type="button" class="editor-button" style="float: right;"><i class="fa fa-expand"></i></button>').appendTo(editor.toolbar);
|
||||||
@ -2414,7 +2414,7 @@ RED.editor = (function() {
|
|||||||
})
|
})
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
var helpButton = $('<button type="button" class="node-text-editor-help editor-button editor-button-small"><i class="fa fa-question"></i></button>').appendTo($(el).parent());
|
var helpButton = $('<button type="button" class="red-ui-editor-text-help editor-button editor-button-small"><i class="fa fa-question"></i></button>').appendTo($(el).parent());
|
||||||
RED.popover.create({
|
RED.popover.create({
|
||||||
target: helpButton,
|
target: helpButton,
|
||||||
trigger: 'click',
|
trigger: 'click',
|
||||||
|
@ -15,7 +15,7 @@
|
|||||||
**/
|
**/
|
||||||
(function() {
|
(function() {
|
||||||
|
|
||||||
var template = '<script type="text/x-red" data-template-name="_buffer"><div id="node-input-buffer-panels"><div id="node-input-buffer-panel-str" class="red-ui-panel"><div class="form-row" style="margin-bottom: 3px; text-align: right;"><span class="node-input-buffer-type"><i class="fa fa-exclamation-circle"></i> <span id="node-input-buffer-type-string" data-i18n="bufferEditor.modeString"></span><span id="node-input-buffer-type-array" data-i18n="bufferEditor.modeArray"></span></span></div><div class="form-row node-text-editor-row"><div class="node-text-editor" id="node-input-buffer-str"></div></div></div><div id="node-input-buffer-panel-bin" class="red-ui-panel"><div class="form-row node-text-editor-row" style="margin-top: 10px"><div class="node-text-editor" id="node-input-buffer-bin"></div></div></div></div></script>';
|
var template = '<script type="text/x-red" data-template-name="_buffer"><div id="red-ui-editor-type-buffer-panels"><div id="red-ui-editor-type-buffer-panel-str" class="red-ui-panel"><div class="form-row" style="margin-bottom: 3px; text-align: right;"><span class="red-ui-editor-type-buffer-type"><i class="fa fa-exclamation-circle"></i> <span id="red-ui-editor-type-buffer-type-string" data-i18n="bufferEditor.modeString"></span><span id="red-ui-editor-type-buffer-type-array" data-i18n="bufferEditor.modeArray"></span></span></div><div class="form-row node-text-editor-row"><div class="node-text-editor" id="red-ui-editor-type-buffer-str"></div></div></div><div id="red-ui-editor-type-buffer-panel-bin" class="red-ui-panel"><div class="form-row node-text-editor-row" style="margin-top: 10px"><div class="node-text-editor" id="red-ui-editor-type-buffer-bin"></div></div></div></div></script>';
|
||||||
|
|
||||||
function stringToUTF8Array(str) {
|
function stringToUTF8Array(str) {
|
||||||
var data = [];
|
var data = [];
|
||||||
@ -49,6 +49,9 @@
|
|||||||
var value = options.value;
|
var value = options.value;
|
||||||
var onComplete = options.complete;
|
var onComplete = options.complete;
|
||||||
var type = "_buffer"
|
var type = "_buffer"
|
||||||
|
if ($("script[data-template-name='"+type+"']").length === 0) {
|
||||||
|
$(template).appendTo("#red-ui-editor-node-configs");
|
||||||
|
}
|
||||||
RED.view.state(RED.state.EDITING);
|
RED.view.state(RED.state.EDITING);
|
||||||
var bufferStringEditor = [];
|
var bufferStringEditor = [];
|
||||||
var bufferBinValue;
|
var bufferBinValue;
|
||||||
@ -87,14 +90,14 @@
|
|||||||
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form',type,'editor');
|
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form',type,'editor');
|
||||||
|
|
||||||
bufferStringEditor = RED.editor.createEditor({
|
bufferStringEditor = RED.editor.createEditor({
|
||||||
id: 'node-input-buffer-str',
|
id: 'red-ui-editor-type-buffer-str',
|
||||||
value: "",
|
value: "",
|
||||||
mode:"ace/mode/text"
|
mode:"ace/mode/text"
|
||||||
});
|
});
|
||||||
bufferStringEditor.getSession().setValue(value||"",-1);
|
bufferStringEditor.getSession().setValue(value||"",-1);
|
||||||
|
|
||||||
bufferBinEditor = RED.editor.createEditor({
|
bufferBinEditor = RED.editor.createEditor({
|
||||||
id: 'node-input-buffer-bin',
|
id: 'red-ui-editor-type-buffer-bin',
|
||||||
value: "",
|
value: "",
|
||||||
mode:"ace/mode/text",
|
mode:"ace/mode/text",
|
||||||
readOnly: true
|
readOnly: true
|
||||||
@ -132,8 +135,8 @@
|
|||||||
binBuffer.push((d<16?"0":"")+d.toString(16).toUpperCase());
|
binBuffer.push((d<16?"0":"")+d.toString(16).toUpperCase());
|
||||||
}
|
}
|
||||||
if (valid) {
|
if (valid) {
|
||||||
$("#node-input-buffer-type-string").toggle(isString);
|
$("#red-ui-editor-type-buffer-type-string").toggle(isString);
|
||||||
$("#node-input-buffer-type-array").toggle(!isString);
|
$("#red-ui-editor-type-buffer-type-array").toggle(!isString);
|
||||||
bufferBinEditor.setValue(binBuffer.join(""),1);
|
bufferBinEditor.setValue(binBuffer.join(""),1);
|
||||||
}
|
}
|
||||||
return valid;
|
return valid;
|
||||||
@ -165,24 +168,24 @@
|
|||||||
dialogForm.i18n();
|
dialogForm.i18n();
|
||||||
|
|
||||||
panels = RED.panels.create({
|
panels = RED.panels.create({
|
||||||
id:"node-input-buffer-panels",
|
id:"red-ui-editor-type-buffer-panels",
|
||||||
resize: function(p1Height,p2Height) {
|
resize: function(p1Height,p2Height) {
|
||||||
var p1 = $("#node-input-buffer-panel-str");
|
var p1 = $("#red-ui-editor-type-buffer-panel-str");
|
||||||
p1Height -= $(p1.children()[0]).outerHeight(true);
|
p1Height -= $(p1.children()[0]).outerHeight(true);
|
||||||
var editorRow = $(p1.children()[1]);
|
var editorRow = $(p1.children()[1]);
|
||||||
p1Height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
|
p1Height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
|
||||||
$("#node-input-buffer-str").css("height",(p1Height-5)+"px");
|
$("#red-ui-editor-type-buffer-str").css("height",(p1Height-5)+"px");
|
||||||
bufferStringEditor.resize();
|
bufferStringEditor.resize();
|
||||||
|
|
||||||
var p2 = $("#node-input-buffer-panel-bin");
|
var p2 = $("#red-ui-editor-type-buffer-panel-bin");
|
||||||
editorRow = $(p2.children()[0]);
|
editorRow = $(p2.children()[0]);
|
||||||
p2Height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
|
p2Height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
|
||||||
$("#node-input-buffer-bin").css("height",(p2Height-5)+"px");
|
$("#red-ui-editor-type-buffer-bin").css("height",(p2Height-5)+"px");
|
||||||
bufferBinEditor.resize();
|
bufferBinEditor.resize();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$(".node-input-buffer-type").on("click", function(e) {
|
$(".red-ui-editor-type-buffer-type").on("click", function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
RED.sidebar.info.set(RED._("bufferEditor.modeDesc"));
|
RED.sidebar.info.set(RED._("bufferEditor.modeDesc"));
|
||||||
RED.sidebar.info.show();
|
RED.sidebar.info.show();
|
||||||
@ -202,7 +205,6 @@
|
|||||||
RED.tray.show(trayOptions);
|
RED.tray.show(trayOptions);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
$(template).appendTo("#red-ui-editor-node-configs");
|
|
||||||
RED.editor.registerTypeEditor("_buffer", definition);
|
RED.editor.registerTypeEditor("_buffer", definition);
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
@ -17,28 +17,28 @@
|
|||||||
|
|
||||||
|
|
||||||
var template = '<script type="text/x-red" data-template-name="_expression">'+
|
var template = '<script type="text/x-red" data-template-name="_expression">'+
|
||||||
'<div id="node-input-expression-panels">'+
|
'<div id="red-ui-editor-type-expression-panels">'+
|
||||||
'<div id="node-input-expression-panel-expr" class="red-ui-panel">'+
|
'<div id="red-ui-editor-type-expression-panel-expr" class="red-ui-panel">'+
|
||||||
'<div class="form-row" style="margin-bottom: 3px; text-align: right;"><span class="node-input-expression-legacy"><i class="fa fa-exclamation-circle"></i> <span data-i18n="expressionEditor.compatMode"></span></span><button id="node-input-expression-reformat" class="editor-button editor-button-small"><span data-i18n="expressionEditor.format"></span></button></div>'+
|
'<div class="form-row" style="margin-bottom: 3px; text-align: right;"><span class="red-ui-editor-type-expression-legacy"><i class="fa fa-exclamation-circle"></i> <span data-i18n="expressionEditor.compatMode"></span></span><button id="red-ui-editor-type-expression-reformat" class="editor-button editor-button-small"><span data-i18n="expressionEditor.format"></span></button></div>'+
|
||||||
'<div class="form-row node-text-editor-row"><div class="node-text-editor" id="node-input-expression"></div></div>'+
|
'<div class="form-row node-text-editor-row"><div class="node-text-editor" id="red-ui-editor-type-expression"></div></div>'+
|
||||||
'</div>'+
|
'</div>'+
|
||||||
'<div id="node-input-expression-panel-info" class="red-ui-panel">'+
|
'<div id="red-ui-editor-type-expression-panel-info" class="red-ui-panel">'+
|
||||||
'<div class="form-row">'+
|
'<div class="form-row">'+
|
||||||
'<ul id="node-input-expression-tabs"></ul>'+
|
'<ul id="red-ui-editor-type-expression-tabs"></ul>'+
|
||||||
'<div id="node-input-expression-tab-help" class="node-input-expression-tab-content hide">'+
|
'<div id="red-ui-editor-type-expression-tab-help" class="red-ui-editor-type-expression-tab-content hide">'+
|
||||||
'<div>'+
|
'<div>'+
|
||||||
'<select id="node-input-expression-func"></select>'+
|
'<select id="red-ui-editor-type-expression-func"></select>'+
|
||||||
'<button id="node-input-expression-func-insert" class="editor-button" data-i18n="expressionEditor.insert"></button>'+
|
'<button id="red-ui-editor-type-expression-func-insert" class="editor-button" data-i18n="expressionEditor.insert"></button>'+
|
||||||
'</div>'+
|
'</div>'+
|
||||||
'<div id="node-input-expression-help"></div>'+
|
'<div id="red-ui-editor-type-expression-help"></div>'+
|
||||||
'</div>'+
|
'</div>'+
|
||||||
'<div id="node-input-expression-tab-test" class="node-input-expression-tab-content hide">'+
|
'<div id="red-ui-editor-type-expression-tab-test" class="red-ui-editor-type-expression-tab-content hide">'+
|
||||||
'<div>'+
|
'<div>'+
|
||||||
'<span style="display: inline-block; width: calc(50% - 5px);"><span data-i18n="expressionEditor.data"></span><button style="float: right; margin-right: 5px;" id="node-input-example-reformat" class="editor-button editor-button-small"><span data-i18n="jsonEditor.format"></span></button></span>'+
|
'<span style="display: inline-block; width: calc(50% - 5px);"><span data-i18n="expressionEditor.data"></span><button style="float: right; margin-right: 5px;" id="node-input-example-reformat" class="editor-button editor-button-small"><span data-i18n="jsonEditor.format"></span></button></span>'+
|
||||||
'<span style="display: inline-block; width: calc(50% - 5px);" data-i18n="expressionEditor.result"></span>'+
|
'<span style="display: inline-block; width: calc(50% - 5px);" data-i18n="expressionEditor.result"></span>'+
|
||||||
'</div>'+
|
'</div>'+
|
||||||
'<div style="display: inline-block; width: calc(50% - 5px);" class="node-text-editor" id="node-input-expression-test-data"></div>'+
|
'<div style="display: inline-block; width: calc(50% - 5px);" class="node-text-editor" id="red-ui-editor-type-expression-test-data"></div>'+
|
||||||
'<div style="display: inline-block; width: calc(50% - 5px);" class="node-text-editor" id="node-input-expression-test-result"></div>'+
|
'<div style="display: inline-block; width: calc(50% - 5px);" class="node-text-editor" id="red-ui-editor-type-expression-test-result"></div>'+
|
||||||
'</div>'+
|
'</div>'+
|
||||||
'</div>'+
|
'</div>'+
|
||||||
'</div>'+
|
'</div>'+
|
||||||
@ -52,6 +52,9 @@
|
|||||||
var value = options.value;
|
var value = options.value;
|
||||||
var onComplete = options.complete;
|
var onComplete = options.complete;
|
||||||
var type = "_expression"
|
var type = "_expression"
|
||||||
|
if ($("script[data-template-name='"+type+"']").length === 0) {
|
||||||
|
$(template).appendTo("#red-ui-editor-node-configs");
|
||||||
|
}
|
||||||
RED.view.state(RED.state.EDITING);
|
RED.view.state(RED.state.EDITING);
|
||||||
var expressionEditor;
|
var expressionEditor;
|
||||||
var testDataEditor;
|
var testDataEditor;
|
||||||
@ -74,7 +77,7 @@
|
|||||||
text: RED._("common.label.done"),
|
text: RED._("common.label.done"),
|
||||||
class: "primary",
|
class: "primary",
|
||||||
click: function() {
|
click: function() {
|
||||||
$("#node-input-expression-help").text("");
|
$("#red-ui-editor-type-expression-help").text("");
|
||||||
onComplete(expressionEditor.getValue());
|
onComplete(expressionEditor.getValue());
|
||||||
RED.tray.close();
|
RED.tray.close();
|
||||||
}
|
}
|
||||||
@ -89,9 +92,9 @@
|
|||||||
},
|
},
|
||||||
open: function(tray) {
|
open: function(tray) {
|
||||||
var trayBody = tray.find('.red-ui-tray-body');
|
var trayBody = tray.find('.red-ui-tray-body');
|
||||||
trayBody.addClass("node-input-expression-editor")
|
trayBody.addClass("red-ui-editor-type-expression")
|
||||||
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form','_expression','editor');
|
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form','_expression','editor');
|
||||||
var funcSelect = $("#node-input-expression-func");
|
var funcSelect = $("#red-ui-editor-type-expression-func");
|
||||||
Object.keys(jsonata.functions).forEach(function(f) {
|
Object.keys(jsonata.functions).forEach(function(f) {
|
||||||
funcSelect.append($("<option></option>").val(f).text(f));
|
funcSelect.append($("<option></option>").val(f).text(f));
|
||||||
})
|
})
|
||||||
@ -100,11 +103,11 @@
|
|||||||
var args = RED._('jsonata:'+f+".args",{defaultValue:''});
|
var args = RED._('jsonata:'+f+".args",{defaultValue:''});
|
||||||
var title = "<h5>"+f+"("+args+")</h5>";
|
var title = "<h5>"+f+"("+args+")</h5>";
|
||||||
var body = marked(RED._('jsonata:'+f+'.desc',{defaultValue:''}));
|
var body = marked(RED._('jsonata:'+f+'.desc',{defaultValue:''}));
|
||||||
$("#node-input-expression-help").html(title+"<p>"+body+"</p>");
|
$("#red-ui-editor-type-expression-help").html(title+"<p>"+body+"</p>");
|
||||||
|
|
||||||
})
|
})
|
||||||
expressionEditor = RED.editor.createEditor({
|
expressionEditor = RED.editor.createEditor({
|
||||||
id: 'node-input-expression',
|
id: 'red-ui-editor-type-expression',
|
||||||
value: "",
|
value: "",
|
||||||
mode:"ace/mode/jsonata",
|
mode:"ace/mode/jsonata",
|
||||||
options: {
|
options: {
|
||||||
@ -186,7 +189,7 @@
|
|||||||
});
|
});
|
||||||
|
|
||||||
dialogForm.i18n();
|
dialogForm.i18n();
|
||||||
$("#node-input-expression-func-insert").on("click", function(e) {
|
$("#red-ui-editor-type-expression-func-insert").on("click", function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
var pos = expressionEditor.getCursorPosition();
|
var pos = expressionEditor.getCursorPosition();
|
||||||
var f = funcSelect.val();
|
var f = funcSelect.val();
|
||||||
@ -194,7 +197,7 @@
|
|||||||
expressionEditor.insertSnippet(snippet);
|
expressionEditor.insertSnippet(snippet);
|
||||||
expressionEditor.focus();
|
expressionEditor.focus();
|
||||||
});
|
});
|
||||||
$("#node-input-expression-reformat").on("click", function(evt) {
|
$("#red-ui-editor-type-expression-reformat").on("click", function(evt) {
|
||||||
evt.preventDefault();
|
evt.preventDefault();
|
||||||
var v = expressionEditor.getValue()||"";
|
var v = expressionEditor.getValue()||"";
|
||||||
try {
|
try {
|
||||||
@ -206,9 +209,9 @@
|
|||||||
});
|
});
|
||||||
|
|
||||||
var tabs = RED.tabs.create({
|
var tabs = RED.tabs.create({
|
||||||
element: $("#node-input-expression-tabs"),
|
element: $("#red-ui-editor-type-expression-tabs"),
|
||||||
onchange:function(tab) {
|
onchange:function(tab) {
|
||||||
$(".node-input-expression-tab-content").hide();
|
$(".red-ui-editor-type-expression-tab-content").hide();
|
||||||
tab.content.show();
|
tab.content.show();
|
||||||
trayOptions.resize();
|
trayOptions.resize();
|
||||||
}
|
}
|
||||||
@ -217,21 +220,21 @@
|
|||||||
tabs.addTab({
|
tabs.addTab({
|
||||||
id: 'expression-help',
|
id: 'expression-help',
|
||||||
label: RED._('expressionEditor.functionReference'),
|
label: RED._('expressionEditor.functionReference'),
|
||||||
content: $("#node-input-expression-tab-help")
|
content: $("#red-ui-editor-type-expression-tab-help")
|
||||||
});
|
});
|
||||||
tabs.addTab({
|
tabs.addTab({
|
||||||
id: 'expression-tests',
|
id: 'expression-tests',
|
||||||
label: RED._('expressionEditor.test'),
|
label: RED._('expressionEditor.test'),
|
||||||
content: $("#node-input-expression-tab-test")
|
content: $("#red-ui-editor-type-expression-tab-test")
|
||||||
});
|
});
|
||||||
testDataEditor = RED.editor.createEditor({
|
testDataEditor = RED.editor.createEditor({
|
||||||
id: 'node-input-expression-test-data',
|
id: 'red-ui-editor-type-expression-test-data',
|
||||||
value: expressionTestCache[expressionTestCacheId] || '{\n "payload": "hello world"\n}',
|
value: expressionTestCache[expressionTestCacheId] || '{\n "payload": "hello world"\n}',
|
||||||
mode:"ace/mode/json",
|
mode:"ace/mode/json",
|
||||||
lineNumbers: false
|
lineNumbers: false
|
||||||
});
|
});
|
||||||
var changeTimer;
|
var changeTimer;
|
||||||
$(".node-input-expression-legacy").on("click", function(e) {
|
$(".red-ui-editor-type-expression-legacy").on("click", function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
RED.sidebar.info.set(RED._("expressionEditor.compatModeDesc"));
|
RED.sidebar.info.set(RED._("expressionEditor.compatModeDesc"));
|
||||||
RED.sidebar.info.show();
|
RED.sidebar.info.show();
|
||||||
@ -243,7 +246,7 @@
|
|||||||
var expr;
|
var expr;
|
||||||
var usesContext = false;
|
var usesContext = false;
|
||||||
var legacyMode = /(^|[^a-zA-Z0-9_'"])msg([^a-zA-Z0-9_'"]|$)/.test(currentExpression);
|
var legacyMode = /(^|[^a-zA-Z0-9_'"])msg([^a-zA-Z0-9_'"]|$)/.test(currentExpression);
|
||||||
$(".node-input-expression-legacy").toggle(legacyMode);
|
$(".red-ui-editor-type-expression-legacy").toggle(legacyMode);
|
||||||
try {
|
try {
|
||||||
expr = jsonata(currentExpression);
|
expr = jsonata(currentExpression);
|
||||||
expr.assign('flowContext',function(val) {
|
expr.assign('flowContext',function(val) {
|
||||||
@ -295,28 +298,28 @@
|
|||||||
});
|
});
|
||||||
|
|
||||||
testResultEditor = RED.editor.createEditor({
|
testResultEditor = RED.editor.createEditor({
|
||||||
id: 'node-input-expression-test-result',
|
id: 'red-ui-editor-type-expression-test-result',
|
||||||
value: "",
|
value: "",
|
||||||
mode:"ace/mode/json",
|
mode:"ace/mode/json",
|
||||||
lineNumbers: false,
|
lineNumbers: false,
|
||||||
readOnly: true
|
readOnly: true
|
||||||
});
|
});
|
||||||
panels = RED.panels.create({
|
panels = RED.panels.create({
|
||||||
id:"node-input-expression-panels",
|
id:"red-ui-editor-type-expression-panels",
|
||||||
resize: function(p1Height,p2Height) {
|
resize: function(p1Height,p2Height) {
|
||||||
var p1 = $("#node-input-expression-panel-expr");
|
var p1 = $("#red-ui-editor-type-expression-panel-expr");
|
||||||
p1Height -= $(p1.children()[0]).outerHeight(true);
|
p1Height -= $(p1.children()[0]).outerHeight(true);
|
||||||
var editorRow = $(p1.children()[1]);
|
var editorRow = $(p1.children()[1]);
|
||||||
p1Height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
|
p1Height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
|
||||||
$("#node-input-expression").css("height",(p1Height-5)+"px");
|
$("#red-ui-editor-type-expression").css("height",(p1Height-5)+"px");
|
||||||
expressionEditor.resize();
|
expressionEditor.resize();
|
||||||
|
|
||||||
var p2 = $("#node-input-expression-panel-info > .form-row > div:first-child");
|
var p2 = $("#red-ui-editor-type-expression-panel-info > .form-row > div:first-child");
|
||||||
p2Height -= p2.outerHeight(true) + 20;
|
p2Height -= p2.outerHeight(true) + 20;
|
||||||
$(".node-input-expression-tab-content").height(p2Height);
|
$(".red-ui-editor-type-expression-tab-content").height(p2Height);
|
||||||
$("#node-input-expression-test-data").css("height",(p2Height-5)+"px");
|
$("#red-ui-editor-type-expression-test-data").css("height",(p2Height-5)+"px");
|
||||||
testDataEditor.resize();
|
testDataEditor.resize();
|
||||||
$("#node-input-expression-test-result").css("height",(p2Height-5)+"px");
|
$("#red-ui-editor-type-expression-test-result").css("height",(p2Height-5)+"px");
|
||||||
testResultEditor.resize();
|
testResultEditor.resize();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@ -346,6 +349,5 @@
|
|||||||
RED.tray.show(trayOptions);
|
RED.tray.show(trayOptions);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
$(template).appendTo("#red-ui-editor-node-configs");
|
|
||||||
RED.editor.registerTypeEditor("_expression", definition);
|
RED.editor.registerTypeEditor("_expression", definition);
|
||||||
})();
|
})();
|
||||||
|
@ -23,6 +23,9 @@
|
|||||||
var value = options.value;
|
var value = options.value;
|
||||||
var onComplete = options.complete;
|
var onComplete = options.complete;
|
||||||
var type = "_js"
|
var type = "_js"
|
||||||
|
if ($("script[data-template-name='"+type+"']").length === 0) {
|
||||||
|
$(template).appendTo("#red-ui-editor-node-configs");
|
||||||
|
}
|
||||||
RED.view.state(RED.state.EDITING);
|
RED.view.state(RED.state.EDITING);
|
||||||
var expressionEditor;
|
var expressionEditor;
|
||||||
var changeTimer;
|
var changeTimer;
|
||||||
@ -96,7 +99,6 @@
|
|||||||
RED.tray.show(trayOptions);
|
RED.tray.show(trayOptions);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
$(template).appendTo("#red-ui-editor-node-configs");
|
|
||||||
RED.editor.registerTypeEditor("_js", definition);
|
RED.editor.registerTypeEditor("_js", definition);
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
@ -23,6 +23,9 @@
|
|||||||
var value = options.value;
|
var value = options.value;
|
||||||
var onComplete = options.complete;
|
var onComplete = options.complete;
|
||||||
var type = "_json"
|
var type = "_json"
|
||||||
|
if ($("script[data-template-name='"+type+"']").length === 0) {
|
||||||
|
$(template).appendTo("#red-ui-editor-node-configs");
|
||||||
|
}
|
||||||
RED.view.state(RED.state.EDITING);
|
RED.view.state(RED.state.EDITING);
|
||||||
var expressionEditor;
|
var expressionEditor;
|
||||||
var changeTimer;
|
var changeTimer;
|
||||||
@ -112,6 +115,5 @@
|
|||||||
RED.tray.show(trayOptions);
|
RED.tray.show(trayOptions);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
$(template).appendTo("#red-ui-editor-node-configs");
|
|
||||||
RED.editor.registerTypeEditor("_json", definition);
|
RED.editor.registerTypeEditor("_json", definition);
|
||||||
})();
|
})();
|
||||||
|
@ -36,15 +36,15 @@
|
|||||||
'</div>';
|
'</div>';
|
||||||
|
|
||||||
var template = '<script type="text/x-red" data-template-name="_markdown">'+
|
var template = '<script type="text/x-red" data-template-name="_markdown">'+
|
||||||
'<div id="node-input-markdown-panels">'+
|
'<div id="red-ui-editor-type-markdown-panels">'+
|
||||||
'<div id="node-input-markdown-panel-editor" class="red-ui-panel">'+
|
'<div id="red-ui-editor-type-markdown-panel-editor" class="red-ui-panel">'+
|
||||||
'<div style="height: 100%; margin: auto; max-width: 1000px;">'+
|
'<div style="height: 100%; margin: auto; max-width: 1000px;">'+
|
||||||
'<div id="node-input-markdown-toolbar"></div>'+
|
'<div id="red-ui-editor-type-markdown-toolbar"></div>'+
|
||||||
'<div class="node-text-editor" style="height: 100%" id="node-input-markdown"></div>'+
|
'<div class="node-text-editor" style="height: 100%" id="red-ui-editor-type-markdown"></div>'+
|
||||||
'</div>'+
|
'</div>'+
|
||||||
'</div>'+
|
'</div>'+
|
||||||
'<div class="red-ui-panel">'+
|
'<div class="red-ui-panel">'+
|
||||||
'<div class="node-input-markdown-panel-preview node-help"></div>'+
|
'<div class="red-ui-editor-type-markdown-panel-preview node-help"></div>'+
|
||||||
'</div>'+
|
'</div>'+
|
||||||
'</script>';
|
'</script>';
|
||||||
|
|
||||||
@ -56,6 +56,11 @@
|
|||||||
var value = options.value;
|
var value = options.value;
|
||||||
var onComplete = options.complete;
|
var onComplete = options.complete;
|
||||||
var type = "_markdown"
|
var type = "_markdown"
|
||||||
|
if ($("script[data-template-name='"+type+"']").length === 0) {
|
||||||
|
$(template).appendTo("#red-ui-editor-node-configs");
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
RED.view.state(RED.state.EDITING);
|
RED.view.state(RED.state.EDITING);
|
||||||
var expressionEditor;
|
var expressionEditor;
|
||||||
|
|
||||||
@ -89,10 +94,10 @@
|
|||||||
},
|
},
|
||||||
open: function(tray) {
|
open: function(tray) {
|
||||||
var trayBody = tray.find('.red-ui-tray-body');
|
var trayBody = tray.find('.red-ui-tray-body');
|
||||||
trayBody.addClass("node-input-markdown-editor")
|
trayBody.addClass("red-ui-editor-type-markdown-editor")
|
||||||
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form',type,'editor');
|
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form',type,'editor');
|
||||||
expressionEditor = RED.editor.createEditor({
|
expressionEditor = RED.editor.createEditor({
|
||||||
id: 'node-input-markdown',
|
id: 'red-ui-editor-type-markdown',
|
||||||
value: value,
|
value: value,
|
||||||
mode:"ace/mode/markdown",
|
mode:"ace/mode/markdown",
|
||||||
expandable: false
|
expandable: false
|
||||||
@ -101,20 +106,20 @@
|
|||||||
expressionEditor.getSession().on("change", function() {
|
expressionEditor.getSession().on("change", function() {
|
||||||
clearTimeout(changeTimer);
|
clearTimeout(changeTimer);
|
||||||
changeTimer = setTimeout(function() {
|
changeTimer = setTimeout(function() {
|
||||||
var currentScrollTop = $(".node-input-markdown-panel-preview").scrollTop();
|
var currentScrollTop = $(".red-ui-editor-type-markdown-panel-preview").scrollTop();
|
||||||
$(".node-input-markdown-panel-preview").html(marked(expressionEditor.getValue()));
|
$(".red-ui-editor-type-markdown-panel-preview").html(marked(expressionEditor.getValue()));
|
||||||
$(".node-input-markdown-panel-preview").scrollTop(currentScrollTop);
|
$(".red-ui-editor-type-markdown-panel-preview").scrollTop(currentScrollTop);
|
||||||
},200);
|
},200);
|
||||||
})
|
})
|
||||||
if (options.header) {
|
if (options.header) {
|
||||||
options.header.appendTo(tray.find('#node-input-markdown-title'));
|
options.header.appendTo(tray.find('#red-ui-editor-type-markdown-title'));
|
||||||
}
|
}
|
||||||
|
|
||||||
if (value) {
|
if (value) {
|
||||||
$(".node-input-markdown-panel-preview").html(marked(expressionEditor.getValue()));
|
$(".red-ui-editor-type-markdown-panel-preview").html(marked(expressionEditor.getValue()));
|
||||||
}
|
}
|
||||||
panels = RED.panels.create({
|
panels = RED.panels.create({
|
||||||
id:"node-input-markdown-panels",
|
id:"red-ui-editor-type-markdown-panels",
|
||||||
dir: "horizontal",
|
dir: "horizontal",
|
||||||
resize: function(p1Width,p2Width) {
|
resize: function(p1Width,p2Width) {
|
||||||
expressionEditor.resize();
|
expressionEditor.resize();
|
||||||
@ -207,6 +212,5 @@
|
|||||||
return toolbar;
|
return toolbar;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
$(template).appendTo("#red-ui-editor-node-configs");
|
|
||||||
RED.editor.registerTypeEditor("_markdown", definition);
|
RED.editor.registerTypeEditor("_markdown", definition);
|
||||||
})();
|
})();
|
||||||
|
@ -79,13 +79,23 @@
|
|||||||
.red-ui-tray-footer {
|
.red-ui-tray-footer {
|
||||||
@include component-footer;
|
@include component-footer;
|
||||||
height: 35px;
|
height: 35px;
|
||||||
|
font-size: 12px !important;
|
||||||
|
line-height: 35px;
|
||||||
|
vertical-align: middle;
|
||||||
|
|
||||||
button {
|
button {
|
||||||
@include editor-button;
|
@include editor-button;
|
||||||
padding: 3px 7px;
|
padding: 3px 7px;
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
}
|
}
|
||||||
|
.red-ui-tray-footer-left {
|
||||||
|
display:inline-block;
|
||||||
|
margin-right: 20px;
|
||||||
|
float:left;
|
||||||
|
}
|
||||||
|
.red-ui-tray-footer-right {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.red-ui-tray-toolbar {
|
.red-ui-tray-toolbar {
|
||||||
@ -197,7 +207,7 @@
|
|||||||
|
|
||||||
.node-text-editor {
|
.node-text-editor {
|
||||||
position: relative;
|
position: relative;
|
||||||
.node-text-editor-help {
|
.red-ui-editor-text-help {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 0px;
|
bottom: 0px;
|
||||||
right: 1px;
|
right: 1px;
|
||||||
@ -207,7 +217,7 @@
|
|||||||
border-right: none;
|
border-right: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.node-text-editor-container {
|
.red-ui-editor-text-container {
|
||||||
border:1px solid #ccc;
|
border:1px solid #ccc;
|
||||||
border-radius:5px;
|
border-radius:5px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@ -215,7 +225,7 @@
|
|||||||
font-family: Menlo, Consolas, 'DejaVu Sans Mono', Courier, monospace !important;
|
font-family: Menlo, Consolas, 'DejaVu Sans Mono', Courier, monospace !important;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
||||||
&.node-text-editor-container-toolbar {
|
&.red-ui-editor-text-container-toolbar {
|
||||||
height: calc(100% - 40px);
|
height: calc(100% - 40px);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -244,34 +254,21 @@
|
|||||||
padding: 0 5px;
|
padding: 0 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#node-config-dialog-scope-container {
|
#red-ui-editor-config-scope-warning {
|
||||||
cursor: auto;
|
|
||||||
float: right;
|
|
||||||
font-size: 12px !important;
|
|
||||||
line-height: 35px;
|
|
||||||
}
|
|
||||||
#node-config-dialog-scope-warning {
|
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
color: #AD1625;
|
color: #AD1625;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
#node-config-dialog-scope {
|
#red-ui-editor-config-scope {
|
||||||
margin: 1px 0 0 0;
|
margin: 1px 0 0 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
height: 22px;
|
height: 22px;
|
||||||
width: 200px;
|
width: 200px;
|
||||||
|
|
||||||
}
|
}
|
||||||
#node-config-dialog-user-count {
|
|
||||||
vertical-align: middle;
|
.red-ui-editor-type-expression #dialog-form {
|
||||||
display:inline-block;
|
|
||||||
margin-right: 20px;
|
|
||||||
float:left;
|
|
||||||
font-size: 12px;
|
|
||||||
line-height: 35px;
|
|
||||||
}
|
|
||||||
.node-input-expression-editor #dialog-form {
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
.red-ui-panel {
|
.red-ui-panel {
|
||||||
@ -283,12 +280,12 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.node-input-expression-tab-content {
|
.red-ui-editor-type-expression-tab-content {
|
||||||
position: relative;
|
position: relative;
|
||||||
padding: 0 20px;
|
padding: 0 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#node-input-expression-help {
|
#red-ui-editor-type-expression-help {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 35px;
|
top: 35px;
|
||||||
left:0;
|
left:0;
|
||||||
@ -298,7 +295,7 @@
|
|||||||
overflow: auto;
|
overflow: auto;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
#node-input-expression-panel-info {
|
#red-ui-editor-type-expression-panel-info {
|
||||||
& > .form-row {
|
& > .form-row {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
& > div:first-child {
|
& > div:first-child {
|
||||||
@ -306,7 +303,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.node-input-expression-legacy, .node-input-buffer-type {
|
.red-ui-editor-type-expression-legacy, .red-ui-editor-type-buffer-type {
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
float: left;
|
float: left;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
@ -317,11 +314,11 @@
|
|||||||
border-color: $form-input-border-color;
|
border-color: $form-input-border-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.node-input-buffer-type {
|
.red-ui-editor-type-buffer-type {
|
||||||
float: none;
|
float: none;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
.node-input-markdown-editor #dialog-form {
|
.red-ui-editor-type-markdown-editor #dialog-form {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
.red-ui-panel {
|
.red-ui-panel {
|
||||||
@ -333,7 +330,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.node-input-markdown-panel-preview {
|
.red-ui-editor-type-markdown-panel-preview {
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
border:1px solid #ccc;
|
border:1px solid #ccc;
|
||||||
border-radius:5px;
|
border-radius:5px;
|
||||||
@ -346,7 +343,7 @@
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
top: -3000px;
|
top: -3000px;
|
||||||
}
|
}
|
||||||
.node-label-form-row {
|
.red-ui-editor-node-label-form-row {
|
||||||
margin: 5px 0 0 50px;
|
margin: 5px 0 0 50px;
|
||||||
label {
|
label {
|
||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
@ -359,15 +356,15 @@
|
|||||||
input {
|
input {
|
||||||
width: calc(100% - 100px);
|
width: calc(100% - 100px);
|
||||||
}
|
}
|
||||||
#node-settings-icon-module {
|
#red-ui-editor-node-icon-module {
|
||||||
width: calc(55% - 50px);
|
width: calc(55% - 50px);
|
||||||
}
|
}
|
||||||
#node-settings-icon-file {
|
#red-ui-editor-node-icon-file {
|
||||||
width: calc(45% - 55px);
|
width: calc(45% - 55px);
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.node-label-form-none {
|
.red-ui-editor-node-label-form-none {
|
||||||
span {
|
span {
|
||||||
padding-left: 50px;
|
padding-left: 50px;
|
||||||
width: 100px;
|
width: 100px;
|
||||||
@ -382,7 +379,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
#node-settings-icon-button {
|
#red-ui-editor-node-icon-button {
|
||||||
position: relative;
|
position: relative;
|
||||||
padding-left: 30px;
|
padding-left: 30px;
|
||||||
width: calc(100% - 150px);
|
width: calc(100% - 150px);
|
||||||
@ -392,7 +389,7 @@
|
|||||||
left: 2px;
|
left: 2px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
#node-settings-icon {
|
#red-ui-editor-node-icon {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
width: calc(100% - 163px);
|
width: calc(100% - 163px);
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user