Auto merge of #45288 - GuillaumeGomez:tab-key-binding, r=QuietMisdreavus

Save the highlighted item when switching tab

To be merged after #45281.

r? @rust-lang/docs
This commit is contained in:
bors 2017-10-19 23:55:20 +00:00
commit a651106ad0
3 changed files with 34 additions and 17 deletions

View File

@ -101,6 +101,8 @@ r##"<!DOCTYPE html>
<dd>Move up in search results</dd> <dd>Move up in search results</dd>
<dt></dt> <dt></dt>
<dd>Move down in search results</dd> <dd>Move down in search results</dd>
<dt></dt>
<dd>Switch tab</dd>
<dt>&#9166;</dt> <dt>&#9166;</dt>
<dd>Go to active search result</dd> <dd>Go to active search result</dd>
<dt>+</dt> <dt>+</dt>

View File

@ -712,41 +712,56 @@
}); });
var search_input = document.getElementsByClassName('search-input')[0]; var search_input = document.getElementsByClassName('search-input')[0];
search_input.onkeydown = null;
search_input.onkeydown = function(e) { search_input.onkeydown = function(e) {
var actives = []; // "actives" references the currently highlighted item in each search tab.
// Each array in "actives" represents a tab.
var actives = [[], [], []];
// "current" is used to know which tab we're looking into.
var current = 0;
onEach(document.getElementsByClassName('search-results'), function(e) { onEach(document.getElementsByClassName('search-results'), function(e) {
onEach(document.getElementsByClassName('highlighted'), function(e) { onEach(e.getElementsByClassName('highlighted'), function(e) {
actives.push(e); actives[current].push(e);
}); });
current += 1;
}); });
if (e.which === 38) { // up if (e.which === 38) { // up
if (!actives.length || !actives[0].previousElementSibling) { if (!actives[currentTab].length ||
!actives[currentTab][0].previousElementSibling) {
return; return;
} }
addClass(actives[0].previousElementSibling, 'highlighted'); addClass(actives[currentTab][0].previousElementSibling, 'highlighted');
removeClass(actives[0], 'highlighted'); removeClass(actives[currentTab][0], 'highlighted');
} else if (e.which === 40) { // down } else if (e.which === 40) { // down
if (!actives.length) { if (!actives[currentTab].length) {
var results = document.getElementsByClassName('search-results'); var results = document.getElementsByClassName('search-results');
if (results.length > 0) { if (results.length > 0) {
var res = results[0].getElementsByClassName('result'); var res = results[currentTab].getElementsByClassName('result');
if (res.length > 0) { if (res.length > 0) {
addClass(res[0], 'highlighted'); addClass(res[0], 'highlighted');
} }
} }
} else if (actives[0].nextElementSibling) { } else if (actives[currentTab][0].nextElementSibling) {
addClass(actives[0].nextElementSibling, 'highlighted'); addClass(actives[currentTab][0].nextElementSibling, 'highlighted');
removeClass(actives[0], 'highlighted'); removeClass(actives[currentTab][0], 'highlighted');
} }
} else if (e.which === 13) { // return } else if (e.which === 13) { // return
if (actives.length) { if (actives[currentTab].length) {
document.location.href = actives[0].getElementsByTagName('a')[0].href; document.location.href =
actives[currentTab][0].getElementsByTagName('a')[0].href;
} }
} else if (actives.length > 0) { } else if (e.which === 9) { // tab
removeClass(actives[0], 'highlighted'); if (e.shiftKey) {
printTab(currentTab > 0 ? currentTab - 1 : 2);
} else {
printTab(currentTab > 1 ? 0 : currentTab + 1);
}
e.preventDefault();
} else if (e.which === 16) { // shift
// Does nothing, it's just to avoid losing "focus" on the highlighted element.
} else if (actives[currentTab].length > 0) {
removeClass(actives[currentTab][0], 'highlighted');
} }
}; };
} }

View File

@ -552,7 +552,7 @@ body.blur > :not(#help) {
flex: 0 0 auto; flex: 0 0 auto;
box-shadow: 0 0 6px rgba(0,0,0,.2); box-shadow: 0 0 6px rgba(0,0,0,.2);
width: 550px; width: 550px;
height: 330px; height: 354px;
border: 1px solid; border: 1px solid;
} }
#help dt { #help dt {