Serpent Zip

1"use client";
2 
3import type { CSSProperties } from "react";
4 
5import { cx } from "@/components/ui/cellforge-core";
6import { resolveDmxColorTokens } from "@/components/ui/cellforge-core";
7import { useCellForgePhases } from "@/components/ui/cellforge-hooks";
8import { styleOpacity, stylePx } from "@/components/ui/cellforge-core";
9import { remapOpacityToTriplet } from "@/components/ui/cellforge-core";
10import { dmxBloomRootActive, dmxDotBloomParts } from "@/components/ui/cellforge-core";
11import { useCyclePhase } from "@/components/ui/cellforge-hooks";
12import { usePrefersReducedMotion } from "@/components/ui/cellforge-hooks";
13import type { CellForgeCommonProps } from "@/components/ui/cellforge-core";
14 
15export type CellAngle13Props = CellForgeCommonProps;
16 
17const MATRIX_SIZE = 7;
18const BASE_OPACITY = 0.13;
19const HIGH_OPACITY = 0.95;
20 
21const TRIANGLE_CELLS = new Set([
22  "1,3",
23  "2,2",
24  "2,4",
25  "3,1",
26  "3,3",
27  "3,5",
28  "4,0",
29  "4,2",
30  "4,4",
31  "4,6"
32]);
33 
34/** Row serpent: base row left→right, row 3 right→left, mid rows alternate — reads as a zigzag zip. */
35const SERPENT_PATH: ReadonlyArray<readonly [number, number]> = [
36  [4, 0],
37  [4, 2],
38  [4, 4],
39  [4, 6],
40  [3, 5],
41  [3, 3],
42  [3, 1],
43  [2, 2],
44  [2, 4],
45  [1, 3]
46];
47 
48const PATH_LEN = SERPENT_PATH.length;
49/** Soft tail length in path units (Braille-style ramp, not discrete steps). */
50const TRAIL_SPAN = 4.25;
51 
52function isWithinTriangleMask(row: number, col: number): boolean {
53  if (row < 0 || row >= MATRIX_SIZE || col < 0 || col >= MATRIX_SIZE) {
54    return false;
55  }
56 
57  return TRIANGLE_CELLS.has(`${row},${col}`);
58}
59 
60function pathIndex(row: number, col: number): number | null {
61  for (let i = 0; i < PATH_LEN; i += 1) {
62    const [pr, pc] = SERPENT_PATH[i]!;
63    if (pr === row && pc === col) {
64      return i;
65    }
66  }
67  return null;
68}
69 
70function modF(n: number, m: number): number {
71  return ((n % m) + m) % m;
72}
73 
74function behindAlongPath(s: number, i: number, L: number): number {
75  return modF(s - i, L);
76}
77 
78function smoothstep01(edge0: number, edge1: number, x: number): number {
79  if (edge1 <= edge0) {
80    return x >= edge1 ? 1 : 0;
81  }
82  const t = Math.max(0, Math.min(1, (x - edge0) / (edge1 - edge0)));
83  return t * t * (3 - 2 * t);
84}
85 
86function opacityForCell(row: number, col: number, phase: number): number {
87  const idx = pathIndex(row, col);
88  if (idx === null) {
89    return 0;
90  }
91 
92  const s = phase * PATH_LEN;
93  const d = behindAlongPath(s, idx, PATH_LEN);
94  const g = 1 - smoothstep01(0, TRAIL_SPAN, d);
95// … truncated