1
0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00

Add feature: search next, search previous

This commit is contained in:
Steve-Mcl 2022-02-09 11:00:09 +00:00
parent 5293563a6a
commit fe47b07229
6 changed files with 107 additions and 4 deletions

View File

@ -149,7 +149,10 @@
"toggle-navigator": "Toggle navigator",
"zoom-out": "Zoom out",
"zoom-reset": "Reset zoom",
"zoom-in": "Zoom in"
"zoom-in": "Zoom in",
"search-flows": "Search flows",
"search-prev": "Previous",
"search-next": "Next"
},
"user": {
"loggedInAs": "Logged in as __name__",

View File

@ -90,6 +90,8 @@
"alt-a m": "core:align-selection-to-middle",
"alt-a c": "core:align-selection-to-center",
"alt-a h": "core:distribute-selection-horizontally",
"alt-a v": "core:distribute-selection-vertically"
"alt-a v": "core:distribute-selection-vertically",
"shift-f": "core:search-prev",
"f": "core:search-next"
}
}

View File

@ -25,6 +25,7 @@ RED.search = (function() {
var searchHistory = [];
var index = {};
var currentResults = [];
var currentIndex = 0;
var previousActiveElement;
function indexProperty(node,label,property) {
@ -324,7 +325,8 @@ RED.search = (function() {
}
} else if (!$(children[selected]).hasClass("red-ui-search-historyHeader")) {
if (currentResults.length > 0) {
reveal(currentResults[Math.max(0,selected)].node);
currentIndex = Math.max(0,selected);
reveal(currentResults[currentIndex].node);
}
}
}
@ -408,6 +410,7 @@ RED.search = (function() {
div.on("click", function(evt) {
evt.preventDefault();
currentIndex = i;
reveal(node);
});
}
@ -428,8 +431,50 @@ RED.search = (function() {
RED.view.reveal(node.id);
}
function revealPrev() {
if(disabled) {
updateSearchToolbar();
return;
}
if(!searchResults || !currentResults.length) {
show();
return;
}
if(currentIndex > 0) {
currentIndex--;
} else {
currentIndex = currentResults.length-1;
}
const n = currentResults[currentIndex];
if(n && n.node && n.node.id) {
RED.view.reveal(n.node.id);
}
updateSearchToolbar();
}
function revealNext() {
if(disabled) {
updateSearchToolbar();
return;
}
if(!searchResults || !currentResults.length) {
show();
return;
}
if(currentIndex < currentResults.length-1) {
currentIndex++
} else {
currentIndex = 0;
}
const n = currentResults[currentIndex];
if(n && n.node && n.node.id) {
RED.view.reveal(n.node.id);
}
updateSearchToolbar();
}
function show(v) {
if (disabled) {
updateSearchToolbar();
return;
}
if (!visible) {
@ -475,8 +520,16 @@ RED.search = (function() {
previousActiveElement = null;
}
}
updateSearchToolbar();
}
function updateSearchToolbar() {
if(!disabled && currentIndex >= 0 && currentResults && currentResults.length ) {
$("#red-ui-view-searchtools-counter").text((currentIndex+1) + " of " + currentResults.length )
$("#view-search-tools > :not(:first-child)").show(); //show other tools
} else {
$("#view-search-tools > :not(:first-child)").hide(); //hide all but search button
}
}
function clearIndex() {
index = {};
}
@ -501,6 +554,8 @@ RED.search = (function() {
function init() {
RED.actions.add("core:search",show);
RED.actions.add("core:search-prev",revealPrev);
RED.actions.add("core:search-next",revealNext);
RED.events.on("editor:open",function() { disabled = true; });
RED.events.on("editor:close",function() { disabled = false; });
@ -516,6 +571,11 @@ RED.search = (function() {
$("#red-ui-palette-shade").on('mousedown',hide);
$("#red-ui-sidebar-shade").on('mousedown',hide);
$("#red-ui-view-searchtools-close").on("click", function close() {
currentResults = [];
updateSearchToolbar();
});
$("#red-ui-view-searchtools-close").trigger("click");
RED.events.on("workspace:clear", clearIndex);

View File

@ -31,6 +31,7 @@ RED.statusBar = (function() {
function addWidget(options) {
widgets[options.id] = options;
var el = $('<span class="red-ui-statusbar-widget"></span>');
el.prop('id', options.id);
options.element.appendTo(el);
if (options.align === 'left') {
leftBucket.append(el);

View File

@ -443,6 +443,33 @@ RED.view = (function() {
}
});
//add search to status-toolbar
RED.statusBar.add({
id: "view-search-tools",
align: "left",
hidden: false,
element: $('<span class="button-group">'+
'<button class="red-ui-footer-button" id="red-ui-view-searchtools-search"><i class="fa fa-search"></i></button>' +
'</span>' +
'<span class="button-group search-counter">' +
'<span class="red-ui-footer-button" id="red-ui-view-searchtools-counter">? of ?</span>' +
'</span>' +
'<span class="button-group">' +
'<button class="red-ui-footer-button" id="red-ui-view-searchtools-prev"><i class="fa fa-chevron-left"></i></button>' +
'<button class="red-ui-footer-button" id="red-ui-view-searchtools-next"><i class="fa fa-chevron-right"></i></button>' +
'</span>' +
'<span class="button-group">' +
'<button class="red-ui-footer-button" id="red-ui-view-searchtools-close"><i class="fa fa-close"></i></button>' +
'</span>')
})
$("#red-ui-view-searchtools-search").on("click", searchFlows);
RED.popover.tooltip($("#red-ui-view-searchtools-search"),RED._('actions.search-flows'),'core:search');
$("#red-ui-view-searchtools-prev").on("click", searchPrev);
RED.popover.tooltip($("#red-ui-view-searchtools-prev"),RED._('actions.search-prev'),'core:search-prev');
$("#red-ui-view-searchtools-next").on("click", searchNext);
RED.popover.tooltip($("#red-ui-view-searchtools-next"),RED._('actions.search-next'),'core:search-next');
RED.popover.tooltip($("#red-ui-view-searchtools-close"),RED._('common.label.close'));
// Handle nodes dragged from the palette
chart.droppable({
accept:".red-ui-palette-node",
@ -1997,6 +2024,9 @@ RED.view = (function() {
}
}
function zoomZero() { zoomView(1); }
function searchFlows() { RED.actions.invoke("core:search"); }
function searchPrev() { RED.actions.invoke("core:search-prev"); }
function searchNext() { RED.actions.invoke("core:search-next"); }
function zoomView(factor) {

View File

@ -135,6 +135,13 @@
margin-top: -1px;
}
}
.search-counter {
display: inline-block;
font-size: smaller;
font-weight: 600;
white-space: nowrap;
}
}
a.red-ui-footer-button,