Merge branch 'dev' into pr_2225

This commit is contained in:
Nick O'Leary
2019-08-12 15:05:12 +01:00
78 changed files with 2886 additions and 2640 deletions

View File

@@ -322,6 +322,31 @@
"description": "Description",
"show": "Show",
"hide": "Hide",
"locale": "Select UI Language",
"icon": "Icon",
"inputType": "Input type",
"previewUI": "Preview UI",
"previewOK": "Preview OK",
"types": {
"str": "string",
"num": "number",
"bool": "bool",
"json": "json",
"bin": "buffer",
"env": "env var",
"no-value": "no value"
},
"menu": {
"input": "input",
"select": "select",
"checkbox": "checkbox",
"spinner": "spinner",
"hidden": "label only"
},
"spinner": {
"min": "min",
"max": "max"
},
"errors": {
"scopeChange": "Changing the scope will make it unavailable to nodes in other flows that use it",
"invalidProperties": "Invalid properties:"
@@ -940,9 +965,11 @@
},
"editor-tab": {
"properties": "Properties",
"envProperties": "Environment Variables",
"description": "Description",
"appearance": "Appearance",
"env": "Environment Variables"
"preview": "UI Preview",
"defaultValue": "Default value"
},
"languages" : {
"de": "German",

View File

@@ -80,7 +80,7 @@
"projects-new": "新規",
"projects-open": "開く",
"projects-settings": "設定",
"showNodeLabelDefault": "追加したノードのラベルを表示する"
"showNodeLabelDefault": "追加したノードのラベルを表示"
}
},
"actions": {
@@ -322,6 +322,31 @@
"description": "詳細",
"show": "表示",
"hide": "非表示",
"locale": "UI言語の選択",
"icon": "記号",
"inputType": "入力形式",
"previewUI": "UI確認",
"previewOK": "確認OK",
"types": {
"str": "文字列",
"num": "数値",
"bool": "真偽",
"json": "JSON",
"bin": "バッファ",
"env": "環境変数",
"no-value": "値無し"
},
"menu": {
"input": "入力",
"select": "選択",
"checkbox": "チェックボックス",
"spinner": "数値",
"hidden": "ラベルのみ"
},
"spinner": {
"min": "最小",
"max": "最大"
},
"errors": {
"scopeChange": "スコープの変更は、他のフローで使われているノードを無効にします",
"invalidProperties": "プロパティが不正です:"
@@ -352,7 +377,8 @@
"pasteNode": "ノードを貼り付け",
"undoChange": "変更操作を戻す",
"searchBox": "ノードを検索",
"managePalette": "パレットの管理"
"managePalette": "パレットの管理",
"actionList": "動作一覧"
},
"library": {
"library": "ライブラリ",
@@ -528,11 +554,13 @@
"none": "選択されていません",
"refresh": "読み込みのため更新してください",
"empty": "データが存在しません",
"node": "Node",
"flow": "Flow",
"global": "Global",
"node": "ノード",
"flow": "フロー",
"global": "グローバル",
"deleteConfirm": "データを削除しても良いですか?",
"autoRefresh": "自動更新"
"autoRefresh": "自動更新",
"refrsh": "更新",
"delete": "削除"
},
"palette": {
"name": "パレットの管理",
@@ -737,7 +765,16 @@
},
"jsonEditor": {
"title": "JSONエディタ",
"format": "JSONフォーマット"
"format": "JSONフォーマット",
"rawMode": "JSONを編集",
"uiMode": "ビジュアルエディタ",
"insertAbove": "上に挿入",
"insertBelow": "下に挿入",
"addItem": "要素を追加",
"copyPath": "要素のパスをコピー",
"expandItems": "要素を展開",
"collapseItems": "要素を折り畳む",
"duplicate": "複製"
},
"markdownEditor": {
"title": "マークダウンエディタ",
@@ -929,9 +966,9 @@
"properties": "プロパティ",
"description": "説明",
"appearance": "外観",
"env": "環境変数"
"env": "サブフロープロパティ"
},
"languages" : {
"languages": {
"de": "ドイツ語",
"en-US": "英語",
"ja": "日本語",

View File

@@ -14,7 +14,8 @@
* limitations under the License.
**/
RED.history = (function() {
var undo_history = [];
var undoHistory = [];
var redoHistory = [];
function undoEvent(ev) {
var i;
@@ -22,52 +23,81 @@ RED.history = (function() {
var node;
var subflow;
var modifiedTabs = {};
var inverseEv;
if (ev) {
if (ev.t == 'multi') {
inverseEv = {
t: 'multi',
events: []
};
len = ev.events.length;
for (i=len-1;i>=0;i--) {
undoEvent(ev.events[i]);
var r = undoEvent(ev.events[i]);
inverseEv.events.push(r);
}
} else if (ev.t == 'replace') {
inverseEv = {
t: 'replace',
config: RED.nodes.createCompleteNodeSet(),
changed: [],
rev: RED.nodes.version()
};
RED.nodes.clear();
var imported = RED.nodes.import(ev.config);
imported[0].forEach(function(n) {
if (ev.changed[n.id]) {
n.changed = true;
inverseEv.changed[n.id] = true;
}
})
RED.nodes.version(ev.rev);
} else if (ev.t == 'add') {
inverseEv = {
t: "delete",
};
if (ev.nodes) {
inverseEv.nodes = [];
for (i=0;i<ev.nodes.length;i++) {
node = RED.nodes.node(ev.nodes[i]);
if (node.z) {
modifiedTabs[node.z] = true;
}
inverseEv.nodes.push(node);
RED.nodes.remove(ev.nodes[i]);
}
}
if (ev.links) {
inverseEv.links = [];
for (i=0;i<ev.links.length;i++) {
inverseEv.links.push(ev.links[i]);
RED.nodes.removeLink(ev.links[i]);
}
}
if (ev.workspaces) {
inverseEv.workspaces = [];
for (i=0;i<ev.workspaces.length;i++) {
var workspaceOrder = RED.nodes.getWorkspaceOrder();
ev.workspaces[i]._index = workspaceOrder.indexOf(ev.workspaces[i].id);
inverseEv.workspaces.push(ev.workspaces[i]);
RED.nodes.removeWorkspace(ev.workspaces[i].id);
RED.workspaces.remove(ev.workspaces[i]);
}
}
if (ev.subflows) {
inverseEv.subflows = [];
for (i=0;i<ev.subflows.length;i++) {
inverseEv.subflows.push(ev.subflows[i]);
RED.nodes.removeSubflow(ev.subflows[i]);
RED.workspaces.remove(ev.subflows[i]);
}
}
if (ev.subflow) {
inverseEv.subflow = {};
if (ev.subflow.instances) {
inverseEv.subflow.instances = [];
ev.subflow.instances.forEach(function(n) {
inverseEv.subflow.instances.push(n);
var node = RED.nodes.node(n.id);
if (node) {
node.changed = n.changed;
@@ -83,21 +113,30 @@ RED.history = (function() {
}
}
if (ev.removedLinks) {
inverseEv.createdLinks = [];
for (i=0;i<ev.removedLinks.length;i++) {
inverseEv.createdLinks.push(ev.removedLinks[i]);
RED.nodes.addLink(ev.removedLinks[i]);
}
}
} else if (ev.t == "delete") {
inverseEv = {
t: "add"
};
if (ev.workspaces) {
inverseEv.workspaces = [];
for (i=0;i<ev.workspaces.length;i++) {
inverseEv.workspaces.push(ev.workspaces[i]);
RED.nodes.addWorkspace(ev.workspaces[i],ev.workspaces[i]._index);
RED.workspaces.add(ev.workspaces[i],undefined,ev.workspaces[i]._index);
delete ev.workspaces[i]._index;
}
}
if (ev.subflows) {
inverseEv.subflows = [];
for (i=0;i<ev.subflows.length;i++) {
inverseEv.subflows.push(ev.subflows[i]);
RED.nodes.addSubflow(ev.subflows[i]);
}
}
@@ -126,8 +165,11 @@ RED.history = (function() {
}
}
if (ev.subflow) {
inverseEv.subflow = {};
if (ev.subflow.hasOwnProperty('instances')) {
inverseEv.subflow.instances = [];
ev.subflow.instances.forEach(function(n) {
inverseEv.subflow.instances.push(n);
var node = RED.nodes.node(n.id);
if (node) {
node.changed = n.changed;
@@ -152,14 +194,25 @@ RED.history = (function() {
});
}
if (ev.nodes) {
inverseEv.nodes = [];
for (i=0;i<ev.nodes.length;i++) {
RED.nodes.add(ev.nodes[i]);
modifiedTabs[ev.nodes[i].z] = true;
inverseEv.nodes.push(ev.nodes[i].id);
}
}
if (ev.links) {
inverseEv.links = [];
for (i=0;i<ev.links.length;i++) {
RED.nodes.addLink(ev.links[i]);
inverseEv.links.push(ev.links[i]);
}
}
if (ev.createdLinks) {
inverseEv.removedLinks = [];
for (i=0;i<ev.createdLinks.length;i++) {
inverseEv.removedLinks.push(ev.createdLinks[i]);
RED.nodes.removeLink(ev.createdLinks[i]);
}
}
if (ev.changes) {
@@ -179,8 +232,14 @@ RED.history = (function() {
}
} else if (ev.t == "move") {
inverseEv = {
t: 'move',
nodes: []
};
for (i=0;i<ev.nodes.length;i++) {
var n = ev.nodes[i];
var rn = {n: n.n, ox: n.n.x, oy: n.n.y, dirty: true, moved: n.moved};
inverseEv.nodes.push(rn);
n.n.x = n.ox;
n.n.y = n.oy;
n.n.dirty = true;
@@ -188,18 +247,28 @@ RED.history = (function() {
}
// A move could have caused a link splice
if (ev.links) {
inverseEv.removedLinks = [];
for (i=0;i<ev.links.length;i++) {
inverseEv.removedLinks.push(ev.links[i]);
RED.nodes.removeLink(ev.links[i]);
}
}
if (ev.removedLinks) {
inverseEv.links = [];
for (i=0;i<ev.removedLinks.length;i++) {
inverseEv.links.push(ev.removedLinks[i]);
RED.nodes.addLink(ev.removedLinks[i]);
}
}
} else if (ev.t == "edit") {
inverseEv = {
t: "edit",
changes: {}
};
inverseEv.node = ev.node;
for (i in ev.changes) {
if (ev.changes.hasOwnProperty(i)) {
inverseEv.changes[i] = ev.node[i];
if (ev.node._def.defaults && ev.node._def.defaults[i] && ev.node._def.defaults[i].type) {
// This is a config node property
var currentConfigNode = RED.nodes.node(ev.node[i]);
@@ -219,22 +288,29 @@ RED.history = (function() {
$("#red-ui-workspace").toggleClass("red-ui-workspace-disabled",!!ev.node.disabled);
}
if (ev.subflow) {
inverseEv.subflow = {};
if (ev.subflow.hasOwnProperty('inputCount')) {
inverseEv.subflow.inputCount = ev.node.in.length;
if (ev.node.in.length > ev.subflow.inputCount) {
inverseEv.subflow.inputs = ev.node.in.slice(ev.subflow.inputCount);
ev.node.in.splice(ev.subflow.inputCount);
} else if (ev.subflow.inputs.length > 0) {
ev.node.in = ev.node.in.concat(ev.subflow.inputs);
}
}
if (ev.subflow.hasOwnProperty('outputCount')) {
inverseEv.subflow.outputCount = ev.node.out.length;
if (ev.node.out.length > ev.subflow.outputCount) {
inverseEv.subflow.outputs = ev.node.out.slice(ev.subflow.outputCount);
ev.node.out.splice(ev.subflow.outputCount);
} else if (ev.subflow.outputs.length > 0) {
ev.node.out = ev.node.out.concat(ev.subflow.outputs);
}
}
if (ev.subflow.hasOwnProperty('instances')) {
inverseEv.subflow.instances = [];
ev.subflow.instances.forEach(function(n) {
inverseEv.subflow.instances.push(n);
var node = RED.nodes.node(n.id);
if (node) {
node.changed = n.changed;
@@ -258,9 +334,11 @@ RED.history = (function() {
var outputMap;
if (ev.outputMap) {
outputMap = {};
inverseEv.outputMap = {};
for (var port in ev.outputMap) {
if (ev.outputMap.hasOwnProperty(port) && ev.outputMap[port] !== "-1") {
outputMap[ev.outputMap[port]] = port;
inverseEv.outputMap[ev.outputMap[port]] = port;
}
}
}
@@ -268,39 +346,107 @@ RED.history = (function() {
RED.editor.validateNode(ev.node);
}
if (ev.links) {
inverseEv.createdLinks = [];
for (i=0;i<ev.links.length;i++) {
RED.nodes.addLink(ev.links[i]);
inverseEv.createdLinks.push(ev.links[i]);
}
}
if (ev.createdLinks) {
inverseEv.links = [];
for (i=0;i<ev.createdLinks.length;i++) {
RED.nodes.removeLink(ev.createdLinks[i]);
inverseEv.links.push(ev.createdLinks[i]);
}
}
ev.node.dirty = true;
ev.node.changed = ev.changed;
} else if (ev.t == "createSubflow") {
inverseEv = {
t: "deleteSubflow",
activeWorkspace: ev.activeWorkspace,
dirty: RED.nodes.dirty()
};
if (ev.nodes) {
inverseEv.movedNodes = [];
var z = ev.activeWorkspace;
RED.nodes.filterNodes({z:ev.subflow.subflow.id}).forEach(function(n) {
n.x += ev.subflow.offsetX;
n.y += ev.subflow.offsetY;
n.z = ev.activeWorkspace;
n.dirty = true;
inverseEv.movedNodes.push(n.id);
RED.nodes.moveNodeToTab(n, z);
});
inverseEv.subflows = [];
for (i=0;i<ev.nodes.length;i++) {
inverseEv.subflows.push(RED.nodes.node(ev.nodes[i]));
RED.nodes.remove(ev.nodes[i]);
}
}
if (ev.links) {
inverseEv.links = [];
for (i=0;i<ev.links.length;i++) {
inverseEv.links.push(ev.links[i]);
RED.nodes.removeLink(ev.links[i]);
}
}
inverseEv.subflow = ev.subflow;
RED.nodes.removeSubflow(ev.subflow.subflow);
RED.workspaces.remove(ev.subflow.subflow);
if (ev.removedLinks) {
inverseEv.createdLinks = [];
for (i=0;i<ev.removedLinks.length;i++) {
inverseEv.createdLinks.push(ev.removedLinks[i]);
RED.nodes.addLink(ev.removedLinks[i]);
}
}
} else if (ev.t == "deleteSubflow") {
inverseEv = {
t: "createSubflow",
activeWorkspace: ev.activeWorkspace,
dirty: RED.nodes.dirty(),
};
if (ev.subflow) {
RED.nodes.addSubflow(ev.subflow.subflow);
inverseEv.subflow = ev.subflow;
}
if (ev.subflows) {
inverseEv.nodes = [];
for (i=0;i<ev.subflows.length;i++) {
RED.nodes.add(ev.subflows[i]);
inverseEv.nodes.push(ev.subflows[i].id);
}
}
if (ev.movedNodes) {
ev.movedNodes.forEach(function(nid) {
nn = RED.nodes.node(nid);
nn.x -= ev.subflow.offsetX;
nn.y -= ev.subflow.offsetY;
nn.dirty = true;
RED.nodes.moveNodeToTab(nn, ev.subflow.subflow.id);
});
}
if (ev.links) {
inverseEv.links = [];
for (i=0;i<ev.links.length;i++) {
inverseEv.links.push(ev.links[i]);
RED.nodes.addLink(ev.links[i]);
}
}
if (ev.createdLinks) {
inverseEv.removedLinks = [];
for (i=0;i<ev.createdLinks.length;i++) {
inverseEv.removedLinks.push(ev.createdLinks[i]);
RED.nodes.removeLink(ev.createdLinks[i]);
}
}
} else if (ev.t == "reorder") {
inverseEv = {
t: 'reorder',
order: RED.nodes.getWorkspaceOrder()
};
if (ev.order) {
RED.workspaces.order(ev.order);
}
@@ -320,6 +466,8 @@ RED.history = (function() {
RED.workspaces.refresh();
RED.sidebar.config.refresh();
RED.subflow.refresh();
return inverseEv;
}
}
@@ -327,28 +475,42 @@ RED.history = (function() {
return {
//TODO: this function is a placeholder until there is a 'save' event that can be listened to
markAllDirty: function() {
for (var i=0;i<undo_history.length;i++) {
undo_history[i].dirty = true;
for (var i=0;i<undoHistory.length;i++) {
undoHistory[i].dirty = true;
}
},
list: function() {
return undo_history
return undoHistory;
},
depth: function() {
return undo_history.length;
return undoHistory.length;
},
push: function(ev) {
undo_history.push(ev);
undoHistory.push(ev);
redoHistory = [];
},
pop: function() {
var ev = undo_history.pop();
undoEvent(ev);
var ev = undoHistory.pop();
var rev = undoEvent(ev);
if (rev) {
redoHistory.push(rev);
}
},
peek: function() {
return undo_history[undo_history.length-1];
return undoHistory[undoHistory.length-1];
},
clear: function() {
undo_history = [];
undoHistory = [];
redoHistory = [];
},
redo: function() {
var ev = redoHistory.pop();
if (ev) {
var uev = undoEvent(ev);
if (uev) {
undoHistory.push(uev);
}
}
}
}

View File

@@ -50,6 +50,19 @@ RED.i18n = (function() {
}
},
lang: function() {
// Gets the active message catalog language. This is based on what
// locale the editor is using and what languages are available.
//
var preferredLangs = i18n.functions.toLanguages(localStorage.getItem("editor-language")||i18n.detectLanguage());
var knownLangs = RED.settings.theme("languages")||["en-US"];
for (var i=0;i<preferredLangs.length;i++) {
if (knownLangs.indexOf(preferredLangs[i]) > -1) {
return preferredLangs[i]
}
}
return 'end-US'
},
loadNodeCatalog: function(namespace,done) {
var languageList = i18n.functions.toLanguages(localStorage.getItem("editor-language")||i18n.detectLanguage());
var toLoad = languageList.length;

View File

@@ -30,7 +30,8 @@
"backspace": "core:delete-config-selection",
"delete": "core:delete-config-selection",
"ctrl-a": "core:select-all-config-nodes",
"ctrl-z": "core:undo"
"ctrl-z": "core:undo",
"ctrl-y": "core:redo"
},
"red-ui-workspace": {
"backspace": "core:delete-selection",
@@ -40,6 +41,7 @@
"ctrl-x": "core:cut-selection-to-internal-clipboard",
"ctrl-v": "core:paste-from-internal-clipboard",
"ctrl-z": "core:undo",
"ctrl-y": "core:redo",
"ctrl-a": "core:select-all-nodes",
"shift-?": "core:show-help",
"up": "core:move-selection-up",

View File

@@ -17,6 +17,8 @@ RED.nodes = (function() {
var node_defs = {};
var nodes = [];
var nodeTabMap = {};
var configNodes = {};
var links = [];
var defaultWorkspace;
@@ -213,6 +215,11 @@ RED.nodes = (function() {
n.i = nextId+1;
}
nodes.push(n);
if (nodeTabMap[n.z]) {
nodeTabMap[n.z][n.id] = n;
} else {
console.warn("Node added to unknown tab/subflow:",n);
}
}
RED.events.emit('nodes:add',n);
}
@@ -246,6 +253,9 @@ RED.nodes = (function() {
node = getNode(id);
if (node) {
nodes.splice(nodes.indexOf(node),1);
if (nodeTabMap[node.z]) {
delete nodeTabMap[node.z][node.id];
}
removedLinks = links.filter(function(l) { return (l.source === node) || (l.target === node); });
removedLinks.forEach(function(l) {links.splice(links.indexOf(l), 1); });
var updatedConfigNode = false;
@@ -291,6 +301,17 @@ RED.nodes = (function() {
return {links:removedLinks,nodes:removedNodes};
}
function moveNodeToTab(node, z) {
if (nodeTabMap[node.z]) {
delete nodeTabMap[node.z][node.id];
}
if (!nodeTabMap[z]) {
nodeTabMap[z] = {};
}
nodeTabMap[z][node.id] = node;
node.z = z;
}
function removeLink(l) {
var index = links.indexOf(l);
if (index != -1) {
@@ -300,6 +321,8 @@ RED.nodes = (function() {
function addWorkspace(ws,targetIndex) {
workspaces[ws.id] = ws;
nodeTabMap[ws.id] = {};
ws._def = RED.nodes.getType('tab');
if (targetIndex === undefined) {
workspacesOrder.push(ws.id);
@@ -312,6 +335,7 @@ RED.nodes = (function() {
}
function removeWorkspace(id) {
delete workspaces[id];
delete nodeTabMap[id];
workspacesOrder.splice(workspacesOrder.indexOf(id),1);
var removedNodes = [];
@@ -357,6 +381,8 @@ RED.nodes = (function() {
sf.name = subflowName;
}
subflows[sf.id] = sf;
nodeTabMap[sf.id] = {};
RED.nodes.registerType("subflow:"+sf.id, {
defaults:{
name:{value:""},
@@ -373,14 +399,14 @@ RED.nodes = (function() {
inputLabels: function(i) { return sf.inputLabels?sf.inputLabels[i]:null },
outputLabels: function(i) { return sf.outputLabels?sf.outputLabels[i]:null },
oneditresize: function(size) {
var rows = $("#dialog-form>div:not(.node-input-env-container-row)");
// var rows = $(".dialog-form>div:not(.node-input-env-container-row)");
var height = size.height;
for (var i=0; i<rows.size(); i++) {
height -= $(rows[i]).outerHeight(true);
}
var editorRow = $("#dialog-form>div.node-input-env-container-row");
height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
$("#node-input-env-container").editableList('height',height-80);
// for (var i=0; i<rows.size(); i++) {
// height -= $(rows[i]).outerHeight(true);
// }
// var editorRow = $("#dialog-form>div.node-input-env-container-row");
// height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
$("ol.red-ui-editor-subflow-env-list").editableList('height',height);
},
set:{
module: "node-red"
@@ -393,6 +419,7 @@ RED.nodes = (function() {
}
function removeSubflow(sf) {
delete subflows[sf.id];
delete nodeTabMap[sf.id];
registry.removeNodeType("subflow:"+sf.id);
}
@@ -1267,12 +1294,13 @@ RED.nodes = (function() {
// TODO: supports filter.z|type
function filterNodes(filter) {
var result = [];
var searchSet = nodes;
if (filter.hasOwnProperty("z") && Object.hasOwnProperty("values") && nodeTabMap.hasOwnProperty(filter.z) ) {
searchSet = Object.values(nodeTabMap[filter.z]);
}
for (var n=0;n<nodes.length;n++) {
var node = nodes[n];
if (filter.hasOwnProperty("z") && node.z !== filter.z) {
continue;
}
for (var n=0;n<searchSet.length;n++) {
var node = searchSet[n];
if (filter.hasOwnProperty("type") && node.type !== filter.type) {
continue;
}
@@ -1340,6 +1368,7 @@ RED.nodes = (function() {
function clear() {
nodes = [];
links = [];
nodeTabMap = {};
configNodes = {};
workspacesOrder = [];
var subflowIds = Object.keys(subflows);
@@ -1449,6 +1478,8 @@ RED.nodes = (function() {
remove: removeNode,
clear: clear,
moveNodeToTab: moveNodeToTab,
addLink: addLink,
removeLink: removeLink,

View File

@@ -34,6 +34,8 @@
* - addItem(itemData)
* - insertItemAt : function(data,index) - add an item at the specified index
* - removeItem(itemData)
* - getItemAt(index)
* - indexOf(itemData)
* - width(width)
* - height(height)
* - items()
@@ -186,7 +188,11 @@
}
},
_destroy: function() {
this.topContainer.remove();
if (this.topContainer) {
var tc = this.topContainer;
delete this.topContainer;
tc.remove();
}
},
_refreshFilter: function() {
var that = this;
@@ -232,6 +238,23 @@
this.uiHeight = desiredHeight;
this._resize();
},
getItemAt: function(index) {
var items = this.items();
if (index >= 0 && index < items.length) {
return $(items[index]).data('data');
} else {
return;
}
},
indexOf: function(data) {
var items = this.items();
for (var i=0;i<items.length;i++) {
if ($(items[i]).data('data') === data) {
return i
}
}
return -1
},
insertItemAt: function(data,index) {
var that = this;
data = data || {};

View File

@@ -225,7 +225,7 @@ RED.menu = (function() {
triggerAction(opt.id,state);
}
}
if (!alreadySet) {
if (!opt.local && !alreadySet) {
RED.settings.set(opt.setting||("menu-"+opt.id), state);
}
}

View File

@@ -253,6 +253,71 @@ RED.popover = (function() {
content: label,
delay: { show: 750, hide: 50 }
});
},
panel: function(content) {
var panel = $('<div class="red-ui-editor-dialog red-ui-popover-panel"></div>');
panel.css({ display: "none" });
panel.appendTo(document.body);
content.appendTo(panel);
var closeCallback;
function hide() {
$(document).off("mousedown.red-ui-popover-panel-close");
panel.hide();
panel.css({
height: "auto"
});
panel.remove();
}
function show(options) {
var closeCallback = options.onclose;
var target = options.target;
var align = options.align || "left";
var pos = target.offset();
var targetWidth = target.width();
var targetHeight = target.height();
var panelHeight = panel.height();
var panelWidth = panel.width();
var top = (targetHeight+pos.top);
if (top+panelHeight > $(window).height()) {
top -= (top+panelHeight)-$(window).height() + 5;
}
if (top < 0) {
panelHeight.height(panelHeight+top)
top = 0;
}
if (align === "left") {
panel.css({
top: top+"px",
left: (pos.left)+"px",
});
} else if(align === "right") {
panel.css({
top: top+"px",
left: (pos.left-panelWidth)+"px",
});
}
panel.slideDown(100);
$(document).on("mousedown.red-ui-popover-panel-close", function(event) {
if(!$(event.target).closest(panel).length && !$(event.target).closest(".red-ui-editor-dialog").length) {
if (closeCallback) {
closeCallback();
}
hide();
}
// if ($(event.target).closest(target).length) {
// event.preventDefault();
// }
})
}
return {
container: panel,
show:show,
hide:hide
}
}
}

View File

@@ -81,7 +81,7 @@
}
},
re: {value:"re",label:"regular expression",icon:"red/images/typedInput/re.svg"},
date: {value:"date",label:"timestamp",hasValue:false},
date: {value:"date",label:"timestamp",icon:"fa fa-clock-o",hasValue:false},
jsonata: {
value: "jsonata",
label: "expression",
@@ -298,7 +298,8 @@
that.uiSelect.addClass('red-ui-typedInput-focus');
});
this.optionExpandButton = $('<button tabindex="0" class="red-ui-typedInput-option-expand" style="display:inline-block"><i class="red-ui-typedInput-icon fa fa-ellipsis-h"></i></button>').appendTo(this.uiSelect);
this.optionExpandButton = $('<button tabindex="0" class="red-ui-typedInput-option-expand" style="display:inline-block"></button>').appendTo(this.uiSelect);
this.optionExpandButtonIcon = $('<i class="red-ui-typedInput-icon fa fa-ellipsis-h"></i>').appendTo(this.optionExpandButton);
this.type(this.options.default||this.typeList[0].value);
}catch(err) {
console.log(err.stack);
@@ -336,6 +337,17 @@
menu.css({
height: "auto"
});
if (menu.opts.multiple) {
var selected = [];
menu.find('input[type="checkbox"]').each(function() {
if ($(this).prop("checked")) {
selected.push($(this).data('value'))
}
})
menu.callback(selected);
}
if (this.elementDiv.is(":visible")) {
this.input.trigger("focus");
} else if (this.optionSelectTrigger.is(":visible")){
@@ -344,10 +356,12 @@
this.selectTrigger.trigger("focus");
}
},
_createMenu: function(opts,callback) {
_createMenu: function(menuOptions,opts,callback) {
var that = this;
var menu = $("<div>").addClass("red-ui-typedInput-options");
opts.forEach(function(opt) {
var menu = $("<div>").addClass("red-ui-typedInput-options red-ui-editor-dialog");
menu.opts = opts;
menu.callback = callback;
menuOptions.forEach(function(opt) {
if (typeof opt === 'string') {
opt = {value:opt,label:opt};
}
@@ -369,12 +383,20 @@
if (!opt.icon && !opt.label) {
op.text(opt.value);
}
var cb;
if (opts.multiple) {
cb = $('<input type="checkbox">').css("pointer-events","none").data('value',opt.value).prependTo(op).on("mousedown", function(evt) { evt.preventDefault() });
}
op.on("click", function(event) {
event.preventDefault();
event.stopPropagation();
callback(opt.value);
that._hideMenu(menu);
if (!opts.multiple) {
callback(opt.value);
that._hideMenu(menu);
} else {
cb.prop("checked",!cb.prop("checked"));
}
});
});
menu.css({
@@ -398,9 +420,6 @@
}
evt.stopPropagation();
})
return menu;
},
@@ -409,11 +428,22 @@
this.disarmClick = false;
return
}
if (menu.opts.multiple) {
var selected = {};
this.value().split(",").forEach(function(f) {
selected[f] = true;
})
menu.find('input[type="checkbox"]').each(function() {
$(this).prop("checked",selected[$(this).data('value')])
})
}
var that = this;
var pos = relativeTo.offset();
var height = relativeTo.height();
var menuHeight = menu.height();
var top = (height+pos.top-3);
var top = (height+pos.top);
if (top+menuHeight > $(window).height()) {
top -= (top+menuHeight)-$(window).height()+5;
}
@@ -423,7 +453,7 @@
}
menu.css({
top: top+"px",
left: (2+pos.left)+"px",
left: (pos.left)+"px",
});
menu.slideDown(100);
this._delay(function() {
@@ -471,7 +501,7 @@
this._getLabelWidth(this.selectTrigger, function(labelWidth) {
that.elementDiv.css('left',labelWidth+"px");
that.valueLabelContainer.css('left',labelWidth+"px");
if (that.optionExpandButton.is(":visible")) {
if (that.optionExpandButton.shown) {
that.elementDiv.css('right',"22px");
that.valueLabelContainer.css('right',"22px");
} else {
@@ -496,7 +526,7 @@
} else {
that.optionSelectLabel.css({'left':'0'})
that.optionSelectTrigger.css({'width':'calc( 100% - '+labelWidth+'px )'});
if (!that.optionExpandButton.is(":visible")) {
if (!that.optionExpandButton.shown) {
that.elementDiv.css({'right':0});
that.input.css({
'border-top-right-radius': '4px',
@@ -511,25 +541,35 @@
_updateOptionSelectLabel: function(o) {
var opt = this.typeMap[this.propertyType];
this.optionSelectLabel.empty();
if (o.icon) {
if (o.icon.indexOf("<") === 0) {
$(o.icon).prependTo(this.optionSelectLabel);
} else if (o.icon.indexOf("/") !== -1) {
// url
$('<img>',{src:mapDeprecatedIcon(o.icon),style:"height: 18px;"}).prependTo(this.optionSelectLabel);
if (this.typeMap[this.propertyType].valueLabel) {
if (opt.multiple) {
this.typeMap[this.propertyType].valueLabel.call(this,this.optionSelectLabel,o);
} else {
// icon class
$('<i>',{class:"red-ui-typedInput-icon "+o.icon}).prependTo(this.optionSelectLabel);
this.typeMap[this.propertyType].valueLabel.call(this,this.optionSelectLabel,o.value);
}
} else if (!opt.multiple) {
if (o.icon) {
if (o.icon.indexOf("<") === 0) {
$(o.icon).prependTo(this.optionSelectLabel);
} else if (o.icon.indexOf("/") !== -1) {
// url
$('<img>',{src:mapDeprecatedIcon(o.icon),style:"height: 18px;"}).prependTo(this.optionSelectLabel);
} else {
// icon class
$('<i>',{class:"red-ui-typedInput-icon "+o.icon}).prependTo(this.optionSelectLabel);
}
} else if (o.label) {
this.optionSelectLabel.text(o.label);
} else {
this.optionSelectLabel.text(o.value);
}
if (opt.hasValue) {
this.optionValue = o.value;
this._resize();
this.input.trigger('change',this.propertyType,this.value());
}
} else if (o.label) {
this.optionSelectLabel.text(o.label);
} else {
this.optionSelectLabel.text(o.value);
}
if (opt.hasValue) {
this.optionValue = o.value;
this._resize();
this.input.trigger('change',this.propertyType,this.value());
this.optionSelectLabel.text(o.length+" selected");
}
},
_destroy: function() {
@@ -558,7 +598,7 @@
if (this.menu) {
this.menu.remove();
}
this.menu = this._createMenu(this.typeList, function(v) { that.type(v) });
this.menu = this._createMenu(this.typeList,{},function(v) { that.type(v) });
if (currentType && !this.typeMap.hasOwnProperty(currentType)) {
this.type(this.typeList[0].value);
} else {
@@ -572,38 +612,51 @@
this._resize();
},
value: function(value) {
var that = this;
var opt = this.typeMap[this.propertyType];
if (!arguments.length) {
var v = this.input.val();
if (this.typeMap[this.propertyType].export) {
v = this.typeMap[this.propertyType].export(v,this.optionValue)
if (opt.export) {
v = opt.export(v,this.optionValue)
}
return v;
} else {
var selectedOption;
if (this.typeMap[this.propertyType].options) {
for (var i=0;i<this.typeMap[this.propertyType].options.length;i++) {
var op = this.typeMap[this.propertyType].options[i];
if (typeof op === "string") {
if (op === value) {
selectedOption = this.activeOptions[op];
var selectedOption = [];
if (opt.options) {
var checkValues = [value];
if (opt.multiple) {
selectedOption = [];
checkValues = value.split(",");
}
checkValues.forEach(function(value) {
for (var i=0;i<opt.options.length;i++) {
var op = opt.options[i];
if (typeof op === "string") {
if (op === value) {
selectedOption.push(that.activeOptions[op]);
break;
}
} else if (op.value === value) {
selectedOption.push(op);
break;
}
} else if (op.value === value) {
selectedOption = op;
break;
}
}
if (!selectedOption) {
selectedOption = {value:""}
}
})
this.input.val(value);
this._updateOptionSelectLabel(selectedOption)
if (!opt.multiple) {
if (!selectedOption.length === 0) {
selectedOption = [{value:""}];
}
this._updateOptionSelectLabel(selectedOption[0])
} else {
this._updateOptionSelectLabel(selectedOption)
}
} else {
this.input.val(value);
}
if (this.typeMap[this.propertyType].valueLabel) {
this.valueLabelContainer.empty();
this.typeMap[this.propertyType].valueLabel.call(this,this.valueLabelContainer,value);
if (opt.valueLabel) {
this.valueLabelContainer.empty();
opt.valueLabel.call(this,this.valueLabelContainer,value);
}
}
this.input.trigger('change',this.type(),value);
}
@@ -621,7 +674,7 @@
}
this.selectLabel.empty();
var image;
if (opt.icon) {
if (opt.icon && opt.showLabel !== false) {
if (opt.icon.indexOf("<") === 0) {
$(opt.icon).prependTo(this.selectLabel);
}
@@ -636,7 +689,8 @@
else {
$('<i>',{class:"red-ui-typedInput-icon "+opt.icon}).prependTo(this.selectLabel);
}
} else {
}
if (opt.hasValue === false || (opt.showLabel !== false && !opt.icon)) {
this.selectLabel.text(opt.label);
}
if (this.optionMenu) {
@@ -646,6 +700,7 @@
if (opt.options) {
if (this.optionExpandButton) {
this.optionExpandButton.hide();
this.optionExpandButton.shown = false;
}
if (this.optionSelectTrigger) {
this.optionSelectTrigger.show();
@@ -668,36 +723,50 @@
if (!that.activeOptions.hasOwnProperty(that.optionValue)) {
that.optionValue = null;
}
this.optionMenu = this._createMenu(opt.options,function(v){
that._updateOptionSelectLabel(that.activeOptions[v]);
if (!opt.hasValue) {
that.value(that.activeOptions[v].value)
}
});
var op;
if (!opt.hasValue) {
var currentVal = this.input.val();
var validValue = false;
for (var i=0;i<opt.options.length;i++) {
op = opt.options[i];
if (typeof op === "string" && op === currentVal) {
that._updateOptionSelectLabel({value:currentVal});
validValue = true;
break;
} else if (op.value === currentVal) {
that._updateOptionSelectLabel(op);
validValue = true;
break;
var currentVal = this.input.val();
if (!opt.multiple) {
for (var i=0;i<opt.options.length;i++) {
op = opt.options[i];
if (typeof op === "string" && op === currentVal) {
that._updateOptionSelectLabel({value:currentVal});
validValue = true;
break;
} else if (op.value === currentVal) {
that._updateOptionSelectLabel(op);
validValue = true;
break;
}
}
}
if (!validValue) {
op = opt.options[0];
if (typeof op === "string") {
this.value(op);
that._updateOptionSelectLabel({value:op});
} else {
this.value(op.value);
that._updateOptionSelectLabel(op);
if (!validValue) {
op = opt.options[0];
if (typeof op === "string") {
this.value(op);
that._updateOptionSelectLabel({value:op});
} else {
this.value(op.value);
that._updateOptionSelectLabel(op);
}
}
} else {
// Check to see if value is a valid csv of
// options.
var currentValues = {};
currentVal.split(",").forEach(function(v) {
if (v) {
currentValues[v] = true;
}
});
for (var i=0;i<opt.options.length;i++) {
op = opt.options[i];
delete currentValues[op.value||op];
}
if (!$.isEmptyObject(currentValues)) {
// Invalid, set to default/empty
this.value((opt.default||[]).join(","));
}
}
} else {
@@ -733,7 +802,21 @@
this.optionSelectTrigger.hide();
}
}
this.optionMenu = this._createMenu(opt.options,opt,function(v){
if (!opt.multiple) {
that._updateOptionSelectLabel(that.activeOptions[v]);
if (!opt.hasValue) {
that.value(that.activeOptions[v].value)
}
} else {
that._updateOptionSelectLabel(v);
if (!opt.hasValue) {
that.value(v.join(","))
}
}
});
}
this._trigger("typechange",null,this.propertyType);
this.input.trigger('change',this.propertyType,this.value());
} else {
if (this.optionSelectTrigger) {
@@ -758,17 +841,44 @@
this.elementDiv.show();
}
if (this.optionExpandButton) {
if (opt.expand && typeof opt.expand === 'function') {
if (opt.expand) {
if (opt.expand.icon) {
this.optionExpandButtonIcon.removeClass().addClass("red-ui-typedInput-icon fa "+opt.expand.icon)
} else {
this.optionExpandButtonIcon.removeClass().addClass("red-ui-typedInput-icon fa fa-ellipsis-h")
}
this.optionExpandButton.shown = true;
this.optionExpandButton.show();
this.optionExpandButton.off('click');
this.optionExpandButton.on('click',function(evt) {
evt.preventDefault();
opt.expand.call(that);
if (typeof opt.expand === 'function') {
opt.expand.call(that);
} else {
var container = $('<div>');
var content = opt.expand.content.call(that,container);
var panel = RED.popover.panel(container);
panel.container.css({
width:that.valueLabelContainer.width()
});
if (opt.expand.minWidth) {
panel.container.css({
minWidth: opt.expand.minWidth+"px"
});
}
panel.show({
target:that.optionExpandButton,
onclose:content.onclose,
align: "right"
});
}
})
} else {
this.optionExpandButton.shown = false;
this.optionExpandButton.hide();
}
}
this._trigger("typechange",null,this.propertyType);
this.input.trigger('change',this.propertyType,this.value());
}
if (!image) {

View File

@@ -19,7 +19,6 @@
*/
RED.editor = (function() {
var editStack = [];
var editing_node = null;
var editing_config_node = null;
@@ -526,7 +525,7 @@ RED.editor = (function() {
} else if (node.type.indexOf("subflow:")===0) {
var subflow = RED.nodes.subflow(node.type.substring(8));
label = RED._("subflow.editSubflowInstance",{name:RED.utils.sanitize(subflow.name)})
} else {
} else if (node._def !== undefined) {
if (typeof node._def.paletteLabel !== "undefined") {
try {
label = RED.utils.sanitize((typeof node._def.paletteLabel === "function" ? node._def.paletteLabel.call(node._def) : node._def.paletteLabel)||"");
@@ -546,148 +545,7 @@ RED.editor = (function() {
return label;
}
function buildEnvForm(container, node) {
var env_container = $('#node-input-env-container');
env_container
.css({
'min-height':'150px',
'min-width':'450px'
})
.editableList({
addItem: function(container, i, opt) {
var row = $('<div/>').appendTo(container);
if (opt.parent) {
$('<div/>', {
class:"uneditable-input",
style: "margin-left: 5px; width: calc(40% - 8px)",
}).appendTo(row).text(opt.name);
} else {
$('<input/>', {
class: "node-input-env-name",
type: "text",
style: "margin-left: 5px; width: calc(40% - 8px)",
placeholder: RED._("common.label.name")
}).attr("autocomplete","disable").appendTo(row).val(opt.name);
}
var valueField = $('<input/>',{
class: "node-input-env-value",
type: "text",
style: "margin-left: 5px; width: calc(60% - 8px)"
}).attr("autocomplete","disable").appendTo(row)
valueField.typedInput({default:'str',
types:['str','num','bool','json','bin','env']
});
valueField.typedInput('type', opt.parent?(opt.type||opt.parent.type):opt.type);
valueField.typedInput('value', opt.parent?((opt.value !== undefined)?opt.value:opt.parent.value):opt.value);
var actionButton = $('<a/>',{href:"#",class:"red-ui-editableList-item-remove red-ui-button red-ui-button-small"}).appendTo(container);
$('<i/>',{class:"fa "+(opt.parent?"fa-reply":"fa-remove")}).appendTo(actionButton);
container.parent().addClass("red-ui-editableList-item-removable");
if (opt.parent) {
if ((opt.value !== undefined) && (opt.value !== opt.parent.value || opt.type !== opt.parent.type)) {
actionButton.show();
} else {
actionButton.hide();
}
var restoreTip = RED.popover.tooltip(actionButton,RED._("subflow.env.restore"));
valueField.on("change", function(evt) {
var newType = valueField.typedInput('type');
var newValue = valueField.typedInput('value');
if (newType === opt.parent.type && newValue === opt.parent.value) {
actionButton.hide();
} else {
actionButton.show();
}
})
actionButton.on("click", function(evt) {
evt.preventDefault();
restoreTip.close();
valueField.typedInput('type', opt.parent.type);
valueField.typedInput('value', opt.parent.value);
})
} else {
var removeTip = RED.popover.tooltip(actionButton,RED._("subflow.env.remove"));
actionButton.on("click", function(evt) {
evt.preventDefault();
removeTip.close();
container.parent().addClass("red-ui-editableList-item-deleting")
container.fadeOut(300, function() {
env_container.editableList('removeItem',opt);
});
});
}
},
sortable: false,
removable: false
});
var parentEnv = {};
var envList = [];
if (/^subflow:/.test(node.type)) {
var subflowDef = RED.nodes.subflow(node.type.substring(8));
if (subflowDef.env) {
subflowDef.env.forEach(function(env) {
var item = {
name:env.name,
parent: {
type: env.type,
value: env.value
}
}
envList.push(item);
parentEnv[env.name] = item;
})
}
}
if (node.env) {
for (var i = 0; i < node.env.length; i++) {
var env = node.env[i];
if (parentEnv.hasOwnProperty(env.name)) {
parentEnv[env.name].type = env.type;
parentEnv[env.name].value = env.value;
} else {
envList.push({
name: env.name,
type: env.type,
value: env.value
});
}
}
}
envList.forEach(function(env) {
env_container.editableList('addItem', env);
})
}
function exportEnvList(list) {
if (list) {
var env = [];
list.each(function(i) {
var entry = $(this);
var item = entry.data('data');
var name = (item.parent?item.name:entry.find(".node-input-env-name").val()).trim();
if (name !== "") {
var valueInput = entry.find(".node-input-env-value");
var value = valueInput.typedInput("value");
var type = valueInput.typedInput("type");
if (!item.parent || (item.parent.value !== value || item.parent.type !== type)) {
var item = {
name: name,
type: type,
value: value
};
env.push(item);
}
}
});
return env;
}
return null;
}
function isSameEnv(env0, env1) {
function isSameObj(env0, env1) {
return (JSON.stringify(env0) === JSON.stringify(env1));
}
@@ -713,8 +571,8 @@ RED.editor = (function() {
$(this).attr("data-i18n",keys.join(";"));
});
if ((type === "subflow") || (type === "subflow-template")) {
buildEnvForm(dialogForm, node);
if (type === "subflow-template" || type === "subflow") {
RED.subflow.buildEditForm(dialogForm,type,node);
}
// Add dummy fields to prevent 'Enter' submitting the form in some
@@ -857,7 +715,7 @@ RED.editor = (function() {
}
return result;
}
function showIconPicker(container, node, iconPath, done) {
function showIconPicker(container, node, iconPath, faOnly, done) {
var containerPos = container.offset();
var pickerBackground = $('<div>').css({
position: "absolute",top:0,bottom:0,left:0,right:0,zIndex:20
@@ -912,7 +770,14 @@ RED.editor = (function() {
done(null);
});
var iconSets = RED.nodes.getIconSets();
var backgroundColor = node && RED.utils.getNodeColor(node.type, node._def);
if (!node && faOnly) {
iconList.addClass("red-ui-icon-list-dark");
}
Object.keys(iconSets).forEach(function(moduleName) {
if (faOnly && (moduleName !== "font-awesome")) {
return;
}
var icons = iconSets[moduleName];
if (icons.length > 0) {
// selectIconModule.append($("<option></option>").val(moduleName).text(moduleName));
@@ -921,10 +786,13 @@ RED.editor = (function() {
icons.forEach(function(icon) {
var iconDiv = $('<div>',{class:"red-ui-icon-list-icon"}).appendTo(iconList);
var nodeDiv = $('<div>',{class:"red-ui-search-result-node"}).appendTo(iconDiv);
var colour = RED.utils.getNodeColor(node.type, node._def);
var icon_url = RED.settings.apiRootUrl+"icons/"+moduleName+"/"+icon;
iconDiv.data('icon',icon_url);
nodeDiv.css('backgroundColor',colour);
if (node) {
nodeDiv.css({
'backgroundColor': backgroundColor
});
}
var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
RED.utils.createIconElement(icon_url, iconContainer, true);
@@ -1067,8 +935,65 @@ RED.editor = (function() {
var i,row;
if (node.type === "subflow") {
var categoryRow = $("<div/>", {
class: "form-row"
}).appendTo(dialogForm);
$("<label/>", {
for: "subflow-appearance-input-category",
"data-i18n": "editor:subflow.category"
}).appendTo(categoryRow);
var categorySelector = $("<select/>", {
id: "subflow-appearance-input-category"
}).css({
width: "250px"
}).appendTo(categoryRow);
$("<input/>", {
type: "text",
id: "subflow-appearance-input-custom-category"
}).css({
display: "none",
"margin-left": "10px",
width: "calc(100% - 250px)"
}).appendTo(categoryRow);
var categories = RED.palette.getCategories();
categories.sort(function(A,B) {
return A.label.localeCompare(B.label);
})
categories.forEach(function(cat) {
categorySelector.append($("<option/>").val(cat.id).text(cat.label));
})
categorySelector.append($("<option/>").attr('disabled',true).text("---"));
categorySelector.append($("<option/>").val("_custom_").text(RED._("palette.addCategory")));
$("#subflow-appearance-input-category").on("change", function() {
var val = $(this).val();
if (val === "_custom_") {
$("#subflow-appearance-input-category").width(120);
$("#subflow-appearance-input-custom-category").show();
} else {
$("#subflow-appearance-input-category").width(250);
$("#subflow-appearance-input-custom-category").hide();
}
})
$("#subflow-appearance-input-category").val(node.category||"subflows");
var userCount = 0;
var subflowType = "subflow:"+node.id;
RED.nodes.eachNode(function(n) {
if (n.type === subflowType) {
userCount++;
}
});
$("#red-ui-editor-subflow-user-count")
.text(RED._("subflow.subflowInstances", {count:userCount})).show();
}
$('<div class="form-row">'+
'<label for="node-input-show-label-btn" data-i18n="editor.label"></label>'+
'<span style="margin-right: 2px;"/>'+
'<input type="checkbox" id="node-input-show-label"/>'+
'</div>').appendTo(dialogForm);
@@ -1106,7 +1031,7 @@ RED.editor = (function() {
} else {
iconPath = RED.utils.getDefaultNodeIcon(node._def, node);
}
showIconPicker(iconRow,node,iconPath,function(newIcon) {
showIconPicker(iconRow,node,iconPath,false,function(newIcon) {
$("#red-ui-editor-node-icon").text(newIcon||"");
var icon_url = RED.utils.getNodeIcon(node._def,{type:node.type,icon:newIcon});
RED.utils.createIconElement(icon_url, iconContainer, true);
@@ -1160,6 +1085,7 @@ RED.editor = (function() {
}
}
function updateLabels(editing_node, changes, outputMap) {
var inputLabels = $("#red-ui-editor-node-label-form-inputs").children().find("input");
var outputLabels = $("#red-ui-editor-node-label-form-outputs").children().find("input");
@@ -1550,13 +1476,13 @@ RED.editor = (function() {
if (type === "subflow") {
var old_env = editing_node.env;
var new_env = exportEnvList($("#node-input-env-container").editableList("items"));
if (!isSameEnv(old_env, new_env)) {
var new_env = RED.subflow.exportSubflowInstanceEnv(editing_node);
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;
@@ -1674,6 +1600,19 @@ RED.editor = (function() {
buildEditForm(nodePropertiesTab.content,"dialog-form",type,ns,node);
editorTabs.addTab(nodePropertiesTab);
if (/^subflow:/.test(node.type)) {
var subflowPropertiesTab = {
id: "editor-subflow-envProperties",
label: RED._("editor-tab.envProperties"),
name: RED._("editor-tab.envProperties"),
content: $('<div>', {class:"red-ui-tray-content"}).appendTo(editorContent).hide(),
iconClass: "fa fa-list"
};
RED.subflow.buildPropertiesForm(subflowPropertiesTab.content,node);
editorTabs.addTab(subflowPropertiesTab);
}
if (!node._def.defaults || !node._def.defaults.hasOwnProperty('info')) {
var descriptionTab = {
id: "editor-tab-description",
@@ -1942,7 +1881,6 @@ RED.editor = (function() {
var configId = editing_config_node.id;
var configAdding = adding;
var configTypeDef = RED.nodes.getType(configType);
if (configTypeDef.oneditcancel) {
// TODO: what to pass as this to call
if (configTypeDef.oneditcancel) {
@@ -2286,9 +2224,9 @@ RED.editor = (function() {
editing_node.icon = icon;
changed = true;
}
var newCategory = $("#subflow-input-category").val().trim();
var newCategory = $("#subflow-appearance-input-category").val().trim();
if (newCategory === "_custom_") {
newCategory = $("#subflow-input-custom-category").val().trim();
newCategory = $("#subflow-appearance-input-custom-category").val().trim();
if (newCategory === "") {
newCategory = editing_node.category;
}
@@ -2312,8 +2250,8 @@ RED.editor = (function() {
}
var old_env = editing_node.env;
var new_env = exportEnvList($("#node-input-env-container").editableList("items"));
if (!isSameEnv(old_env, new_env)) {
var new_env = RED.subflow.exportSubflowTemplateEnv($("#node-input-env-container").editableList("items"));
if (!isSameObj(old_env, new_env)) {
editing_node.env = new_env;
changes.env = editing_node.env;
changed = true;
@@ -2359,21 +2297,39 @@ RED.editor = (function() {
],
resize: function(size) {
$(".red-ui-tray-content").height(size.height - 50);
// var form = $(".red-ui-tray-content form").height(size.height - 50 - 40);
var rows = $("#dialog-form>div:not(.node-input-env-container-row)");
var height = size.height;
for (var i=0; i<rows.size(); i++) {
height -= $(rows[i]).outerHeight(true);
var envContainer = $("#node-input-env-container");
if (envContainer.length) {
// var form = $(".red-ui-tray-content form").height(size.height - 50 - 40);
var rows = $("#dialog-form>div:not(#subflow-env-tabs-content)");
var height = size.height;
for (var i=0; i<rows.size(); i++) {
height -= $(rows[i]).outerHeight(true);
}
// var editorRow = $("#dialog-form>div.node-input-env-container-row");
// height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
$("#node-input-env-container").editableList('height',height-95);
}
var editorRow = $("#dialog-form>div.node-input-env-container-row");
height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
$("#node-input-env-container").editableList('height',height-80);
},
open: function(tray) {
var trayFooter = tray.find(".red-ui-tray-footer");
var trayFooterLeft = $("<div/>", {
class: "red-ui-tray-footer-left"
}).appendTo(trayFooter)
var trayBody = tray.find('.red-ui-tray-body');
trayBody.parent().css('overflow','hidden');
if (editing_node.type === "subflow") {
var span = $("<span/>").css({
"margin-left": "10px"
}).appendTo(trayFooterLeft);
$("<i/>", {
class: "fa fa-info-circle"
}).appendTo(span);
$("<span/>").text(" ").appendTo(span);
$("<i/>", {
id: "red-ui-editor-subflow-user-count"
}).appendTo(span);
}
if (editing_node) {
RED.sidebar.info.refresh(editing_node);
@@ -2433,46 +2389,9 @@ RED.editor = (function() {
buildAppearanceForm(appearanceTab.content,editing_node);
editorTabs.addTab(appearanceTab);
$("#subflow-input-name").val(subflow.name);
RED.text.bidi.prepareInput($("#subflow-input-name"));
$("#subflow-input-category").empty();
var categories = RED.palette.getCategories();
categories.sort(function(A,B) {
return A.label.localeCompare(B.label);
})
categories.forEach(function(cat) {
$("#subflow-input-category").append($("<option></option>").val(cat.id).text(cat.label));
})
$("#subflow-input-category").append($("<option></option>").attr('disabled',true).text("---"));
$("#subflow-input-category").append($("<option></option>").val("_custom_").text(RED._("palette.addCategory")));
$("#subflow-input-category").on("change", function() {
var val = $(this).val();
if (val === "_custom_") {
$("#subflow-input-category").width(120);
$("#subflow-input-custom-category").show();
} else {
$("#subflow-input-category").width(250);
$("#subflow-input-custom-category").hide();
}
})
$("#subflow-input-category").val(subflow.category||"subflows");
var userCount = 0;
var subflowType = "subflow:"+editing_node.id;
RED.nodes.eachNode(function(n) {
if (n.type === subflowType) {
userCount++;
}
});
$("#subflow-dialog-user-count").text(RED._("subflow.subflowInstances", {count:userCount})).show();
trayBody.i18n();
finishedBuilding = true;
},
@@ -2625,6 +2544,8 @@ RED.editor = (function() {
validateNode: validateNode,
updateNodeProperties: updateNodeProperties, // TODO: only exposed for edit-undo
showIconPicker:showIconPicker,
/**
* Show a type editor.
* @param {string} type - the type to display

View File

@@ -152,7 +152,7 @@ RED.palette = (function() {
function getPaletteNode(type) {
return $(".red-ui-palette-node[data-palette-type='"+type+"']");
}
function addNodeType(nt,def) {
if (getPaletteNode(nt).length) {
return;
@@ -241,7 +241,6 @@ RED.palette = (function() {
RED.sidebar.info.set(helpText,RED._("sidebar.info.nodeHelp"));
});
var chart = $("#red-ui-workspace-chart");
var chartOffset = chart.offset();
var chartSVG = $("#red-ui-workspace-chart>svg").get(0);
var activeSpliceLink;
var mouseX;
@@ -265,8 +264,8 @@ RED.palette = (function() {
ui.originalPosition.left = $('#' + e.target.id).offset().left;
if (def.inputs > 0 && def.outputs > 0) {
mouseX = ui.position.left-paletteWidth+(ui.helper.width()/2) - chartOffset.left + chart.scrollLeft();
mouseY = ui.position.top-paletteTop+(ui.helper.height()/2) - chartOffset.top + chart.scrollTop();
mouseX = ui.position.left - paletteWidth + (ui.helper.width()/2) + chart.scrollLeft();
mouseY = ui.position.top - paletteTop + (ui.helper.height()/2) + chart.scrollTop();
if (!spliceTimer) {
spliceTimer = setTimeout(function() {
var nodes = [];
@@ -416,7 +415,7 @@ RED.palette = (function() {
createCategory(newCategory,category,category,"node-red");
var currentCategoryNode = paletteNode.closest(".red-ui-palette-category");
var newCategoryNode = $("#palette-"+category);
var newCategoryNode = $("#red-ui-palette-"+category);
newCategoryNode.append(paletteNode);
if (newCategoryNode.find(".red-ui-palette-node").length === 1) {
categoryContainers[category].open();

File diff suppressed because it is too large Load Diff

View File

@@ -406,6 +406,7 @@ RED.view = (function() {
RED.actions.add("core:delete-selection",deleteSelection);
RED.actions.add("core:edit-selected-node",editSelection);
RED.actions.add("core:undo",RED.history.pop);
RED.actions.add("core:redo",RED.history.redo);
RED.actions.add("core:select-all-nodes",selectAll);
RED.actions.add("core:zoom-in",zoomIn);
RED.actions.add("core:zoom-out",zoomOut);
@@ -3166,7 +3167,7 @@ RED.view = (function() {
var statusClass = "red-ui-flow-node-status-"+(d.status.shape||"dot")+"-"+d.status.fill;
thisNode.selectAll(".red-ui-flow-node-status").style("display","inline").attr("class","red-ui-flow-node-status "+statusClass);
}
if (d.status.text) {
if (d.status.hasOwnProperty('text')) {
thisNode.selectAll(".red-ui-flow-node-status-label").text(d.status.text);
} else {
thisNode.selectAll(".red-ui-flow-node-status-label").text("");

View File

@@ -60,10 +60,12 @@
.red-ui-icon-picker {
a {
text-decoration: none;
color: $primary-text-color;
}
a:hover,
a:focus {
text-decoration: none;
color: $primary-text-color;
}
p {

View File

@@ -79,6 +79,9 @@
}
a {
img {
max-width: 14px;
}
.fa {
width: 20px;
margin-left: -25px;

View File

@@ -190,6 +190,10 @@ button.red-ui-tray-resize-button {
border-color: $form-input-border-error-color !important;
}
.input-updated {
border-color: $node-selected-color !important;
}
.form-row {
clear: both;
color: $form-text-color;
@@ -421,6 +425,15 @@ button.red-ui-button-small
height: 200px;
overflow-y: scroll;
line-height: 0px;
&.red-ui-icon-list-dark {
.red-ui-palette-icon-fa {
color: $secondary-text-color;
}
.red-ui-palette-icon-container {
background: $secondary-background;
border-radius: 4px;
}
}
}
.red-ui-icon-list-icon {
display: inline-block;
@@ -428,6 +441,7 @@ button.red-ui-button-small
padding: 4px;
cursor: pointer;
border-radius: 4px;
&:hover {
background: $list-item-background-hover;
}
@@ -599,3 +613,405 @@ button.red-ui-toggleButton.toggle {
border: solid 1px $primary-border-color;
border-radius: 2px;
}
.red-ui-editor-subflow-env-ui-row {
margin-right: 3px;
>div {
display: grid;
grid-template-columns: 16px 40px 35% auto;
}
>div:first-child {
font-size: 0.9em;
color: $tertiary-text-color;
margin: 3px 0 -4px;
>div {
padding-left: 3px;
}
}
>div:last-child {
>div {
height: 40px;
line-height: 30px;
display: inline-block;
box-sizing: border-box;
// border-left: 2px dashed $secondary-border-color;
// border-bottom: 2px dashed $secondary-border-color;
// border: 1px dashed $secondary-border-color;
border-right: none;
&:not(:first-child) {
padding: 3px;
}
// &:last-child {
// border-right: 1px dashed $secondary-border-color;
// }
.placeholder-input {
position: relative;
padding: 0 3px;
line-height: 24px;
opacity: 0.8
}
.red-ui-typedInput-value-label,.red-ui-typedInput-option-label {
select,.placeholder-input {
margin: 3px;
height: 26px;
width: calc(100% - 10px);
padding-left: 3px;
}
.placeholder-input {
span:first-child {
display:inline-block;
height: 100%;
width: 20px;
text-align:center;
border-right: 1px solid $secondary-border-color;
background: $tertiary-background;
}
}
input[type="checkbox"] {
margin-left: 8px;
margin-top: 0;
height: 100%;
}
}
}
>div:nth-child(1) {
border: none;
padding: 2px;
.red-ui-editableList-item-handle {
position:relative;
top: 0px;
color: $tertiary-text-color;
}
}
>div:nth-child(2) {
margin: 4px;
height: 32px;
border: 1px dashed $secondary-border-color;
text-align: center;
a {
display: block;
width: 100%;
height: 100%;
line-height: 32px;
&:hover {
background: $secondary-background-hover;
}
i {
height: 100%;
vertical-align: middle;
}
}
}
>div:nth-child(3) {
position: relative;
input {
width: 100%;
}
}
}
}
span.red-ui-editor-subflow-env-lang-icon {
position: absolute;
display: inline-block;
background: $secondary-background;
opacity: 0.8;
width: 20px;
line-height: 32px;
height: 32px;
text-align: center;
top: 4px;
right: 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
// .red-ui-editor-subflow-ui-grid {
// width: 100%;
// .red-ui-editableList-container {
// border: none;
// border-radius: 0;
// }
// .red-ui-editableList-container li {
// border: none;
// padding: 0;
// &:not(:first-child) .red-ui-editableList-item-content >div:first-child >div {
// border-top: none;
// }
// &.ui-sortable-helper {
// border: 2px dashed $secondary-border-color;
// .red-ui-editableList-item-content {
// >div {
// border: none;
// opacity: 0.7
// }
//
// }
// }
// }
//
// .red-ui-editableList-item-content {
// >div>div {
// display: inline-block;
// box-sizing: border-box;
// border-left: 1px dashed $secondary-border-color;
// border-bottom: 1px dashed $secondary-border-color;
// }
// >div:first-child {
// font-size: 0.9em;
// display: grid;
// grid-template-columns: 25px auto 20px;
// >div {
// border-top: 1px dashed $secondary-border-color;
// padding: 1px;
// }
// >div:nth-child(3) {
// border-top: none;
// border-bottom: none;
// // width: 20px;
// }
// }
// >div:last-child {
// display: grid;
// grid-template-columns: 25px 140px auto 20px;
// >div {
// height: 48px;
// line-height: 30px;
// // display: inline-block;
// // height: 48px;
// // line-height: 30px;
// // box-sizing: border-box;
// //
// // border-left: 2px dashed $secondary-border-color;
// border-top: none;
// // border-bottom: 2px dashed $secondary-border-color;
// &:not(:first-child) {
// padding: 6px 3px;
// }
// .placeholder-input {
// position: relative;
// padding: 0 3px;
// line-height: 24px;
// opacity: 0.8
// }
// .red-ui-typedInput-value-label,.red-ui-typedInput-option-label {
// select,.placeholder-input {
// margin: 3px;
// height: 26px;
// width: calc(100% - 10px);
// padding-left: 3px;
// }
// input[type="checkbox"] {
// margin-left: 8px;
// margin-top: 0;
// height: 100%;
// }
// }
// }
// >div:nth-child(1) {
// text-align: center;
// a {
// display: block;
// width: 100%;
// height: 100%;
// line-height: 45px;
// &:hover {
// background: $secondary-background-hover;
// }
// }
// }
// >div:nth-child(2) {
// input {
// width: 100%;
// }
// // width: 140px;
// }
// >div:nth-child(3) {
// position: relative;
// .options-button {
// position: absolute;
// top: calc(50% - 10px);
// margin-right: 2px;
// right: 2px;
// }
// }
// >div:nth-child(4) {
// border-top: none;
// border-bottom: none;
// // width: 20px;
// }
//
// }
// }
// }
.red-ui-editor-subflow-ui-edit-panel {
padding-bottom: 3px;
background: $primary-background;
.red-ui-editableList-border {
border: none;
border-radius: 0;
border-bottom: 1px solid $secondary-border-color;
}
.red-ui-editableList-container {
}
.red-ui-editableList-addButton {
margin-left: 2px;
}
.red-ui-editableList-header {
background: $primary-background;
display: grid;
grid-template-columns: 50% 50%;
color: $secondary-text-color;
div:first-child {
padding-left: 23px;
}
div:last-child {
padding-left: 3px;
}
}
.red-ui-editableList-container {
padding: 0 1px;
li {
background: $secondary-background;
// border-bottom: none;
padding: 0;
.red-ui-editableList-item-content {
display: grid;
grid-template-columns: 50% 50%;
>div {
position:relative;
}
}
input {
margin-bottom: 0;
border:none;
width: 100%;
border-right: 1px solid $secondary-border-color;
border-radius: 0;
&:focus {
box-shadow: 0 0 0 1px inset $form-input-focus-color;
}
&:first-child {
border-left: 1px solid $secondary-border-color;
}
}
button.red-ui-typedInput-type-select, button.red-ui-typedInput-option-expand, button.red-ui-typedInput-option-trigger {
border-radius: 0;
height: 34px;
}
.red-ui-typedInput-container {
border-radius: 0;
border: none;
input.red-ui-typedInput-input {
height: 34px;
border-right: none;
}
}
.red-ui-editor-subflow-env-lang-icon {
top: 1px;
right: 1px;
border-top-right-radius:0;
border-bottom-right-radius:0;
}
.red-ui-editableList-item-remove {
right: 3px;
}
}
}
}
.node-input-env-locales-row {
position: relative;
top: -20px;
float: right;
select {
width: 160px;
height: 20px;
min-width: 20px;
line-height: 18px;
font-size: 10px;
}
}
.node-input-env-container-row {
min-width: 470px;
position: relative;
.red-ui-editableList-item-content {
label {
margin-bottom: 0;
line-height: 32px;
span {
display: inline-block;
width: 20px;
text-align: center;
}
}
>div:first-child {
display: grid;
padding-left: 5px;
grid-template-columns: 40% auto 37px;
> :first-child {
width: calc(100% - 5px);
}
input {
width: calc(100% - 5px);
}
}
&.red-ui-editor-subflow-env-editable {
>div:first-child {
padding-left: 0;
grid-template-columns: 24px 40% auto 37px;
> a:first-child {
text-align: center;
line-height: 32px;
i.fa-angle-right {
transition: all 0.2s linear;
}
&.expanded {
i.fa-angle-right {
transform: rotate(90deg);
}
}
}
}
}
}
.red-ui-editableList-border .red-ui-editableList-header {
border-top-left-radius: 4px;
border-top-right-radius: 4px;
background: $tertiary-background;
padding: 0;
>div {
display: grid;
grid-template-columns: 24px 40% auto 37px;
>div {
display: inline-block;
}
}
}
.red-ui-editableList-container {
padding: 0;
.red-ui-editableList-item-handle {
top: 25px;
}
.red-ui-editableList-item-remove {
top: 25px;
right: 5px;
}
}
}
#subflow-input-ui {
// .form-row {
// display: grid;
// grid-template-columns: 120px auto;
// label span {
// display: inline-block;
// width: 20px;
// text-align: center;
// }
// }
}

View File

@@ -150,7 +150,8 @@
input[type="tel"],
input[type="color"],
div[contenteditable="true"],
.uneditable-input {
.uneditable-input,
.placeholder-input {
box-sizing: border-box;
display: inline-block;
height: 34px;
@@ -190,7 +191,8 @@
input[type="tel"],
input[type="color"],
div[contenteditable="true"],
.uneditable-input {
.uneditable-input,
.placeholder-input {
background-color: $form-input-background;
border: 1px solid $form-input-border-color;
}

View File

@@ -192,6 +192,7 @@
color: $header-menu-color;
padding: 3px 40px;
img {
max-width: 100%;
margin-right: 10px;
padding: 4px;
border: 3px solid transparent;

View File

@@ -162,3 +162,15 @@
background: none;
color: $tertiary-text-color;
}
.red-ui-popover-panel {
@include component-shadow;
font-family: $primary-font;
font-size: $primary-font-size;
position: absolute;
box-sizing: border-box;
border: 1px solid $primary-border-color;
background: $secondary-background;
z-index: 2000;
}

View File

@@ -58,118 +58,6 @@
text-overflow: ellipsis;
}
button.red-ui-typedInput-type-select,
button.red-ui-typedInput-option-expand,
button.red-ui-typedInput-option-trigger
{
text-align: left;
border: none;
position: absolute;
box-sizing: border-box;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
padding: 0 1px 0 5px;
display:inline-block;
background: $form-button-background;
height: 32px;
line-height: 32px;
vertical-align: middle;
color: $form-text-color;
i.red-ui-typedInput-icon {
margin-left: 1px;
margin-right: 2px;
vertical-align: middle;
}
&.disabled {
cursor: default;
i.red-ui-typedInput-icon {
color: $secondary-text-color-disabled;
}
}
.red-ui-typedInput-type-label,.red-ui-typedInput-option-label {
display: inline-block;
height: 100%;
padding: 0 1px 0 5px;
img {
max-width: none;
}
}
&:not(.disabled):hover {
text-decoration: none;
background: $workspace-button-background-hover;
}
&:focus {
text-decoration: none;
outline: none;
box-shadow: inset 0 0 0 1px $form-input-focus-color;
}
&:not(.disabled):active {
background: $workspace-button-background-active;
text-decoration: none;
}
&.red-ui-typedInput-full-width {
width: 100%;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
&:before {
content:'';
display: inline-block;
height: 100%;
vertical-align: middle;
}
}
button.red-ui-typedInput-option-expand {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
right: 0;
}
button.red-ui-typedInput-option-trigger {
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
padding: 0 0 0 0;
position:absolute;
right: 0;
.red-ui-typedInput-option-label {
background:$form-button-background;
color: $form-text-color;
position:absolute;
left:0;
right:23px;
top: 0;
padding: 0 5px 0 8px;
i.red-ui-typedInput-icon {
margin-right: 4px;
}
}
.red-ui-typedInput-option-caret {
top: 0;
position: absolute;
right: 0;
bottom: 0;
width: 17px;
padding-left: 6px;
&:before {
content:'';
display: inline-block;
height: 100%;
vertical-align: middle;
}
}
&:focus {
box-shadow: none;
}
&:focus .red-ui-typedInput-option-caret {
box-shadow: inset 0 0 0 1px $form-input-focus-color;
}
}
}
.red-ui-typedInput-options {
@include component-shadow;
@@ -180,6 +68,7 @@
max-height: 350px;
overflow-y: auto;
border: 1px solid $primary-border-color;
box-sizing: border-box;
background: $secondary-background;
z-index: 2000;
a {
@@ -200,8 +89,124 @@
text-decoration: none;
background: $workspace-button-background-active;
}
input[type="checkbox"] {
margin-right: 6px;
}
}
.red-ui-typedInput-icon {
margin-right: 4px;
margin-right: 6px;
}
}
button.red-ui-typedInput-type-select,
button.red-ui-typedInput-option-expand,
button.red-ui-typedInput-option-trigger
{
text-align: left;
border: none;
position: absolute;
box-sizing: border-box;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
padding: 0 1px 0 5px;
display:inline-block;
background: $form-button-background;
height: 32px;
line-height: 30px;
min-width: 23px;
vertical-align: middle;
color: $form-text-color;
i.red-ui-typedInput-icon {
margin-left: 1px;
margin-right: 2px;
vertical-align: middle;
}
&.disabled {
cursor: default;
i.red-ui-typedInput-icon {
color: $secondary-text-color-disabled;
}
}
.red-ui-typedInput-type-label,.red-ui-typedInput-option-label {
display: inline-block;
vertical-align: middle;
height: 100%;
padding: 0 1px 0 5px;
img {
max-width: none;
}
}
&:not(.disabled):hover {
text-decoration: none;
background: $workspace-button-background-hover;
}
&:focus {
text-decoration: none;
outline: none;
box-shadow: inset 0 0 0 1px $form-input-focus-color;
}
&:not(.disabled):active {
background: $workspace-button-background-active;
text-decoration: none;
}
&.red-ui-typedInput-full-width {
width: 100%;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
&:before {
content:'';
display: inline-block;
height: 100%;
vertical-align: middle;
}
}
button.red-ui-typedInput-option-expand {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
right: 0;
}
button.red-ui-typedInput-option-trigger {
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
padding: 0 0 0 0;
position:absolute;
right: 0;
.red-ui-typedInput-option-label {
background:$form-button-background;
color: $form-text-color;
position:absolute;
left:0;
right:23px;
top: 0;
padding: 0 5px 0 8px;
i.red-ui-typedInput-icon {
margin-right: 4px;
}
}
.red-ui-typedInput-option-caret {
top: 0;
position: absolute;
right: 0;
bottom: 0;
width: 17px;
padding-left: 5px;
&:before {
content:'';
display: inline-block;
height: 100%;
vertical-align: middle;
}
}
&:focus {
box-shadow: none;
}
&:focus .red-ui-typedInput-option-caret {
box-shadow: inset 0 0 0 1px $form-input-focus-color;
}
}