Added options dialog

This commit is contained in:
2025-08-18 15:21:33 -06:00
parent 056d6fd282
commit 5de0ea7f8a
2 changed files with 36 additions and 5 deletions

27
main.js
View File

@@ -170,6 +170,10 @@ document.body.appendChild(app.gui.main);
app.gui.menu = document.createElement("nav");
app.gui.menu.id = "navigation";
app.gui.main.appendChild(app.gui.menu);
app.gui.optionsButton = document.createElement("div");
app.gui.optionsButton.classList.add("options_button");
app.gui.optionsButton.innerHTML = "☰";
app.gui.menu.appendChild(app.gui.optionsButton);
app.gui.view = document.createElement("div");
app.gui.view.id = "view";
app.gui.main.appendChild(app.gui.view);
@@ -179,8 +183,9 @@ app.gui.library.body.classList.add("dialog_body");
app.gui.main.append(app.gui.library.root);
// Options popup
app.gui.options = new auxillery_dialog("Options");
app.gui.library.body.classList.add("dialog_body");
app.gui.main.append(app.gui.library.root);
app.gui.options.body.classList.add("dialog_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
for (var x = 0; x < 16; x++) {
var name = "pec"+x;
@@ -214,3 +219,21 @@ app.library.forEach((p,i)=>{
newPec.addEventListener("click", useThisPec);
app.gui.library.body.appendChild(newPec);
});
// Populate Options
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
// 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_audioFeedback = document.createElement("div");
app.gui.options.body.appendChild(app.gui.options_audioFeedback);
app.gui.options_feedbackFloodLimit = document.createElement("div");
app.gui.options.body.appendChild(app.gui.options_feedbackFloodLimit);
app.gui.options_feedbackTimeout = document.createElement("div");
app.gui.options.body.appendChild(app.gui.options_feedbackTimeout);