2014-02-26 23:58:44 +01:00
|
|
|
/**
|
2017-01-11 16:24:33 +01:00
|
|
|
* Copyright JS Foundation and other contributors, http://js.foundation
|
2014-02-26 23:58:44 +01:00
|
|
|
*
|
|
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
|
|
* you may not use this file except in compliance with the License.
|
|
|
|
* You may obtain a copy of the License at
|
|
|
|
*
|
|
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
*
|
|
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
|
|
* See the License for the specific language governing permissions and
|
|
|
|
* limitations under the License.
|
|
|
|
**/
|
2014-08-08 01:01:35 +02:00
|
|
|
RED.sidebar.info = (function() {
|
2015-02-10 17:55:50 +01:00
|
|
|
|
2017-04-07 00:17:06 +02:00
|
|
|
var content;
|
2020-05-01 18:39:54 +02:00
|
|
|
var panels;
|
2017-04-07 00:17:06 +02:00
|
|
|
var infoSection;
|
2020-05-01 18:39:54 +02:00
|
|
|
|
|
|
|
var propertiesPanelContent;
|
|
|
|
var propertiesPanelHeader;
|
|
|
|
var propertiesPanelHeaderIcon;
|
|
|
|
var propertiesPanelHeaderLabel;
|
|
|
|
var propertiesPanelHeaderReveal;
|
|
|
|
var propertiesPanelHeaderHelp;
|
|
|
|
|
|
|
|
var selectedObject;
|
|
|
|
|
2020-05-07 11:32:25 +02:00
|
|
|
var tipContainer;
|
2017-04-07 00:17:06 +02:00
|
|
|
var tipBox;
|
2014-02-26 23:58:44 +01:00
|
|
|
|
2020-05-01 18:39:54 +02:00
|
|
|
// TODO: remove this
|
2017-04-05 17:19:23 +02:00
|
|
|
var expandedSections = {
|
2017-04-07 00:17:06 +02:00
|
|
|
"property": false
|
2017-04-05 17:19:23 +02:00
|
|
|
};
|
2015-07-01 00:42:03 +02:00
|
|
|
|
2020-05-01 18:39:54 +02:00
|
|
|
function resizeStack() {
|
2020-05-07 11:32:25 +02:00
|
|
|
if (panels) {
|
|
|
|
var h = $(content).parent().height() - tipContainer.outerHeight();
|
|
|
|
panels.resize(h)
|
|
|
|
}
|
2020-05-01 18:39:54 +02:00
|
|
|
}
|
2015-07-03 11:07:40 +02:00
|
|
|
function init() {
|
2017-04-07 00:17:06 +02:00
|
|
|
|
|
|
|
content = document.createElement("div");
|
2019-05-16 23:32:28 +02:00
|
|
|
content.className = "red-ui-sidebar-info"
|
2017-04-07 00:17:06 +02:00
|
|
|
|
|
|
|
RED.actions.add("core:show-info-tab",show);
|
|
|
|
|
2019-05-16 23:32:28 +02:00
|
|
|
var stackContainer = $("<div>",{class:"red-ui-sidebar-info-stack"}).appendTo(content);
|
2017-04-07 12:21:30 +02:00
|
|
|
|
2020-05-06 17:15:12 +02:00
|
|
|
var outlinerPanel = $("<div>").css({
|
|
|
|
"overflow": "hidden",
|
|
|
|
"height": "calc(70%)"
|
|
|
|
}).appendTo(stackContainer);
|
2020-05-01 18:39:54 +02:00
|
|
|
var propertiesPanel = $("<div>").css({
|
|
|
|
"overflow":"hidden",
|
|
|
|
"height":"100%",
|
|
|
|
"display": "flex",
|
|
|
|
"flex-direction": "column"
|
|
|
|
}).appendTo(stackContainer);
|
|
|
|
propertiesPanelHeader = $("<div>", {class:"red-ui-palette-header red-ui-info-header"}).css({
|
|
|
|
"flex":"0 0 auto"
|
|
|
|
}).appendTo(propertiesPanel);
|
|
|
|
|
|
|
|
propertiesPanelHeaderIcon = $("<span>").appendTo(propertiesPanelHeader);
|
|
|
|
propertiesPanelHeaderLabel = $("<span>").appendTo(propertiesPanelHeader);
|
2020-05-06 17:15:12 +02:00
|
|
|
propertiesPanelHeaderHelp = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-book"></button>').css({
|
2020-05-01 18:39:54 +02:00
|
|
|
position: 'absolute',
|
|
|
|
top: '12px',
|
2020-05-14 23:08:25 +02:00
|
|
|
right: '32px'
|
2020-05-01 18:39:54 +02:00
|
|
|
}).on("click", function(evt) {
|
|
|
|
evt.preventDefault();
|
|
|
|
evt.stopPropagation();
|
|
|
|
if (selectedObject) {
|
2020-05-14 23:08:25 +02:00
|
|
|
RED.sidebar.help.show(selectedObject.type);
|
2020-05-01 18:39:54 +02:00
|
|
|
}
|
|
|
|
}).appendTo(propertiesPanelHeader);
|
2020-05-06 17:15:12 +02:00
|
|
|
RED.popover.tooltip(propertiesPanelHeaderHelp,RED._("sidebar.help.showHelp"));
|
2020-05-01 18:39:54 +02:00
|
|
|
|
|
|
|
|
|
|
|
propertiesPanelHeaderReveal = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-search"></button>').css({
|
|
|
|
position: 'absolute',
|
|
|
|
top: '12px',
|
|
|
|
right: '8px'
|
|
|
|
}).on("click", function(evt) {
|
|
|
|
evt.preventDefault();
|
|
|
|
evt.stopPropagation();
|
|
|
|
if (selectedObject) {
|
|
|
|
RED.sidebar.info.outliner.reveal(selectedObject);
|
2020-05-14 23:08:25 +02:00
|
|
|
RED.view.reveal(selectedObject.id);
|
2020-05-01 18:39:54 +02:00
|
|
|
}
|
|
|
|
}).appendTo(propertiesPanelHeader);
|
2020-05-12 04:06:29 +02:00
|
|
|
RED.popover.tooltip(propertiesPanelHeaderReveal,RED._("sidebar.help.showInOutline"));
|
2017-04-07 00:17:06 +02:00
|
|
|
|
2020-04-27 12:17:19 +02:00
|
|
|
|
2020-05-01 18:39:54 +02:00
|
|
|
propertiesPanelContent = $("<div>").css({
|
|
|
|
"flex":"1 1 auto",
|
|
|
|
"overflow-y":"scroll",
|
|
|
|
}).appendTo(propertiesPanel);
|
2018-09-21 12:38:48 +02:00
|
|
|
|
|
|
|
|
2020-05-01 18:39:54 +02:00
|
|
|
panels = RED.panels.create({container: stackContainer})
|
|
|
|
panels.ratio(0.6);
|
|
|
|
RED.sidebar.info.outliner.build().appendTo(outlinerPanel);
|
|
|
|
|
|
|
|
|
|
|
|
RED.sidebar.addTab({
|
|
|
|
id: "info",
|
|
|
|
label: RED._("sidebar.info.label"),
|
|
|
|
name: RED._("sidebar.info.name"),
|
|
|
|
iconClass: "fa fa-info",
|
|
|
|
action:"core:show-info-tab",
|
|
|
|
content: content,
|
|
|
|
pinned: true,
|
|
|
|
enableOnEdit: true
|
2018-09-21 12:38:48 +02:00
|
|
|
});
|
2017-04-07 12:21:30 +02:00
|
|
|
|
2020-06-08 14:17:06 +02:00
|
|
|
RED.events.on("sidebar:resize", resizeStack);
|
|
|
|
|
2020-05-01 18:39:54 +02:00
|
|
|
$(window).on("resize", resizeStack);
|
|
|
|
$(window).on("focus", resizeStack);
|
|
|
|
|
|
|
|
|
|
|
|
// Tip Box
|
2020-05-07 11:32:25 +02:00
|
|
|
tipContainer = $('<div class="red-ui-help-tips"></div>').appendTo(content);
|
2019-05-16 23:32:28 +02:00
|
|
|
tipBox = $('<div class="red-ui-help-tip"></div>').appendTo(tipContainer);
|
2019-05-15 14:54:29 +02:00
|
|
|
var tipButtons = $('<div class="red-ui-help-tips-buttons"></div>').appendTo(tipContainer);
|
2017-04-07 13:24:39 +02:00
|
|
|
|
2019-03-26 23:22:13 +01:00
|
|
|
var tipRefresh = $('<a href="#" class="red-ui-footer-button"><i class="fa fa-refresh"></a>').appendTo(tipButtons);
|
2019-04-29 12:50:15 +02:00
|
|
|
tipRefresh.on("click", function(e) {
|
2017-04-07 13:24:39 +02:00
|
|
|
e.preventDefault();
|
|
|
|
tips.next();
|
|
|
|
})
|
|
|
|
|
2019-03-26 23:22:13 +01:00
|
|
|
var tipClose = $('<a href="#" class="red-ui-footer-button"><i class="fa fa-times"></a>').appendTo(tipButtons);
|
2019-04-29 12:50:15 +02:00
|
|
|
tipClose.on("click", function(e) {
|
2017-04-07 13:24:39 +02:00
|
|
|
e.preventDefault();
|
|
|
|
RED.actions.invoke("core:toggle-show-tips");
|
2017-04-28 21:49:01 +02:00
|
|
|
RED.notify(RED._("sidebar.info.showTips"));
|
2017-04-07 13:24:39 +02:00
|
|
|
});
|
2017-05-03 22:27:08 +02:00
|
|
|
if (tips.enabled()) {
|
|
|
|
tips.start();
|
|
|
|
} else {
|
|
|
|
tips.stop();
|
|
|
|
}
|
2017-04-07 12:21:30 +02:00
|
|
|
|
2015-07-03 11:07:40 +02:00
|
|
|
}
|
|
|
|
|
2014-11-11 11:15:02 +01:00
|
|
|
function show() {
|
|
|
|
RED.sidebar.show("info");
|
|
|
|
}
|
2015-02-10 17:55:50 +01:00
|
|
|
|
2017-09-20 11:30:07 +02:00
|
|
|
// TODO: DRY - projects.js
|
2017-01-19 14:52:38 +01:00
|
|
|
function addTargetToExternalLinks(el) {
|
|
|
|
$(el).find("a").each(function(el) {
|
|
|
|
var href = $(this).attr('href');
|
|
|
|
if (/^https?:/.test(href)) {
|
|
|
|
$(this).attr('target','_blank');
|
|
|
|
}
|
|
|
|
});
|
|
|
|
return el;
|
|
|
|
}
|
2014-02-26 23:58:44 +01:00
|
|
|
function refresh(node) {
|
2017-09-20 23:51:28 +02:00
|
|
|
if (node === undefined) {
|
|
|
|
refreshSelection();
|
|
|
|
return;
|
|
|
|
}
|
2020-05-01 18:39:54 +02:00
|
|
|
$(propertiesPanelContent).empty();
|
2017-04-07 00:17:06 +02:00
|
|
|
|
|
|
|
var propRow;
|
2015-07-01 00:42:03 +02:00
|
|
|
|
2020-05-01 18:39:54 +02:00
|
|
|
var table = $('<table class="red-ui-info-table"></table>').appendTo(propertiesPanelContent);
|
2017-09-20 11:30:07 +02:00
|
|
|
var tableBody = $('<tbody>').appendTo(table);
|
2018-10-17 12:03:09 +02:00
|
|
|
|
2017-09-20 11:30:07 +02:00
|
|
|
var subflowNode;
|
|
|
|
var subflowUserCount;
|
2017-04-10 15:33:21 +02:00
|
|
|
|
2017-09-20 23:51:28 +02:00
|
|
|
if (node === null) {
|
2020-05-14 23:08:25 +02:00
|
|
|
RED.sidebar.info.outliner.select(null);
|
2017-09-20 11:30:07 +02:00
|
|
|
return;
|
|
|
|
} else if (Array.isArray(node)) {
|
2018-09-21 12:38:48 +02:00
|
|
|
// Multiple things selected
|
|
|
|
// - hide help and info sections
|
2020-05-14 23:08:25 +02:00
|
|
|
RED.sidebar.info.outliner.select(node);
|
2018-10-30 23:18:16 +01:00
|
|
|
|
2020-05-01 18:39:54 +02:00
|
|
|
propertiesPanelHeaderIcon.empty();
|
|
|
|
RED.utils.createNodeIcon({type:"_selection_"}).appendTo(propertiesPanelHeaderIcon);
|
|
|
|
propertiesPanelHeaderLabel.text("Selection");
|
|
|
|
propertiesPanelHeaderReveal.hide();
|
|
|
|
propertiesPanelHeaderHelp.hide();
|
|
|
|
selectedObject = null;
|
|
|
|
|
2018-10-30 23:18:16 +01:00
|
|
|
var types = {
|
|
|
|
nodes:0,
|
|
|
|
flows:0,
|
2020-03-26 22:00:22 +01:00
|
|
|
subflows:0,
|
|
|
|
groups: 0
|
2018-10-30 23:18:16 +01:00
|
|
|
}
|
|
|
|
node.forEach(function(n) {
|
|
|
|
if (n.type === 'tab') {
|
|
|
|
types.flows++;
|
|
|
|
types.nodes += RED.nodes.filterNodes({z:n.id}).length;
|
|
|
|
} else if (n.type === 'subflow') {
|
|
|
|
types.subflows++;
|
2020-03-26 22:00:22 +01:00
|
|
|
} else if (n.type === 'group') {
|
|
|
|
types.groups++;
|
2018-10-30 23:18:16 +01:00
|
|
|
} else {
|
|
|
|
types.nodes++;
|
|
|
|
}
|
|
|
|
});
|
2020-05-01 18:39:54 +02:00
|
|
|
// infoSection.container.hide();
|
2018-09-21 12:38:48 +02:00
|
|
|
// - show the count of selected nodes
|
2019-05-16 23:32:28 +02:00
|
|
|
propRow = $('<tr class="red-ui-help-info-row"><td>'+RED._("sidebar.info.selection")+"</td><td></td></tr>").appendTo(tableBody);
|
2018-10-30 23:18:16 +01:00
|
|
|
|
|
|
|
var counts = $('<div>').appendTo($(propRow.children()[1]));
|
|
|
|
if (types.flows > 0) {
|
|
|
|
$('<div>').text(RED._("clipboard.flow",{count:types.flows})).appendTo(counts);
|
|
|
|
}
|
|
|
|
if (types.subflows > 0) {
|
|
|
|
$('<div>').text(RED._("clipboard.subflow",{count:types.subflows})).appendTo(counts);
|
|
|
|
}
|
|
|
|
if (types.nodes > 0) {
|
|
|
|
$('<div>').text(RED._("clipboard.node",{count:types.nodes})).appendTo(counts);
|
|
|
|
}
|
2020-03-26 22:00:22 +01:00
|
|
|
if (types.groups > 0) {
|
|
|
|
$('<div>').text(RED._("clipboard.group",{count:types.groups})).appendTo(counts);
|
|
|
|
}
|
2017-09-20 11:30:07 +02:00
|
|
|
} else {
|
2018-09-21 12:38:48 +02:00
|
|
|
// A single 'thing' selected.
|
|
|
|
|
2020-05-14 23:08:25 +02:00
|
|
|
RED.sidebar.info.outliner.select(node);
|
|
|
|
|
2018-09-21 12:38:48 +02:00
|
|
|
// Check to see if this is a subflow or subflow instance
|
2020-05-01 18:39:54 +02:00
|
|
|
var subflowRegex = /^subflow(:(.+))?$/.exec(node.type);
|
|
|
|
if (subflowRegex) {
|
|
|
|
if (subflowRegex[2]) {
|
|
|
|
subflowNode = RED.nodes.subflow(subflowRegex[2]);
|
2017-04-07 00:17:06 +02:00
|
|
|
} else {
|
|
|
|
subflowNode = node;
|
2014-02-26 23:58:44 +01:00
|
|
|
}
|
2017-04-07 00:17:06 +02:00
|
|
|
|
|
|
|
var subflowType = "subflow:"+subflowNode.id;
|
2020-06-08 12:49:43 +02:00
|
|
|
subflowUserCount = subflowNode.instances.length;
|
2014-02-26 23:58:44 +01:00
|
|
|
}
|
2020-05-01 18:39:54 +02:00
|
|
|
|
|
|
|
propertiesPanelHeaderIcon.empty();
|
|
|
|
RED.utils.createNodeIcon(node).appendTo(propertiesPanelHeaderIcon);
|
2020-05-19 18:53:20 +02:00
|
|
|
var objectLabel = RED.utils.getNodeLabel(node, node.type+": "+node.id)
|
|
|
|
var newlineIndex = objectLabel.indexOf("\\n");
|
|
|
|
if (newlineIndex > -1) {
|
|
|
|
objectLabel = objectLabel.substring(0,newlineIndex)+"...";
|
|
|
|
}
|
|
|
|
propertiesPanelHeaderLabel.text(objectLabel);
|
2020-05-01 18:39:54 +02:00
|
|
|
propertiesPanelHeaderReveal.show();
|
|
|
|
selectedObject = node;
|
|
|
|
|
2020-05-14 23:08:25 +02:00
|
|
|
propRow = $('<tr class="red-ui-help-info-row"><td></td><td></td></tr>').appendTo(tableBody);
|
|
|
|
var objectType = "node";
|
|
|
|
if (node.type === "subflow" || subflowRegex) {
|
|
|
|
objectType = "subflow";
|
|
|
|
} else if (node.type === "tab") {
|
|
|
|
objectType = "flow";
|
|
|
|
}else if (node.type === "group") {
|
|
|
|
objectType = "group";
|
|
|
|
}
|
|
|
|
$(propRow.children()[0]).text(RED._("sidebar.info."+objectType))
|
|
|
|
RED.utils.createObjectElement(node.id).appendTo(propRow.children()[1]);
|
|
|
|
|
2017-09-20 11:30:07 +02:00
|
|
|
if (node.type === "tab" || node.type === "subflow") {
|
2018-09-21 12:38:48 +02:00
|
|
|
// If nothing is selected, but we're on a flow or subflow tab.
|
2020-05-01 18:39:54 +02:00
|
|
|
propertiesPanelHeaderHelp.hide();
|
2020-05-14 23:08:25 +02:00
|
|
|
|
2020-03-26 22:00:22 +01:00
|
|
|
} else if (node.type === "group") {
|
2020-05-01 18:39:54 +02:00
|
|
|
propertiesPanelHeaderHelp.hide();
|
|
|
|
|
2020-05-14 23:08:25 +02:00
|
|
|
propRow = $('<tr class="red-ui-help-info-row"><td> </td><td></td></tr>').appendTo(tableBody);
|
2020-05-01 18:39:54 +02:00
|
|
|
|
2020-03-26 22:00:22 +01:00
|
|
|
var typeCounts = {
|
|
|
|
nodes:0,
|
|
|
|
groups: 0
|
|
|
|
}
|
|
|
|
var allNodes = RED.group.getNodes(node,true);
|
|
|
|
allNodes.forEach(function(n) {
|
|
|
|
if (n.type === "group") {
|
|
|
|
typeCounts.groups++;
|
|
|
|
} else {
|
|
|
|
typeCounts.nodes++
|
|
|
|
}
|
|
|
|
});
|
|
|
|
var counts = $('<div>').appendTo($(propRow.children()[1]));
|
|
|
|
if (typeCounts.nodes > 0) {
|
|
|
|
$('<div>').text(RED._("clipboard.node",{count:typeCounts.nodes})).appendTo(counts);
|
|
|
|
}
|
|
|
|
if (typeCounts.groups > 0) {
|
|
|
|
$('<div>').text(RED._("clipboard.group",{count:typeCounts.groups})).appendTo(counts);
|
|
|
|
}
|
|
|
|
|
|
|
|
|
2017-09-20 11:30:07 +02:00
|
|
|
} else {
|
2020-05-14 23:08:25 +02:00
|
|
|
propertiesPanelHeaderHelp.show();
|
2020-05-01 18:39:54 +02:00
|
|
|
|
|
|
|
if (!subflowRegex) {
|
|
|
|
propRow = $('<tr class="red-ui-help-info-row"><td>'+RED._("sidebar.info.type")+'</td><td></td></tr>').appendTo(tableBody);
|
2018-06-13 15:56:09 +02:00
|
|
|
$(propRow.children()[1]).text((node.type === "unknown")?node._orig.type:node.type);
|
|
|
|
if (node.type === "unknown") {
|
|
|
|
$('<span style="float: right; font-size: 0.8em"><i class="fa fa-warning"></i></span>').prependTo($(propRow.children()[1]))
|
|
|
|
}
|
2017-09-20 11:30:07 +02:00
|
|
|
}
|
2020-05-01 18:39:54 +02:00
|
|
|
|
2018-10-16 15:05:23 +02:00
|
|
|
var count = 0;
|
2020-05-01 18:39:54 +02:00
|
|
|
if (!subflowRegex && node.type != "subflow" && node.type != "group") {
|
|
|
|
|
|
|
|
var blankRow = $('<tr class="red-ui-help-property-expand blank"><td colspan="2"></td></tr>').appendTo(tableBody);
|
|
|
|
|
2018-06-13 15:56:09 +02:00
|
|
|
var defaults;
|
|
|
|
if (node.type === 'unknown') {
|
|
|
|
defaults = {};
|
|
|
|
Object.keys(node._orig).forEach(function(k) {
|
|
|
|
if (k !== 'type') {
|
|
|
|
defaults[k] = {};
|
|
|
|
}
|
|
|
|
})
|
|
|
|
} else if (node._def) {
|
|
|
|
defaults = node._def.defaults;
|
2019-05-16 23:32:28 +02:00
|
|
|
propRow = $('<tr class="red-ui-help-info-property-row'+(expandedSections.property?"":" hide")+'"><td>'+RED._("sidebar.info.module")+"</td><td></td></tr>").appendTo(tableBody);
|
2018-10-16 15:05:23 +02:00
|
|
|
$(propRow.children()[1]).text(RED.nodes.getType(node.type).set.module);
|
|
|
|
count++;
|
2018-06-13 15:56:09 +02:00
|
|
|
}
|
2018-10-16 15:05:23 +02:00
|
|
|
|
2018-06-13 15:56:09 +02:00
|
|
|
if (defaults) {
|
2017-09-20 11:30:07 +02:00
|
|
|
for (var n in defaults) {
|
2018-09-21 12:38:48 +02:00
|
|
|
if (n != "name" && n != "info" && defaults.hasOwnProperty(n)) {
|
2017-09-20 11:30:07 +02:00
|
|
|
var val = node[n];
|
|
|
|
var type = typeof val;
|
|
|
|
count++;
|
2020-05-01 18:39:54 +02:00
|
|
|
propRow = $('<tr class="red-ui-help-info-property-row'+(expandedSections.property?"":" hide")+'"><td></td><td></td></tr>').appendTo(tableBody);
|
|
|
|
$(propRow.children()[0]).text(n);
|
2017-09-20 11:30:07 +02:00
|
|
|
if (defaults[n].type) {
|
|
|
|
var configNode = RED.nodes.node(val);
|
|
|
|
if (!configNode) {
|
|
|
|
RED.utils.createObjectElement(undefined).appendTo(propRow.children()[1]);
|
|
|
|
} else {
|
|
|
|
var configLabel = RED.utils.getNodeLabel(configNode,val);
|
|
|
|
var container = propRow.children()[1];
|
|
|
|
|
|
|
|
var div = $('<span>',{class:""}).appendTo(container);
|
2019-04-29 23:38:14 +02:00
|
|
|
var nodeDiv = $('<div>',{class:"red-ui-palette-node red-ui-palette-node-small"}).appendTo(div);
|
2018-07-27 23:05:28 +02:00
|
|
|
var colour = RED.utils.getNodeColor(configNode.type,configNode._def);
|
2017-09-20 11:30:07 +02:00
|
|
|
var icon_url = RED.utils.getNodeIcon(configNode._def);
|
|
|
|
nodeDiv.css({'backgroundColor':colour, "cursor":"pointer"});
|
2019-04-29 23:38:14 +02:00
|
|
|
var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
|
|
|
|
$('<div/>',{class:"red-ui-palette-icon",style:"background-image: url("+icon_url+")"}).appendTo(iconContainer);
|
2018-05-11 15:05:52 +02:00
|
|
|
var nodeContainer = $('<span></span>').css({"verticalAlign":"top","marginLeft":"6px"}).text(configLabel).appendTo(container);
|
2017-09-20 11:30:07 +02:00
|
|
|
|
|
|
|
nodeDiv.on('dblclick',function() {
|
|
|
|
RED.editor.editConfig("", configNode.type, configNode.id);
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
RED.utils.createObjectElement(val).appendTo(propRow.children()[1]);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2018-10-16 15:05:23 +02:00
|
|
|
}
|
|
|
|
if (count > 0) {
|
2020-05-01 18:39:54 +02:00
|
|
|
$('<a href="#" class="node-info-property-header'+(expandedSections.property?" expanded":"")+'"><span class="red-ui-help-property-more">'+RED._("sidebar.info.showMore")+'</span><span class="red-ui-help-property-less">'+RED._("sidebar.info.showLess")+'</span> <i class="fa fa-caret-down"></i></a>').appendTo(blankRow.children()[0]);
|
2017-09-20 11:30:07 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
if (node.type !== 'tab') {
|
2020-05-01 18:39:54 +02:00
|
|
|
if (subflowRegex) {
|
2017-09-20 11:30:07 +02:00
|
|
|
$('<tr class="blank"><th colspan="2">'+RED._("sidebar.info.subflow")+'</th></tr>').appendTo(tableBody);
|
2019-05-16 23:32:28 +02:00
|
|
|
$('<tr class="node-info-subflow-row"><td>'+RED._("common.label.name")+'</td><td><span class="red-ui-text-bidi-aware" dir=\"'+RED.text.bidi.resolveBaseTextDir(subflowNode.name)+'">'+RED.utils.sanitize(subflowNode.name)+'</span></td></tr>').appendTo(tableBody);
|
2017-09-20 11:30:07 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2020-05-01 18:39:54 +02:00
|
|
|
if (subflowRegex) {
|
2019-05-16 23:32:28 +02:00
|
|
|
propRow = $('<tr class="red-ui-help-info-row"><td>'+RED._("subflow.category")+'</td><td></td></tr>').appendTo(tableBody);
|
2018-06-12 13:54:32 +02:00
|
|
|
var category = subflowNode.category||"subflows";
|
|
|
|
$(propRow.children()[1]).text(RED._("palette.label."+category,{defaultValue:category}))
|
2017-09-20 11:30:07 +02:00
|
|
|
$('<tr class="node-info-subflow-row"><td>'+RED._("sidebar.info.instances")+"</td><td>"+subflowUserCount+'</td></tr>').appendTo(tableBody);
|
|
|
|
}
|
2015-01-29 16:57:05 +01:00
|
|
|
|
2020-05-01 18:39:54 +02:00
|
|
|
// var helpText = "";
|
|
|
|
// if (node.type === "tab" || node.type === "subflow") {
|
|
|
|
// } else {
|
|
|
|
// if (subflowNode && node.type !== "subflow") {
|
|
|
|
// // Selected a subflow instance node.
|
|
|
|
// // - The subflow template info goes into help
|
|
|
|
// helpText = (RED.utils.renderMarkdown(subflowNode.info||"")||('<span class="red-ui-help-info-none">'+RED._("sidebar.info.none")+'</span>'));
|
|
|
|
// } else {
|
|
|
|
// helpText = $("script[data-help-name='"+node.type+"']").html()||('<span class="red-ui-help-info-none">'+RED._("sidebar.info.none")+'</span>');
|
|
|
|
// }
|
|
|
|
// setInfoText(helpText, helpSection.content);
|
|
|
|
// }
|
2015-07-01 00:42:03 +02:00
|
|
|
|
2018-09-21 12:38:48 +02:00
|
|
|
var infoText = "";
|
|
|
|
|
|
|
|
if (node._def && node._def.info) {
|
2017-09-20 11:30:07 +02:00
|
|
|
var info = node._def.info;
|
|
|
|
var textInfo = (typeof info === "function" ? info.call(node) : info);
|
2020-02-24 12:22:47 +01:00
|
|
|
infoText = infoText + RED.utils.renderMarkdown(textInfo);
|
2017-09-20 11:30:07 +02:00
|
|
|
}
|
2018-08-06 14:39:37 +02:00
|
|
|
if (node.info) {
|
2020-02-24 12:22:47 +01:00
|
|
|
infoText = infoText + RED.utils.renderMarkdown(node.info || "")
|
2017-09-20 11:30:07 +02:00
|
|
|
}
|
2020-05-01 18:39:54 +02:00
|
|
|
var infoSectionContainer = $("<div>").css("padding","0 6px 6px").appendTo(propertiesPanelContent)
|
|
|
|
|
|
|
|
// var editInfo = $('<button class="red-ui-button red-ui-button-small" style="float: right"><i class="fa fa-file-text-o"></button>').appendTo(infoSectionContainer).on("click", function(evt) {
|
|
|
|
// //.text(RED._("sidebar.info.editDescription"))
|
|
|
|
// evt.preventDefault();
|
|
|
|
// evt.stopPropagation();
|
|
|
|
// if (node.type === 'tab') {
|
|
|
|
//
|
|
|
|
// } else if (node.type === 'subflow') {
|
|
|
|
//
|
|
|
|
// } else if (node.type === 'group') {
|
|
|
|
//
|
|
|
|
// } else if (node._def.category !== 'config') {
|
|
|
|
// RED.editor.edit(node,"editor-tab-description");
|
|
|
|
// } else {
|
|
|
|
//
|
|
|
|
// }
|
|
|
|
// })
|
|
|
|
|
|
|
|
setInfoText(infoText, infoSectionContainer);
|
2018-09-21 12:38:48 +02:00
|
|
|
|
2019-05-16 23:32:28 +02:00
|
|
|
$(".red-ui-sidebar-info-stack").scrollTop(0);
|
2019-04-29 12:50:15 +02:00
|
|
|
$(".node-info-property-header").on("click", function(e) {
|
2017-09-20 11:30:07 +02:00
|
|
|
e.preventDefault();
|
|
|
|
expandedSections["property"] = !expandedSections["property"];
|
|
|
|
$(this).toggleClass("expanded",expandedSections["property"]);
|
2019-05-16 23:32:28 +02:00
|
|
|
$(".red-ui-help-info-property-row").toggle(expandedSections["property"]);
|
2017-09-20 11:30:07 +02:00
|
|
|
});
|
|
|
|
}
|
2018-10-17 12:03:09 +02:00
|
|
|
|
|
|
|
|
2018-10-17 14:18:08 +02:00
|
|
|
// $('<tr class="blank"><th colspan="2"></th></tr>').appendTo(tableBody);
|
2019-05-16 23:32:28 +02:00
|
|
|
// propRow = $('<tr class="red-ui-help-info-row"><td>Actions</td><td></td></tr>').appendTo(tableBody);
|
2018-10-17 14:18:08 +02:00
|
|
|
// var actionBar = $(propRow.children()[1]);
|
|
|
|
//
|
2020-05-01 18:39:54 +02:00
|
|
|
// // var actionBar = $('<div>',{style:"background: #fefefe; padding: 3px;"}).appendTo(propertiesPanel);
|
2019-05-17 11:42:43 +02:00
|
|
|
// $('<button type="button" class="red-ui-button"><i class="fa fa-code"></i></button>').appendTo(actionBar);
|
|
|
|
// $('<button type="button" class="red-ui-button"><i class="fa fa-code"></i></button>').appendTo(actionBar);
|
|
|
|
// $('<button type="button" class="red-ui-button"><i class="fa fa-code"></i></button>').appendTo(actionBar);
|
|
|
|
// $('<button type="button" class="red-ui-button"><i class="fa fa-code"></i></button>').appendTo(actionBar);
|
2018-10-17 12:03:09 +02:00
|
|
|
|
|
|
|
|
|
|
|
|
2014-02-26 23:58:44 +01:00
|
|
|
}
|
2018-09-21 12:38:48 +02:00
|
|
|
function setInfoText(infoText,target) {
|
2019-05-16 23:32:28 +02:00
|
|
|
var info = addTargetToExternalLinks($('<div class="red-ui-help"><span class="red-ui-text-bidi-aware" dir=\"'+RED.text.bidi.resolveBaseTextDir(infoText)+'">'+infoText+'</span></div>')).appendTo(target);
|
|
|
|
info.find(".red-ui-text-bidi-aware").contents().filter(function() { return this.nodeType === 3 && this.textContent.trim() !== "" }).wrap( "<span></span>" );
|
2017-05-24 22:11:23 +02:00
|
|
|
var foldingHeader = "H3";
|
2019-05-16 23:32:28 +02:00
|
|
|
info.find(foldingHeader).wrapInner('<a class="red-ui-help-info-header expanded" href="#"></a>')
|
2019-04-29 12:50:15 +02:00
|
|
|
.find("a").prepend('<i class="fa fa-angle-right">').on("click", function(e) {
|
2017-05-24 22:11:23 +02:00
|
|
|
e.preventDefault();
|
|
|
|
var isExpanded = $(this).hasClass('expanded');
|
|
|
|
var el = $(this).parent().next();
|
|
|
|
while(el.length === 1 && el[0].nodeName !== foldingHeader) {
|
|
|
|
el.toggle(!isExpanded);
|
|
|
|
el = el.next();
|
|
|
|
}
|
|
|
|
$(this).toggleClass('expanded',!isExpanded);
|
|
|
|
})
|
|
|
|
}
|
2017-01-06 00:33:19 +01:00
|
|
|
var tips = (function() {
|
2017-01-06 14:33:23 +01:00
|
|
|
var enabled = true;
|
|
|
|
var startDelay = 1000;
|
2017-01-09 23:09:06 +01:00
|
|
|
var cycleDelay = 15000;
|
2017-01-06 00:33:19 +01:00
|
|
|
var startTimeout;
|
|
|
|
var refreshTimeout;
|
|
|
|
var tipCount = -1;
|
|
|
|
|
2017-01-06 14:33:23 +01:00
|
|
|
RED.actions.add("core:toggle-show-tips",function(state) {
|
|
|
|
if (state === undefined) {
|
2017-04-28 21:49:01 +02:00
|
|
|
RED.userSettings.toggle("view-show-tips");
|
2017-01-06 14:33:23 +01:00
|
|
|
} else {
|
|
|
|
enabled = state;
|
|
|
|
if (enabled) {
|
2017-04-07 12:21:30 +02:00
|
|
|
startTips();
|
2017-01-06 14:33:23 +01:00
|
|
|
} else {
|
|
|
|
stopTips();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
2017-01-06 00:33:19 +01:00
|
|
|
|
|
|
|
function setTip() {
|
|
|
|
var r = Math.floor(Math.random() * tipCount);
|
|
|
|
var tip = RED._("infotips:info.tip"+r);
|
|
|
|
|
|
|
|
var m;
|
|
|
|
while ((m=/({{(.*?)}})/.exec(tip))) {
|
|
|
|
var shortcut = RED.keyboard.getShortcut(m[2]);
|
|
|
|
if (shortcut) {
|
|
|
|
tip = tip.replace(m[1],RED.keyboard.formatKey(shortcut.key));
|
|
|
|
} else {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
while ((m=/(\[(.*?)\])/.exec(tip))) {
|
|
|
|
tip = tip.replace(m[1],RED.keyboard.formatKey(m[2]));
|
|
|
|
}
|
2017-04-07 00:17:06 +02:00
|
|
|
tipBox.html(tip).fadeIn(200);
|
2017-01-06 00:33:19 +01:00
|
|
|
if (startTimeout) {
|
|
|
|
startTimeout = null;
|
|
|
|
refreshTimeout = setInterval(cycleTips,cycleDelay);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
function cycleTips() {
|
2017-04-07 00:17:06 +02:00
|
|
|
tipBox.fadeOut(300,function() {
|
2017-01-06 00:33:19 +01:00
|
|
|
setTip();
|
|
|
|
})
|
|
|
|
}
|
2017-01-06 14:33:23 +01:00
|
|
|
function startTips() {
|
2019-05-16 23:32:28 +02:00
|
|
|
$(".red-ui-sidebar-info").addClass('show-tips');
|
2020-05-07 11:32:25 +02:00
|
|
|
resizeStack();
|
2017-01-06 14:33:23 +01:00
|
|
|
if (enabled) {
|
2017-01-06 00:33:19 +01:00
|
|
|
if (!startTimeout && !refreshTimeout) {
|
|
|
|
if (tipCount === -1) {
|
|
|
|
do {
|
|
|
|
tipCount++;
|
|
|
|
} while(RED._("infotips:info.tip"+tipCount)!=="infotips:info.tip"+tipCount);
|
|
|
|
}
|
|
|
|
startTimeout = setTimeout(setTip,startDelay);
|
|
|
|
}
|
|
|
|
}
|
2016-11-14 20:10:02 +01:00
|
|
|
}
|
2017-01-06 14:33:23 +01:00
|
|
|
function stopTips() {
|
2019-05-16 23:32:28 +02:00
|
|
|
$(".red-ui-sidebar-info").removeClass('show-tips');
|
2020-05-07 11:32:25 +02:00
|
|
|
resizeStack();
|
2017-01-06 14:33:23 +01:00
|
|
|
clearInterval(refreshTimeout);
|
|
|
|
clearTimeout(startTimeout);
|
|
|
|
refreshTimeout = null;
|
|
|
|
startTimeout = null;
|
|
|
|
}
|
2017-04-07 13:24:39 +02:00
|
|
|
function nextTip() {
|
|
|
|
clearInterval(refreshTimeout);
|
|
|
|
startTimeout = true;
|
|
|
|
setTip();
|
|
|
|
}
|
2017-01-06 14:33:23 +01:00
|
|
|
return {
|
|
|
|
start: startTips,
|
2017-04-07 13:24:39 +02:00
|
|
|
stop: stopTips,
|
2017-05-03 22:27:08 +02:00
|
|
|
next: nextTip,
|
|
|
|
enabled: function() { return enabled; }
|
2017-01-06 14:33:23 +01:00
|
|
|
}
|
2017-01-06 00:33:19 +01:00
|
|
|
})();
|
|
|
|
|
|
|
|
function clear() {
|
2017-09-20 11:30:07 +02:00
|
|
|
// sections.hide();
|
2017-09-20 23:51:28 +02:00
|
|
|
refresh(null);
|
2015-03-12 01:08:47 +01:00
|
|
|
}
|
2015-07-01 00:42:03 +02:00
|
|
|
|
2017-09-20 11:30:07 +02:00
|
|
|
function set(html,title) {
|
2020-05-06 17:15:12 +02:00
|
|
|
console.warn("Deprecated use of RED.sidebar.info.set - use RED.sidebar.help.set instead")
|
|
|
|
RED.sidebar.help.set(html,title);
|
2015-07-18 16:33:31 +02:00
|
|
|
}
|
2015-10-23 23:14:21 +02:00
|
|
|
|
2017-09-20 23:51:28 +02:00
|
|
|
function refreshSelection(selection) {
|
|
|
|
if (selection === undefined) {
|
|
|
|
selection = RED.view.selection();
|
|
|
|
}
|
2015-03-12 01:08:47 +01:00
|
|
|
if (selection.nodes) {
|
|
|
|
if (selection.nodes.length == 1) {
|
|
|
|
var node = selection.nodes[0];
|
|
|
|
if (node.type === "subflow" && node.direction) {
|
|
|
|
refresh(RED.nodes.subflow(node.z));
|
|
|
|
} else {
|
|
|
|
refresh(node);
|
|
|
|
}
|
2017-09-20 11:30:07 +02:00
|
|
|
} else {
|
|
|
|
refresh(selection.nodes);
|
2015-03-12 01:08:47 +01:00
|
|
|
}
|
2018-10-30 23:18:16 +01:00
|
|
|
} else if (selection.flows || selection.subflows) {
|
|
|
|
refresh(selection.flows);
|
2015-03-12 01:08:47 +01:00
|
|
|
} else {
|
2017-04-07 00:17:06 +02:00
|
|
|
var activeWS = RED.workspaces.active();
|
|
|
|
|
|
|
|
var flow = RED.nodes.workspace(activeWS) || RED.nodes.subflow(activeWS);
|
|
|
|
if (flow) {
|
|
|
|
refresh(flow);
|
2015-03-12 01:08:47 +01:00
|
|
|
} else {
|
2017-03-16 17:29:19 +01:00
|
|
|
var workspace = RED.nodes.workspace(RED.workspaces.active());
|
2017-05-24 21:58:16 +02:00
|
|
|
if (workspace && workspace.info) {
|
2017-03-16 17:29:19 +01:00
|
|
|
refresh(workspace);
|
|
|
|
} else {
|
2017-09-20 23:51:28 +02:00
|
|
|
refresh(null)
|
2017-09-20 11:30:07 +02:00
|
|
|
// clear();
|
2017-03-16 17:29:19 +01:00
|
|
|
}
|
2015-03-12 01:08:47 +01:00
|
|
|
}
|
|
|
|
}
|
2017-09-20 23:51:28 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
RED.events.on("view:selection-changed",refreshSelection);
|
2015-01-29 16:57:05 +01:00
|
|
|
|
2014-02-26 23:58:44 +01:00
|
|
|
return {
|
2015-07-03 11:07:40 +02:00
|
|
|
init: init,
|
2014-11-11 11:15:02 +01:00
|
|
|
show: show,
|
2016-11-14 20:10:02 +01:00
|
|
|
refresh: refresh,
|
2015-07-18 16:33:31 +02:00
|
|
|
clear: clear,
|
|
|
|
set: set
|
2014-02-26 23:58:44 +01:00
|
|
|
}
|
2014-08-08 01:01:35 +02:00
|
|
|
})();
|