Add copy menu button on debug tab

This commit is contained in:
Kazuhito Yokoi 2022-02-09 11:04:03 +09:00
parent 5293563a6a
commit eab281280f
4 changed files with 66 additions and 12 deletions

View File

@ -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 = $('<li>').appendTo(list);
var link = $('<a href="#"></a>').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}
})

View File

@ -226,19 +226,44 @@ RED.utils = (function() {
var tools = $('<span class="red-ui-debug-msg-tools"></span>').appendTo(obj);
var copyTools = $('<span class="red-ui-debug-msg-tools-copy button-group"></span>').appendTo(tools);
if (!!key) {
var copyPath = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-terminal"></i></button>').appendTo(copyTools).on("click", function(e) {
var copyPath = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-caret-down"></i></button>').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 = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-clipboard"></i></button>').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);

View File

@ -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",

View File

@ -147,8 +147,15 @@
"clearFilteredLog": "選択したメッセージを削除",
"filterLog": "ログのフィルタリング",
"openWindow": "新しいウィンドウで開く",
"copyOptions": "コピーのオプション",
"copyValue": "値をコピー",
"copyValueTooltip": "プロパティの値をクリップボードにコピー",
"copyPath": "パスをコピー",
"copyPayload": "値をコピー",
"copyPathTooltip": "ノードプロパティで使用するために、プロパティのパスをクリップボードにコピー",
"copyFullPath": "フルパスをコピー",
"copyFullPathTooltip": "functionードで使用するために、プロパティのパスをクリップボードにコピー",
"copyMustachePath": "Mustache向けのパスをコピー",
"copyMustachePathTooltip": "templateードなど、Mustache形式を利用できるフィールド向けに、プロパティのパスをクリップボードへコピー",
"pinPath": "展開を固定",
"selectAll": "全てを選択",
"selectNone": "選択を外す",