diff --git a/src/components/catalog/InstalledThemes.astro b/src/components/catalog/InstalledThemes.astro index e0ab429..35b27d5 100644 --- a/src/components/catalog/InstalledThemes.astro +++ b/src/components/catalog/InstalledThemes.astro @@ -1,19 +1,23 @@
-
-
- Classic nebula +
+
+ Classic nebula
Classic Nebula
- + + diff --git a/src/components/settings/Loader.astro b/src/components/settings/Loader.astro index 606b76e..5f40c83 100644 --- a/src/components/settings/Loader.astro +++ b/src/components/settings/Loader.astro @@ -4,6 +4,7 @@ import { Settings } from "@utils/settings"; import { log } from "@utils/index"; import { Marketplace } from "@utils/marketplace"; + import { SettingsVals } from "@utils/values"; const titleText = ` _ _ _ _ ____ _ | \\ | | ___| |__ _ _| | __ _ / ___| ___ _ ____ _(_) ___ ___ ___ @@ -13,7 +14,7 @@ `; const info = "Hello developer or curious individual & welcome to the console! \nThere isn't a whole lot here for you unless you have run into an error."; const sysInfo = `In which case please include the info below when opening the issue: \n\nOS: ${navigator.platform} \nBrowser: ${navigator.userAgent} \nService workers: ${"serviceWorker" in navigator ? "Yes" : "No"}` - const init = async () => { + const init = async (): Promise => { log({ type: 'normal', bg: false, prefix: false }, titleText); log({ type: 'normal', bg: true, prefix: false }, info); log({ type: 'normal', bg: true, prefix: false }, sysInfo); @@ -24,25 +25,43 @@ await checkProxyScripts(); const conn = await createBareMuxConn("/baremux/worker.js"); const sw = new SW(conn); - new Marketplace(); - // We don't do anything with the values (they aren't even any), so we just are iterating. - for await (const _ of Settings.initDefaults()); + const mp = new Marketplace(); const { serviceWorker, bareMuxConn, sj } = await sw.getSWInfo(); log({ type: 'info', bg: true, prefix: true }, `General init completed! \n\nServiceWorker: ${serviceWorker.active?.state} \nBareMuxConn: ${bareMuxConn ? 'Active': 'Not active'} \nScramjetController: ${sj ? 'Active' : 'Not active'}`); - } - const initSettings = async () => { + return mp; + } + + const handleTheme = async (marketplace: Marketplace) => { + const name = await marketplace.getValueFromStore(SettingsVals.marketPlace.appearance.theme.name); + const payload = await marketplace.getValueFromStore(SettingsVals.marketPlace.appearance.theme.payload); + const video = await marketplace.getValueFromStore(SettingsVals.marketPlace.appearance.video); + const image = await marketplace.getValueFromStore(SettingsVals.marketPlace.appearance.image); + if (name !== null) { + marketplace.theme({ + type: 'normal', + name: name, + payload: payload, + sources: { + video: video, + bg: image + } + }); + } + } + + const initSettings = async (marketplace: Marketplace) => { log({ type: 'info', bg: true, prefix: true }, "Initializing settings..."); + for await (const _ of Settings.initDefaults()); + await handleTheme(marketplace); log({ type: 'info', bg: true, prefix: true }, "Initialized Settings!"); } const eventHandler = new EventHandler({ events: { "DOMContentLoaded": async () => { - await init(); - await initSettings(); - }, - "astro:after-swap": (async () => { - }) + const mp = await init(); + await initSettings(mp); + } }, logging: true }); diff --git a/src/pages/[lang]/settings/misc.astro b/src/pages/[lang]/settings/misc.astro index 0c7f71b..84042fe 100644 --- a/src/pages/[lang]/settings/misc.astro +++ b/src/pages/[lang]/settings/misc.astro @@ -30,57 +30,10 @@ const t = useTranslations(lang); ] }} both={{enabled: false}} - /> - - + /> - - - - - - diff --git a/src/utils/index.ts b/src/utils/index.ts index aaddd8f..bb1c55b 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -74,6 +74,20 @@ class Elements { static attachEvent(item: Element, event: EType, fn: () => unknown) { item.addEventListener(event, fn); } + + static createCustomElement(name: string, fn: () => unknown) { + class CustomEl extends HTMLElement { + constructor() { + super(); + (async () => await fn())(); + } + } + + if (customElements.get(name)) return log({ type: "error", bg: true, prefix: false, throw: false }, `An element with the name ${name} already exists! This WILL not work! And`); + + log({ type: 'info', bg: false, prefix: true }, `Creating custom element with the name ${name}`); + customElements.define(name, CustomEl); + } } /** diff --git a/src/utils/marketplace.ts b/src/utils/marketplace.ts index 64f9367..ad72889 100644 --- a/src/utils/marketplace.ts +++ b/src/utils/marketplace.ts @@ -94,9 +94,23 @@ class Marketplace { static *getInstances() { //Marketplace.instances.forEach((val) => yield val); for (const item of Marketplace.#instances.keys()) { - yield item; + yield item! as Marketplace; } } + + /** + * Detect if our Marketplace is ready or not. If it's not, don't resolve until it IS + */ + static ready(): Promise { + return new Promise((resolve) => { + const t = setInterval(() => { + if (Marketplace.#instances.size !== 0) { + clearInterval(t); + resolve(true); + } + }, 100); + }); + } /** * Install a theme into both localstorage AND set the theme. @@ -132,11 +146,11 @@ class Marketplace { } async uninstallTheme(theme: Omit) { - const items = JSON.parse(this.#storage.getVal(SettingsVals.marketPlace.plugins)) || []; - if (!items.find((th: string) => th === theme.name)) { + const items = JSON.parse(this.#storage.getVal(SettingsVals.marketPlace.themes)) || []; + if (!items.find((th: string) => th === theme.name)) { return log({ type: 'error', bg: false, prefix: false, throw: true }, `Theme: ${theme.name} is not installed!`); } - const idx = items.indexOf(theme.name.toLowerCase()); + const idx = items.indexOf(theme.name); items.splice(idx, 1); this.#storage.setVal(SettingsVals.marketPlace.themes, JSON.stringify(items)); } @@ -257,8 +271,8 @@ class Marketplace { if (tsp !== opts.payload) { this.#storage.setVal(SettingsVals.marketPlace.appearance.theme.payload, opts.payload); this.#storage.setVal(SettingsVals.marketPlace.appearance.theme.name, opts.name); - s.href = `/packages/${opts.name}/${opts.payload}`; } + s.href = `/packages/${opts.name}/${opts.payload}`; } else { if (tsp) return s.href = `/packages/${tsn}/${tsp}`;