mirror of
https://forge.murkfall.net/bluesaxman/librePECS.git
synced 2026-03-13 02:04:20 -06:00
Added options menu items, implimented darkmode, thank goodnes
This commit is contained in:
23
main.js
23
main.js
@@ -51,6 +51,15 @@ function systemMsg (message,level=0) { // abstraction?
|
||||
// but later we will also have it push an error toast in the ui.
|
||||
}
|
||||
|
||||
function toggleDarkmode () {
|
||||
var html = document.documentElement;
|
||||
if (html.classList.contains("darkmode")) {
|
||||
html.classList.remove("darkmode");
|
||||
} else {
|
||||
html.classList.add("darkmode");
|
||||
}
|
||||
}
|
||||
|
||||
function inRange(target,min,max) {
|
||||
if (isNaN(target) || isNaN(min) || isNaN(max)) { return false; }
|
||||
return (min <= target && target <= max);
|
||||
@@ -180,11 +189,11 @@ app.gui.view.id = "view";
|
||||
app.gui.main.appendChild(app.gui.view);
|
||||
// Library popup
|
||||
app.gui.library = new auxillery_dialog("Library");
|
||||
app.gui.library.body.classList.add("dialog_body");
|
||||
app.gui.library.body.classList.add("library_body");
|
||||
app.gui.main.append(app.gui.library.root);
|
||||
// Options popup
|
||||
app.gui.options = new auxillery_dialog("Options");
|
||||
app.gui.options.body.classList.add("dialog_body");
|
||||
app.gui.options.body.classList.add("options_body");
|
||||
app.gui.main.append(app.gui.options.root);
|
||||
app.gui.optionsButton.addEventListener("click", ()=>{ app.gui.options.root.classList.add("focused") });
|
||||
// pre-populate grid with emptys
|
||||
@@ -222,15 +231,23 @@ app.options = {};
|
||||
app.options.darkmode = false; // should always be an option
|
||||
app.options.audioFeedback = false; // read word aloude
|
||||
app.options.feedbackFloodLimit = 3;
|
||||
app.options.feedbackTimeout = 60000; // 60 seconds
|
||||
app.options.feedbackTimeout = 60; // 60 seconds
|
||||
// overload defaults with options stored in localstorage
|
||||
|
||||
// build Options UI
|
||||
app.gui.options_darkmode = document.createElement("div");
|
||||
app.gui.options.body.appendChild(app.gui.options_darkmode);
|
||||
app.gui.options_darkmode.innerHTML = '<label for="darkmode-checkbox">Darkmode</label> <input id="darkmode-checkbox" type="checkbox" class="dm-indicator" />';
|
||||
app.gui.options_darkmode.addEventListener("change", toggleDarkmode);
|
||||
|
||||
app.gui.options_audioFeedback = document.createElement("div");
|
||||
app.gui.options.body.appendChild(app.gui.options_audioFeedback);
|
||||
app.gui.options_audioFeedback.innerHTML = '<label for="audio-feedback-toggle">Read Allowed</label> <input id="audio-feedback-toggle" type="checkbox" class="toggle-switch" />';
|
||||
|
||||
app.gui.options_feedbackFloodLimit = document.createElement("div");
|
||||
app.gui.options.body.appendChild(app.gui.options_feedbackFloodLimit);
|
||||
app.gui.options_feedbackFloodLimit.innerHTML = '<label for="flood-limit">Audio Flood Limit</label> <input id="flood-limit" type="number" min=1 step=2 max=10 />';
|
||||
|
||||
app.gui.options_feedbackTimeout = document.createElement("div");
|
||||
app.gui.options.body.appendChild(app.gui.options_feedbackTimeout);
|
||||
app.gui.options_feedbackTimeout.innerHTML = '<label for="flood-timeout">Audio Flood Timeout</label> <input id="flood-timeout" type="number" min=0 step=10 />';
|
||||
|
||||
Reference in New Issue
Block a user