mirror of https://github.com/searx/searx
361 lines
9.1 KiB
JavaScript
361 lines
9.1 KiB
JavaScript
searx.ready(function() {
|
|
|
|
searx.on('.result', 'click', function() {
|
|
highlightResult(this)(true);
|
|
});
|
|
|
|
searx.on('.result a', 'focus', function(e) {
|
|
var el = e.target;
|
|
while (el !== undefined) {
|
|
if (el.classList.contains('result')) {
|
|
if (el.getAttribute("data-vim-selected") === null) {
|
|
highlightResult(el)(true);
|
|
}
|
|
break;
|
|
}
|
|
el = el.parentNode;
|
|
}
|
|
}, true);
|
|
|
|
var vimKeys = {
|
|
27: {
|
|
key: 'Escape',
|
|
fun: removeFocus,
|
|
des: 'remove focus from the focused input',
|
|
cat: 'Control'
|
|
},
|
|
73: {
|
|
key: 'i',
|
|
fun: searchInputFocus,
|
|
des: 'focus on the search input',
|
|
cat: 'Control'
|
|
},
|
|
66: {
|
|
key: 'b',
|
|
fun: scrollPage(-window.innerHeight),
|
|
des: 'scroll one page up',
|
|
cat: 'Navigation'
|
|
},
|
|
70: {
|
|
key: 'f',
|
|
fun: scrollPage(window.innerHeight),
|
|
des: 'scroll one page down',
|
|
cat: 'Navigation'
|
|
},
|
|
85: {
|
|
key: 'u',
|
|
fun: scrollPage(-window.innerHeight / 2),
|
|
des: 'scroll half a page up',
|
|
cat: 'Navigation'
|
|
},
|
|
68: {
|
|
key: 'd',
|
|
fun: scrollPage(window.innerHeight / 2),
|
|
des: 'scroll half a page down',
|
|
cat: 'Navigation'
|
|
},
|
|
71: {
|
|
key: 'g',
|
|
fun: scrollPageTo(-document.body.scrollHeight, 'top'),
|
|
des: 'scroll to the top of the page',
|
|
cat: 'Navigation'
|
|
},
|
|
86: {
|
|
key: 'v',
|
|
fun: scrollPageTo(document.body.scrollHeight, 'bottom'),
|
|
des: 'scroll to the bottom of the page',
|
|
cat: 'Navigation'
|
|
},
|
|
75: {
|
|
key: 'k',
|
|
fun: highlightResult('up'),
|
|
des: 'select previous search result',
|
|
cat: 'Results'
|
|
},
|
|
74: {
|
|
key: 'j',
|
|
fun: highlightResult('down'),
|
|
des: 'select next search result',
|
|
cat: 'Results'
|
|
},
|
|
80: {
|
|
key: 'p',
|
|
fun: pageButtonClick(0),
|
|
des: 'go to previous page',
|
|
cat: 'Results'
|
|
},
|
|
78: {
|
|
key: 'n',
|
|
fun: pageButtonClick(1),
|
|
des: 'go to next page',
|
|
cat: 'Results'
|
|
},
|
|
79: {
|
|
key: 'o',
|
|
fun: openResult(false),
|
|
des: 'open search result',
|
|
cat: 'Results'
|
|
},
|
|
84: {
|
|
key: 't',
|
|
fun: openResult(true),
|
|
des: 'open the result in a new tab',
|
|
cat: 'Results'
|
|
},
|
|
82: {
|
|
key: 'r',
|
|
fun: reloadPage,
|
|
des: 'reload page from the server',
|
|
cat: 'Control'
|
|
},
|
|
72: {
|
|
key: 'h',
|
|
fun: toggleHelp,
|
|
des: 'toggle help window',
|
|
cat: 'Other'
|
|
}
|
|
};
|
|
|
|
searx.on(document, "keyup", function(e) {
|
|
// check for modifiers so we don't break browser's hotkeys
|
|
if (vimKeys.hasOwnProperty(e.keyCode) && !e.ctrlKey && !e.altKey && !e.shiftKey && !e.metaKey) {
|
|
var tagName = e.target.tagName.toLowerCase();
|
|
if (e.keyCode === 27) {
|
|
if (tagName === 'input' || tagName === 'select' || tagName === 'textarea') {
|
|
vimKeys[e.keyCode].fun();
|
|
}
|
|
} else {
|
|
if (e.target === document.body || tagName === 'a' || tagName === 'button') {
|
|
vimKeys[e.keyCode].fun();
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
function highlightResult(which) {
|
|
return function(noScroll) {
|
|
var current = document.querySelector('.result[data-vim-selected]'),
|
|
effectiveWhich = which;
|
|
if (current === null) {
|
|
// no selection : choose the first one
|
|
current = document.querySelector('.result');
|
|
if (current === null) {
|
|
// no first one : there are no results
|
|
return;
|
|
}
|
|
// replace up/down actions by selecting first one
|
|
if (which === "down" || which === "up") {
|
|
effectiveWhich = current;
|
|
}
|
|
}
|
|
|
|
var next, results = document.querySelectorAll('.result');
|
|
|
|
if (typeof effectiveWhich !== 'string') {
|
|
next = effectiveWhich;
|
|
} else {
|
|
switch (effectiveWhich) {
|
|
case 'visible':
|
|
var top = document.documentElement.scrollTop || document.body.scrollTop;
|
|
var bot = top + document.documentElement.clientHeight;
|
|
|
|
for (var i = 0; i < results.length; i++) {
|
|
next = results[i];
|
|
var etop = next.offsetTop;
|
|
var ebot = etop + next.clientHeight;
|
|
|
|
if ((ebot <= bot) && (etop > top)) {
|
|
break;
|
|
}
|
|
}
|
|
break;
|
|
case 'down':
|
|
next = current.nextElementSibling;
|
|
if (next === null) {
|
|
next = results[0];
|
|
}
|
|
break;
|
|
case 'up':
|
|
next = current.previousElementSibling;
|
|
if (next === null) {
|
|
next = results[results.length - 1];
|
|
}
|
|
break;
|
|
case 'bottom':
|
|
next = results[results.length - 1];
|
|
break;
|
|
case 'top':
|
|
/* falls through */
|
|
default:
|
|
next = results[0];
|
|
}
|
|
}
|
|
|
|
if (next) {
|
|
current.removeAttribute('data-vim-selected');
|
|
next.setAttribute('data-vim-selected', 'true');
|
|
var link = next.querySelector('h3 a') || next.querySelector('a');
|
|
if (link !== null) {
|
|
link.focus();
|
|
}
|
|
if (!noScroll) {
|
|
scrollPageToSelected();
|
|
}
|
|
}
|
|
};
|
|
}
|
|
|
|
function reloadPage() {
|
|
document.location.reload(true);
|
|
}
|
|
|
|
function removeFocus() {
|
|
if (document.activeElement) {
|
|
document.activeElement.blur();
|
|
}
|
|
}
|
|
|
|
function pageButtonClick(num) {
|
|
return function() {
|
|
var buttons = $('div#pagination button[type="submit"]');
|
|
if (buttons.length !== 2) {
|
|
console.log('page navigation with this theme is not supported');
|
|
return;
|
|
}
|
|
if (num >= 0 && num < buttons.length) {
|
|
buttons[num].click();
|
|
} else {
|
|
console.log('pageButtonClick(): invalid argument');
|
|
}
|
|
};
|
|
}
|
|
|
|
function scrollPageToSelected() {
|
|
var sel = document.querySelector('.result[data-vim-selected]');
|
|
if (sel === null) {
|
|
return;
|
|
}
|
|
var wtop = document.documentElement.scrollTop || document.body.scrollTop,
|
|
wheight = document.documentElement.clientHeight,
|
|
etop = sel.offsetTop,
|
|
ebot = etop + sel.clientHeight,
|
|
offset = 120;
|
|
// first element ?
|
|
if ((sel.previousElementSibling === null) && (ebot < wheight)) {
|
|
// set to the top of page if the first element
|
|
// is fully included in the viewport
|
|
window.scroll(window.scrollX, 0);
|
|
return;
|
|
}
|
|
if (wtop > (etop - offset)) {
|
|
window.scroll(window.scrollX, etop - offset);
|
|
} else {
|
|
var wbot = wtop + wheight;
|
|
if (wbot < (ebot + offset)) {
|
|
window.scroll(window.scrollX, ebot - wheight + offset);
|
|
}
|
|
}
|
|
}
|
|
|
|
function scrollPage(amount) {
|
|
return function() {
|
|
window.scrollBy(0, amount);
|
|
highlightResult('visible')();
|
|
};
|
|
}
|
|
|
|
function scrollPageTo(position, nav) {
|
|
return function() {
|
|
window.scrollTo(0, position);
|
|
highlightResult(nav)();
|
|
};
|
|
}
|
|
|
|
function searchInputFocus() {
|
|
window.scrollTo(0, 0);
|
|
document.querySelector('#q').focus();
|
|
}
|
|
|
|
function openResult(newTab) {
|
|
return function() {
|
|
var link = document.querySelector('.result[data-vim-selected] h3 a');
|
|
if (link !== null) {
|
|
var url = link.getAttribute('href');
|
|
if (newTab) {
|
|
window.open(url);
|
|
} else {
|
|
window.location.href = url;
|
|
}
|
|
}
|
|
};
|
|
}
|
|
|
|
function toggleHelp() {
|
|
var helpPanel = document.querySelector('#vim-hotkeys-help');
|
|
if (helpPanel.length) {
|
|
helpPanel.classList.toggle('hidden');
|
|
return;
|
|
}
|
|
|
|
var categories = {};
|
|
|
|
for (var k in vimKeys) {
|
|
var key = vimKeys[k];
|
|
categories[key.cat] = categories[key.cat] || [];
|
|
categories[key.cat].push(key);
|
|
}
|
|
|
|
var sorted = Object.keys(categories).sort(function(a, b) {
|
|
return categories[b].length - categories[a].length;
|
|
});
|
|
|
|
if (sorted.length === 0) {
|
|
return;
|
|
}
|
|
|
|
var html = '<div id="vim-hotkeys-help" class="well vim-hotkeys-help">';
|
|
html += '<div class="container-fluid">';
|
|
|
|
html += '<div class="row">';
|
|
html += '<div class="col-sm-12">';
|
|
html += '<h3>How to navigate searx with Vim-like hotkeys</h3>';
|
|
html += '</div>'; // col-sm-12
|
|
html += '</div>'; // row
|
|
|
|
for (var i = 0; i < sorted.length; i++) {
|
|
var cat = categories[sorted[i]];
|
|
|
|
var lastCategory = i === (sorted.length - 1);
|
|
var first = i % 2 === 0;
|
|
|
|
if (first) {
|
|
html += '<div class="row dflex">';
|
|
}
|
|
html += '<div class="col-sm-' + (first && lastCategory ? 12 : 6) + ' dflex">';
|
|
|
|
html += '<div class="panel panel-default iflex">';
|
|
html += '<div class="panel-heading">' + cat[0].cat + '</div>';
|
|
html += '<div class="panel-body">';
|
|
html += '<ul class="list-unstyled">';
|
|
|
|
for (var cj in cat) {
|
|
html += '<li><kbd>' + cat[cj].key + '</kbd> ' + cat[cj].des + '</li>';
|
|
}
|
|
|
|
html += '</ul>';
|
|
html += '</div>'; // panel-body
|
|
html += '</div>'; // panel
|
|
html += '</div>'; // col-sm-*
|
|
|
|
if (!first || lastCategory) {
|
|
html += '</div>'; // row
|
|
}
|
|
}
|
|
|
|
html += '</div>'; // container-fluid
|
|
html += '</div>'; // vim-hotkeys-help
|
|
|
|
$('body').append(html);
|
|
}
|
|
});
|