This repository has been archived on 2021-11-08. You can view files and clone it, but cannot push or open issues or pull requests.
svelte-sharg/src/App.svelte
2021-10-02 20:56:40 +02:00

47 lines
1.3 KiB
Svelte

<script lang="ts">
import Footer from "./components/Footer.svelte";
import Header from "./components/Header.svelte";
import Wrapper from "./components/Wrapper.svelte";
import { SharkGame } from "./shark/SharkGame";
import { Modals, closeAllModals } from "svelte-modals";
import { onDestroy, onMount } from "svelte";
import type { Unsubscriber } from "svelte/store";
let root: HTMLElement;
let unsubscribeSettings: Unsubscriber;
onMount(() => {
root = document.documentElement;
SharkGame.Settings.settings.subscribe((settings) => {
root.classList.toggle("no-theme", !settings.appearance.enableThemes.current);
settings.appearance.theme.options.forEach((theme) => {
root.classList.toggle(theme, theme === settings.appearance.theme.current);
});
});
});
onDestroy(() => {
unsubscribeSettings();
});
function handleKeyUp(event: KeyboardEvent) {
if (event.key === "Escape") {
closeAllModals();
}
}
</script>
<svelte:body on:keyup={handleKeyUp} />
<Modals>
<div slot="backdrop" id="modal-backdrop" on:click={closeAllModals} />
</Modals>
{#await SharkGame.initialize()}
Loading...
{:then}
<Header game={SharkGame} title={SharkGame.title} />
<Wrapper game={SharkGame} />
<Footer />
{/await}