Clean up code around theme elements
This commit is contained in:
parent
3ab4f9a204
commit
5dea1f1888
1 changed files with 19 additions and 11 deletions
|
@ -1,3 +1,4 @@
|
||||||
|
// ignore-tidy-filelength
|
||||||
// Local js definitions:
|
// Local js definitions:
|
||||||
/* global addClass, getSettingValue, hasClass */
|
/* global addClass, getSettingValue, hasClass */
|
||||||
/* global onEach, onEachLazy, hasOwnProperty, removeClass, updateLocalStorage */
|
/* global onEach, onEachLazy, hasOwnProperty, removeClass, updateLocalStorage */
|
||||||
|
@ -84,12 +85,20 @@ function getSearchElement() {
|
||||||
return document.getElementById("search");
|
return document.getElementById("search");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function getThemesElementId() {
|
||||||
|
return "theme-choices";
|
||||||
|
}
|
||||||
|
|
||||||
function getThemesElement() {
|
function getThemesElement() {
|
||||||
return document.getElementById("theme-choices");
|
return document.getElementById(getThemesElementId());
|
||||||
|
}
|
||||||
|
|
||||||
|
function getThemePickerElementId() {
|
||||||
|
return "theme-picker";
|
||||||
}
|
}
|
||||||
|
|
||||||
function getThemePickerElement() {
|
function getThemePickerElement() {
|
||||||
return document.getElementById("theme-picker");
|
return document.getElementById(getThemePickerElementId());
|
||||||
}
|
}
|
||||||
|
|
||||||
// Returns the current URL without any query parameter or hash.
|
// Returns the current URL without any query parameter or hash.
|
||||||
|
@ -143,11 +152,11 @@ function hideThemeButtonState() {
|
||||||
var active = document.activeElement;
|
var active = document.activeElement;
|
||||||
var related = e.relatedTarget;
|
var related = e.relatedTarget;
|
||||||
|
|
||||||
if (active.id !== "theme-picker" &&
|
if (active.id !== getThemePickerElementId() &&
|
||||||
(!active.parentNode || active.parentNode.id !== "theme-choices") &&
|
(!active.parentNode || active.parentNode.id !== getThemesElementId()) &&
|
||||||
(!related ||
|
(!related ||
|
||||||
(related.id !== "theme-picker" &&
|
(related.id !== getThemePickerElementId() &&
|
||||||
(!related.parentNode || related.parentNode.id !== "theme-choices")))) {
|
(!related.parentNode || related.parentNode.id !== getThemesElementId())))) {
|
||||||
hideThemeButtonState();
|
hideThemeButtonState();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -512,8 +521,7 @@ function hideThemeButtonState() {
|
||||||
break;
|
break;
|
||||||
|
|
||||||
default:
|
default:
|
||||||
var themePicker = getThemePickerElement();
|
if (getThemePickerElement().parentNode.contains(ev.target)) {
|
||||||
if (themePicker.parentNode.contains(ev.target)) {
|
|
||||||
handleThemeKeyDown(ev);
|
handleThemeKeyDown(ev);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -526,7 +534,7 @@ function hideThemeButtonState() {
|
||||||
switch (getVirtualKey(ev)) {
|
switch (getVirtualKey(ev)) {
|
||||||
case "ArrowUp":
|
case "ArrowUp":
|
||||||
ev.preventDefault();
|
ev.preventDefault();
|
||||||
if (active.previousElementSibling && ev.target.id !== "theme-picker") {
|
if (active.previousElementSibling && ev.target.id !== getThemePickerElementId()) {
|
||||||
active.previousElementSibling.focus();
|
active.previousElementSibling.focus();
|
||||||
} else {
|
} else {
|
||||||
showThemeButtonState();
|
showThemeButtonState();
|
||||||
|
@ -535,7 +543,7 @@ function hideThemeButtonState() {
|
||||||
break;
|
break;
|
||||||
case "ArrowDown":
|
case "ArrowDown":
|
||||||
ev.preventDefault();
|
ev.preventDefault();
|
||||||
if (active.nextElementSibling && ev.target.id !== "theme-picker") {
|
if (active.nextElementSibling && ev.target.id !== getThemePickerElementId()) {
|
||||||
active.nextElementSibling.focus();
|
active.nextElementSibling.focus();
|
||||||
} else {
|
} else {
|
||||||
showThemeButtonState();
|
showThemeButtonState();
|
||||||
|
@ -545,7 +553,7 @@ function hideThemeButtonState() {
|
||||||
case "Enter":
|
case "Enter":
|
||||||
case "Return":
|
case "Return":
|
||||||
case "Space":
|
case "Space":
|
||||||
if (ev.target.id === "theme-picker" && themes.style.display === "none") {
|
if (ev.target.id === getThemePickerElementId() && themes.style.display === "none") {
|
||||||
ev.preventDefault();
|
ev.preventDefault();
|
||||||
showThemeButtonState();
|
showThemeButtonState();
|
||||||
themes.firstElementChild.focus();
|
themes.firstElementChild.focus();
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue