package-lock.json

@@ -29,7 +29,6 @@
 				"svelte": "^4.0.5",
 				"svelte-check": "^3.4.3",
 				"svelte-heros-v2": "^0.9.3",
-				"svelte-local-storage-store": "^0.6.0",
 				"svelte-multicssclass": "^2.1.1",
 				"tailwindcss": "^3.3.3",
 				"tslib": "^2.4.1",
@@ -4872,18 +4871,6 @@
 				"svelte": "^3.19.0 || ^4.0.0-next.0"
 			}
 		},
-		"node_modules/svelte-local-storage-store": {
-			"version": "0.6.0",
-			"resolved": "https://registry.npmjs.org/svelte-local-storage-store/-/svelte-local-storage-store-0.6.0.tgz",
-			"integrity": "sha512-UbCY/yT/YUadU5IX/gZkoRQnA+ebFZHKKQjlJvfWHnBj3CPe9sNn8ndxYz/xy4LUzGjuBLq8+wH5RYK54ba3wA==",
-			"dev": true,
-			"engines": {
-				"node": ">=0.14"
-			},
-			"peerDependencies": {
-				"svelte": "^3.48.0 || ^4.0.0"
-			}
-		},
 		"node_modules/svelte-multicssclass": {
 			"version": "2.1.1",
 			"resolved": "https://registry.npmjs.org/svelte-multicssclass/-/svelte-multicssclass-2.1.1.tgz",

package.json

@@ -28,7 +28,6 @@
 		"svelte": "^4.0.5",
 		"svelte-check": "^3.4.3",
 		"svelte-heros-v2": "^0.9.3",
-		"svelte-local-storage-store": "^0.6.0",
 		"svelte-multicssclass": "^2.1.1",
 		"tailwindcss": "^3.3.3",
 		"tslib": "^2.4.1",

src/lib/stores.ts

@@ -1,4 +1,5 @@
-import { persisted } from 'svelte-local-storage-store';
-import type { Writable } from 'svelte/store';
+import { type Writable, writable } from 'svelte/store';
 
-export const playAudio: Writable<boolean> = persisted('playAudio', false);
+export const registered: Writable<{
+	username: string;
+} | null> = writable(null);

src/routes/+layout.svelte

@@ -1,9 +1,6 @@
 <script lang="ts">
 	import '../app.css';
 	import { env } from '$env/dynamic/public';
-	import { goto } from '$app/navigation';
-	import Settings from './Settings.svelte';
-	import { playAudio } from '$lib/stores';
 
 	let navPaths = [
 		{
@@ -31,18 +28,18 @@
 	function onMenuButtonScroll(e: WheelEvent) {
 		if (menuButtonScrollIndex == null) {
 			if (e.deltaY < 0) {
-				menuButtonScrollIndex = navPaths.length - 1;
-			} else if (e.deltaY > 0) {
 				menuButtonScrollIndex = 0;
-			} else {
+			} else if (e.deltaY > 0) {
 				menuButtonScrollIndex = navPaths.length - 1;
+			} else {
+				menuButtonScrollIndex = 0;
 			}
 		} else {
 			navPaths[menuButtonScrollIndex].active = false;
 
-			if (e.deltaY > 0) {
+			if (e.deltaY < 0) {
 				menuButtonScrollIndex++;
-			} else if (e.deltaY < 0) {
+			} else if (e.deltaY > 0) {
 				menuButtonScrollIndex--;
 			}
 
@@ -58,20 +55,9 @@
 
 	let isTouch = false;
 	let nav: HTMLDivElement;
-	let settings: HTMLDialogElement;
 </script>
 
 <svelte:body
-	on:keyup={(e) => {
-		if (e.key === 'Escape') {
-			e.preventDefault();
-			if (settings.open) {
-				settings.close();
-			} else {
-				settings.show();
-			}
-		}
-	}}
 	on:touchend={(e) => {
 		// eslint-disable-next-line @typescript-eslint/ban-ts-comment
 		// @ts-ignore
@@ -92,17 +78,7 @@
 				? 'btn btn-square relative w-16 h-16'
 				: 'btn btn-square group/menu-button relative w-16 h-16'}
 			on:click={() => {
-				if (!isTouch) {
-					let activePath = navPaths.find((path) => path.active);
-					if (activePath !== undefined) {
-						goto(activePath.href);
-					} else if ($playAudio) {
-						new Audio(
-							`${env.PUBLIC_BASE_PATH}/aud/chest-${showMenuPermanent ? 'close' : 'open'}.mp3`
-						).play();
-					}
-					showMenuPermanent = !showMenuPermanent;
-				}
+				if (!isTouch) showMenuPermanent = !showMenuPermanent;
 			}}
 			on:touchend={() => {
 				isTouch = true;
@@ -151,7 +127,7 @@
 								<img class="w-1/2 h-1/2 pixelated" src={navPath.sprite} alt={navPath.name} />
 							</div>
 							<img
-								class="transition-opacity delay-50 group-hover/menu-item:opacity-100 absolute w-full h-full pixelated scale-110 z-10"
+								class="transition-opacity delay-50 group-hover/menu-item:opacity-100 absolute w-full h-full pixelated scale-110"
 								class:opacity-0={!navPath.active}
 								src="{env.PUBLIC_BASE_PATH}/img/selected-frame.png"
 								alt="menu hover"
@@ -163,13 +139,3 @@
 		</div>
 	</div>
 </nav>
-
-<dialog class="modal" bind:this={settings}>
-	<form method="dialog" class="modal-box" style="overflow: unset">
-		<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
-		<Settings />
-	</form>
-	<form method="dialog" class="modal-backdrop bg-[rgba(0,0,0,.3)]">
-		<button>close</button>
-	</form>
-</dialog>

src/routes/Settings.svelte

@@ -1,42 +0,0 @@
-<script lang="ts">
-	import { playAudio } from '$lib/stores';
-	import { get } from 'svelte/store';
-	import { IconOutline } from 'svelte-heros-v2';
-
-	let settings = [
-		{
-			name: 'Sound abspielen',
-			description:
-				'Manche Elemente können Sounds abspielen. Aktiviere diese Option und finde raus welche',
-			store: playAudio
-		}
-	];
-</script>
-
-<div>
-	<h2 class="text-2xl">Einstellungen</h2>
-	<div>
-		<div class="divider" />
-		<div class="grid grid-cols-2">
-			{#each settings as setting}
-				<div class="flex">
-					<p>{setting.name}</p>
-					<span class="tooltip ml-[0.2rem] -mt-[1px]" data-tip={setting.description}>
-						<IconOutline name="question-mark-circle-outline" width="16" height="16" />
-					</span>
-				</div>
-				<input
-					type="checkbox"
-					class="toggle justify-self-end mr-6"
-					checked={get(setting.store)}
-					on:change={(e) => {
-						// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-						// @ts-ignore
-						setting.store.set(e.target.checked);
-					}}
-				/>
-			{/each}
-		</div>
-		<div class="divider" />
-	</div>
-</div>