From ffeb2e91f41cec97e394bd89fa693e6c020e4034 Mon Sep 17 00:00:00 2001 From: Nick O'Leary Date: Fri, 7 Jun 2019 11:29:18 +0100 Subject: [PATCH 1/3] Add command prompt dialog --- Gruntfile.js | 1 + .../editor-client/src/js/keymap.json | 3 +- .../@node-red/editor-client/src/js/red.js | 1 + .../editor-client/src/js/ui/clipboard.js | 2 + .../editor-client/src/js/ui/commandPrompt.js | 228 ++++++++++++++++++ .../editor-client/src/js/ui/search.js | 4 +- .../editor-client/src/sass/search.scss | 11 +- 7 files changed, 247 insertions(+), 3 deletions(-) create mode 100644 packages/node_modules/@node-red/editor-client/src/js/ui/commandPrompt.js diff --git a/Gruntfile.js b/Gruntfile.js index c301c6c9c..f6fb3e19a 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/commandPrompt.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/src/js/keymap.json b/packages/node_modules/@node-red/editor-client/src/js/keymap.json index 5ae7cd10d..b3544c124 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 @@ -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-command-prompt" }, "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..d8962c44a 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 @@ -521,6 +521,7 @@ var RED = (function() { RED.subflow.init(); RED.clipboard.init(); RED.search.init(); + RED.commandPrompt.init(); RED.editor.init(); RED.diff.init(); 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..8c8d3a664 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("commandPrompt:open",function() { disabled = true; }); + RED.events.on("commandPrompt: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/commandPrompt.js b/packages/node_modules/@node-red/editor-client/src/js/ui/commandPrompt.js new file mode 100644 index 000000000..e86fde55a --- /dev/null +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/commandPrompt.js @@ -0,0 +1,228 @@ +/** + * 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.commandPrompt = (function() { + + var disabled = false; + var dialog = null; + var searchInput; + var searchResults; + var selected = -1; + var visible = false; + var activeElement; + + var results = []; + + var scopes = {}; + + function search(val) { + scopes = {}; + val = val ||""; + searchResults.editableList('empty'); + + var actions = RED.actions.list(); + actions.sort(function(A,B) { + return A.id.localeCompare(B.id); + }); + + val = val.trim().toLowerCase(); + + actions.forEach(function(action) { + if (action.scope && action.scope !== "*") { + if (!scopes.hasOwnProperty(action.scope)) { + var target = activeElement; + while (target.nodeName !== 'BODY' && target.id !== action.scope) { + target = target.parentElement; + } + scopes[action.scope] = (target.nodeName !== 'BODY') + } + if (!scopes[action.scope]) { + return; + } + } + action.label = action.id.replace(/:/,": ").replace(/-/g," ").replace(/(^| )./g,function() { return arguments[0].toUpperCase()}); + if (val !== "" && action.label.toLowerCase().indexOf(val) === -1) { + return; + } + results.push(action); + searchResults.editableList('addItem',action) + }) + // searchResults.editableList('addItem',{}); + console.log(document.activeElement); + + } + + 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-commandPrompt",class:"red-ui-search"}).appendTo("#red-ui-main-container"); + var searchDiv = $("
",{class:"red-ui-search-container"}).appendTo(dialog); + searchInput = $('').appendTo(searchDiv).searchBox({ + delay: 200, + change: function() { + search($(this).val()); + } + }); + + searchInput.on('keydown',function(evt) { + var children; + if (results.length > 0) { + if (evt.keyCode === 40) { + // Down + children = searchResults.children(); + if (selected < children.length-1) { + if (selected > -1) { + $(children[selected]).removeClass('selected'); + } + selected++; + } + $(children[selected]).addClass('selected'); + ensureSelectedIsVisible(); + evt.preventDefault(); + } else if (evt.keyCode === 38) { + // Up + children = searchResults.children(); + if (selected > 0) { + if (selected < children.length) { + $(children[selected]).removeClass('selected'); + } + selected--; + } + $(children[selected]).addClass('selected'); + ensureSelectedIsVisible(); + evt.preventDefault(); + } else if (evt.keyCode === 13) { + // Enter + if (results.length > 0) { + selectCommand(results[Math.max(0,selected)]); + } + } + } + }); + 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 + }); + + } + + function selectCommand(command) { + hide(); + RED.actions.invoke(command.id); + console.log(command); + } + + function show(v) { + if (disabled) { + return; + } + if (!visible) { + activeElement = document.activeElement; + 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) + search(v); + RED.events.emit("commandPrompt: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("commandPrompt:close"); + } + } + + function init() { + RED.actions.add("core:show-command-prompt",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/search.js b/packages/node_modules/@node-red/editor-client/src/js/ui/search.js index d814ab738..74072065a 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("commandPrompt:open",function() { disabled = true; }); + RED.events.on("commandPrompt: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..2fd016508 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,12 @@ font-style: italic; color: $form-placeholder-color; } + +.red-ui-search-result-action { + color: $primary-text-color; +} +.red-ui-search-result-action-key { + float:right; + margin-right: 10px; + color: $tertiary-text-color; +} From 2de9a804a00161bf25b9c52a469147a397d25d9c Mon Sep 17 00:00:00 2001 From: Nick O'Leary Date: Fri, 7 Jun 2019 12:07:58 +0100 Subject: [PATCH 2/3] Tidy up nls of command prompt and selection handling --- .../editor-client/locales/en-US/editor.json | 3 ++- .../editor-client/src/js/keymap.json | 2 +- .../editor-client/src/js/ui/commandPrompt.js | 21 +++---------------- 3 files changed, 6 insertions(+), 20 deletions(-) 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..a92de4304 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 @@ -710,7 +710,8 @@ }, "search": { "empty": "No matches found", - "addNode": "add a node..." + "addNode": "add a node...", + "actions": "search available actions" }, "expressionEditor": { "functions": "Functions", 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 b3544c124..db7c4f77d 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 @@ -23,7 +23,7 @@ "ctrl-alt-o": "core:open-project", "ctrl-g v": "core:show-version-control-tab", "ctrl-shift-l": "core:show-event-log", - "ctrl-shift-p":"core:show-command-prompt" + "alt-shift-p":"core:show-command-prompt" }, "red-ui-sidebar-node-config": { "backspace": "core:delete-config-selection", diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/commandPrompt.js b/packages/node_modules/@node-red/editor-client/src/js/ui/commandPrompt.js index e86fde55a..733be9aab 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/commandPrompt.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/commandPrompt.js @@ -21,7 +21,6 @@ RED.commandPrompt = (function() { var searchResults; var selected = -1; var visible = false; - var activeElement; var results = []; @@ -29,6 +28,8 @@ RED.commandPrompt = (function() { function search(val) { scopes = {}; + results = []; + selected = -1; val = val ||""; searchResults.editableList('empty'); @@ -40,18 +41,6 @@ RED.commandPrompt = (function() { val = val.trim().toLowerCase(); actions.forEach(function(action) { - if (action.scope && action.scope !== "*") { - if (!scopes.hasOwnProperty(action.scope)) { - var target = activeElement; - while (target.nodeName !== 'BODY' && target.id !== action.scope) { - target = target.parentElement; - } - scopes[action.scope] = (target.nodeName !== 'BODY') - } - if (!scopes[action.scope]) { - return; - } - } action.label = action.id.replace(/:/,": ").replace(/-/g," ").replace(/(^| )./g,function() { return arguments[0].toUpperCase()}); if (val !== "" && action.label.toLowerCase().indexOf(val) === -1) { return; @@ -59,8 +48,6 @@ RED.commandPrompt = (function() { results.push(action); searchResults.editableList('addItem',action) }) - // searchResults.editableList('addItem',{}); - console.log(document.activeElement); } @@ -83,7 +70,7 @@ RED.commandPrompt = (function() { function createDialog() { dialog = $("
    ",{id:"red-ui-commandPrompt",class:"red-ui-search"}).appendTo("#red-ui-main-container"); var searchDiv = $("
    ",{class:"red-ui-search-container"}).appendTo(dialog); - searchInput = $('').appendTo(searchDiv).searchBox({ + searchInput = $('').appendTo(searchDiv).searchBox({ delay: 200, change: function() { search($(this).val()); @@ -158,7 +145,6 @@ RED.commandPrompt = (function() { function selectCommand(command) { hide(); RED.actions.invoke(command.id); - console.log(command); } function show(v) { @@ -166,7 +152,6 @@ RED.commandPrompt = (function() { return; } if (!visible) { - activeElement = document.activeElement; RED.keyboard.add("*","escape",function(){hide()}); $("#red-ui-header-shade").show(); $("#red-ui-editor-shade").show(); From cc0933eee4c17a24ea45884579915ebf2e9b3fc7 Mon Sep 17 00:00:00 2001 From: Nick O'Leary Date: Tue, 11 Jun 2019 22:43:01 +0100 Subject: [PATCH 3/3] Rename commandPrompt to actionList --- Gruntfile.js | 2 +- .../editor-client/locales/en-US/editor.json | 6 +- .../editor-client/src/js/keymap.json | 4 +- .../@node-red/editor-client/src/js/red.js | 3 +- .../js/ui/{commandPrompt.js => actionList.js} | 128 ++++++++---------- .../editor-client/src/js/ui/clipboard.js | 4 +- .../src/js/ui/common/editableList.js | 9 ++ .../editor-client/src/js/ui/search.js | 4 +- .../editor-client/src/sass/search.scss | 4 +- 9 files changed, 84 insertions(+), 80 deletions(-) rename packages/node_modules/@node-red/editor-client/src/js/ui/{commandPrompt.js => actionList.js} (65%) diff --git a/Gruntfile.js b/Gruntfile.js index f6fb3e19a..8b7b85a25 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -169,7 +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/commandPrompt.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 a92de4304..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", @@ -710,8 +711,7 @@ }, "search": { "empty": "No matches found", - "addNode": "add a node...", - "actions": "search available actions" + "addNode": "add a node..." }, "expressionEditor": { "functions": "Functions", 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 db7c4f77d..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", @@ -23,7 +23,7 @@ "ctrl-alt-o": "core:open-project", "ctrl-g v": "core:show-version-control-tab", "ctrl-shift-l": "core:show-event-log", - "alt-shift-p":"core:show-command-prompt" + "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 d8962c44a..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,7 +522,7 @@ var RED = (function() { RED.subflow.init(); RED.clipboard.init(); RED.search.init(); - RED.commandPrompt.init(); + RED.actionList.init(); RED.editor.init(); RED.diff.init(); diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/commandPrompt.js b/packages/node_modules/@node-red/editor-client/src/js/ui/actionList.js similarity index 65% rename from packages/node_modules/@node-red/editor-client/src/js/ui/commandPrompt.js rename to packages/node_modules/@node-red/editor-client/src/js/ui/actionList.js index 733be9aab..d3155051b 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/commandPrompt.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/actionList.js @@ -13,7 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. **/ -RED.commandPrompt = (function() { +RED.actionList = (function() { var disabled = false; var dialog = null; @@ -22,34 +22,7 @@ RED.commandPrompt = (function() { var selected = -1; var visible = false; - var results = []; - - var scopes = {}; - - function search(val) { - scopes = {}; - results = []; - selected = -1; - val = val ||""; - searchResults.editableList('empty'); - - var actions = RED.actions.list(); - actions.sort(function(A,B) { - return A.id.localeCompare(B.id); - }); - - val = val.trim().toLowerCase(); - - actions.forEach(function(action) { - action.label = action.id.replace(/:/,": ").replace(/-/g," ").replace(/(^| )./g,function() { return arguments[0].toUpperCase()}); - if (val !== "" && action.label.toLowerCase().indexOf(val) === -1) { - return; - } - results.push(action); - searchResults.editableList('addItem',action) - }) - - } + var filterTerm = ""; function ensureSelectedIsVisible() { var selectedEntry = searchResults.find("li.selected"); @@ -68,48 +41,50 @@ RED.commandPrompt = (function() { } function createDialog() { - dialog = $("
    ",{id:"red-ui-commandPrompt",class:"red-ui-search"}).appendTo("#red-ui-main-container"); + 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({ - delay: 200, + searchInput = $('').appendTo(searchDiv).searchBox({ change: function() { - search($(this).val()); + filterTerm = $(this).val(); + searchResults.editableList('filter'); + searchResults.find("li.selected").removeClass("selected"); } }); searchInput.on('keydown',function(evt) { - var children; - if (results.length > 0) { - if (evt.keyCode === 40) { - // Down - children = searchResults.children(); - if (selected < children.length-1) { - if (selected > -1) { - $(children[selected]).removeClass('selected'); - } - selected++; + 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]; } - $(children[selected]).addClass('selected'); - ensureSelectedIsVisible(); - evt.preventDefault(); - } else if (evt.keyCode === 38) { - // Up - children = searchResults.children(); - if (selected > 0) { - if (selected < children.length) { - $(children[selected]).removeClass('selected'); - } - selected--; - } - $(children[selected]).addClass('selected'); - ensureSelectedIsVisible(); - evt.preventDefault(); - } else if (evt.keyCode === 13) { - // Enter - if (results.length > 0) { - selectCommand(results[Math.max(0,selected)]); + } 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(); @@ -137,14 +112,22 @@ RED.commandPrompt = (function() { }); } }, - scrollOnAdd: false + scrollOnAdd: false, + filter: function(item) { + if (filterTerm !== "" && item.label.toLowerCase().indexOf(filterTerm) === -1) { + return false; + } + return true; + } }); } function selectCommand(command) { hide(); - RED.actions.invoke(command.id); + if (command) { + RED.actions.invoke(command.id); + } } function show(v) { @@ -163,8 +146,17 @@ RED.commandPrompt = (function() { } dialog.slideDown(300); searchInput.searchBox('value',v) - search(v); - RED.events.emit("commandPrompt:open"); + 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"); @@ -184,12 +176,12 @@ RED.commandPrompt = (function() { searchInput.searchBox('value',''); }); } - RED.events.emit("commandPrompt:close"); + RED.events.emit("actionList:close"); } } function init() { - RED.actions.add("core:show-command-prompt",show); + RED.actions.add("core:show-action-list",show); RED.events.on("editor:open",function() { disabled = true; }); RED.events.on("editor:close",function() { disabled = false; }); 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 8c8d3a664..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,8 +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("commandPrompt:open",function() { disabled = true; }); - RED.events.on("commandPrompt: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 74072065a..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 @@ -296,8 +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("commandPrompt:open",function() { disabled = true; }); - RED.events.on("commandPrompt: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 2fd016508..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 @@ -198,7 +198,9 @@ color: $primary-text-color; } .red-ui-search-result-action-key { - float:right; + position: absolute; + top: 9px; + right: 0; margin-right: 10px; color: $tertiary-text-color; }