diff --git a/web/scripts/settings.js b/web/scripts/settings.js index f44f263..e6d7f96 100644 --- a/web/scripts/settings.js +++ b/web/scripts/settings.js @@ -1,34 +1,35 @@ -import { setAppearance } from "./utils.js"; +import { setAppearance, getSyncSettings, getSearchSettings, getThemeSettings, setSyncSettings, setSearchSettings, setThemeSettings } from "./utils.js"; window.addEventListener("DOMContentLoaded", init); function init () { setAppearance(); - const scheme = localStorage.getItem("sync-scheme"); + const {scheme, rate} = getSyncSettings(); if (scheme) { document.querySelector(`#sync-${scheme}`).checked = true; } - const rate = localStorage.getItem("sync-rate"); if (rate) { document.querySelector("#sync-rate").value = rate; } - const search = localStorage.getItem("search-criteria"); + + const search = getSearchSettings(); if (search) { document.querySelector(`#search-${search}`).checked = true; } - const theme = localStorage.getItem("appearance-theme"); + + const theme = getThemeSettings(); if (theme) { document.querySelector("#appearance-theme").value = theme; } + document.querySelector("#settings").addEventListener("submit", handleSaveSettings, false); } function handleSaveSettings (event) { event.preventDefault(); const form = new FormData(document.querySelector("#settings")); - localStorage.setItem("sync-scheme", form.get("sync-scheme")); - localStorage.setItem("sync-rate", form.get("sync-rate")); - localStorage.setItem("search-criteria", form.get("search-criteria")); - localStorage.setItem("appearance-theme", form.get("appearance-theme")); - window.location.reload(); + setSyncSettings(form.get("sync-scheme"), form.get("sync-rate")); + setSearchSettings(form.get("search-criteria")); + setThemeSettings(form.get("appearance-theme")); + init(); } diff --git a/web/scripts/utils.js b/web/scripts/utils.js index 76c2402..41db653 100644 --- a/web/scripts/utils.js +++ b/web/scripts/utils.js @@ -66,111 +66,6 @@ export const resourcesConfig = { } }; -export const instancesConfig = { - running: { - status: { - src: "images/status/active.svg", - alt: "Instance is running", - clickable: false - }, - power: { - src: "images/actions/instance/stop.svg", - alt: "Shutdown Instance", - clickable: true - }, - config: { - src: "images/actions/instance/config-inactive.svg", - alt: "Change Configuration (Inactive)", - clickable: false - }, - console: { - src: "images/actions/instance/console-active.svg", - alt: "Open Console", - clickable: true - }, - delete: { - src: "images/actions/delete-inactive.svg", - alt: "Delete Instance (Inactive)", - clickable: false - } - }, - stopped: { - status: { - src: "images/status/inactive.svg", - alt: "Instance is stopped", - clickable: false - }, - power: { - src: "images/actions/instance/start.svg", - alt: "Start Instance", - clickable: true - }, - config: { - src: "images/actions/instance/config-active.svg", - alt: "Change Configuration", - clickable: true - }, - console: { - src: "images/actions/instance/console-inactive.svg", - alt: "Open Console (Inactive)", - clickable: false - }, - delete: { - src: "images/actions/delete-active.svg", - alt: "Delete Instance", - clickable: true - } - }, - loading: { - status: { - src: "images/status/loading.svg", - alt: "Instance is loading", - clickable: false - }, - power: { - src: "images/status/loading.svg", - alt: "Loading Instance", - clickable: false - }, - config: { - src: "images/actions/instance/config-inactive.svg", - alt: "Change Configuration (Inactive)", - clickable: false - }, - console: { - src: "images/actions/instance/console-inactive.svg", - alt: "Open Console (Inactive)", - clickable: false - }, - delete: { - src: "images/actions/delete-inactive.svg", - alt: "Delete Instance (Inactive)", - clickable: false - } - } -}; - -export const nodesConfig = { - online: { - status: { - src: "images/status/active.svg", - alt: "Node is online" - } - }, - offline: { - status: { - src: "images/status/inactive.svg", - alt: "Node is offline" - } - }, - uknown: { - status: { - src: "images/status/inactive.svg", - alt: "Node is offline" - } - } -}; - export const bootConfig = { eligiblePrefixes: ["ide", "sata", "scsi", "net"], ide: { @@ -191,6 +86,10 @@ export const bootConfig = { } }; +export function setCookie (cname, cval) { + document.cookie = `${cname}=${cval}`; +} + export function getCookie (cname) { const name = cname + "="; const decodedCookie = decodeURIComponent(document.cookie); @@ -349,13 +248,30 @@ export function getSearchSettings () { return searchCriteria; } -export function setAppearance () { +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 () { + let theme = getThemeSettings(); if (theme === "auto") { document.querySelector(":root").classList.remove("dark-theme", "light-theme"); }