Brush

1"use client";
2 
3import { hash01 } from "@/lib/remocn/stop-motion";
4 
5const GRAIN_RATIO = 0.5;
6const GRAIN_FREQUENCY = 0.7;
7const GRAIN_OCTAVES = 3;
8 
9export type BrushPoint = { x: number; y: number };
10 
11export type BrushTaper = {
12  strokeWidth: number;
13  pressure?: number;
14  release?: number;
15};
16 
17export function brushHalfWidth(taper: BrushTaper, t: number): number {
18  const pressure = taper.pressure ?? 0.2;
19  const release = taper.release ?? 1;
20  return (taper.strokeWidth / 2) * (pressure + (release - pressure) * t);
21}
22 
23export function brushGrainScale(strokeWidth: number, grain: number): number {
24  return strokeWidth * GRAIN_RATIO * grain;
25}
26 
27export function brushReach(strokeWidth: number, grain: number): number {
28  return strokeWidth / 2 + brushGrainScale(strokeWidth, grain) / 2;
29}
30 
31export function brushFilterId(
32  seed: string,
33  strokeWidth: number,
34  grain: number,
35): string {
36  return `remocn-brush-${Math.floor(hash01(`${seed}:${strokeWidth}:${grain}`) * 1e9)}`;
37}
38 
39export function sampleCubic(
40  from: BrushPoint,
41  c1: BrushPoint,
42  c2: BrushPoint,
43  to: BrushPoint,
44  points = 32,
45): BrushPoint[] {
46  const count = Math.max(2, points);
47  return Array.from({ length: count }, (_, i) => {
48    const t = i / (count - 1);
49    const u = 1 - t;
50    const a = u * u * u;
51    const b = 3 * u * u * t;
52    const c = 3 * u * t * t;
53    const d = t * t * t;
54    return {
55      x: a * from.x + b * c1.x + c * c2.x + d * to.x,
56      y: a * from.y + b * c1.y + c * c2.y + d * to.y,
57    };
58  });
59}
60 
61export function sampleLine(
62  from: BrushPoint,
63  to: BrushPoint,
64  points = 8,
65): BrushPoint[] {
66  const count = Math.max(2, points);
67  return Array.from({ length: count }, (_, i) => {
68    const t = i / (count - 1);
69    return {
70      x: from.x + (to.x - from.x) * t,
71      y: from.y + (to.y - from.y) * t,
72    };
73  });
74}
75 
76const normalAt = (points: BrushPoint[], i: number): BrushPoint => {
77  const before = points[i - 1] ?? points[i];
78  const after = points[i + 1] ?? points[i];
79  const tx = after.x - before.x;
80  const ty = after.y - before.y;
81  const length = Math.hypot(tx, ty) || 1;
82  return { x: -ty / length, y: tx / length };
83};
84 
85const curveSegments = (points: BrushPoint[]): string =>
86  points
87    .slice(0, -1)
88    .map((p1, i) => {
89      const p0 = points[i - 1] ?? p1;
90      const p2 = points[i + 1];
91      const p3 = points[i + 2] ?? p2;
92// … truncated