diff --git a/Gruntfile.js b/Gruntfile.js index c301c6c9c..8b7b85a25 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -169,6 +169,7 @@ module.exports = function(grunt) { "packages/node_modules/@node-red/editor-client/src/js/ui/library.js", "packages/node_modules/@node-red/editor-client/src/js/ui/notifications.js", "packages/node_modules/@node-red/editor-client/src/js/ui/search.js", + "packages/node_modules/@node-red/editor-client/src/js/ui/actionList.js", "packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js", "packages/node_modules/@node-red/editor-client/src/js/ui/subflow.js", "packages/node_modules/@node-red/editor-client/src/js/ui/userSettings.js", diff --git a/packages/node_modules/@node-red/editor-client/locales/en-US/editor.json b/packages/node_modules/@node-red/editor-client/locales/en-US/editor.json index 37e51adf1..9a53a870c 100755 --- a/packages/node_modules/@node-red/editor-client/locales/en-US/editor.json +++ b/packages/node_modules/@node-red/editor-client/locales/en-US/editor.json @@ -351,7 +351,8 @@ "pasteNode": "Paste nodes", "undoChange": "Undo the last change performed", "searchBox": "Open search box", - "managePalette": "Manage palette" + "managePalette": "Manage palette", + "actionList":"Action list" }, "library": { "library": "Library", diff --git a/packages/node_modules/@node-red/editor-client/src/js/keymap.json b/packages/node_modules/@node-red/editor-client/src/js/keymap.json index 5ae7cd10d..2db2d4836 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/keymap.json +++ b/packages/node_modules/@node-red/editor-client/src/js/keymap.json @@ -1,6 +1,6 @@ { "*": { - "ctrl-shift-p":"core:manage-palette", + "alt-shift-p":"core:manage-palette", "ctrl-f": "core:search", "ctrl-shift-f": "core:list-flows", "ctrl-=": "core:zoom-in", @@ -22,7 +22,8 @@ "ctrl-alt-n": "core:new-project", "ctrl-alt-o": "core:open-project", "ctrl-g v": "core:show-version-control-tab", - "ctrl-shift-l": "core:show-event-log" + "ctrl-shift-l": "core:show-event-log", + "ctrl-shift-p":"core:show-action-list" }, "red-ui-sidebar-node-config": { "backspace": "core:delete-config-selection", diff --git a/packages/node_modules/@node-red/editor-client/src/js/red.js b/packages/node_modules/@node-red/editor-client/src/js/red.js index e7613103d..715da7784 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/red.js +++ b/packages/node_modules/@node-red/editor-client/src/js/red.js @@ -451,6 +451,7 @@ var RED = (function() { {id:"menu-item-palette",label:RED._("menu.label.palette.show"),toggle:true,onselect:"core:toggle-palette", selected: true}, {id:"menu-item-sidebar",label:RED._("menu.label.sidebar.show"),toggle:true,onselect:"core:toggle-sidebar", selected: true}, {id:"menu-item-event-log",label:RED._("eventLog.title"),onselect:"core:show-event-log"}, + {id:"menu-item-action-list",label:RED._("keyboard.actionList"),onselect:"core:show-action-list"}, null ]}); menuOptions.push(null); @@ -521,6 +522,7 @@ var RED = (function() { RED.subflow.init(); RED.clipboard.init(); RED.search.init(); + RED.actionList.init(); RED.editor.init(); RED.diff.init(); diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/actionList.js b/packages/node_modules/@node-red/editor-client/src/js/ui/actionList.js new file mode 100644 index 000000000..d3155051b --- /dev/null +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/actionList.js @@ -0,0 +1,205 @@ +/** + * 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.actionList = (function() { + + var disabled = false; + var dialog = null; + var searchInput; + var searchResults; + var selected = -1; + var visible = false; + + var filterTerm = ""; + + function ensureSelectedIsVisible() { + var selectedEntry = searchResults.find("li.selected"); + if (selectedEntry.length === 1) { + var scrollWindow = searchResults.parent(); + var scrollHeight = scrollWindow.height(); + var scrollOffset = scrollWindow.scrollTop(); + var y = selectedEntry.position().top; + var h = selectedEntry.height(); + if (y+h > scrollHeight) { + scrollWindow.animate({scrollTop: '-='+(scrollHeight-(y+h)-10)},50); + } else if (y<0) { + scrollWindow.animate({scrollTop: '+='+(y-10)},50); + } + } + } + + function createDialog() { + dialog = $("
",{id:"red-ui-actionList",class:"red-ui-search"}).appendTo("#red-ui-main-container"); + var searchDiv = $("
",{class:"red-ui-search-container"}).appendTo(dialog); + searchInput = $('').appendTo(searchDiv).searchBox({ + change: function() { + filterTerm = $(this).val(); + searchResults.editableList('filter'); + searchResults.find("li.selected").removeClass("selected"); + } + }); + + searchInput.on('keydown',function(evt) { + var selectedChild; + if (evt.keyCode === 40) { + // Down + selectedChild = searchResults.find("li.selected"); + if (!selectedChild.length) { + var children = searchResults.children(":visible"); + if (children.length) { + $(children[0]).addClass('selected'); + RED.a = children[0]; + } + } else { + var nextChild = selectedChild.nextAll(":visible").first(); + if (nextChild.length) { + selectedChild.removeClass('selected'); + nextChild.addClass('selected'); + } + } + ensureSelectedIsVisible(); + evt.preventDefault(); + } else if (evt.keyCode === 38) { + // Up + selectedChild = searchResults.find("li.selected"); + var nextChild = selectedChild.prevAll(":visible").first(); + if (nextChild.length) { + selectedChild.removeClass('selected'); + nextChild.addClass('selected'); + } + ensureSelectedIsVisible(); + evt.preventDefault(); + } else if (evt.keyCode === 13) { + // Enter + selectedChild = searchResults.find("li.selected"); + selectCommand(searchResults.editableList('getItem',selectedChild)); + } + }); + searchInput.i18n(); + + var searchResultsDiv = $("
",{class:"red-ui-search-results-container"}).appendTo(dialog); + searchResults = $('
    ',{style:"position: absolute;top: 5px;bottom: 5px;left: 5px;right: 5px;"}).appendTo(searchResultsDiv).editableList({ + addButton: false, + addItem: function(container,i,action) { + if (action.id === undefined) { + $('
    ',{class:"red-ui-search-empty"}).text(RED._('search.empty')).appendTo(container); + } else { + var div = $('',{href:'#',class:"red-ui-search-result"}).appendTo(container); + var contentDiv = $('
    ',{class:"red-ui-search-result-action"}).appendTo(div); + + + $('
    ').text(action.label).appendTo(contentDiv); + // $('
    ',{class:"red-ui-search-result-node-type"}).text(node.type).appendTo(contentDiv); + // $('
    ',{class:"red-ui-search-result-node-id"}).text(node.id).appendTo(contentDiv); + if (action.key) { + $('
    ',{class:"red-ui-search-result-action-key"}).html(RED.keyboard.formatKey(action.key)).appendTo(contentDiv); + } + div.on("click", function(evt) { + evt.preventDefault(); + selectCommand(action); + }); + } + }, + scrollOnAdd: false, + filter: function(item) { + if (filterTerm !== "" && item.label.toLowerCase().indexOf(filterTerm) === -1) { + return false; + } + return true; + } + }); + + } + + function selectCommand(command) { + hide(); + if (command) { + RED.actions.invoke(command.id); + } + } + + function show(v) { + if (disabled) { + return; + } + if (!visible) { + RED.keyboard.add("*","escape",function(){hide()}); + $("#red-ui-header-shade").show(); + $("#red-ui-editor-shade").show(); + $("#red-ui-palette-shade").show(); + $("#red-ui-sidebar-shade").show(); + $("#red-ui-sidebar-separator").hide(); + if (dialog === null) { + createDialog(); + } + dialog.slideDown(300); + searchInput.searchBox('value',v) + searchResults.editableList('empty'); + results = []; + var actions = RED.actions.list(); + actions.sort(function(A,B) { + return A.id.localeCompare(B.id); + }); + actions.forEach(function(action) { + action.label = action.id.replace(/:/,": ").replace(/-/g," ").replace(/(^| )./g,function() { return arguments[0].toUpperCase()}); + searchResults.editableList('addItem',action) + }) + RED.events.emit("actionList:open"); + visible = true; + } + searchInput.trigger("focus"); + } + + function hide() { + if (visible) { + RED.keyboard.remove("escape"); + visible = false; + $("#red-ui-header-shade").hide(); + $("#red-ui-editor-shade").hide(); + $("#red-ui-palette-shade").hide(); + $("#red-ui-sidebar-shade").hide(); + $("#red-ui-sidebar-separator").show(); + if (dialog !== null) { + dialog.slideUp(200,function() { + searchInput.searchBox('value',''); + }); + } + RED.events.emit("actionList:close"); + } + } + + function init() { + RED.actions.add("core:show-action-list",show); + + RED.events.on("editor:open",function() { disabled = true; }); + RED.events.on("editor:close",function() { disabled = false; }); + RED.events.on("search:open",function() { disabled = true; }); + RED.events.on("search:close",function() { disabled = false; }); + RED.events.on("type-search:open",function() { disabled = true; }); + RED.events.on("type-search:close",function() { disabled = false; }); + + $("#red-ui-header-shade").on('mousedown',hide); + $("#red-ui-editor-shade").on('mousedown',hide); + $("#red-ui-palette-shade").on('mousedown',hide); + $("#red-ui-sidebar-shade").on('mousedown',hide); + } + + return { + init: init, + show: show, + hide: hide + }; + +})(); diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/clipboard.js b/packages/node_modules/@node-red/editor-client/src/js/ui/clipboard.js index 6971dc787..cdff62919 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/clipboard.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/clipboard.js @@ -742,6 +742,8 @@ RED.clipboard = (function() { RED.events.on("editor:close",function() { disabled = false; }); RED.events.on("search:open",function() { disabled = true; }); RED.events.on("search:close",function() { disabled = false; }); + RED.events.on("actionList:open",function() { disabled = true; }); + RED.events.on("actionList:close",function() { disabled = false; }); RED.events.on("type-search:open",function() { disabled = true; }); RED.events.on("type-search:close",function() { disabled = false; }); diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/common/editableList.js b/packages/node_modules/@node-red/editor-client/src/js/ui/common/editableList.js index ee0251951..d4fa53dfa 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/common/editableList.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/common/editableList.js @@ -323,6 +323,7 @@ }, empty: function() { this.element.empty(); + this.uiContainer.scrollTop(0); }, filter: function(filter) { if (filter !== undefined) { @@ -346,6 +347,14 @@ if (items.length > 0) { this.uiContainer.scrollTop(this.uiContainer.scrollTop()+items.position().top) } + }, + getItem: function(li) { + var el = li.find(".red-ui-editableList-item-content"); + if (el.length) { + return el.data('data'); + } else { + return null; + } } }); })(jQuery); diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/search.js b/packages/node_modules/@node-red/editor-client/src/js/ui/search.js index d814ab738..dcb147de7 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/search.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/search.js @@ -216,7 +216,7 @@ RED.search = (function() { var iconContainer = $('
    ',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv); RED.utils.createIconElement(icon_url, iconContainer, true); - var contentDiv = $('
    ',{class:"red-ui-search-result-description"}).appendTo(div); + var contentDiv = $('
    ',{class:"red-ui-search-result-node-description"}).appendTo(div); if (node.z) { var workspace = RED.nodes.workspace(node.z); if (!workspace) { @@ -296,6 +296,8 @@ RED.search = (function() { RED.events.on("editor:close",function() { disabled = false; }); RED.events.on("type-search:open",function() { disabled = true; }); RED.events.on("type-search:close",function() { disabled = false; }); + RED.events.on("actionList:open",function() { disabled = true; }); + RED.events.on("actionList:close",function() { disabled = false; }); diff --git a/packages/node_modules/@node-red/editor-client/src/sass/search.scss b/packages/node_modules/@node-red/editor-client/src/sass/search.scss index a63bd4457..0ec8b6525 100644 --- a/packages/node_modules/@node-red/editor-client/src/sass/search.scss +++ b/packages/node_modules/@node-red/editor-client/src/sass/search.scss @@ -165,7 +165,7 @@ } } -.red-ui-search-result-description { +.red-ui-search-result-node-description { margin-left: 40px; margin-right: 5px; } @@ -193,3 +193,14 @@ font-style: italic; color: $form-placeholder-color; } + +.red-ui-search-result-action { + color: $primary-text-color; +} +.red-ui-search-result-action-key { + position: absolute; + top: 9px; + right: 0; + margin-right: 10px; + color: $tertiary-text-color; +}