@nayan-ui/games 1.19.0 → 1.20.0

package/src/games/nuts-and-bolts/NutsAndBoltsConstants.ts

@@ -0,0 +1,75 @@
+// Nuts and Bolts' rules, timings and layout. Rules, puzzles and scoring match the original version
+// (games/nuts-and-bolts), so scores carry over.
+import { getScoreBoardTop } from '../shared/EngineHud';
+import type { TiltView } from '../shared/EngineTilt';
+import { frontLight, gameWidthFor } from '../shared/EngineUtils';
+
+// ── Rules ─────────────────────────────────────────────────────────────
+
+export const BOARD_COLS = 5;
+export const BOARD_ROWS = 5;
+export const EXTRA_HOLES = 3; // the swap holes along the bottom
+export const TIME_LIMIT = 120; // seconds
+
+// ── Feel (seconds) ────────────────────────────────────────────────────
+
+export const LIFT_TIME = 0.26; // a picked-up bolt unscrews and rises
+export const MOVE_TIME = 0.6; // ...flies over and screws into its new hole
+export const FALL_TIME = 0.6; // a free plank swings down off the board
+
+// ── The scene ─────────────────────────────────────────────────────────
+
+/** The camera leans back from straight down, so the planks' stack and the bolt heads stand up. */
+export const TILT = 0.38;
+/** Lit from the upper left; surfaces facing up off the board (+z) keep their exact color. */
+export const LIGHT = frontLight([-0.4, 0.5, 1], 0.45);
+export const CLASSIC_BOARD = 'rgba(255, 255, 255, 0.30)';
+export const CLASSIC_SEPARATOR = 'rgba(255, 255, 255, 0.1)';
+
+// ── Layout (view points) ──────────────────────────────────────────────
+
+const SCOREBOARD_HEIGHT = 82;
+const CONTROLS_HEIGHT = 110;
+const PADDING = 18; // round the grid and the swap row
+/** The swap row's strip below the grid, in cells: just the sockets and the separator above them. */
+const SWAP_ROW = 0.95;
+
+export type Layout = TiltView & {
+  cell: number;
+  padding: number;
+  boardWidth: number;
+  boardHeight: number;
+};
+
+/** The board as the original version sized it (5 x 5 points and the swap row below), smaller if the screen is short. */
+export function getLayout(width: number, height: number, offset: number): Layout {
+  const gameWidth = gameWidthFor(width);
+  const top = getScoreBoardTop(offset) + SCOREBOARD_HEIGHT;
+  const room = Math.max(240, height - top - CONTROLS_HEIGHT);
+  const cell = Math.min((gameWidth - PADDING * 2) / BOARD_COLS, (room / Math.cos(TILT) - PADDING * 2) / (BOARD_ROWS + SWAP_ROW));
+  return {
+    width,
+    height,
+    tilt: TILT,
+    centerY: top + room / 2,
+    cell,
+    padding: PADDING,
+    boardWidth: cell * BOARD_COLS + PADDING * 2,
+    boardHeight: cell * (BOARD_ROWS + SWAP_ROW) + PADDING * 2
+  };
+}
+
+/** A grid point (row 0 along the top) on the board, in world units: the 5 x 5 points centred across, in the board's top part. */
+export function pointAt(l: Layout, row: number, col: number): [number, number] {
+  const top = l.boardHeight / 2 - l.padding - l.cell / 2;
+  return [(col - (BOARD_COLS - 1) / 2) * l.cell, top - row * l.cell];
+}
+
+/** Swap hole `i`'s centre, along the bottom, 1.2 cells apart. */
+export function swapAt(l: Layout, i: number): [number, number] {
+  const spacing = l.cell * 1.2;
+  return [(i - (EXTRA_HOLES - 1) / 2) * spacing, -l.boardHeight / 2 + l.padding + l.cell * 0.38];
+}
+
+/** The line between the grid and the swap row. */
+export const separatorY = (l: Layout) => -l.boardHeight / 2 + l.padding + l.cell * 0.86;

package/src/games/nuts-and-bolts/NutsAndBoltsGame.ts

@@ -0,0 +1,298 @@
+// Nuts and Bolts' play, with no React: build a game with `createGame` (it deals a puzzle), give it a
+// layout, `start` it and `tick` it every frame. Tap a bolt to pick it up; tap an empty swap hole, or an
+// empty bolt hole on the board, to screw it in there. A plank with no bolt left in it falls away. Clear
+// every plank inside two minutes to win (scored by the time it took, as the original version did).
+//
+// The tap rules are the original store's `handleTap`, branch for branch; the clock and the planks' falls run
+// on the game's own clock, so a reset drops whatever's pending.
+import { type Camera, type Vec3, World } from '@nayan-ui/engine';
+import { calculateTimeBasedScore } from '../../services/ScoringService';
+import type { GameTheme } from '../../services/ThemeService';
+import { aimTilted, unproject } from '../shared/EngineTilt';
+import { type Layout, pointAt, swapAt, TIME_LIMIT } from './NutsAndBoltsConstants';
+import {
+  type Bolt,
+  canPlaceBoltInHole,
+  canSelectBolt,
+  checkPlankRemoval,
+  generatePuzzle,
+  getBoltAtPosition,
+  getBoltById,
+  getHoleById,
+  getPlanksAtPosition,
+  type Hole,
+  isPuzzleComplete,
+  moveBoltToGrid,
+  moveBoltToHole,
+  type Plank
+} from './NutsAndBoltsRules';
+import {
+  boltRest,
+  buildScene,
+  celebrate,
+  dropPlank,
+  liftBolt,
+  lowerBolt,
+  moveBolt,
+  placeSockets,
+  removeBolts,
+  removeScene,
+  type Scene,
+  setSceneTheme,
+  settleBolt,
+  spawnBolt,
+  spawnPlank
+} from './NutsAndBoltsScene';
+
+export type Phase = 'ready' | 'playing' | 'over';
+/** select: a bolt picked up; place: one screwed into a new hole; complete: the last plank's down. */
+export type GameEvent = 'select' | 'place' | 'complete';
+
+const WORLD_CAPACITY = 300; // the board, sockets, planks, bolts, and bursts
+
+type Puzzle = { holes: Hole[]; bolts: Bolt[]; planks: Plank[]; homes: { row: number; col: number }[] };
+const deal = (): Puzzle => {
+  const p = generatePuzzle();
+  return { ...p, homes: p.bolts.map((b) => ({ row: b.originalRow, col: b.originalCol })) };
+};
+
+export function createGame(theme: GameTheme) {
+  const world = new World(WORLD_CAPACITY);
+  const camera: Camera = { eye: [0, 0, 240], target: [0, 0, 0], fov: 1, ortho: 1 };
+  const g = {
+    world,
+    camera,
+    theme,
+    layout: null as Layout | null,
+    scene: null as Scene | null,
+    phase: 'ready' as Phase,
+    ...deal(),
+    selected: null as string | null,
+    /** Score and the countdown live in the engine (Rust), advanced by world.update. */
+    get score() {
+      return world.scoreboard.score;
+    },
+    get time() {
+      return world.scoreboard.shownSeconds;
+    },
+    won: false,
+    // UI hooks, set by the screen.
+    onPhase: (_p: Phase) => {},
+    onScore: (_s: number) => {},
+    onTime: (_t: number) => {},
+    onPlanks: (_n: number) => {},
+    onEvent: (_e: GameEvent) => {}
+  };
+  world.scoreboard.reset(0, TIME_LIMIT);
+  world.scoreboard.handlers = {
+    onSecond: (t) => g.onTime(t),
+    onTimeUp: () => g.phase === 'playing' && end(g, false)
+  };
+  return g;
+}
+export type Game = ReturnType<typeof createGame>;
+
+const holeIndex = (id: string) => Number(id.slice('hole-'.length));
+/** Where a bolt sits in the world: in its swap hole, or on top of the planks at its point. */
+function boltAt(g: Game, b: Bolt): Vec3 {
+  const l = g.layout!;
+  if (b.holeId) {
+    const [x, y] = swapAt(l, holeIndex(b.holeId));
+    return [x, y, 0];
+  }
+  const [x, y] = pointAt(l, b.row, b.col);
+  return [x, y, boltRest(g.planks, b.row, b.col)];
+}
+
+// ── Scene ─────────────────────────────────────────────────────────────
+
+/** Lays the board out for the view (first layout, header height, rotation): rebuilt from the puzzle's state. */
+export function setLayout(g: Game, l: Layout) {
+  if (g.scene) removeScene(g.world, g.scene);
+  g.layout = l;
+  aimTilted(g.camera, l);
+  g.scene = buildScene(g.world, l, g.theme, g.homes);
+  spawnPieces(g);
+}
+
+export function setTheme(g: Game, theme: GameTheme) {
+  g.theme = theme;
+  if (g.layout && g.scene) setSceneTheme(g.world, g.layout, g.scene, theme);
+}
+
+function spawnPieces(g: Game) {
+  const { layout: l, scene: s } = g;
+  if (!l || !s) return;
+  for (const p of g.planks) spawnPlank(g.world, l, s, p);
+  for (const b of g.bolts) spawnBolt(g.world, l, s, b.id, boltAt(g, b));
+  if (g.selected) {
+    const b = getBoltById(g.selected, g.bolts);
+    if (b) liftBolt(g.world, l, s, b.id, boltAt(g, b));
+  }
+}
+
+// ── Run ───────────────────────────────────────────────────────────────
+
+/** Plays the puzzle that's showing. */
+export function start(g: Game) {
+  if (g.phase !== 'ready') return;
+  g.phase = 'playing';
+  g.world.scoreboard.startCountdown(TIME_LIMIT);
+  g.onPhase('playing');
+}
+
+/** A fresh puzzle, not started (Stop, Play Again). The world, and the GPU view drawing it, are kept. */
+export function reset(g: Game) {
+  g.world.cancelTimers();
+  const { layout: l, scene: s } = g;
+  if (l && s) {
+    for (const e of s.planks.values()) g.world.despawn(e);
+    s.planks.clear();
+    removeBolts(g.world, s);
+  }
+  Object.assign(g, deal());
+  g.selected = null;
+  g.world.scoreboard.reset(0, TIME_LIMIT);
+  g.won = false;
+  g.phase = 'ready';
+  if (l && s) {
+    placeSockets(g.world, l, s, g.homes);
+    spawnPieces(g);
+  }
+  g.onScore(0);
+  g.onTime(TIME_LIMIT);
+  g.onPlanks(g.planks.length);
+  g.onPhase('ready');
+}
+
+export function dispose(g: Game) {
+  g.world.dispose();
+}
+
+export function tick(g: Game, dt: number) {
+  if (g.world.isDisposed) return;
+  g.world.update(dt);
+}
+
+function end(g: Game, won: boolean) {
+  g.world.scoreboard.stop();
+  const { layout: l, scene: s } = g;
+  if (g.selected && l && s) {
+    const b = getBoltById(g.selected, g.bolts);
+    if (b) lowerBolt(g.world, g.layout!, s, b.id, boltAt(g, b));
+  }
+  g.selected = null;
+  g.won = won;
+  g.phase = 'over';
+  g.onPhase('over');
+}
+
+// ── Taps ──────────────────────────────────────────────────────────────
+
+type Target = { row: number; col: number; holeId: string | null };
+
+/**
+ * What a view point is on, within half a cell, checked as the original board did: the swap holes, then the
+ * empty bolt holes on the board, then the bolts on it.
+ */
+export function targetAt(g: Game, x: number, y: number): Target | null {
+  const l = g.layout;
+  if (!l) return null;
+  const [wx, wy] = unproject(l, x, y, 10);
+  const reachSq = (l.cell * 0.5) ** 2;
+  const near = ([tx, ty]: [number, number]) => (wx - tx) ** 2 + (wy - ty) ** 2 <= reachSq;
+  for (const h of g.holes) if (near(swapAt(l, holeIndex(h.id)))) return { row: h.row, col: h.col, holeId: h.id };
+  const occupied = new Set(g.bolts.filter((b) => b.holeId === null).map((b) => `${b.row}-${b.col}`));
+  for (const p of g.homes) if (!occupied.has(`${p.row}-${p.col}`) && near(pointAt(l, p.row, p.col))) return { row: p.row, col: p.col, holeId: null };
+  for (const b of g.bolts) if (b.holeId === null && near(pointAt(l, b.row, b.col))) return { row: b.row, col: b.col, holeId: null };
+  return null;
+}
+
+export function tap(g: Game, x: number, y: number) {
+  if (g.phase !== 'playing') return;
+  const t = targetAt(g, x, y);
+  if (t) choose(g, t);
+}
+
+/** The store's handleTap: pick up, put back, switch to another bolt, or move the picked-up bolt. */
+export function choose(g: Game, t: Target) {
+  const { layout: l, scene: s } = g;
+  if (!l || !s || g.phase !== 'playing') return;
+  const select = (id: string) => {
+    const previous = g.selected ? getBoltById(g.selected, g.bolts) : null;
+    if (previous) lowerBolt(g.world, g.layout!, s, previous.id, boltAt(g, previous));
+    g.selected = id;
+    const b = getBoltById(id, g.bolts)!;
+    liftBolt(g.world, l, s, id, boltAt(g, b));
+    g.onEvent('select');
+  };
+  const deselect = () => {
+    const b = g.selected ? getBoltById(g.selected, g.bolts) : null;
+    if (b) lowerBolt(g.world, g.layout!, s, b.id, boltAt(g, b));
+    g.selected = null;
+  };
+
+  if (!g.selected) {
+    if (t.holeId) {
+      const hole = getHoleById(t.holeId, g.holes);
+      if (hole?.boltId && getBoltById(hole.boltId, g.bolts)) select(hole.boltId);
+    } else {
+      const bolt = getBoltAtPosition(t.row, t.col, g.bolts);
+      if (bolt && canSelectBolt(bolt, g.planks)) select(bolt.id);
+    }
+    return;
+  }
+
+  const selected = getBoltById(g.selected, g.bolts);
+  if (!selected) {
+    g.selected = null;
+    return;
+  }
+  if (t.holeId) {
+    const hole = getHoleById(t.holeId, g.holes);
+    if (!hole) return;
+    if (hole.boltId === g.selected) return deselect();
+    if (canPlaceBoltInHole(hole)) return place(g, moveBoltToHole(g.selected, t.holeId, g.bolts, g.holes));
+    if (hole.boltId) select(hole.boltId);
+    return;
+  }
+  const atPoint = getBoltAtPosition(t.row, t.col, g.bolts);
+  if (atPoint && atPoint.id === g.selected) return deselect();
+  if (atPoint && canSelectBolt(atPoint, g.planks)) return select(atPoint.id);
+  if (!atPoint) {
+    const home = g.homes.some((p) => p.row === t.row && p.col === t.col);
+    if (home || getPlanksAtPosition(t.row, t.col, g.planks).length > 0) place(g, moveBoltToGrid(g.selected, t.row, t.col, g.bolts, g.holes));
+  }
+}
+
+/** A move: the bolt flies to its new hole, any plank left with no bolt falls, and the puzzle may be done. */
+function place(g: Game, moved: { bolts: Bolt[]; holes: Hole[] }) {
+  const { layout: l, scene: s } = g;
+  const id = g.selected!;
+  const from = boltAt(g, getBoltById(id, g.bolts)!);
+  g.bolts = moved.bolts;
+  g.holes = moved.holes;
+  g.selected = null;
+  const { removedPlanks, remainingPlanks } = checkPlankRemoval(g.planks, g.bolts);
+  g.planks = remainingPlanks;
+  if (l && s) {
+    moveBolt(g.world, l, s, id, from, boltAt(g, getBoltById(id, g.bolts)!));
+    for (const p of removedPlanks) {
+      const e = s.planks.get(p.id);
+      const time = dropPlank(g.world, l, s, p);
+      if (e != null) g.world.after(time, () => g.world.despawn(e));
+    }
+    // Bolts left on lower planks settle onto them
+    if (removedPlanks.length) for (const b of g.bolts) if (b.id !== id && b.holeId === null) settleBolt(g.world, s, b.id, boltAt(g, b));
+  }
+  if (removedPlanks.length) g.onPlanks(g.planks.length);
+  if (isPuzzleComplete(g.planks)) {
+    g.world.scoreboard.set(calculateTimeBasedScore(TIME_LIMIT - g.time, TIME_LIMIT, g.score));
+    g.onScore(g.score);
+    g.onEvent('complete');
+    if (l) celebrate(g.world, l);
+    end(g, true);
+    return;
+  }
+  g.onEvent('place');
+}