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:
parent
5293563a6a
commit
fe47b07229
@ -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__",
|
||||
|
@ -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"
|
||||
}
|
||||
}
|
||||
|
@ -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);
|
||||
|
||||
|
@ -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);
|
||||
|
@ -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) {
|
||||
|
@ -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,
|
||||
|
Loading…
Reference in New Issue
Block a user