Vertex Relay

1"use client";
2 
3import type { CSSProperties } from "react";
4 
5import { cx } from "@/components/ui/dotmatrix-core";
6import { resolveDmxColorTokens } from "@/components/ui/dotmatrix-core";
7import { styleOpacity, stylePx } from "@/components/ui/dotmatrix-core";
8import { remapOpacityToTriplet } from "@/components/ui/dotmatrix-core";
9import { dmxBloomRootActive, dmxDotBloomParts } from "@/components/ui/dotmatrix-core";
10import { getPatternIndexes } from "@/components/ui/dotmatrix-core";
11import { useDotMatrixPhases } from "@/components/ui/dotmatrix-hooks";
12import { useCyclePhase } from "@/components/ui/dotmatrix-hooks";
13import { usePrefersReducedMotion } from "@/components/ui/dotmatrix-hooks";
14import type { DotMatrixCommonProps } from "@/components/ui/dotmatrix-core";
15 
16export type DotmHex4Props = DotMatrixCommonProps;
17 
18const ROW_COUNTS = [3, 4, 5, 4, 3] as const;
19const BASE_OPACITY = 0.08;
20const MID_OPACITY = 0.36;
21const HIGH_OPACITY = 0.98;
22const HEX_ROW_PITCH_RATIO = Math.sqrt(3) / 2;
23 
24function hexPatternIndex(row: number, rowCount: number, col: number): number {
25  return row * ROW_COUNTS[2] + Math.floor((ROW_COUNTS[2] - rowCount) / 2) + col;
26}
27const TRAIL_SPAN = 2.2;
28 
29const VERTEX_PATH = [
30  "0,2",
31  "1,3",
32  "2,4",
33  "3,3",
34  "4,2",
35  "3,0",
36  "2,0",
37  "1,0",
38  "0,0"
39] as const;
40 
41const ECHO_BY_VERTEX: Readonly<Record<(typeof VERTEX_PATH)[number], readonly string[]>> = {
42  "0,2": ["0,1", "1,2"],
43  "1,3": ["1,2", "2,3"],
44  "2,4": ["2,3", "2,2"],
45  "3,3": ["3,2", "2,3"],
46  "4,2": ["4,1", "3,2"],
47  "3,0": ["3,1", "2,1"],
48  "2,0": ["2,1", "2,2"],
49  "1,0": ["1,1", "2,1"],
50  "0,0": ["0,1", "1,1"]
51};
52 
53const PATH_LEN = VERTEX_PATH.length;
54 
55function clamp01(n: number | undefined) {
56  if (n == null || !Number.isFinite(n)) {
57    return;
58  }
59  return Math.min(1, Math.max(0, n));
60}
61 
62function pointForCell(row: number, col: number): { x: number; y: number } {
63  const count = ROW_COUNTS[row] ?? 1;
64  return {
65    x: col - (count - 1) / 2,
66    y: (row - 2) * HEX_ROW_PITCH_RATIO
67  };
68}
69 
70function modF(n: number, m: number): number {
71  return ((n % m) + m) % m;
72}
73 
74function opacityForCell(row: number, col: number, phase: number): number {
75  const id = `${row},${col}`;
76  const head = phase * PATH_LEN;
77  const vertexIndex = VERTEX_PATH.indexOf(id as (typeof VERTEX_PATH)[number]);
78  let opacity = BASE_OPACITY;
79 
80  if (vertexIndex >= 0) {
81    const distance = modF(head - vertexIndex, PATH_LEN);
82    const glow = Math.max(0, 1 - distance / TRAIL_SPAN);
83// … truncated