diff --git a/client/src/hooks.js b/client/src/hooks.js new file mode 100644 index 0000000..1c3f5b3 --- /dev/null +++ b/client/src/hooks.js @@ -0,0 +1,4 @@ +// @ts-ignore +export async function handle({ event, resolve }) { + return resolve(event, { ssr: false }); +} \ No newline at end of file diff --git a/client/src/lib/Websocket.ts b/client/src/lib/Websocket.ts index 4bf0d81..2cf67a8 100644 --- a/client/src/lib/Websocket.ts +++ b/client/src/lib/Websocket.ts @@ -22,6 +22,8 @@ class ConnectedClient extends EventTarget { readyState: number = 0; pings: number[] = []; score: number = 0; + lives: number = 3; + lastScoreChange: number = 0; constructor(public ws: WebsocketConnection, public name: string) { super(); @@ -84,8 +86,17 @@ class ConnectedClient extends EventTarget { this.dispatchEvent(new FastEvent("message", msg.d)); messages.update(t => { t.push({ author: this.name, content: msg.d });return t}) break; + case "lives": + this.lives = msg.d; + players.update(t => t); + break; + case "score": + this.score = msg.d; + this.lastScoreChange = Date.now(); + players.update(t => t); + break; case "start": - gameData.set({ score: 0 }); + gameData.set({ score: 0, lives: 3, lastScoreChange: 0 }); // break not on purpose default: console.log("MSG", msg); @@ -236,6 +247,9 @@ export class WebsocketConnection extends EventTarget { this.fast.delete(msg.client); players.set(this.fast); messages.update(t => { t.push({ author: " SYS ", content: `${msg.client} left`});return t}) + if(this.fast.size == 0) { + gameData.set(null); + } break; } case "host": { @@ -280,6 +294,17 @@ export class WebsocketConnection extends EventTarget { } } + setScore(score: number) { + if (!this.roomName) return console.log("Not in a room"); + this.broadcast({ t: "score", d: score }); + gameData.update(t => { t!.score = score; t!.lastScoreChange = Date.now(); return t}); + } + setLives(lives: number) { + if (!this.roomName) return console.log("Not in a room"); + this.broadcast({ t: "lives", d: lives }); + gameData.update(t => { t!.lives = lives; return t}); + } + createGame(name: string) { this.ws.send(JSON.stringify({ t: "create", name: name })); } @@ -290,6 +315,7 @@ export class WebsocketConnection extends EventTarget { for(const [, client] of this.fast) { client.score = 0; } + gameData.set({ score: 0, lives: 3, lastScoreChange: 0 }); } join(name: string) { @@ -313,4 +339,4 @@ export const lastError: Writable = writable(""); export const room: Writable<{ name: string, host: string } | null> = writable(null); export const players: Writable> = writable(new Map); export const messages: Writable<{ author: string, content: string }[]> = writable([]); -export const gameData: Writable<{ score: number }|null> = writable(null); \ No newline at end of file +export const gameData: Writable<{ score: number, lives: number, lastScoreChange: number }|null> = writable(null); \ No newline at end of file diff --git a/client/src/lib/view/components/prestartScreen.svelte b/client/src/lib/view/components/prestartScreen.svelte index 3d37df2..770d8c1 100644 --- a/client/src/lib/view/components/prestartScreen.svelte +++ b/client/src/lib/view/components/prestartScreen.svelte @@ -79,7 +79,7 @@ transform: rotate3d(1, 0, 0, 0deg); transform-style: preserve-3d; box-sizing: border-box; - animation: dice 1.8s 0.7s ease-in-out; + animation: dice 1.2s 0.5s ease-in-out; animation-fill-mode: both; } @keyframes dice { diff --git a/client/src/lib/view/game/gameOverlay.svelte b/client/src/lib/view/game/gameOverlay.svelte index 13e960c..2e3d9f0 100644 --- a/client/src/lib/view/game/gameOverlay.svelte +++ b/client/src/lib/view/game/gameOverlay.svelte @@ -1,2 +1,95 @@ + + +
+
+
+ {#each [...Array($gameData?.lives).keys()] as i} + + {/each} +
+
    + {#each scoreboard as player (player.name)} +
  • + {player.name} + {player.score} + {#if !player.lives} +
    DEAD
    + {/if} +
  • + {/each} +
+
+
+ +
+
+ +
+
+ + \ No newline at end of file diff --git a/client/src/lib/view/game/init.ts b/client/src/lib/view/game/init.ts index 62720ec..0265c0c 100644 --- a/client/src/lib/view/game/init.ts +++ b/client/src/lib/view/game/init.ts @@ -4,22 +4,19 @@ import { GameScene } from "./scene"; var ratio = window.devicePixelRatio || 1; export function resize() { if(!game || !htmlcanvas) return; - try { - game.scale.resize(htmlcanvas.parentElement!.clientWidth * ratio, htmlcanvas.parentElement!.clientHeight * ratio); - } catch(e) { - // @ts-ignore - console.error(e, new ErrorEvent(e.type, { colno: e.colno, error: e, lineno: e.lineno, message: e.message, filename: e.filename })); - window.dispatchEvent(new ErrorEvent("error", e as any)); - } + // try { + // game.scale.resize(htmlcanvas.parentElement!.clientWidth * ratio, htmlcanvas.parentElement!.clientHeight * ratio); + // } catch(e) { + // // @ts-ignore + // console.error(e, new ErrorEvent(e.type, { colno: e.colno, error: e, lineno: e.lineno, message: e.message, filename: e.filename })); + // window.dispatchEvent(new ErrorEvent("error", e as any)); + // } // console.log("size", htmlcanvas.parentElement!.clientWidth * ratio, htmlcanvas.parentElement!.clientHeight * ratio); } -/** @type {HTMLCanvasElement} */ var htmlcanvas: HTMLCanvasElement; -/** @type {Game} */ var game: Game; -/** @type {GameScene} */ -var gs: GameScene; +var gs: GameScene | null = null; export function setCanvas(canvas: HTMLCanvasElement) { htmlcanvas = canvas; var ctx = canvas.getContext("webgl2") || canvas.getContext("webgl"); @@ -43,7 +40,12 @@ export function setCanvas(canvas: HTMLCanvasElement) { title: "Multidie", version: "0", scene: [gs], - backgroundColor: "#01021B", + backgroundColor: "#85e65c", banner: false }); } + +export function stop() { + game.destroy(false); + gs = null; +} \ No newline at end of file diff --git a/client/src/lib/view/game/scene.svelte b/client/src/lib/view/game/scene.svelte index e69de29..abef2ef 100644 --- a/client/src/lib/view/game/scene.svelte +++ b/client/src/lib/view/game/scene.svelte @@ -0,0 +1,28 @@ + + + + + + \ No newline at end of file diff --git a/client/src/lib/view/game/timedPrestartScreen.svelte b/client/src/lib/view/game/timedPrestartScreen.svelte index 361ebf5..7fef204 100644 --- a/client/src/lib/view/game/timedPrestartScreen.svelte +++ b/client/src/lib/view/game/timedPrestartScreen.svelte @@ -7,7 +7,7 @@ onMount(() => { let i = setTimeout(() => { visible = false; - }, 3000); + }, 2000); return () => clearTimeout(i); }); diff --git a/client/src/lib/view/game/waiting.svelte b/client/src/lib/view/game/waiting.svelte index 2b83c0b..6e0c366 100644 --- a/client/src/lib/view/game/waiting.svelte +++ b/client/src/lib/view/game/waiting.svelte @@ -3,7 +3,7 @@ import Button from '../components/button.svelte'; function startGame() { - + $connection!.startGame(); } let content = ""; function sendMessage() { diff --git a/client/static/assets/heart.png b/client/static/assets/heart.png new file mode 100644 index 0000000..d71e27d Binary files /dev/null and b/client/static/assets/heart.png differ