From eab281280f83863554c6bb5dee962257233af266 Mon Sep 17 00:00:00 2001 From: Kazuhito Yokoi Date: Wed, 9 Feb 2022 11:04:03 +0900 Subject: [PATCH] Add copy menu button on debug tab --- .../editor-client/src/js/ui/common/popover.js | 15 +++++++ .../editor-client/src/js/ui/utils.js | 45 ++++++++++++++----- .../nodes/locales/en-US/messages.json | 9 +++- .../@node-red/nodes/locales/ja/messages.json | 9 +++- 4 files changed, 66 insertions(+), 12 deletions(-) diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/common/popover.js b/packages/node_modules/@node-red/editor-client/src/js/ui/common/popover.js index f060af37d..f36e6a4ef 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/common/popover.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/common/popover.js @@ -95,6 +95,7 @@ * Menu Options array: * [ * label : string|DOM element - the label of the item. Can be custom DOM element + * tooltip : string - the text of the tooltip * onselect : function - called when the item is selected * ] * @@ -493,6 +494,7 @@ RED.popover = (function() { menuOptions = opts || []; list.empty(); menuOptions.forEach(function(opt) { + var popover; var item = $('
  • ').appendTo(list); var link = $('').appendTo(item); if (typeof opt.label == "string") { @@ -500,6 +502,16 @@ RED.popover = (function() { } else if (opt.label){ opt.label.appendTo(link); } + if (opt.tooltip) { + popover = RED.popover.create({ + tooltip: true, + target: item, + trigger: "hover", + size: "small", + direction: "left", + content: opt.tooltip + }); + } link.on("click", function(evt) { evt.preventDefault(); if (opt.onselect) { @@ -508,6 +520,9 @@ RED.popover = (function() { options.onselect(opt); } menu.hide(); + if (opt.tooltip) { + popover.close(); + } }) if (!first) { first = link} }) diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js b/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js index 33f6c3ea1..a6f228f20 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/utils.js @@ -226,19 +226,44 @@ RED.utils = (function() { var tools = $('').appendTo(obj); var copyTools = $('').appendTo(tools); if (!!key) { - var copyPath = $('').appendTo(copyTools).on("click", function(e) { + var copyPath = $('').appendTo(copyTools).on("click", function (e) { e.preventDefault(); e.stopPropagation(); - RED.clipboard.copyText(key,copyPath,"clipboard.copyMessagePath"); - }) - RED.popover.tooltip(copyPath,RED._("node-red:debug.sidebar.copyPath")); + RED.popover.tooltip(copyPath, RED._("node-red:debug.sidebar.copyOptions")); + var menu = RED.popover.menu({ + options: [{ + label: RED._("node-red:debug.sidebar.copyValue"), + tooltip: RED._("node-red:debug.sidebar.copyValueTooltip"), + onselect : function () { + RED.clipboard.copyText(msg); + } + }, { + label: RED._("node-red:debug.sidebar.copyPath"), + tooltip: RED._("node-red:debug.sidebar.copyPathTooltip"), + onselect : function () { + RED.clipboard.copyText(key); + } + }, { + label: RED._("node-red:debug.sidebar.copyFullPath"), + tooltip: RED._("node-red:debug.sidebar.copyFullPathTooltip"), + onselect : function () { + RED.clipboard.copyText("msg." + key); + } + }, { + label: RED._("node-red:debug.sidebar.copyMustachePath"), + tooltip: RED._("node-red:debug.sidebar.copyMustachePathTooltip"), + onselect : function () { + var mustachePath = key.replace(/\["([^\]]+)"\]/g,'.$1').replace(/\[([0-9]+)\]/g,'.$1'); + RED.clipboard.copyText(mustachePath); + } + }] + }); + menu.show({ + target: copyPath, + align: "left" + }); + }); } - var copyPayload = $('').appendTo(copyTools).on("click", function(e) { - e.preventDefault(); - e.stopPropagation(); - RED.clipboard.copyText(msg,copyPayload,"clipboard.copyMessageValue"); - }) - RED.popover.tooltip(copyPayload,RED._("node-red:debug.sidebar.copyPayload")); if (strippedKey !== undefined && strippedKey !== '') { var isPinned = pinnedPaths[sourceId].hasOwnProperty(strippedKey); diff --git a/packages/node_modules/@node-red/nodes/locales/en-US/messages.json b/packages/node_modules/@node-red/nodes/locales/en-US/messages.json index ecc5d905c..006a06582 100755 --- a/packages/node_modules/@node-red/nodes/locales/en-US/messages.json +++ b/packages/node_modules/@node-red/nodes/locales/en-US/messages.json @@ -147,8 +147,15 @@ "clearFilteredLog": "Clear filtered messages", "filterLog": "Filter messages", "openWindow": "Open in new window", + "copyOptions": "Copy options", + "copyValue": "Copy value", + "copyValueTooltip": "Copies the value of the property to the clipboard", "copyPath": "Copy path", - "copyPayload": "Copy value", + "copyPathTooltip": "Copies the path of the property to the clipboard for use in node properties", + "copyFullPath": "Copy full path", + "copyFullPathTooltip": "Copies the path of the property to the clipboard for use in the function node", + "copyMustachePath": "Copy Mustache path", + "copyMustachePathTooltip": "Copies the path of the property to the clipboard for use in fields that accept Mustache format e.g. the template node", "pinPath": "Pin open", "selectAll": "select all", "selectNone": "select none", diff --git a/packages/node_modules/@node-red/nodes/locales/ja/messages.json b/packages/node_modules/@node-red/nodes/locales/ja/messages.json index 70b813554..c687a206c 100644 --- a/packages/node_modules/@node-red/nodes/locales/ja/messages.json +++ b/packages/node_modules/@node-red/nodes/locales/ja/messages.json @@ -147,8 +147,15 @@ "clearFilteredLog": "選択したメッセージを削除", "filterLog": "ログのフィルタリング", "openWindow": "新しいウィンドウで開く", + "copyOptions": "コピーのオプション", + "copyValue": "値をコピー", + "copyValueTooltip": "プロパティの値をクリップボードにコピー", "copyPath": "パスをコピー", - "copyPayload": "値をコピー", + "copyPathTooltip": "ノードプロパティで使用するために、プロパティのパスをクリップボードにコピー", + "copyFullPath": "フルパスをコピー", + "copyFullPathTooltip": "functionノードで使用するために、プロパティのパスをクリップボードにコピー", + "copyMustachePath": "Mustache向けのパスをコピー", + "copyMustachePathTooltip": "templateノードなど、Mustache形式を利用できるフィールド向けに、プロパティのパスをクリップボードへコピー", "pinPath": "展開を固定", "selectAll": "全てを選択", "selectNone": "選択を外す",