1 // Local js definitions:
2 /* global getSettingValue, getVirtualKey, onEachLazy, updateLocalStorage, updateSystemTheme */
3 /* global addClass, removeClass */
6 function changeSetting(settingName, value) {
7 updateLocalStorage(settingName, value);
11 case "preferred-dark-theme":
12 case "preferred-light-theme":
13 case "use-system-theme":
20 function handleKey(ev) {
21 // Don't interfere with browser shortcuts
22 if (ev.ctrlKey || ev.altKey || ev.metaKey) {
25 switch (getVirtualKey(ev)) {
29 ev.target.checked = !ev.target.checked;
35 function showLightAndDark() {
36 addClass(document.getElementById("theme").parentElement, "hidden");
37 removeClass(document.getElementById("preferred-light-theme").parentElement, "hidden");
38 removeClass(document.getElementById("preferred-dark-theme").parentElement, "hidden");
41 function hideLightAndDark() {
42 addClass(document.getElementById("preferred-light-theme").parentElement, "hidden");
43 addClass(document.getElementById("preferred-dark-theme").parentElement, "hidden");
44 removeClass(document.getElementById("theme").parentElement, "hidden");
47 function updateLightAndDark() {
48 if (getSettingValue("use-system-theme") !== "false") {
55 function setEvents() {
57 onEachLazy(document.getElementsByClassName("slider"), function(elem) {
58 var toggle = elem.previousElementSibling;
59 var settingId = toggle.id;
60 var settingValue = getSettingValue(settingId);
61 if (settingValue !== null) {
62 toggle.checked = settingValue === "true";
64 toggle.onchange = function() {
65 changeSetting(this.id, this.checked);
67 toggle.onkeyup = handleKey;
68 toggle.onkeyrelease = handleKey;
70 onEachLazy(document.getElementsByClassName("select-wrapper"), function(elem) {
71 var select = elem.getElementsByTagName("select")[0];
72 var settingId = select.id;
73 var settingValue = getSettingValue(settingId);
74 if (settingValue !== null) {
75 select.value = settingValue;
77 select.onchange = function() {
78 changeSetting(this.id, this.value);
81 onEachLazy(document.querySelectorAll("input[type=\"radio\"]"), function(elem) {
82 const settingId = elem.name;
83 const settingValue = getSettingValue(settingId);
84 if (settingValue !== null && settingValue !== "null") {
85 elem.checked = settingValue === elem.value;
87 elem.addEventListener("change", function(ev) {
88 changeSetting(ev.target.name, ev.target.value);
91 document.getElementById("back").addEventListener("click", function() {
96 window.addEventListener("DOMContentLoaded", setEvents);