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:
commit
a651106ad0
@ -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>⏎</dt>
|
<dt>⏎</dt>
|
||||||
<dd>Go to active search result</dd>
|
<dd>Go to active search result</dd>
|
||||||
<dt>+</dt>
|
<dt>+</dt>
|
||||||
|
@ -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');
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
@ -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 {
|
||||||
|
Loading…
Reference in New Issue
Block a user