@nayan-ui/games 1.20.0 → 1.21.0

package/src/games/tile-home/TileHomeConstants.ts

@@ -1,139 +0,0 @@
-// Tile Home's rules, tiles, timings and layout. Rules, scoring and layout match the original version
-// (games/tile-home), so scores and feel carry over.
-import type { FruitKind } from '../shared/EngineFruits';
-import { frontLight, gameWidthFor } from '../shared/EngineUtils';
-
-// ── Rules ─────────────────────────────────────────────────────────────
-
-export const BOARD_COLS = 6;
-export const BOARD_ROWS = 7;
-export const LAYER_COUNT = 3; // each layer up is one smaller each way, offset half a cell
-export const TILES_PER_TYPE = 6;
-export const SLOT_CAPACITY = 7;
-export const MATCH_COUNT = 3;
-export const TIME_LIMIT = 300; // seconds
-export const POINTS_PER_SET = 500;
-
-/** The 12 fruits, by tile type id (the original version's order), with each one's burst color. */
-export const TILE_TYPES: readonly { fruit: FruitKind; color: string }[] = [
-  { fruit: 'apple', color: '#dc2626' },
-  { fruit: 'orange', color: '#f97316' },
-  { fruit: 'banana', color: '#fbbf24' },
-  { fruit: 'grapes', color: '#7c3aed' },
-  { fruit: 'kiwi', color: '#84cc16' },
-  { fruit: 'strawberry', color: '#ef4444' },
-  { fruit: 'mango', color: '#f59e0b' },
-  { fruit: 'cherries', color: '#be123c' },
-  { fruit: 'pineapple', color: '#eab308' },
-  { fruit: 'watermelon', color: '#22c55e' },
-  { fruit: 'peach', color: '#fda4af' },
-  { fruit: 'pomegranate', color: '#9f1239' }
-];
-
-/** Sets of three in a board: 24. */
-export const TOTAL_SETS = (TILE_TYPES.length * TILES_PER_TYPE) / MATCH_COUNT;
-
-// ── Feel (seconds) ────────────────────────────────────────────────────
-
-export const FLY_TIME = 0.25; // board to tray
-export const LIFT_AT = 0.28; // the flying tile peaks at LIFT_SCALE this far through, then shrinks to tray size
-export const LIFT_SCALE = 1.08;
-export const MATCH_CHECK_DELAY = 0.3; // after a tile lands
-export const MATCH_REMOVE_DELAY = 0.4; // after a match shows
-export const MATCH_BURST_TIME = 0.55;
-export const SHADE_TIME = 0.22; // a covered tile's shade lifting as it's revealed
-export const SHIFT_SPRING = { stiffness: 200, damping: 15 }; // tray tiles stepping aside
-export const LAND_SPRING = { stiffness: 260, damping: 9 }; // a landing's squash
-export const LAND_SQUASH = 1.12;
-// Board intro: tiles spring up rippling out from the centre, each layer a beat after the one below
-// (an underdamped spring: damping ratio 0.45 at 20 rad/s).
-export const INTRO_SPRING = { stiffness: 400, damping: 18, mass: 1 };
-export const RIPPLE_TIME = 0.3;
-export const LAYER_STAGGER = 0.07;
-
-/** How dark a covered tile is: more tiles over it, darker. */
-export const shadeFor = (blockingCount: number) => (blockingCount > 0 ? Math.min(0.2 + blockingCount * 0.15, 0.6) : 0);
-
-// ── Look ──────────────────────────────────────────────────────────────
-
-// Same top-left lighting and raised profile as Candy Crush's blocks.
-export const LIGHT = frontLight([-0.35, 0.6, 1], 0.5);
-export const TILE_FACE = '#fffdf7';
-export const TILE_THICKNESS = 0.4;
-
-// Classic (no host theme) board and tray colors
-export const CLASSIC_BOARD = 'rgba(255, 255, 255, 0.35)';
-export const CLASSIC_TRAY = 'rgba(255, 255, 255, 0.45)';
-export const CLASSIC_TRAY_BORDER = 'rgba(255, 255, 255, 0.6)';
-export const CLASSIC_SLOT = 'rgba(255, 255, 255, 0.25)';
-export const CLASSIC_SLOT_BORDER = 'rgba(255, 255, 255, 0.5)';
-
-// ── Layout (points; same arithmetic as the original version) ──────────────
-
-const BOARD_PADDING = 8;
-const TRAY_PADDING = 8;
-const TRAY_BORDER = 1;
-const SLOT_GAP = 4;
-const TRAY_BOARD_GAP = 10;
-
-export type Layout = {
-  /** The GameView's size. */
-  width: number;
-  height: number;
-  boardLeft: number;
-  boardTop: number;
-  boardWidth: number;
-  boardHeight: number;
-  cell: number;
-  /** A board tile's side. */
-  tile: number;
-  /** The fruit's size on a board tile. */
-  fruit: number;
-  trayLeft: number;
-  trayTop: number;
-  trayWidth: number;
-  trayHeight: number;
-  /** A tray tile's side. */
-  slot: number;
-};
-
-export function getLayout(width: number, height: number, offset: number): Layout {
-  const gameWidth = gameWidthFor(width);
-  const cell = (gameWidth - BOARD_PADDING * 2) / BOARD_COLS;
-  const tile = cell - 2;
-  const boardHeight = BOARD_ROWS * cell + BOARD_PADDING * 2;
-  const slot = Math.floor((gameWidth - TRAY_PADDING * 2 - (SLOT_CAPACITY - 1) * SLOT_GAP) / SLOT_CAPACITY);
-  const trayHeight = slot + TRAY_PADDING * 2;
-  // The tray above the board, the pair centred in the space under the header
-  const total = trayHeight + TRAY_BOARD_GAP + boardHeight;
-  const top = offset + (height - offset - total) / 2;
-  const left = (width - gameWidth) / 2;
-  return {
-    width,
-    height,
-    boardLeft: left,
-    boardTop: top + trayHeight + TRAY_BOARD_GAP,
-    boardWidth: gameWidth,
-    boardHeight,
-    cell,
-    tile,
-    fruit: tile - 12,
-    trayLeft: left,
-    trayTop: top,
-    trayWidth: gameWidth,
-    trayHeight,
-    slot
-  };
-}
-
-/** A board tile's top-left, in view points. */
-export const tileOrigin = (l: Layout, col: number, row: number, layer: number): [number, number] => [
-  l.boardLeft + BOARD_PADDING + col * l.cell + layer * (l.cell / 2),
-  l.boardTop + BOARD_PADDING + row * l.cell + layer * (l.cell / 2)
-];
-
-/** Tray slot `index`'s top-left, in view points. */
-export const slotOrigin = (l: Layout, index: number): [number, number] => [
-  l.trayLeft + TRAY_BORDER + TRAY_PADDING + index * (l.slot + SLOT_GAP),
-  l.trayTop + TRAY_BORDER + TRAY_PADDING
-];

package/src/games/tile-home/TileHomeGame.ts

@@ -1,435 +0,0 @@
-// Tile Home's rules, with no React: build a run with `createGame`, hand it the fruit models and a
-// layout, `start` it and `tick` it every frame. Tap an uncovered tile to send it to the tray, next to
-// its kind; three of a kind clear for 500. Clear the board to win (with a time bonus); fill the tray
-// without a match, or run out of time, and it's over.
-import { type Camera, type Entity, World } from '@nayan-ui/engine';
-import { TIME_BONUS_PER_SECOND } from '../../services/ScoringService';
-import type { GameTheme } from '../../services/ThemeService';
-import { popAndBurst } from '../shared/EngineBlasts';
-import type { Fruit, FruitKind } from '../shared/EngineFruits';
-import { introPlayed, toColor } from '../shared/EngineUtils';
-import {
-  BOARD_COLS,
-  BOARD_ROWS,
-  FLY_TIME,
-  INTRO_SPRING,
-  LAND_SPRING,
-  LAND_SQUASH,
-  LAYER_COUNT,
-  LAYER_STAGGER,
-  type Layout,
-  LIFT_AT,
-  LIFT_SCALE,
-  MATCH_BURST_TIME,
-  MATCH_CHECK_DELAY,
-  MATCH_COUNT,
-  MATCH_REMOVE_DELAY,
-  POINTS_PER_SET,
-  RIPPLE_TIME,
-  SHADE_TIME,
-  shadeFor,
-  SHIFT_SPRING,
-  SLOT_CAPACITY,
-  slotOrigin,
-  TILE_TYPES,
-  tileOrigin,
-  TILES_PER_TYPE,
-  TIME_LIMIT
-} from './TileHomeConstants';
-import { addTileFruit, buildScenery, type FruitModels, layerZ, spawnTile, toWorld, trayZ, Z_FLYING } from './TileHomeScene';
-
-export type Phase = 'ready' | 'playing' | 'over';
-
-type Tile = {
-  typeId: number;
-  col: number;
-  row: number;
-  layer: number;
-  /** Tiles on higher layers covering this one (0 = free to pick). */
-  blocking: number;
-  /** Lower tiles uncovered when this tile leaves the board (computed once per deal). */
-  covers: Tile[];
-  root: Entity | null;
-  shade: Entity | null;
-  /** Its fruit, once that model is built (the tile shows before it). */
-  fruit: Entity | null;
-  parts: Entity[];
-};
-
-const WORLD_CAPACITY = 900; // 72 tiles x 4 entities (root, body, fruit, shade), scenery, bursts
-
-const shuffle = <T>(items: T[]) => {
-  for (let i = items.length - 1; i > 0; i--) {
-    const j = Math.floor(Math.random() * (i + 1));
-    [items[i], items[j]] = [items[j]!, items[i]!];
-  }
-  return items;
-};
-
-/** Six of each fruit on shuffled spots across the three layers (as many spots as there are tiles). */
-function generateBoard(): Tile[] {
-  const pool = shuffle(TILE_TYPES.flatMap((_, type) => Array.from({ length: TILES_PER_TYPE }, () => type)));
-  const spots: { col: number; row: number; layer: number }[] = [];
-  for (let layer = 0; layer < LAYER_COUNT; layer++) {
-    for (let row = 0; row < BOARD_ROWS - layer; row++) for (let col = 0; col < BOARD_COLS - layer; col++) spots.push({ col, row, layer });
-  }
-  shuffle(spots);
-  return pool
-    .slice(0, spots.length)
-    .map((typeId, i) => ({ typeId, ...spots[i]!, blocking: 0, covers: [], root: null, shade: null, fruit: null, parts: [] }));
-}
-
-/** How many higher tiles overlap each tile (layers sit half a cell apart, so a tile can cover up to four). */
-function countBlocking(board: Tile[]) {
-  for (const t of board) {
-    t.blocking = 0;
-    t.covers.length = 0;
-  }
-  for (const t of board) {
-    const x = t.col + t.layer * 0.5;
-    const y = t.row + t.layer * 0.5;
-    for (const o of board) {
-      if (o.layer <= t.layer) continue;
-      if (Math.abs(o.col + o.layer * 0.5 - x) < 1 && Math.abs(o.row + o.layer * 0.5 - y) < 1) {
-        t.blocking++;
-        o.covers.push(t);
-      }
-    }
-  }
-}
-
-const introDelay = (t: Tile) => {
-  const cc = (BOARD_COLS - 1) / 2;
-  const cr = (BOARD_ROWS - 1) / 2;
-  const max = Math.hypot(cc + 1, cr + 1);
-  const dist = Math.hypot(t.col + t.layer * 0.5 - cc, t.row + t.layer * 0.5 - cr);
-  return (Math.min(dist, max) / max) * RIPPLE_TIME + t.layer * LAYER_STAGGER;
-};
-
-export function createGame(theme: GameTheme) {
-  const world = new World(WORLD_CAPACITY);
-  const camera: Camera = { eye: [0, 0, 500], target: [0, 0, 0], fov: 1, ortho: 1 };
-  const board = generateBoard();
-  countBlocking(board);
-  const g = {
-    world,
-    camera,
-    theme,
-    layout: null as Layout | null,
-    fruits: {} as FruitModels,
-    scenery: [] as Entity[],
-    phase: 'ready' as Phase,
-    /** Score and the countdown live in the engine (Rust), advanced by world.update. */
-    get score() {
-      return world.scoreboard.score;
-    },
-    won: false,
-    board,
-    /** The tray, in order. */
-    slot: [] as Tile[],
-    /** The tile on its way to the tray, and the slot it's headed for. */
-    flying: null as { tile: Tile; index: number } | null,
-    /** Tray tiles bursting, removed when the burst has shown. */
-    matching: [] as Tile[],
-    /** The next board to appear plays the intro. */
-    intro: true,
-    /** Game seconds the current intro has been playing (-1 until its board spawns). */
-    introAge: -1,
-    // UI hooks, set by the screen.
-    onPhase: (_p: Phase) => {},
-    onScore: (_s: number) => {},
-    onTime: (_t: number) => {},
-    onPick: () => {},
-    onMatch: () => {},
-    onWin: () => {},
-    onLose: () => {}
-  };
-  showFullTime(g);
-  world.scoreboard.handlers = {
-    onScore: (s) => g.onScore(s),
-    onSecond: (t) => g.onTime(t),
-    onTimeUp: () => g.phase === 'playing' && end(g, false)
-  };
-  return g;
-}
-export type Game = ReturnType<typeof createGame>;
-
-const after = (g: Game, seconds: number, run: () => void) => g.world.after(seconds, run);
-
-/** Score 0 and the full time on the clock, waiting for Start. */
-function showFullTime(g: { world: World }) {
-  const sb = g.world.scoreboard;
-  sb.reset();
-  sb.startCountdown(TIME_LIMIT);
-  sb.stop();
-}
-
-// ── Scene ─────────────────────────────────────────────────────────────
-
-/**
- * One kind of fruit's model is ready (they're built once per app, one per frame after the screen
- * opens): it pops onto every tile of that kind already showing, and is used for any made from now on.
- */
-export function addFruit(g: Game, kind: FruitKind, fruit: Fruit) {
-  if (g.world.isDisposed || g.fruits[kind]) return;
-  g.fruits[kind] = fruit;
-  const l = g.layout;
-  if (!l) return;
-  const tiles = [...g.board, ...g.slot, ...(g.flying ? [g.flying.tile] : [])];
-  for (const t of tiles) {
-    if (t.root == null || t.fruit != null || TILE_TYPES[t.typeId]!.fruit !== kind) continue;
-    t.fruit = addTileFruit(g.world, l, t.root, fruit, true);
-    t.parts.push(t.fruit);
-  }
-}
-
-/** Lays the scene out for the view and header. Same tile size: everything just moves; else it's rebuilt. */
-export function setLayout(g: Game, l: Layout) {
-  const old = g.layout;
-  g.layout = l;
-  g.camera.ortho = l.height / 2;
-  for (const e of g.scenery) g.world.despawn(e);
-  g.scenery = buildScenery(g.world, l, g.theme);
-  if (old && old.tile === l.tile && old.slot === l.slot) {
-    const updates = g.world.transforms;
-    for (const t of g.board) {
-      if (t.root == null) continue;
-      const [x, y, z] = boardPosition(l, t);
-      updates.position(t.root, x, y, z);
-    }
-    g.slot.forEach((t, i) => {
-      if (t.root == null) return;
-      const [x, y, z] = slotPosition(l, i);
-      updates.position(t.root, x, y, z);
-    });
-    updates.flush();
-  } else {
-    spawnAll(g);
-  }
-}
-
-/** A new theme: the background, board and tray are rebuilt; the tiles and the run carry on. */
-export function setTheme(g: Game, theme: GameTheme) {
-  g.theme = theme;
-  const l = g.layout;
-  if (!l || g.world.isDisposed) return;
-  for (const e of g.scenery) g.world.despawn(e);
-  g.scenery = buildScenery(g.world, l, theme);
-}
-
-const boardPosition = (l: Layout, t: Tile) => {
-  const [x, y] = tileOrigin(l, t.col, t.row, t.layer);
-  return toWorld(l, x + l.tile / 2, y + l.tile / 2, layerZ(t.layer));
-};
-const slotPosition = (l: Layout, index: number, z = trayZ) => {
-  const [x, y] = slotOrigin(l, index);
-  return toWorld(l, x + l.slot / 2, y + l.slot / 2, z);
-};
-const slotScale = (l: Layout) => l.slot / l.tile;
-
-function despawnTile(g: Game, t: Tile) {
-  if (t.root != null) g.world.despawn(t.root); // body, fruit and shade go with it
-  t.root = null;
-  t.shade = null;
-  t.fruit = null;
-  t.parts = [];
-}
-
-/**
- * (Re)creates every tile's entities from the run's state; the board springs in if it's new. Tiles whose
- * fruit isn't built yet show without it and get it when it arrives (addFruit).
- */
-function spawnAll(g: Game) {
-  const l = g.layout;
-  const fruits = g.fruits;
-  if (!l) return;
-  if (g.flying) land(g);
-  for (const t of [...g.board, ...g.slot]) despawnTile(g, t);
-  const intro = g.intro;
-  if (intro) g.introAge = 0;
-  for (const t of g.board) {
-    const [x, y] = tileOrigin(l, t.col, t.row, t.layer);
-    const e = spawnTile(g.world, l, fruits[TILE_TYPES[t.typeId]!.fruit], x + l.tile / 2, y + l.tile / 2, layerZ(t.layer), intro ? 0 : 1);
-    t.root = e.root;
-    t.shade = e.shade;
-    t.fruit = e.fruit;
-    t.parts = e.parts;
-    g.world.set(e.shade, { color: [0, 0, 0, shadeFor(t.blocking)] });
-    if (intro) g.world.animate(e.root, { scale: 1 }, { spring: INTRO_SPRING, delay: introDelay(t) });
-  }
-  g.slot.forEach((t, i) => {
-    if (g.matching.includes(t)) return; // bursting: its burst finishes it
-    const [x, y] = slotOrigin(l, i);
-    const e = spawnTile(g.world, l, fruits[TILE_TYPES[t.typeId]!.fruit], x + l.slot / 2, y + l.slot / 2, trayZ, slotScale(l));
-    t.root = e.root;
-    t.shade = e.shade;
-    t.fruit = e.fruit;
-    t.parts = e.parts;
-  });
-}
-
-// ── Run ───────────────────────────────────────────────────────────────
-
-export function start(g: Game) {
-  if (g.phase !== 'ready') return;
-  g.phase = 'playing';
-  g.world.scoreboard.startCountdown(TIME_LIMIT);
-  g.onPhase('playing');
-}
-
-/** A new board and timer (Stop, Play Again), springing in. The world and its GPU view are kept. */
-export function reset(g: Game) {
-  g.world.cancelTimers();
-  if (g.flying) despawnTile(g, g.flying.tile);
-  g.flying = null;
-  for (const t of [...g.board, ...g.slot, ...g.matching]) despawnTile(g, t);
-  g.board = generateBoard();
-  countBlocking(g.board);
-  g.slot = [];
-  g.matching = [];
-  g.intro = true;
-  spawnAll(g);
-  showFullTime(g);
-  g.won = false;
-  g.phase = 'ready';
-  g.onScore(0);
-  g.onTime(TIME_LIMIT);
-  g.onPhase('ready');
-}
-
-export function dispose(g: Game) {
-  g.world.cancelTimers();
-  g.world.dispose();
-}
-
-function end(g: Game, won: boolean) {
-  g.world.cancelTimers();
-  g.world.scoreboard.stop();
-  g.won = won;
-  g.phase = 'over';
-  if (won) g.onWin();
-  else g.onLose();
-  g.onPhase('over');
-}
-
-export function tick(g: Game, dt: number) {
-  if (g.world.isDisposed) return;
-  introPlayed(g, dt);
-  g.world.update(dt);
-}
-
-// ── Picking ───────────────────────────────────────────────────────────
-
-/** A tap: sends the uncovered tile under it to the tray. */
-export function tap(g: Game, x: number, y: number) {
-  const l = g.layout;
-  if (!l || g.phase !== 'playing' || g.flying) return;
-  const index = g.board.findIndex((t) => {
-    if (t.blocking > 0) return false;
-    const [ox, oy] = tileOrigin(l, t.col, t.row, t.layer);
-    return x >= ox && x <= ox + l.tile && y >= oy && y <= oy + l.tile;
-  });
-  if (index < 0) return;
-  const tile = g.board.splice(index, 1)[0]!;
-
-  // Uncovering: the tiles it covered lighten (the shade eases off).
-  for (const t of tile.covers) {
-    t.blocking--;
-    if (t.shade != null) g.world.animate(t.shade, { color: [0, 0, 0, shadeFor(t.blocking)] }, { duration: SHADE_TIME });
-  }
-
-  // Next to its kind, or at the end; tiles from there step aside so it lands in a gap.
-  const same = g.slot.findIndex((t) => t.typeId === tile.typeId);
-  const to = same >= 0 ? same + 1 : g.slot.length;
-  g.flying = { tile, index: to };
-  arrangeSlot(g);
-
-  if (tile.root != null) {
-    const start = boardPosition(l, tile);
-    g.world.set(tile.root, { position: [start[0], start[1], Z_FLYING] });
-    g.world.animate(tile.root, { position: slotPosition(l, to, Z_FLYING) }, { duration: FLY_TIME });
-    g.world.animate(tile.root, [{ scale: LIFT_SCALE, at: LIFT_AT }, { scale: slotScale(l) }], { duration: FLY_TIME });
-  }
-  after(g, FLY_TIME, () => land(g));
-  g.onPick();
-}
-
-/** The flying tile joins the tray (next to its kind, as things are now) and squashes as it lands. */
-function land(g: Game) {
-  const f = g.flying;
-  const l = g.layout;
-  if (!f || !l) return;
-  g.flying = null;
-  const tile = f.tile;
-  const same = g.slot.findIndex((t) => t.typeId === tile.typeId);
-  const at = same >= 0 ? same + 1 : g.slot.length;
-  g.slot.splice(at, 0, tile);
-  if (tile.root != null) {
-    const s = slotScale(l);
-    g.world.stopAnimation(tile.root);
-    g.world.set(tile.root, { position: slotPosition(l, at), scale: s * LAND_SQUASH });
-    g.world.animate(tile.root, { scale: s }, { spring: LAND_SPRING });
-  }
-  arrangeSlot(g, tile);
-  after(g, MATCH_CHECK_DELAY, () => checkMatches(g));
-}
-
-/** Slides tray tiles to their places, leaving a gap where the flying tile will land. */
-function arrangeSlot(g: Game, skip?: Tile) {
-  const l = g.layout;
-  if (!l) return;
-  const gap = g.flying?.index ?? -1;
-  g.slot.forEach((t, i) => {
-    if (t === skip || t.root == null) return;
-    g.world.animate(t.root, { position: slotPosition(l, gap >= 0 && i >= gap ? i + 1 : i) }, { spring: SHIFT_SPRING });
-  });
-}
-
-function checkMatches(g: Game) {
-  if (g.phase !== 'playing' || g.matching.length) return;
-  // The lowest fruit type with three in the tray (the original version checked types in that order)
-  for (let type = 0; type < TILE_TYPES.length; type++) {
-    const of = g.slot.filter((t) => t.typeId === type);
-    if (of.length < MATCH_COUNT) continue;
-    g.matching = of.slice(0, MATCH_COUNT);
-    burstMatch(g);
-    g.onMatch();
-    after(g, MATCH_REMOVE_DELAY, () => removeMatch(g));
-    return;
-  }
-  if (g.slot.length >= SLOT_CAPACITY) end(g, false);
-}
-
-/** Matched tiles pop, flash white and shrink away, with a glow and sparks (the shared pop). */
-function burstMatch(g: Game) {
-  const l = g.layout!;
-  g.matching.forEach((t, i) => {
-    const root = t.root;
-    if (root == null) return;
-    const at = slotPosition(l, g.slot.indexOf(t));
-    const color = toColor(TILE_TYPES[t.typeId]!.color);
-    popAndBurst(
-      g.world,
-      root,
-      { scale: slotScale(l), flash: t.parts, delay: (i / g.matching.length) * 0.1 * MATCH_BURST_TIME, duration: MATCH_BURST_TIME },
-      { position: [at[0], at[1], at[2] + 40], size: l.slot, color, glowZ: at[2] - 2 }
-    ).then(() => {
-      g.world.despawn(root);
-    });
-    t.root = null; // the burst owns it now
-    t.parts = [];
-  });
-}
-
-function removeMatch(g: Game) {
-  if (g.phase !== 'playing') return;
-  const gone = new Set(g.matching);
-  g.slot = g.slot.filter((t) => !gone.has(t));
-  g.matching = [];
-  g.world.scoreboard.add(POINTS_PER_SET);
-  arrangeSlot(g);
-  if (g.board.length === 0 && g.slot.length === 0 && !g.flying) {
-    g.world.scoreboard.awardTimeBonus(TIME_BONUS_PER_SECOND);
-    end(g, true);
-  }
-}