RevelaNetwork/Revela-v4
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Maybe fix the no bare clients issue??

Browse source
This commit is contained in:
wearrrrr 2024-04-08 19:10:50 -05:00
parent 9934d87ffb
commit 2391cf2cfe
1 changed files with 79 additions and 77 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

154
src/pages/[lang]/index.astro
View file

@ -63,88 +63,90 @@ export function getStaticPaths() {
</div> </div>
</div> </div>
<ProxyRegistrar /> <ProxyRegistrar />
</Layout> <script>
<script> import { TransportMgr, initTransport } from "@components/ts/TransportManager";
import { TransportMgr } from "@components/ts/TransportManager"; document.addEventListener("astro:after-swap", () => {
document.addEventListener("astro:after-swap", () => { console.log("Updating transport...");
console.log("Updating transport..."); TransportMgr.updateTransport();
TransportMgr.updateTransport(); });
}); type Suggestion = {
type Suggestion = { phrase: string;
phrase: string; };
};
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");
if (!searchSuggestions) throw new Error("searchSuggestions is null"); if (!searchSuggestions) throw new Error("searchSuggestions is null");
let url = urlInput.value; let url = urlInput.value;
let request = await fetch("/search?query=" + url); let request = await fetch("/search?query=" + url);
let data = await request.json(); let data = await request.json();
searchSuggestions.innerHTML = ""; searchSuggestions.innerHTML = "";
data.map((suggestion: Suggestion) => { data.map((suggestion: Suggestion) => {
let suggestionElement = document.createElement("div"); let suggestionElement = document.createElement("div");
// For some reason css classes weren't working T^T. // For some reason css classes weren't working T^T.
suggestionElement.style.cursor = "pointer"; suggestionElement.style.cursor = "pointer";
suggestionElement.style.marginTop = "5px"; suggestionElement.style.marginTop = "5px";
suggestionElement.innerText = suggestion.phrase; suggestionElement.innerText = suggestion.phrase;
suggestionElement.addEventListener("click", async () => { suggestionElement.addEventListener("click", async () => {
urlInput.value = suggestion.phrase; urlInput.value = suggestion.phrase;
// I can't be bothered to extend the window object, so I'm just going to use any // I can't be bothered to extend the window object, so I'm just going to use any
(window as any).loadFormContent(); (window as any).loadFormContent();
});
searchSuggestions.appendChild(suggestionElement);
}); });
searchSuggestions.appendChild(suggestionElement); if (data.length === 0) {
}); urlInput.classList.remove("search-results");
if (data.length === 0) { searchSuggestions.style.opacity = "0";
urlInput.classList.remove("search-results"); } else {
searchSuggestions.style.opacity = "0";
} else {
urlInput.classList.add("search-results");
searchSuggestions.style.opacity = "1";
}
}
function addEventListeners() {
let urlInput = document.getElementById("url-input") as HTMLInputElement;
let searchSuggestions = document.getElementById("search-suggestions") as HTMLDivElement;
// Silently return if the required elements aren't found, this prevents the console from getting cluttered with errors.
if (!urlInput || !searchSuggestions) return;
urlInput.addEventListener("focus", () => {
if (!searchSuggestions) {
throw new Error("searchSuggestions is null");
}
if (searchSuggestions.children.length > 0) {
searchSuggestions.style.opacity = "1";
searchSuggestions.style.pointerEvents = "all";
urlInput.classList.add("search-results"); urlInput.classList.add("search-results");
searchSuggestions.style.opacity = "1";
} }
});
urlInput.addEventListener("blur", () => {
searchSuggestions.style.opacity = "0";
setTimeout(() => {
searchSuggestions.style.pointerEvents = "none";
}, 200);
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 () => { function addEventListeners() {
const search = debounce(async () => { let urlInput = document.getElementById("url-input") as HTMLInputElement;
return await sendAPIRequest(urlInput, searchSuggestions); let searchSuggestions = document.getElementById("search-suggestions") as HTMLDivElement;
}, 500)(); // Silently return if the required elements aren't found, this prevents the console from getting cluttered with errors.
}); if (!urlInput || !searchSuggestions) return;
} urlInput.addEventListener("focus", () => {
document.addEventListener("astro:after-swap", addEventListeners); if (!searchSuggestions) {
addEventListeners(); throw new Error("searchSuggestions is null");
</script> }
if (searchSuggestions.children.length > 0) {
searchSuggestions.style.opacity = "1";
searchSuggestions.style.pointerEvents = "all";
urlInput.classList.add("search-results");
}
});
urlInput.addEventListener("blur", () => {
searchSuggestions.style.opacity = "0";
setTimeout(() => {
searchSuggestions.style.pointerEvents = "none";
}, 200);
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 () => {
const search = debounce(async () => {
return await sendAPIRequest(urlInput, searchSuggestions);
}, 500)();
});
}
document.addEventListener("astro:after-swap", addEventListeners);
document.addEventListener("DOMContentLoaded", initTransport);
addEventListeners();
</script>
</Layout>
<style is:global> <style is:global>
.main-content { .main-content {