sass/kuldvillak-mvp-ei-forki
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

More QoL changes

Browse Source
This commit is contained in:
AlacrisDevs
2025-12-08 14:33:45 +02:00
parent 4e7ecb5397
commit 9dc3e7006e
10 changed files with 62 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/lib/assets/favicon-kuldvillak.svg
View File

@@ -1,8 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128">
<rect width="128" height="128" fill="#060ce9"/>
<path
fill="#ffcc00"
d="M24 16L27.3 27V110L24 121H62L58.7 110V68.2L98 121H136L83.3 53.5L131.6 0H93.7L58.7 45V27L62 16H24Z"
transform="translate(-8, 4) scale(0.9)"
/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 302 B

3
src/lib/assets/kuldvillak_favicon.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.05957 1.5L11.3781 12.5V115.5L8.05957 126.5H45.9855L42.667 115.5V73.6719L82.0151 126.5H119.941L67.3188 59L115.674 1.50006H77.7485L42.667 50.5001V12.5L45.9855 1.50006L8.05957 1.5Z" fill="#FFAB00"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 355 B

6
src/lib/components/ErrorBoundary.svelte
View File

@@ -65,16 +65,16 @@
<div class="text-red-500 text-6xl mb-4" aria-hidden="true">
⚠️
</div>
<h1 class="text-white text-2xl font-bold mb-2">
<h1 class="text-white text-2xl font-bold mb-2 uppercase">
{m.error_title?.() ?? "Something went wrong"}
</h1>
<p class="text-gray-400 mb-4">
<p class="text-gray-400 mb-4 uppercase">
{m.error_description?.() ??
"An unexpected error occurred. Please try again."}
</p>
<details class="text-left mb-4">
<summary
class="text-gray-500 cursor-pointer hover:text-gray-400"
class="text-gray-500 uppercase cursor-pointer hover:text-gray-400"
>
{m.error_details?.() ?? "Technical details"}
</summary>

2
src/routes/kuldvillak/+layout.svelte
View File

@@ -4,7 +4,7 @@
import { audioStore } from "$lib/stores/audio.svelte";
import { themeStore } from "$lib/stores/theme.svelte";
import type { Snippet } from "svelte";
import faviconKuldvillak from "$lib/assets/favicon-kuldvillak.svg";
import faviconKuldvillak from "$lib/assets/kuldvillak_favicon.svg";
let { children }: { children: Snippet } = $props();

2
src/routes/kuldvillak/play/+page.svelte
View File

@@ -8,12 +8,14 @@
KvSpinner,
} from "$lib/components/kuldvillak/ui";
import * as m from "$lib/paraglide/messages";
import faviconKuldvillak from "$lib/assets/kuldvillak_favicon.svg";
// Get view from URL query param
let view = $derived($page.url.searchParams.get("view") ?? "moderator");
</script>
<svelte:head>
<link rel="icon" href={faviconKuldvillak} />
<title>{gameSession.state?.name ?? "Play"} - Kuldvillak</title>
</svelte:head>

58
src/routes/kuldvillak/play/ModeratorView.svelte
View File

@@ -22,6 +22,15 @@
// End game confirmation dialog
let showEndGameConfirm = $state(false);
// Loading overlay when finishing game
let isFinishing = $state(false);
async function finishGame() {
isFinishing = true;
gameSession.clearSession();
await goto("/kuldvillak/edit");
}
function openProjector() {
gameSession.openProjector();
}
@@ -34,6 +43,7 @@
let wagerInput = $state(5);
let scoreAdjustment = $state(10);
let introDelayComplete = $state(false);
let introCountdown = $state(3);
let prevIntroPhase = $state<string | null>(null);
// Derived state
@@ -46,13 +56,20 @@
phase === "intro-categories" &&
prevIntroPhase !== "intro-categories"
) {
// Just entered intro-categories, start 3s delay
// Just entered intro-categories, start 3s countdown
introDelayComplete = false;
setTimeout(() => {
introDelayComplete = true;
}, 3000);
introCountdown = 3;
const interval = setInterval(() => {
introCountdown--;
if (introCountdown <= 0) {
clearInterval(interval);
introDelayComplete = true;
}
}, 1000);
return () => clearInterval(interval);
} else if (phase !== "intro-categories") {
introDelayComplete = false;
introCountdown = 3;
}
prevIntroPhase = phase ?? null;
});
@@ -322,7 +339,7 @@
</div>
{:else if session.phase === "intro-categories"}
{#if !introDelayComplete && session.introCategoryIndex === 0}
<!-- Initial 3s delay - show Villak/Topeltvillak -->
<!-- Initial 3s delay - show Villak/Topeltvillak with countdown -->
<span
class="font-kv-body text-4xl md:text-6xl text-kv-yellow uppercase kv-shadow-text"
>
@@ -330,6 +347,13 @@
? "Villak"
: "Topeltvillak"}
</span>
<span
class="font-kv-body text-lg md:text-xl text-kv-white uppercase kv-shadow-text"
>
{m.kv_play_introducing_categories({
seconds: introCountdown,
})}
</span>
{:else if currentRound?.categories[session.introCategoryIndex]}
<span
class="font-kv-body text-4xl md:text-6xl text-kv-white uppercase kv-shadow-text"
@@ -855,23 +879,12 @@
>
{m.kv_play_game_over()}!
</span>
<KvButtonPrimary
onclick={() => {
gameSession.clearSession();
goto("/kuldvillak/edit");
}}
>
<KvButtonPrimary onclick={finishGame} disabled={isFinishing}>
{m.kv_play_finish()}
</KvButtonPrimary>
</div>
{/if}
</div>
{:else}
<div class="min-h-screen bg-kv-black flex items-center justify-center">
<span class="font-kv-body text-2xl text-kv-white uppercase">
{m.kv_play_loading()}
</span>
</div>
{/if}
<!-- Settings Modal -->
@@ -885,3 +898,14 @@
confirmText={m.kv_play_end_game()}
onconfirm={() => gameSession.endGame()}
/>
<!-- Loading overlay when finishing game -->
{#if isFinishing}
<div
class="fixed inset-0 bg-kv-black/90 flex flex-col items-center justify-center z-50 gap-4"
>
<div
class="w-16 h-16 border-4 border-kv-yellow border-t-transparent rounded-full animate-spin"
></div>
</div>
{/if}