diff --git a/packages/app/src/new-session/brick-breaker.tsx b/packages/app/src/new-session/brick-breaker.tsx new file mode 100644 index 00000000000..8ef2c9de02c --- /dev/null +++ b/packages/app/src/new-session/brick-breaker.tsx @@ -0,0 +1,471 @@ +import { For, onCleanup, onMount } from "solid-js" +import type { PinBoardHandle } from "./pin-board" +import { PinSound } from "./pin-sound" +import type { LodgerBall } from "./wordmark" + +const LIVES = 3 +const ENTER = 0.85 +const EXIT = 1 + +type Phase = "enter" | "serve" | "play" | "miss" | "exit" +type Box = { x: number; y: number; w: number; h: number; r: number } + +/** + * A brick breaker homage. The lodger curls into the ball, the pins are the bricks, and the composer shrinks + * into the paddle. Like Arkanoid, the ball waits on the paddle until it is served with a click or Space. + */ +export function NewSessionBrickBreaker(props: { + panel: HTMLElement + board: PinBoardHandle + ball: LodgerBall + sound: () => boolean + onDone: () => void +}) { + let paddle!: HTMLDivElement + let hud!: HTMLDivElement + let score!: HTMLSpanElement + const spares: HTMLSpanElement[] = [] + const walls: HTMLSpanElement[] = [] + + onMount(() => + onCleanup( + mountGame({ panel: props.panel, paddle, hud, score, spares, walls }, props.board, props.ball, props.sound, props.onDone), + ), + ) + + return ( + <> +