test game

app/nose/bin/game.tsx

@@ -0,0 +1,59 @@
+/// <reference lib="dom" />
+export const game = true
+
+import type { GameContext, InputState } from "@/shared/types"
+import { rng } from "@/shared/utils.ts"
+
+const WIDTH = 960
+const HEIGHT = 540
+const SPEED = 10
+let x = rng(0, WIDTH)
+let y = rng(0, HEIGHT)
+
+export function init() { console.log("init") }
+
+export function update(_delta: number, input: InputState) {
+  if (input.pressed.has("ArrowUp") || input.pressed.has("w")) y -= 1 * SPEED
+  if (input.pressed.has("ArrowDown") || input.pressed.has("s")) y += 1 * SPEED
+
+  if (input.pressed.has("ArrowLeft") || input.pressed.has("a")) x -= 1 * SPEED
+  if (input.pressed.has("ArrowRight") || input.pressed.has("d")) x += 1 * SPEED
+}
+
+export function draw(ctx: GameContext) {
+  ctx.clear()
+
+  // sky background
+  ctx.rectfill(0, 0, ctx.width, ctx.height, "skyblue")
+
+  // sun
+  ctx.circfill(800, 100, 50, "yellow")
+
+  // grass
+  ctx.rectfill(0, 400, ctx.width, ctx.height, "green")
+
+  // house body
+  ctx.rectfill(200, 250, 400, 400, "sienna")
+
+  // roof (triangle-ish with lines)
+  ctx.line(200, 250, 300, 150, "brown")
+  ctx.line(400, 250, 300, 150, "brown")
+  ctx.line(200, 250, 400, 250, "brown")
+
+  // door
+  ctx.rectfill(280, 320, 320, 400, "darkred")
+
+  // windows
+  ctx.rectfill(220, 270, 260, 310, "lightblue")
+  ctx.rectfill(340, 270, 380, 310, "lightblue")
+
+  // tree trunk
+  ctx.rectfill(500, 300, 540, 400, "saddlebrown")
+  // tree top (a few circles for puffiness)
+  ctx.circfill(520, 280, 40, "darkgreen")
+  ctx.circfill(480, 300, 40, "darkgreen")
+  ctx.circfill(560, 300, 40, "darkgreen")
+
+  ctx.circfill(x, y, 10, "magenta")
+  ctx.circ(x, y, 11, "white")
+}