@sarmal/core 0.4.2 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/auto-init.cjs +92 -50
- package/dist/auto-init.cjs.map +1 -1
- package/dist/auto-init.d.cts +2 -1
- package/dist/auto-init.d.ts +2 -1
- package/dist/auto-init.js +91 -49
- package/dist/auto-init.js.map +1 -1
- package/dist/index.cjs +108 -58
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +151 -160
- package/dist/index.d.ts +151 -160
- package/dist/index.js +107 -57
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,155 +1,171 @@
|
|
|
1
1
|
interface Point {
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
x: number;
|
|
3
|
+
y: number;
|
|
4
4
|
}
|
|
5
5
|
interface CurveDef {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
6
|
+
name: string;
|
|
7
|
+
fn: (t: number, time: number, params: Record<string, number>) => Point;
|
|
8
|
+
/**
|
|
9
|
+
* @default (Math.PI * 2)
|
|
10
|
+
*/
|
|
11
|
+
period?: number;
|
|
12
|
+
/**
|
|
13
|
+
* @default 1
|
|
14
|
+
*/
|
|
15
|
+
speed?: number;
|
|
16
|
+
/**
|
|
17
|
+
* To indicate a compatible library version when providing the curve definitions
|
|
18
|
+
* Intended for potential backwards compatibility scenarios and futureproofing
|
|
19
|
+
*/
|
|
20
|
+
version?: number;
|
|
21
|
+
/**
|
|
22
|
+
* Skeleton rendering mode:
|
|
23
|
+
* - 'static': Skeleton is computed once at init from `fn(t, 0)` and cached
|
|
24
|
+
* - 'live': Skeleton is recomputed each frame using `fn(t, actualTime)` specifically for curves whose shape drifts *over time*
|
|
25
|
+
* @default "static"
|
|
26
|
+
*/
|
|
27
|
+
skeleton?: "static" | "live";
|
|
28
|
+
/**
|
|
29
|
+
* An **override** function for computing a skeleton independent of `fn`
|
|
30
|
+
* If provided, this function is used instead of `fn` to sample the skeleton,
|
|
31
|
+
* and the result is cached just like like 'static' mode
|
|
32
|
+
* @param t The parametric time value from `0` to `period`
|
|
33
|
+
* @returns The point on the skeleton at time `t`
|
|
34
|
+
*/
|
|
35
|
+
skeletonFn?: (t: number) => Point;
|
|
21
36
|
}
|
|
22
37
|
type SeekOptions = {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
38
|
+
/**
|
|
39
|
+
* Decides whether the sarmal trail should be cleared when `seek` is called
|
|
40
|
+
*/
|
|
41
|
+
clearTrail?: boolean;
|
|
27
42
|
};
|
|
28
43
|
type SeekWithTrailOptions = {
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
44
|
+
/**
|
|
45
|
+
* When true, the trail wraps around the period boundary,
|
|
46
|
+
* which results in a full trail even near `t=0`
|
|
47
|
+
* By default, the trail stops at `t=0`, which results in a partial trail near the start
|
|
48
|
+
* @default false
|
|
49
|
+
*/
|
|
50
|
+
wrap?: boolean;
|
|
51
|
+
/**
|
|
52
|
+
* Time gap between each trail point (in same units as `t`)
|
|
53
|
+
* Smaller value means a trail that is more dense
|
|
54
|
+
* @default period / trailLength
|
|
55
|
+
*/
|
|
56
|
+
step?: number;
|
|
42
57
|
};
|
|
43
58
|
interface Engine {
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
59
|
+
/**
|
|
60
|
+
* Advances the Sarmal simulation by the given delta time (dt) in seconds.
|
|
61
|
+
* Internally, this increases the simulation time `t` by `speed * dt`,
|
|
62
|
+
* wraps `t` at `period`, evaluates the curve's parametric function `fn(t)`,
|
|
63
|
+
* and appends the new point to the trail.
|
|
64
|
+
* Returns the pre-allocated trail buffer, which has the *same* reference every call
|
|
65
|
+
* ! Do not use `Array.length` to determine size
|
|
66
|
+
* @param deltaTime Delta time in seconds (typically frame time from **requestAnimationFrame** or similar)
|
|
67
|
+
*/
|
|
68
|
+
tick(deltaTime: number): Array<Point>;
|
|
69
|
+
/**
|
|
70
|
+
* Number of valid points in the trail buffer returned by the last `tick()` call
|
|
71
|
+
* ! Use this instead of `trail.length`
|
|
72
|
+
*/
|
|
73
|
+
readonly trailCount: number;
|
|
74
|
+
/**
|
|
75
|
+
* Resets the simulation state, by clearing the trail and reverting internal time `t` to 0.
|
|
76
|
+
* The next call to `tick` will start fresh from the beginning of the curve.
|
|
77
|
+
*/
|
|
78
|
+
reset(): void;
|
|
79
|
+
/**
|
|
80
|
+
* Returns the *skeleton* of the curve.
|
|
81
|
+
* In technicality, it just represents the complete traversal of the curve over one full period,
|
|
82
|
+
* which is sampled at points from `t=0` to `t=period`
|
|
83
|
+
*
|
|
84
|
+
* For "static" skeletons, this returns the same array on every call
|
|
85
|
+
* For "live" skeletons, this returns a different array each frame
|
|
86
|
+
* For `skeletonFn` overrides, this returns the skeleton from that function, which is *always* static
|
|
87
|
+
*
|
|
88
|
+
* The number of sample points is automatically derived from the curve's period.
|
|
89
|
+
*/
|
|
90
|
+
getSarmalSkeleton(): Array<Point>;
|
|
91
|
+
readonly isLiveSkeleton: boolean;
|
|
92
|
+
/**
|
|
93
|
+
* Sets the simulation time `t` directly to the specified value.
|
|
94
|
+
* By default, the trail is preserved
|
|
95
|
+
* @param t The time value to seek to (will be wrapped into [0, period))
|
|
96
|
+
*/
|
|
97
|
+
seek(t: number, options?: SeekOptions): void;
|
|
98
|
+
/**
|
|
99
|
+
* Seeks to `t` and rebuilds the trail as if the animation naturally arrived there from `t=0`
|
|
100
|
+
* @param t The time value to seek to (will be wrapped into [0, period))
|
|
101
|
+
*/
|
|
102
|
+
seekWithTrail(t: number, options?: SeekWithTrailOptions): void;
|
|
87
103
|
}
|
|
88
104
|
interface SarmalInstance {
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
105
|
+
start(): void;
|
|
106
|
+
stop(): void;
|
|
107
|
+
/** Resets the engine and clears the trail */
|
|
108
|
+
reset(): void;
|
|
109
|
+
/** Stops the animation and cleans up resources */
|
|
110
|
+
destroy(): void;
|
|
111
|
+
/**
|
|
112
|
+
* Sets the simulation time `t` directly to the specified value.
|
|
113
|
+
* By default, the trail is preserved
|
|
114
|
+
* @param t The time value to seek to (will be wrapped into [0, period))
|
|
115
|
+
*/
|
|
116
|
+
seek(t: number, options?: SeekOptions): void;
|
|
117
|
+
/**
|
|
118
|
+
* Seeks to `t` and rebuilds the trail as if the animation naturally arrived there from `t=0`
|
|
119
|
+
* @param t The time value to seek to (will be wrapped into [0, period))
|
|
120
|
+
*/
|
|
121
|
+
seekWithTrail(t: number, options?: SeekWithTrailOptions): void;
|
|
106
122
|
}
|
|
107
123
|
interface RendererOptions {
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
124
|
+
/** Target canvas element that will contain the Sarmal */
|
|
125
|
+
canvas: HTMLCanvasElement;
|
|
126
|
+
engine: Engine;
|
|
127
|
+
/**
|
|
128
|
+
* @default '#ffffff'
|
|
129
|
+
*/
|
|
130
|
+
skeletonColor?: string;
|
|
131
|
+
/**
|
|
132
|
+
* @default '#ffffff'
|
|
133
|
+
*/
|
|
134
|
+
trailColor?: string;
|
|
135
|
+
/**
|
|
136
|
+
* @default '#ffffff'
|
|
137
|
+
*/
|
|
138
|
+
headColor?: string;
|
|
139
|
+
/** @default 4 */
|
|
140
|
+
headRadius?: number;
|
|
141
|
+
/** @default 20 */
|
|
142
|
+
glowSize?: number;
|
|
127
143
|
}
|
|
128
144
|
interface SarmalOptions extends Omit<RendererOptions, "canvas" | "engine"> {
|
|
129
|
-
|
|
130
|
-
|
|
145
|
+
/** @default 120 */
|
|
146
|
+
trailLength?: number;
|
|
131
147
|
}
|
|
132
148
|
|
|
133
149
|
interface SVGRendererOptions {
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
150
|
+
/** Container element that will contain the SVG */
|
|
151
|
+
container: Element;
|
|
152
|
+
engine: Engine;
|
|
153
|
+
/** @default '#ffffff' */
|
|
154
|
+
skeletonColor?: string;
|
|
155
|
+
/** @default '#ffffff' */
|
|
156
|
+
trailColor?: string;
|
|
157
|
+
/** @default '#ffffff' */
|
|
158
|
+
headColor?: string;
|
|
159
|
+
/** @default 4 */
|
|
160
|
+
headRadius?: number;
|
|
161
|
+
/** @default 20 */
|
|
162
|
+
glowSize?: number;
|
|
163
|
+
/** @default 'Loading' */
|
|
164
|
+
ariaLabel?: string;
|
|
149
165
|
}
|
|
150
166
|
interface SVGSarmalOptions extends Omit<SVGRendererOptions, "container" | "engine"> {
|
|
151
|
-
|
|
152
|
-
|
|
167
|
+
/** @default 120 */
|
|
168
|
+
trailLength?: number;
|
|
153
169
|
}
|
|
154
170
|
/**
|
|
155
171
|
* Creates a live SVG renderer for sarmal animations
|
|
@@ -167,11 +183,7 @@ declare function createSVGRenderer(options: SVGRendererOptions): SarmalInstance;
|
|
|
167
183
|
* sarmal.start()
|
|
168
184
|
* ```
|
|
169
185
|
*/
|
|
170
|
-
declare function createSarmalSVG(
|
|
171
|
-
container: Element,
|
|
172
|
-
curveDef: CurveDef,
|
|
173
|
-
options?: SVGSarmalOptions,
|
|
174
|
-
): SarmalInstance;
|
|
186
|
+
declare function createSarmalSVG(container: Element, curveDef: CurveDef, options?: SVGSarmalOptions): SarmalInstance;
|
|
175
187
|
|
|
176
188
|
/**
|
|
177
189
|
* Creates the core simulation engine for a sarmal
|
|
@@ -205,27 +217,6 @@ declare const curves: Record<string, CurveDef>;
|
|
|
205
217
|
* sarmal.start()
|
|
206
218
|
* ```
|
|
207
219
|
*/
|
|
208
|
-
declare function createSarmal(
|
|
209
|
-
canvas: HTMLCanvasElement,
|
|
210
|
-
curveDef: CurveDef,
|
|
211
|
-
options?: SarmalOptions,
|
|
212
|
-
): SarmalInstance;
|
|
220
|
+
declare function createSarmal(canvas: HTMLCanvasElement, curveDef: CurveDef, options?: SarmalOptions): SarmalInstance;
|
|
213
221
|
|
|
214
|
-
export {
|
|
215
|
-
type CurveDef,
|
|
216
|
-
type Engine,
|
|
217
|
-
type Point,
|
|
218
|
-
type RendererOptions,
|
|
219
|
-
type SVGRendererOptions,
|
|
220
|
-
type SVGSarmalOptions,
|
|
221
|
-
type SarmalInstance,
|
|
222
|
-
type SarmalOptions,
|
|
223
|
-
type SeekOptions,
|
|
224
|
-
type SeekWithTrailOptions,
|
|
225
|
-
createEngine,
|
|
226
|
-
createRenderer,
|
|
227
|
-
createSVGRenderer,
|
|
228
|
-
createSarmal,
|
|
229
|
-
createSarmalSVG,
|
|
230
|
-
curves,
|
|
231
|
-
};
|
|
222
|
+
export { type CurveDef, type Engine, type Point, type RendererOptions, type SVGRendererOptions, type SVGSarmalOptions, type SarmalInstance, type SarmalOptions, type SeekOptions, type SeekWithTrailOptions, createEngine, createRenderer, createSVGRenderer, createSarmal, createSarmalSVG, curves };
|