Confirm Slide Shatter

1"use client";
2 
3import { useEffect, useRef, useState } from "react";
4 
5type Pt = { x: number; y: number };
6type Edge = { ax: number; ay: number; bx: number; by: number; t: number };
7type Shard = {
8  poly: Pt[];
9  cx: number;
10  cy: number;
11  ox: number;
12  oy: number;
13  vx: number;
14  vy: number;
15  rot: number;
16  vr: number;
17};
18 
19const INSET = 4;
20const RADIUS = 12;
21// canvas bleeds past the track so shards can tumble out of frame
22const PAD_X = 160;
23const PAD_TOP = 120;
24const PAD_BOTTOM = 320;
25const COMMIT_AT = 0.98;
26const SHATTER_MS = 900;
27const FADE_MS = 700;
28const KEY_STEP = 0.08;
29 
30/** dart-throwing Poisson disc — relaxes min distance if the pane is crowded */
31function poissonPoints(w: number, h: number, count: number, minDist: number): Pt[] {
32  const pts: Pt[] = [];
33  let d = minDist;
34  let attempts = 0;
35  while (pts.length < count && attempts < 6000) {
36    attempts++;
37    const c = { x: Math.random() * w, y: Math.random() * h };
38    let ok = true;
39    for (const q of pts) {
40      const dx = q.x - c.x;
41      const dy = q.y - c.y;
42      if (dx * dx + dy * dy < d * d) {
43        ok = false;
44        break;
45      }
46    }
47    if (ok) pts.push(c);
48    if (attempts % 1500 === 0) d *= 0.85;
49  }
50  return pts;
51}
52 
53/** keep the part of `poly` on the seed's side of the bisector (dot(p-m, n) <= 0) */
54function clipHalfPlane(poly: Pt[], mx: number, my: number, nx: number, ny: number): Pt[] {
55  const out: Pt[] = [];
56  for (let i = 0; i < poly.length; i++) {
57    const a = poly[i];
58    const b = poly[(i + 1) % poly.length];
59    const da = (a.x - mx) * nx + (a.y - my) * ny;
60    const db = (b.x - mx) * nx + (b.y - my) * ny;
61    if (da <= 0) out.push(a);
62    if (da <= 0 !== db <= 0) {
63      const f = da / (da - db);
64      out.push({ x: a.x + (b.x - a.x) * f, y: a.y + (b.y - a.y) * f });
65    }
66  }
67  return out;
68}
69 
70/** exact Voronoi cells via half-plane clipping — O(n²), computed once at mount */
71function voronoiCells(seeds: Pt[], w: number, h: number): Pt[][] {
72  return seeds
73    .map((s) => {
74      let poly: Pt[] = [
75        { x: 0, y: 0 },
76        { x: w, y: 0 },
77        { x: w, y: h },
78        { x: 0, y: h },
79      ];
80      for (const o of seeds) {
81        if (o === s) continue;
82        poly = clipHalfPlane(poly, (s.x + o.x) / 2, (s.y + o.y) / 2, o.x - s.x, o.y - s.y);
83        if (poly.length === 0) break;
84      }
85      return poly;
86    })
87    .filter((poly) => poly.length >= 3);
88}
89 
90/** dedupe shared cell walls into crack polylines, each with a reveal threshold */
91// … truncated