Don't fetch the data unless on the page

This commit is contained in:
MotorTruck1221 2024-12-28 03:41:11 -07:00
parent d2b05a1b1b
commit a9b94c27d4
No known key found for this signature in database
GPG key ID: 08F417E2B8B61EA4

View file

@ -8,7 +8,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="w-0 h-0 visibility-none hidden"> <asset-loader /> </div>
<script> <script>
type Assets = { type Assets = {
description: string, description: string,
@ -22,7 +22,6 @@
type: string, type: string,
version: string version: string
} }
import { pageLoad } from "@utils/events";
import { Settings, settings } from "@utils/settings"; import { Settings, settings } from "@utils/settings";
async function getItem(item: any) { async function getItem(item: any) {
try { try {
@ -105,12 +104,19 @@
parent?.appendChild(mainDiv); parent?.appendChild(mainDiv);
console.log(mainDiv); console.log(mainDiv);
} }
pageLoad(async () => { //I don't actually want this to run on every page but defining a custom component is an easy way around it.
const mainElem = document.getElementById("main-theme"); class AssetLoader extends HTMLElement {
try { attachThemeEvent(mainElem!, true) } catch(_) {} constructor() {
const assets = await getAssets(); super();
console.log(assets); (async function() {
assets.map((asset) => { createElem(asset); }); const mainElem = document.getElementById("main-theme");
}, true); try { attachThemeEvent(mainElem!, true) } catch(_) {}
const assets = await getAssets();
console.log(assets);
assets.map((asset) => { createElem(asset); });
})();
}
}
customElements.define('asset-loader', AssetLoader);
</script> </script>