Make loading much more efficient and have it not shit itself when you start on anything other than the index page.
This commit is contained in:
parent
55b0708016
commit
949f7c4936
3 changed files with 76 additions and 22 deletions
|
|
@ -1,11 +1,6 @@
|
||||||
<script src="/uv/uv.bundle.js" transition:persist is:inline defer></script>
|
|
||||||
<script src="/uv.config.js" transition:persist is:inline defer></script>
|
|
||||||
<script src="/epoxy/index.js" transition:persist is:inline defer></script>
|
|
||||||
<script src="/libcurl/index.js" transition:persist is:inline defer></script>
|
|
||||||
<script src="/bare_transport.js" transition:persist is:inline defer></script>
|
|
||||||
<script>
|
<script>
|
||||||
import { initTransport } from "./ts/TransportManager";
|
import { initTransport, loadSelectedTransportScript } from "./ts/TransportManager";
|
||||||
|
loadSelectedTransportScript();
|
||||||
let form = document.querySelector("form");
|
let form = document.querySelector("form");
|
||||||
let input = document.querySelector("input");
|
let input = document.querySelector("input");
|
||||||
document.addEventListener("astro:after-swap", initForm);
|
document.addEventListener("astro:after-swap", initForm);
|
||||||
|
|
|
||||||
|
|
@ -81,3 +81,69 @@ export async function initTransport() {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export async function loadUltraviolet(): Promise<void> {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
let UVBundle = document.createElement("script");
|
||||||
|
UVBundle.src = "/uv/uv.bundle.js";
|
||||||
|
document.body.appendChild(UVBundle);
|
||||||
|
UVBundle.onload = () => {
|
||||||
|
resolve();
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function loadUltravioletConfig(): Promise<void> {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
let UVConfig = document.createElement("script");
|
||||||
|
UVConfig.src = "/uv.config.js";
|
||||||
|
document.body.appendChild(UVConfig);
|
||||||
|
UVConfig.onload = () => {
|
||||||
|
resolve();
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function loadSelectedTransportScript(): Promise<void> {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
|
||||||
|
let selectedTransport = localStorage.getItem("alu__selectedTransport");
|
||||||
|
if (!selectedTransport) {
|
||||||
|
localStorage.setItem("alu__selectedTransport", JSON.stringify({ value: "uv" }));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let transport = JSON.parse(selectedTransport).value;
|
||||||
|
console.log(`Loading script for ${transport}`);
|
||||||
|
let script;
|
||||||
|
switch (transport) {
|
||||||
|
case "EpxMod.EpoxyClient": {
|
||||||
|
script = document.createElement("script");
|
||||||
|
script.src = "/epoxy/index.js";
|
||||||
|
script.defer = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
case "CurlMod.LibcurlClient": {
|
||||||
|
script = document.createElement("script");
|
||||||
|
script.src = "/libcurl/index.js";
|
||||||
|
script.defer = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
case "BareMod.BareClient": {
|
||||||
|
script = document.createElement("script");
|
||||||
|
script.src = "/bare_transport.js";
|
||||||
|
script.defer = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
default: {
|
||||||
|
script = document.createElement("script");
|
||||||
|
script.src = "/epoxy/index.js";
|
||||||
|
script.defer = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
document.body.appendChild(script);
|
||||||
|
script.onload = () => {
|
||||||
|
resolve();
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -64,14 +64,19 @@ export function getStaticPaths() {
|
||||||
</div>
|
</div>
|
||||||
<ProxyRegistrar />
|
<ProxyRegistrar />
|
||||||
<script>
|
<script>
|
||||||
import { TransportMgr, initTransport } from "@components/ts/TransportManager";
|
import { TransportMgr, initTransport, loadSelectedTransportScript, loadUltraviolet, loadUltravioletConfig } from "@components/ts/TransportManager";
|
||||||
document.addEventListener("astro:after-swap", () => {
|
document.addEventListener("astro:after-swap", async () => {
|
||||||
console.log("Updating transport...");
|
console.log("Updating transport...");
|
||||||
|
await loadUltraviolet();
|
||||||
|
await loadUltravioletConfig();
|
||||||
|
await loadSelectedTransportScript();
|
||||||
TransportMgr.updateTransport();
|
TransportMgr.updateTransport();
|
||||||
});
|
});
|
||||||
type Suggestion = {
|
type Suggestion = {
|
||||||
phrase: string;
|
phrase: string;
|
||||||
};
|
};
|
||||||
|
await loadUltraviolet();
|
||||||
|
await loadUltravioletConfig();
|
||||||
|
|
||||||
async function sendAPIRequest(urlInput: HTMLInputElement, searchSuggestions: HTMLDivElement) {
|
async function sendAPIRequest(urlInput: HTMLInputElement, searchSuggestions: HTMLDivElement) {
|
||||||
if (!urlInput) throw new Error("urlInput is null");
|
if (!urlInput) throw new Error("urlInput is null");
|
||||||
|
|
@ -125,20 +130,8 @@ export function getStaticPaths() {
|
||||||
urlInput.classList.remove("search-results");
|
urlInput.classList.remove("search-results");
|
||||||
});
|
});
|
||||||
|
|
||||||
function debounce(cb: Function, delay = 1000) {
|
|
||||||
let timeout: string | number | NodeJS.Timeout | undefined;
|
|
||||||
return (...args: any) => {
|
|
||||||
clearTimeout(timeout);
|
|
||||||
timeout = setTimeout(() => {
|
|
||||||
cb(...args);
|
|
||||||
}, delay);
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
urlInput.addEventListener("keyup", async () => {
|
urlInput.addEventListener("keyup", async () => {
|
||||||
debounce(async () => {
|
|
||||||
return await sendAPIRequest(urlInput, searchSuggestions);
|
return await sendAPIRequest(urlInput, searchSuggestions);
|
||||||
}, 500)();
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
document.addEventListener("astro:after-swap", addEventListeners);
|
document.addEventListener("astro:after-swap", addEventListeners);
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue