Change the way EventHandler works

This commit is contained in:
MotorTruck1221 2025-01-03 05:04:44 -07:00
parent 5aa0169e81
commit 927b68dab7
No known key found for this signature in database
GPG key ID: 08F417E2B8B61EA4
2 changed files with 28 additions and 33 deletions

View file

@ -3,11 +3,11 @@ import LoadingComponent from "@components/Loading.astro";
import Layout from "@layouts/Layout.astro";
---
<Layout title="Loading page..." noHeader="true">
<!-- Layout title="Loading page..." noHeader="true">
<LoadingComponent />
</Layout>
</Layout -->
<script>
import { pageLoad } from "@utils/events";
import { EventHandler } from "@utils/events";
import { navigate } from "astro:transitions/client";
function isComingFromIframe() {
try {
@ -17,11 +17,19 @@ import Layout from "@layouts/Layout.astro";
return true;
}
}
pageLoad(() => {
const isIframe = isComingFromIframe();
if (!isIframe) {
console.log("Assuming request isn't coming from iFrame. Redirecting...");
navigate('/');
}
const eHandle = new EventHandler({
events: {
"astro:page-load": (() => {
const isIframe = isComingFromIframe();
if (!isIframe) {
console.log("Assuming request isn't coming from iframe. Redirecting...");
navigate("/");
}
})
},
logging: false
});
//Handle the events.
eHandle.handleEvents();
</script>

View file

@ -19,15 +19,11 @@ interface Events {
* "astro:before-swap": () => {},
* "astro:after-swap": () => {},
* "DOMContentLoaded": () => {}
* }, // Do note: these are optional to pass. But if you try to call the method associated with the event, it WILL throw an error.
* }, // Pass any number of these : D (they are all optional)
* logging: false // Set this to true to enable logging when things go wrong.
* });
*
* eventHandler.pageLoad(); // For astro:page-load
* eventHandler.beforeSwap(); // For astro:before-swap
* eventHandler.afterSwap(); // For astro:after-swap
* eventHandler.domContent(); // For DOMContentLoaded
* // NOTE: If you do not pass a function in the events: {} associated with these events, it WILL throw an error.
* eventHandler.handleEvents(); // Attaches every event you passed.
*/
class EventHandler {
#eventItems: Events;
@ -38,24 +34,15 @@ class EventHandler {
if (items.logging) return document.addEventListener(eventType, () => fn());
try { document.addEventListener(eventType, () => fn()) } catch (_) {};
}
#throwErrorOnUnspecified(fn: Event) {
throw new Error(`No function specified for ${fn}`);
}
pageLoad() {
if (!this.#eventItems.events["astro:page-load"]) return this.#throwErrorOnUnspecified("astro:page-load");
this.#attachEvent(this.#eventItems, "astro:page-load", this.#eventItems.events["astro:page-load"]);
}
beforeSwap() {
if (!this.#eventItems.events["astro:before-swap"]) return this.#throwErrorOnUnspecified("astro:before-swap");
this.#attachEvent(this.#eventItems, "astro:before-swap", this.#eventItems.events["astro:before-swap"]);
}
afterSwap() {
if (!this.#eventItems.events["astro:after-swap"]) return this.#throwErrorOnUnspecified("astro:after-swap");
this.#attachEvent(this.#eventItems, "astro:after-swap", this.#eventItems.events["astro:after-swap"]);
}
domContent() {
if (!this.#eventItems.events.DOMContentLoaded) return this.#throwErrorOnUnspecified("DOMContentLoaded");
this.#attachEvent(this.#eventItems, "DOMContentLoaded", this.#eventItems.events.DOMContentLoaded);
/**
* Attatches the events you passed when creating the class. If none are passed, an error is thrown.
*/
handleEvents() {
const events = Object.entries(this.#eventItems.events);
if (!events || events.length === 0) throw new Error('No events added!');
events.map((event) => {
this.#attachEvent(this.#eventItems, event[0] as Event, event[1]);
});
}
}