bluesaxman/librePECS
1
0
Fork 0
mirror of https://forge.murkfall.net/bluesaxman/librePECS.git synced 2026-03-13 02:04:20 -06:00
Code Issues Packages Projects Releases Wiki Activity

Added options dialog

Browse Source
This commit is contained in:
bluesaxman
2025-08-18 15:21:33 -06:00
parent 056d6fd282
commit 5de0ea7f8a
2 changed files with 36 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
main.css
View File

@@ -99,15 +99,23 @@ body {
flex: 1;
}
.close {
.options_button, .close {
display: inline-block;
background: rgba(128,128,128,0.01);
box-shadow: inset 2px 2px 2px 0 rgba(128,128,128,0.5);
background: var(--middle-accent);
box-shadow: inset 2px 2px 2px 0 var(--middle-shade);
width: 50px;
text-align: center;
cursor: pointer;
}
.options_button {
position: absolute;
height: 50px;
top: 0;
right: 0;
font-size: 32pt;
}
.focused {
left: 0vw;
backdrop-filter: blur(5px);

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);