/** * Copyright JS Foundation and other contributors, http://js.foundation * * 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. **/ RED.sidebar.info = (function() { marked.setOptions({ renderer: new marked.Renderer(), gfm: true, tables: true, breaks: false, pedantic: false, sanitize: true, smartLists: true, smartypants: false }); var content; var sections; var nodeSection; var infoSection; var tipBox; var expandedSections = { "property": false }; function init() { content = document.createElement("div"); content.className = "sidebar-node-info" RED.actions.add("core:show-info-tab",show); var stackContainer = $("
",{class:"sidebar-node-info-stack"}).appendTo(content); sections = RED.stack.create({ container: stackContainer }).hide(); nodeSection = sections.add({ title: "Node", collapsible: false }); infoSection = sections.add({ title: "Information", collapsible: false }); infoSection.content.css("padding","6px"); infoSection.container.css("border-bottom","none"); var tipContainer = $('
').appendTo(content); tipBox = $('
').appendTo(tipContainer); var tipButtons = $('
').appendTo(tipContainer); var tipRefresh = $('').appendTo(tipButtons); tipRefresh.click(function(e) { e.preventDefault(); tips.next(); }) var tipClose = $('').appendTo(tipButtons); tipClose.click(function(e) { e.preventDefault(); RED.actions.invoke("core:toggle-show-tips"); RED.notify("You can re-open the tips from the side menu"); }); RED.sidebar.addTab({ id: "info", label: RED._("sidebar.info.label"), name: RED._("sidebar.info.name"), content: content, enableOnEdit: true }); tips.start(); } function show() { RED.sidebar.show("info"); } function jsonFilter(key,value) { if (key === "") { return value; } var t = typeof value; if ($.isArray(value)) { return "[array:"+value.length+"]"; } else if (t === "object") { return "[object]" } else if (t === "string") { if (value.length > 30) { return value.substring(0,30)+" ..."; } } return value; } function addTargetToExternalLinks(el) { $(el).find("a").each(function(el) { var href = $(this).attr('href'); if (/^https?:/.test(href)) { $(this).attr('target','_blank'); } }); return el; } function refresh(node) { sections.show(); $(nodeSection.content).empty(); $(infoSection.content).empty(); var table = $('
'); var tableBody = $('').appendTo(table); var propRow; var subflowNode; if (node.type === "tab") { nodeSection.title.html("Flow"); propRow = $('Name').appendTo(tableBody); $(propRow.children()[1]).html(' '+(node.label||"")) propRow = $(''+RED._("sidebar.info.id")+"").appendTo(tableBody); RED.utils.createObjectElement(node.id).appendTo(propRow.children()[1]); propRow = $('Status').appendTo(tableBody); $(propRow.children()[1]).html((!!!node.disabled)?"Enabled":"Disabled") } else { nodeSection.title.html("Node"); if (node.type !== "subflow" && node.name) { $(''+RED._("common.label.name")+' '+node.name+'').appendTo(tableBody); } $(''+RED._("sidebar.info.type")+" "+node.type+"").appendTo(tableBody); propRow = $(''+RED._("sidebar.info.id")+"").appendTo(tableBody); RED.utils.createObjectElement(node.id).appendTo(propRow.children()[1]); var m = /^subflow(:(.+))?$/.exec(node.type); if (!m && node.type != "subflow" && node.type != "comment") { if (node._def) { var count = 0; var defaults = node._def.defaults; for (var n in defaults) { if (n != "name" && defaults.hasOwnProperty(n)) { var val = node[n]; var type = typeof val; count++; propRow = $(''+n+"").appendTo(tableBody); 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 = $('',{class:""}).appendTo(container); var nodeDiv = $('
',{class:"palette_node palette_node_small"}).appendTo(div); var colour = configNode._def.color; var icon_url = RED.utils.getNodeIcon(configNode._def); nodeDiv.css({'backgroundColor':colour, "cursor":"pointer"}); var iconContainer = $('
',{class:"palette_icon_container"}).appendTo(nodeDiv); $('
',{class:"palette_icon",style:"background-image: url("+icon_url+")"}).appendTo(iconContainer); var nodeContainer = $('').css({"verticalAlign":"top","marginLeft":"6px"}).html(configLabel).appendTo(container); nodeDiv.on('dblclick',function() { RED.editor.editConfig("", configNode.type, configNode.id); }) } } else { RED.utils.createObjectElement(val).appendTo(propRow.children()[1]); } } } if (count > 0) { $('show moreshow less ').appendTo(tableBody); } } } if (m) { if (m[2]) { subflowNode = RED.nodes.subflow(m[2]); } else { subflowNode = node; } $(''+RED._("sidebar.info.subflow")+'').appendTo(tableBody); var userCount = 0; var subflowType = "subflow:"+subflowNode.id; RED.nodes.eachNode(function(n) { if (n.type === subflowType) { userCount++; } }); $(''+RED._("common.label.name")+''+subflowNode.name+'').appendTo(tableBody); $(''+RED._("sidebar.info.instances")+""+userCount+'').appendTo(tableBody); } } $(table).appendTo(nodeSection.content); var infoText = ""; if (!subflowNode && node.type !== "comment" && node.type !== "tab") { var helpText = $("script[data-help-name='"+node.type+"']").html()||""; infoText = helpText; } else if (node.type === "tab") { infoText = marked(node.info||""); } if (subflowNode) { infoText = infoText + marked(subflowNode.info||""); } else if (node._def && node._def.info) { var info = node._def.info; var textInfo = (typeof info === "function" ? info.call(node) : info); // TODO: help infoText = infoText + marked(textInfo); } if (infoText) { var info = addTargetToExternalLinks($('
'+infoText+'
')).appendTo(infoSection.content); info.find(".bidiAware").contents().filter(function() { return this.nodeType === 3 && this.textContent.trim() !== "" }).wrap( "" ); var foldingHeader = "H3"; info.find(foldingHeader).wrapInner('') .find("a").prepend('').click(function(e) { 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); }) } $(".node-info-property-header").click(function(e) { e.preventDefault(); expandedSections["property"] = !expandedSections["property"]; $(this).toggleClass("expanded",expandedSections["property"]); $(".node-info-property-row").toggle(expandedSections["property"]); }); } var tips = (function() { var enabled = true; var startDelay = 1000; var cycleDelay = 15000; var startTimeout; var refreshTimeout; var tipCount = -1; RED.actions.add("core:toggle-show-tips",function(state) { if (state === undefined) { RED.menu.toggleSelected("menu-item-show-tips"); } else { enabled = state; if (enabled) { startTips(); } else { stopTips(); } } }); 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])); } tipBox.html(tip).fadeIn(200); if (startTimeout) { startTimeout = null; refreshTimeout = setInterval(cycleTips,cycleDelay); } } function cycleTips() { tipBox.fadeOut(300,function() { setTip(); }) } function startTips() { $(".sidebar-node-info").addClass('show-tips'); if (enabled) { if (!startTimeout && !refreshTimeout) { if (tipCount === -1) { do { tipCount++; } while(RED._("infotips:info.tip"+tipCount)!=="infotips:info.tip"+tipCount); } startTimeout = setTimeout(setTip,startDelay); } } } function stopTips() { $(".sidebar-node-info").removeClass('show-tips'); clearInterval(refreshTimeout); clearTimeout(startTimeout); refreshTimeout = null; startTimeout = null; } function nextTip() { clearInterval(refreshTimeout); startTimeout = true; setTip(); } return { start: startTips, stop: stopTips, next: nextTip } })(); function clear() { sections.hide(); // } function set(html) { // tips.stop(); sections.show(); nodeSection.container.hide(); $(infoSection.content).html(html); } RED.events.on("view:selection-changed",function(selection) { 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); } } } else { var activeWS = RED.workspaces.active(); var flow = RED.nodes.workspace(activeWS) || RED.nodes.subflow(activeWS); if (flow) { refresh(flow); } else { var workspace = RED.nodes.workspace(RED.workspaces.active()); if (workspace.info) { refresh(workspace); } else { clear(); } } } }); return { init: init, show: show, refresh: refresh, clear: clear, set: set } })();