Skip to content

Commit 3b51009

Browse files
geoffrichgeoffrich
committed
chore: re-scaffold demo
1 parent 75b01fd commit 3b51009

File tree

8 files changed

+634
-293
lines changed

8 files changed

+634
-293
lines changed

‎demo/jsconfig.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@
88
"resolveJsonModule": true,
99
"skipLibCheck": true,
1010
"sourceMap": true,
11-
"strict": true
11+
"strict": true,
12+
"moduleResolution": "bundler"
1213
}
1314
// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias and https://kit.svelte.dev/docs/configuration#files
1415
//

‎demo/package-lock.json‎

Lines changed: 599 additions & 261 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎demo/package.json‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -11,17 +11,17 @@
1111
"test": "playwright test"
1212
},
1313
"devDependencies": {
14-
"@fontsource/fira-mono": "^5.0.8",
14+
"@fontsource/fira-mono": "^4.5.10",
1515
"@neoconfetti/svelte": "^1.0.0",
16-
"@playwright/test": "^1.40.0",
17-
"@sveltejs/adapter-auto": "^1.0.3",
18-
"@sveltejs/kit": "^1.27.6",
19-
"@types/cookie": "^0.5.4",
20-
"svelte": "^3.59.2",
16+
"@playwright/test": "^1.28.1",
17+
"@sveltejs/adapter-auto": "^3.0.0",
18+
"@sveltejs/kit": "^2.0.0",
19+
"@sveltejs/vite-plugin-svelte": "^3.0.0",
20+
"svelte": "^4.2.7",
2121
"svelte-adapter-azure-swa": "file:..",
2222
"svelte-check": "^3.6.0",
23-
"typescript": "^4.9.5",
24-
"vite": "^4.5.0"
23+
"typescript": "^5.0.0",
24+
"vite": "^5.0.3"
2525
},
2626
"type": "module"
2727
}

‎demo/src/app.d.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
1-
/// <reference types="svelte-adapter-azure-swa" />
2-
31
// See https://kit.svelte.dev/docs/types#app
42
// for information about these interfaces
53
declare global {
64
namespace App {
75
// interface Error {}
86
// interface Locals {}
97
// interface PageData {}
8+
// interface PageState {}
109
// interface Platform {}
1110
}
1211
}

‎demo/src/app.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<head>
44
<meta charset="utf-8" />
55
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
6-
<meta name="viewport" content="width=device-width" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1" />
77
%sveltekit.head%
88
</head>
99
<body data-sveltekit-preload-data="hover">

‎demo/src/routes/sverdle/+page.server.js‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { fail } from '@sveltejs/kit';
22
import { Game } from './game';
33

4-
/** @type {import('./$types').PageServerLoad} */
4+
/** @satisfies {import('./$types').PageServerLoad} */
55
export const load = ({ cookies }) => {
66
const game = new Game(cookies.get('sverdle'));
77

@@ -24,7 +24,7 @@ export const load = ({ cookies }) => {
2424
};
2525
};
2626

27-
/** @type {import('./$types').Actions} */
27+
/** @satisfies {import('./$types').Actions} */
2828
export const actions = {
2929
/**
3030
* Modify game state in reaction to a keypress. If client-side JavaScript
@@ -44,7 +44,7 @@ export const actions = {
4444
game.guesses[i] += key;
4545
}
4646

47-
cookies.set('sverdle', game.toString());
47+
cookies.set('sverdle', game.toString(), { path: '' });
4848
},
4949

5050
/**
@@ -61,10 +61,10 @@ export const actions = {
6161
return fail(400, { badGuess: true });
6262
}
6363

64-
cookies.set('sverdle', game.toString());
64+
cookies.set('sverdle', game.toString(), { path: '' });
6565
},
6666

6767
restart: async ({ cookies }) => {
68-
cookies.delete('sverdle');
68+
cookies.delete('sverdle', { path: '' });
6969
}
7070
};

‎demo/src/routes/sverdle/+page.svelte‎

Lines changed: 15 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,11 @@
1616
/** The index of the current guess */
1717
$: i = won ? -1 : data.answers.length;
1818
19+
/** The current guess */
20+
$: currentGuess = data.guesses[i] || '';
21+
1922
/** Whether the current guess can be submitted */
20-
$: submittable = data.guesses[i]?.length === 5;
23+
$: submittable = currentGuess.length === 5;
2124
2225
/**
2326
* A map of classnames for all letters that have been guessed,
@@ -60,14 +63,13 @@
6063
* @param {MouseEvent} event
6164
*/
6265
function update(event) {
63-
const guess = data.guesses[i];
6466
const key = /** @type {HTMLButtonElement} */ (event.target).getAttribute('data-key');
6567
6668
if (key === 'backspace') {
67-
data.guesses[i] = guess.slice(0, -1);
69+
currentGuess = currentGuess.slice(0, -1);
6870
if (form?.badGuess) form.badGuess = false;
69-
} else if (guess.length < 5) {
70-
data.guesses[i] += key;
71+
} else if (currentGuess.length < 5) {
72+
currentGuess += key;
7173
}
7274
}
7375
@@ -79,6 +81,8 @@
7981
function keydown(event) {
8082
if (event.metaKey) return;
8183
84+
if (event.key === 'Enter' && !submittable) return;
85+
8286
document
8387
.querySelector(`[data-key="${event.key}" i]`)
8488
?.dispatchEvent(new MouseEvent('click', { cancelable: true }));
@@ -107,14 +111,15 @@
107111
<a class="how-to-play" href="/sverdle/how-to-play">How to play</a>
108112
109113
<div class="grid" class:playing={!won} class:bad-guess={form?.badGuess}>
110-
{#each Array(6) as _, row}
114+
{#each Array.from(Array(6).keys()) as row (row)}
111115
{@const current = row === i}
112116
<h2 class="visually-hidden">Row {row + 1}</h2>
113117
<div class="row" class:current>
114-
{#each Array(5) as _, column}
118+
{#each Array.from(Array(5).keys()) as column (column)}
119+
{@const guess = current ? currentGuess : data.guesses[row]}
115120
{@const answer = data.answers[row]?.[column]}
116-
{@const value = data.guesses[row]?.[column] ?? ''}
117-
{@const selected = current && column === data.guesses[row].length}
121+
{@const value = guess?.[column] ?? ''}
122+
{@const selected = current && column === guess.length}
118123
{@const exact = answer === 'x'}
119124
{@const close = answer === 'c'}
120125
{@const missing = answer === '_'}
@@ -167,7 +172,7 @@
167172
on:click|preventDefault={update}
168173
data-key={letter}
169174
class={classnames[letter]}
170-
disabled={data.guesses[i].length === 5}
175+
disabled={submittable}
171176
formaction="?/update"
172177
name="key"
173178
value={letter}

‎demo/vite.config.js‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
import { sveltekit } from '@sveltejs/kit/vite';
2+
import { defineConfig } from 'vite';
23

3-
/** @type {import('vite').UserConfig} */
4-
const config = {
4+
export default defineConfig({
55
plugins: [sveltekit()]
6-
};
7-
8-
export default config;
6+
});

0 commit comments

Comments
 (0)