tronnet/ProxmoxAAS-Dashboard
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

Compare commits

base: tronnet/ProxmoxAAS-Dashboard:00fa6f2f3b2aa12852c8274d75b7160fbf4e872b
Branches Tags
tronnet/ProxmoxAAS-Dashboard:main tronnet/ProxmoxAAS-Dashboard:v2.0.0 tronnet/ProxmoxAAS-Dashboard:instance-power-sync-fix tronnet/ProxmoxAAS-Dashboard:wfa-fuzzy-search
...
compare: tronnet/ProxmoxAAS-Dashboard:0752394d6990cc119c5a3b384d50bf797998255d
Branches Tags
tronnet/ProxmoxAAS-Dashboard:v2.0.0 tronnet/ProxmoxAAS-Dashboard:main tronnet/ProxmoxAAS-Dashboard:instance-power-sync-fix tronnet/ProxmoxAAS-Dashboard:wfa-fuzzy-search

1 Commits
00fa6f2f3b ... 0752394d69

Author SHA1 Message Date
alu 0752394d69 cleanup settings logic 2026-07-15 05:00:52 +00:00
5 changed files with 78 additions and 71 deletions
Expand all files Collapse all files
web/html/settings.html
+7 -1
View File
@@ -20,6 +20,12 @@
p:last-child { p:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
#save.disabled {
display: none;
}
#save.enabled {
display: unset;
}
</style> </style>
</head> </head>
<body> <body>
@@ -70,7 +76,7 @@
</fieldset> </fieldset>
</section> </section>
<div class="w3-container w3-center" id="form-actions"> <div class="w3-container w3-center" id="form-actions">
<button class="w3-button w3-margin" id="save" type="submit">SAVE</button> <button class="w3-button w3-margin disabled" id="save" type="submit">SAVE</button>
</div> </div>
</form> </form>
</main> </main>
web/scripts/clientsync.js
+3 -2
View File
@@ -1,7 +1,8 @@
import { getSyncSettings, requestAPI } from "./utils.js"; import { getSetting, requestAPI } from "./utils.js";
export async function setupClientSync (callback) { export async function setupClientSync (callback) {
const { scheme, rate } = getSyncSettings(); const scheme = getSetting("sync-scheme");
const rate = getSetting("sync-rate");
if (scheme === "never") { if (scheme === "never") {
return; return;
} }
web/scripts/index.js
+2 -2
View File
@@ -1,4 +1,4 @@
import { requestPVE, requestAPI, setAppearance, getSearchSettings, requestDash, setIconSrc, setIconAlt } from "./utils.js"; import { requestPVE, requestAPI, setAppearance, getSetting, requestDash, setIconSrc, setIconAlt } from "./utils.js";
import { alert, dialog, error } from "./dialog.js"; import { alert, dialog, error } from "./dialog.js";
import { setupClientSync } from "./clientsync.js"; import { setupClientSync } from "./clientsync.js";
import wfaInit from "../modules/wfa.js"; import wfaInit from "../modules/wfa.js";
@@ -243,7 +243,7 @@ function initInstances () {
} }
function sortInstances () { function sortInstances () {
const searchCriteria = getSearchSettings(); const searchCriteria = getSetting("search-criteria");
const searchQuery = document.querySelector("#search").value || null; const searchQuery = document.querySelector("#search").value || null;
let criteria; let criteria;
if (!searchQuery) { if (!searchQuery) {
web/scripts/settings.js
+50 -19
View File
@@ -1,36 +1,67 @@
import { setAppearance, getSyncSettings, getSearchSettings, getThemeSettings, setSyncSettings, setSearchSettings, setThemeSettings } from "./utils.js"; import { setAppearance, getSetting, setSetting } from "./utils.js";
window.addEventListener("DOMContentLoaded", init); window.addEventListener("DOMContentLoaded", init);
function init () { function init () {
setAppearance(); setAppearance();
const { scheme, rate } = getSyncSettings(); document.querySelectorAll("[id^=sync-]").forEach((v) => {
if (scheme) { v.addEventListener("change", handleSettingsChange);
document.querySelector(`#sync-${scheme}`).checked = true; });
} document.querySelector(`#sync-${getSetting("sync-scheme")}`).checked = true;
if (rate) { document.querySelector("#sync-rate").value = getSetting("sync-rate");
document.querySelector("#sync-rate").value = rate;
}
const search = getSearchSettings(); document.querySelectorAll("[id^=search-]").forEach((v) => {
if (search) { v.addEventListener("change", handleSettingsChange);
document.querySelector(`#search-${search}`).checked = true; });
} document.querySelector(`#search-${getSetting("search-criteria")}`).checked = true;
const theme = getThemeSettings(); document.querySelector("#appearance-theme").addEventListener("change", handleSettingsChange);
if (theme) { document.querySelector("#appearance-theme").value = getSetting("appearance-theme");
document.querySelector("#appearance-theme").value = theme;
}
document.querySelector("#settings").addEventListener("submit", handleSaveSettings, false); document.querySelector("#settings").addEventListener("submit", handleSaveSettings, false);
} }
function handleSettingsChange (event) {
event.preventDefault();
const form = new FormData(document.querySelector("#settings"));
const saveBtn = document.querySelector("#save");
if (getSetting("sync-scheme") !== form.get("sync-scheme")) {
saveBtn.classList.remove("disabled");
saveBtn.classList.add("enabled");
console.log("here1")
}
else if (getSetting("sync-rate") !== Number(form.get("sync-rate"))) {
saveBtn.classList.remove("disabled");
saveBtn.classList.add("enabled");
console.log("here2")
}
else if (getSetting("search-criteria") !== form.get("search-criteria")) {
saveBtn.classList.remove("disabled");
saveBtn.classList.add("enabled");
console.log("here3")
}
else if (getSetting("appearance-theme") !== form.get("appearance-theme")) {
saveBtn.classList.remove("disabled");
saveBtn.classList.add("enabled");
console.log("here4")
}
else {
saveBtn.classList.remove("enabled");
saveBtn.classList.add("disabled");
console.log("here5")
}
}
function handleSaveSettings (event) { function handleSaveSettings (event) {
event.preventDefault(); event.preventDefault();
const form = new FormData(document.querySelector("#settings")); const form = new FormData(document.querySelector("#settings"));
setSyncSettings(form.get("sync-scheme"), form.get("sync-rate")); const saveBtn = document.querySelector("#save");
setSearchSettings(form.get("search-criteria")); setSetting("sync-scheme", form.get("sync-scheme"));
setThemeSettings(form.get("appearance-theme")); setSetting("sync-rate", Number(form.get("sync-rate")));
setSetting("search-criteria", form.get("search-criteria"));
setSetting("appearance-theme", form.get("appearance-theme"));
saveBtn.classList.remove("enabled");
saveBtn.classList.add("disabled");
init(); init();
} }
web/scripts/utils.js
+16 -47
View File
@@ -125,60 +125,30 @@ export function getURIData () {
return Object.fromEntries(url.searchParams); return Object.fromEntries(url.searchParams);
} }
const settingsDefault = { const settings = {
"sync-scheme": "always", "sync-scheme": {"type": String, "default": "always"},
"sync-rate": 5, "sync-rate": {"type": Number, "default": 5},
"search-criteria": "fuzzy", "search-criteria": {"type": String, "default": "fuzzy"},
"appearance-theme": "auto" "appearance-theme": {"type": String, "default": "auto"}
}; };
export function getSyncSettings () { export function getSetting (key) {
let scheme = localStorage.getItem("sync-scheme"); const meta = settings[key];
let rate = Number(localStorage.getItem("sync-rate")); let value = localStorage.getItem(key);
if (!scheme) { if (value === null || meta === null) {
scheme = settingsDefault["sync-scheme"]; value = meta.default;
localStorage.setItem("sync-scheme", scheme); localStorage.setItem(key, meta.default);
} }
if (!rate) {
rate = settingsDefault["sync-rate"]; return meta.type(value);
localStorage.setItem("sync-rate", rate);
}
return { scheme, rate };
} }
export function getSearchSettings () { export function setSetting (key, value) {
let searchCriteria = localStorage.getItem("search-criteria"); localStorage.setItem(key, value);
if (!searchCriteria) {
searchCriteria = settingsDefault["search-criteria"];
localStorage.setItem("search-criteria", searchCriteria);
}
return searchCriteria;
}
export function getThemeSettings () {
let theme = localStorage.getItem("appearance-theme");
if (!theme) {
theme = settingsDefault["appearance-theme"];
localStorage.setItem("appearance-theme", theme);
}
return theme;
}
export function setSyncSettings (scheme, rate) {
localStorage.setItem("sync-scheme", scheme);
localStorage.setItem("sync-rate", rate);
}
export function setSearchSettings (criteria) {
localStorage.setItem("search-criteria", criteria);
}
export function setThemeSettings (theme) {
localStorage.setItem("appearance-theme", theme);
} }
export function setAppearance () { export function setAppearance () {
const theme = getThemeSettings(); const theme = getSetting("appearance-theme");
if (theme === "auto") { if (theme === "auto") {
document.querySelector(":root").classList.remove("dark-theme", "light-theme"); document.querySelector(":root").classList.remove("dark-theme", "light-theme");
} }
@@ -192,7 +162,6 @@ export function setAppearance () {
} }
} }
// assumes href is path to svg, and id to grab is #symb
export function setIconSrc (icon, path) { export function setIconSrc (icon, path) {
icon.setAttribute("src", path); icon.setAttribute("src", path);
} }