Skip to content

Commit

Permalink
Rollup merge of rust-lang#78876 - GuillaumeGomez:better-setting-keybo…
Browse files Browse the repository at this point in the history
…ard-ux, r=jyn514

Make keyboard interactions in the settings menu more pleasant

rust-lang#78868 improved the keyboard interactions with the settings page. This PR goes a bit further by allowing more than just "space" to toggle the checkboxes.

r? `@jyn514`
  • Loading branch information
Dylan-DPC authored Nov 30, 2020
2 parents 9905bb7 + 14ecee7 commit 0e0aeec
Show file tree
Hide file tree
Showing 2 changed files with 62 additions and 55 deletions.
45 changes: 23 additions & 22 deletions src/librustdoc/html/static/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,29 @@ if (!DOMTokenList.prototype.remove) {
};
}


// Gets the human-readable string for the virtual-key code of the
// given KeyboardEvent, ev.
//
// This function is meant as a polyfill for KeyboardEvent#key,
// since it is not supported in IE 11 or Chrome for Android. We also test for
// KeyboardEvent#keyCode because the handleShortcut handler is
// also registered for the keydown event, because Blink doesn't fire
// keypress on hitting the Escape key.
//
// So I guess you could say things are getting pretty interoperable.
function getVirtualKey(ev) {
if ("key" in ev && typeof ev.key != "undefined") {
return ev.key;
}

var c = ev.charCode || ev.keyCode;
if (c == 27) {
return "Escape";
}
return String.fromCharCode(c);
}

function getSearchInput() {
return document.getElementsByClassName("search-input")[0];
}
Expand Down Expand Up @@ -326,28 +349,6 @@ function defocusSearchBar() {
}
}

// Gets the human-readable string for the virtual-key code of the
// given KeyboardEvent, ev.
//
// This function is meant as a polyfill for KeyboardEvent#key,
// since it is not supported in Trident. We also test for
// KeyboardEvent#keyCode because the handleShortcut handler is
// also registered for the keydown event, because Blink doesn't fire
// keypress on hitting the Escape key.
//
// So I guess you could say things are getting pretty interoperable.
function getVirtualKey(ev) {
if ("key" in ev && typeof ev.key != "undefined") {
return ev.key;
}

var c = ev.charCode || ev.keyCode;
if (c == 27) {
return "Escape";
}
return String.fromCharCode(c);
}

function getHelpElement() {
buildHelperPopup();
return document.getElementById("help");
Expand Down
72 changes: 39 additions & 33 deletions src/librustdoc/html/static/settings.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
// Local js definitions:
/* global getCurrentValue, updateLocalStorage, updateSystemTheme */
/* global getCurrentValue, getVirtualKey, updateLocalStorage, updateSystemTheme */

(function () {
function changeSetting(settingName, value) {
Expand All @@ -14,41 +14,47 @@
}
}

function setEvents() {
var elems = {
toggles: document.getElementsByClassName("slider"),
selects: document.getElementsByClassName("select-wrapper")
};
var i;

if (elems.toggles && elems.toggles.length > 0) {
for (i = 0; i < elems.toggles.length; ++i) {
var toggle = elems.toggles[i].previousElementSibling;
var settingId = toggle.id;
var settingValue = getSettingValue(settingId);
if (settingValue !== null) {
toggle.checked = settingValue === "true";
}
toggle.onchange = function() {
changeSetting(this.id, this.checked);
};
}
function handleKey(ev) {
// Don't interfere with browser shortcuts
if (ev.ctrlKey || ev.altKey || ev.metaKey) {
return;
}
switch (getVirtualKey(ev)) {
case "Enter":
case "Return":
case "Space":
ev.target.checked = !ev.target.checked;
ev.preventDefault();
break;
}
}

if (elems.selects && elems.selects.length > 0) {
for (i = 0; i < elems.selects.length; ++i) {
var select = elems.selects[i].getElementsByTagName("select")[0];
var settingId = select.id;
var settingValue = getSettingValue(settingId);
if (settingValue !== null) {
select.value = settingValue;
}
select.onchange = function() {
changeSetting(this.id, this.value);
};
function setEvents() {
onEachLazy(document.getElementsByClassName("slider"), function(elem) {
var toggle = elem.previousElementSibling;
var settingId = toggle.id;
var settingValue = getSettingValue(settingId);
if (settingValue !== null) {
toggle.checked = settingValue === "true";
}
}
toggle.onchange = function() {
changeSetting(this.id, this.checked);
};
toggle.onkeyup = handleKey;
toggle.onkeyrelease = handleKey;
});
onEachLazy(document.getElementsByClassName("select-wrapper"), function(elem) {
var select = elem.getElementsByTagName("select")[0];
var settingId = select.id;
var settingValue = getSettingValue(settingId);
if (settingValue !== null) {
select.value = settingValue;
}
select.onchange = function() {
changeSetting(this.id, this.value);
};
});
}

setEvents();
window.addEventListener("DOMContentLoaded", setEvents);
})();

0 comments on commit 0e0aeec

Please sign in to comment.