@sarmal/core 0.25.1 → 0.26.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 +170 -206
- package/dist/auto-init.cjs.map +1 -1
- package/dist/auto-init.js +169 -205
- package/dist/auto-init.js.map +1 -1
- package/dist/curves/artemis2.cjs +14 -20
- package/dist/curves/artemis2.cjs.map +1 -1
- package/dist/curves/artemis2.d.cts +1 -1
- package/dist/curves/artemis2.d.ts +1 -1
- package/dist/curves/artemis2.js +13 -19
- package/dist/curves/artemis2.js.map +1 -1
- package/dist/curves/astroid.cjs +7 -7
- package/dist/curves/astroid.cjs.map +1 -1
- package/dist/curves/astroid.d.cts +1 -1
- package/dist/curves/astroid.d.ts +1 -1
- package/dist/curves/astroid.js +6 -6
- package/dist/curves/astroid.js.map +1 -1
- package/dist/curves/deltoid.cjs +6 -6
- package/dist/curves/deltoid.cjs.map +1 -1
- package/dist/curves/deltoid.d.cts +1 -1
- package/dist/curves/deltoid.d.ts +1 -1
- package/dist/curves/deltoid.js +5 -5
- package/dist/curves/deltoid.js.map +1 -1
- package/dist/curves/epicycloid3.cjs +6 -6
- package/dist/curves/epicycloid3.cjs.map +1 -1
- package/dist/curves/epicycloid3.d.cts +1 -1
- package/dist/curves/epicycloid3.d.ts +1 -1
- package/dist/curves/epicycloid3.js +5 -5
- package/dist/curves/epicycloid3.js.map +1 -1
- package/dist/curves/epitrochoid7.cjs +10 -10
- package/dist/curves/epitrochoid7.cjs.map +1 -1
- package/dist/curves/epitrochoid7.d.cts +1 -1
- package/dist/curves/epitrochoid7.d.ts +1 -1
- package/dist/curves/epitrochoid7.js +9 -9
- package/dist/curves/epitrochoid7.js.map +1 -1
- package/dist/curves/index.cjs +81 -97
- package/dist/curves/index.cjs.map +1 -1
- package/dist/curves/index.d.cts +29 -29
- package/dist/curves/index.d.ts +29 -29
- package/dist/curves/index.js +81 -113
- package/dist/curves/index.js.map +1 -1
- package/dist/curves/lame.cjs +7 -8
- package/dist/curves/lame.cjs.map +1 -1
- package/dist/curves/lame.d.cts +1 -1
- package/dist/curves/lame.d.ts +1 -1
- package/dist/curves/lame.js +6 -7
- package/dist/curves/lame.js.map +1 -1
- package/dist/curves/lissajous32.cjs +7 -7
- package/dist/curves/lissajous32.cjs.map +1 -1
- package/dist/curves/lissajous32.d.cts +1 -1
- package/dist/curves/lissajous32.d.ts +1 -1
- package/dist/curves/lissajous32.js +6 -6
- package/dist/curves/lissajous32.js.map +1 -1
- package/dist/curves/lissajous43.cjs +7 -7
- package/dist/curves/lissajous43.cjs.map +1 -1
- package/dist/curves/lissajous43.d.cts +1 -1
- package/dist/curves/lissajous43.d.ts +1 -1
- package/dist/curves/lissajous43.js +6 -6
- package/dist/curves/lissajous43.js.map +1 -1
- package/dist/curves/rose3.cjs +7 -7
- package/dist/curves/rose3.cjs.map +1 -1
- package/dist/curves/rose3.d.cts +1 -1
- package/dist/curves/rose3.d.ts +1 -1
- package/dist/curves/rose3.js +6 -6
- package/dist/curves/rose3.js.map +1 -1
- package/dist/curves/rose5.cjs +7 -7
- package/dist/curves/rose5.cjs.map +1 -1
- package/dist/curves/rose5.d.cts +1 -1
- package/dist/curves/rose5.d.ts +1 -1
- package/dist/curves/rose5.js +6 -6
- package/dist/curves/rose5.js.map +1 -1
- package/dist/curves/rose52.cjs +7 -7
- package/dist/curves/rose52.cjs.map +1 -1
- package/dist/curves/rose52.d.cts +1 -1
- package/dist/curves/rose52.d.ts +1 -1
- package/dist/curves/rose52.js +6 -6
- package/dist/curves/rose52.js.map +1 -1
- package/dist/curves/star.cjs +7 -10
- package/dist/curves/star.cjs.map +1 -1
- package/dist/curves/star.d.cts +1 -1
- package/dist/curves/star.d.ts +1 -1
- package/dist/curves/star.js +6 -9
- package/dist/curves/star.js.map +1 -1
- package/dist/curves/star4.cjs +7 -10
- package/dist/curves/star4.cjs.map +1 -1
- package/dist/curves/star4.d.cts +2 -2
- package/dist/curves/star4.d.ts +2 -2
- package/dist/curves/star4.js +6 -9
- package/dist/curves/star4.js.map +1 -1
- package/dist/curves/star7.cjs +7 -10
- package/dist/curves/star7.cjs.map +1 -1
- package/dist/curves/star7.d.cts +2 -2
- package/dist/curves/star7.d.ts +2 -2
- package/dist/curves/star7.js +6 -9
- package/dist/curves/star7.js.map +1 -1
- package/dist/index.cjs +158 -192
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +43 -95
- package/dist/index.d.ts +43 -95
- package/dist/index.js +158 -213
- package/dist/index.js.map +1 -1
- package/dist/types-zbxUgcmZ.d.cts +325 -0
- package/dist/types-zbxUgcmZ.d.ts +325 -0
- package/package.json +1 -1
- package/dist/types-Z9i1_AQZ.d.cts +0 -339
- package/dist/types-Z9i1_AQZ.d.ts +0 -339
package/dist/index.js
CHANGED
|
@@ -61,32 +61,32 @@ function resolveCurve(curveDef) {
|
|
|
61
61
|
period,
|
|
62
62
|
speed,
|
|
63
63
|
skeleton: curveDef.skeleton,
|
|
64
|
-
skeletonFn: curveDef.skeletonFn
|
|
64
|
+
skeletonFn: curveDef.skeletonFn
|
|
65
65
|
};
|
|
66
66
|
}
|
|
67
67
|
function createEngine(curveDef, trailLength = 120) {
|
|
68
68
|
if (!Number.isFinite(trailLength) || trailLength <= 0) {
|
|
69
69
|
throw new RangeError(
|
|
70
|
-
`[sarmal] trailLength must be a positive finite number, got ${trailLength}
|
|
70
|
+
`[sarmal] trailLength must be a positive finite number, got ${trailLength}`
|
|
71
71
|
);
|
|
72
72
|
}
|
|
73
73
|
let curve = resolveCurve(curveDef);
|
|
74
74
|
const trail = new CircularBuffer(trailLength);
|
|
75
|
-
let
|
|
75
|
+
let phase = 0;
|
|
76
76
|
let actualTime = 0;
|
|
77
77
|
let userSpeedOverride = null;
|
|
78
78
|
let morphCurveB = null;
|
|
79
79
|
let _morphAlpha = null;
|
|
80
80
|
let _morphStrategy = "normalized";
|
|
81
81
|
let _speedTransition = null;
|
|
82
|
-
function sampleSkeleton(c,
|
|
82
|
+
function sampleSkeleton(c, samplePhase) {
|
|
83
83
|
if (c.skeletonFn) {
|
|
84
|
-
return c.skeletonFn(
|
|
84
|
+
return c.skeletonFn(samplePhase);
|
|
85
85
|
}
|
|
86
86
|
if (c.skeleton === "live") {
|
|
87
|
-
return c.fn(
|
|
87
|
+
return c.fn(samplePhase, actualTime, EMPTY_PARAMS);
|
|
88
88
|
}
|
|
89
|
-
return c.fn(
|
|
89
|
+
return c.fn(samplePhase, 0, EMPTY_PARAMS);
|
|
90
90
|
}
|
|
91
91
|
return {
|
|
92
92
|
tick(deltaTime) {
|
|
@@ -104,15 +104,15 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
104
104
|
if (morphCurveB !== null && _morphAlpha !== null) {
|
|
105
105
|
effectiveSpeed = lerp(effectiveSpeed, morphCurveB.speed, _morphAlpha);
|
|
106
106
|
}
|
|
107
|
-
|
|
107
|
+
phase = (phase + effectiveSpeed * deltaTime) % curve.period;
|
|
108
108
|
actualTime += deltaTime;
|
|
109
109
|
if (morphCurveB !== null && _morphAlpha !== null) {
|
|
110
|
-
const a = curve.fn(
|
|
111
|
-
const
|
|
112
|
-
const b = morphCurveB.fn(
|
|
110
|
+
const a = curve.fn(phase, actualTime, EMPTY_PARAMS);
|
|
111
|
+
const phaseB = _morphStrategy === "normalized" ? phase / curve.period * morphCurveB.period : phase;
|
|
112
|
+
const b = morphCurveB.fn(phaseB, actualTime, EMPTY_PARAMS);
|
|
113
113
|
trail.push(a.x + (b.x - a.x) * _morphAlpha, a.y + (b.y - a.y) * _morphAlpha);
|
|
114
114
|
} else {
|
|
115
|
-
const point = curve.fn(
|
|
115
|
+
const point = curve.fn(phase, actualTime, EMPTY_PARAMS);
|
|
116
116
|
trail.push(point.x, point.y);
|
|
117
117
|
}
|
|
118
118
|
return trail.toArray();
|
|
@@ -130,30 +130,30 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
130
130
|
return _morphAlpha;
|
|
131
131
|
},
|
|
132
132
|
reset() {
|
|
133
|
-
|
|
133
|
+
phase = 0;
|
|
134
134
|
actualTime = 0;
|
|
135
135
|
trail.clear();
|
|
136
136
|
},
|
|
137
|
-
jump(
|
|
138
|
-
|
|
137
|
+
jump(newPhase, { clearTrail = false } = {}) {
|
|
138
|
+
phase = (newPhase % curve.period + curve.period) % curve.period;
|
|
139
139
|
if (clearTrail) {
|
|
140
140
|
trail.clear();
|
|
141
141
|
}
|
|
142
142
|
},
|
|
143
|
-
seek(
|
|
143
|
+
seek(targetPhase, { wrap = false, step = curve.period / trailLength } = {}) {
|
|
144
144
|
const advance = curve.speed * step;
|
|
145
|
-
const target = (
|
|
145
|
+
const target = (targetPhase % curve.period + curve.period) % curve.period;
|
|
146
146
|
const targetTime = target / curve.speed;
|
|
147
|
-
|
|
147
|
+
phase = target;
|
|
148
148
|
actualTime = targetTime;
|
|
149
149
|
trail.clear();
|
|
150
150
|
const pointsFromStart = Math.floor(target / advance) + 1;
|
|
151
151
|
const count = wrap ? trailLength : Math.min(trailLength, pointsFromStart);
|
|
152
152
|
for (let i = count - 1; i >= 0; i--) {
|
|
153
|
-
const
|
|
154
|
-
const
|
|
155
|
-
const
|
|
156
|
-
const point = curve.fn(
|
|
153
|
+
const samplePhase = target - i * advance;
|
|
154
|
+
const wrappedPhase = (samplePhase % curve.period + curve.period) % curve.period;
|
|
155
|
+
const elapsed = targetTime - i * step;
|
|
156
|
+
const point = curve.fn(wrappedPhase, elapsed, EMPTY_PARAMS);
|
|
157
157
|
trail.push(point.x, point.y);
|
|
158
158
|
}
|
|
159
159
|
},
|
|
@@ -166,18 +166,15 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
166
166
|
const frozenStrategy = _morphStrategy;
|
|
167
167
|
curve = {
|
|
168
168
|
...frozenB,
|
|
169
|
-
fn: (
|
|
170
|
-
const a = frozenA.fn(
|
|
171
|
-
const
|
|
172
|
-
|
|
173
|
-
? (sampleT / frozenA.period) * frozenB.period
|
|
174
|
-
: sampleT;
|
|
175
|
-
const b = frozenB.fn(tB, time, params);
|
|
169
|
+
fn: (samplePhase, elapsed, params) => {
|
|
170
|
+
const a = frozenA.fn(samplePhase, elapsed, params);
|
|
171
|
+
const phaseB = frozenStrategy === "normalized" ? samplePhase / frozenA.period * frozenB.period : samplePhase;
|
|
172
|
+
const b = frozenB.fn(phaseB, elapsed, params);
|
|
176
173
|
return {
|
|
177
174
|
x: a.x + (b.x - a.x) * frozenAlpha,
|
|
178
|
-
y: a.y + (b.y - a.y) * frozenAlpha
|
|
175
|
+
y: a.y + (b.y - a.y) * frozenAlpha
|
|
179
176
|
};
|
|
180
|
-
}
|
|
177
|
+
}
|
|
181
178
|
};
|
|
182
179
|
}
|
|
183
180
|
_morphStrategy = strategy;
|
|
@@ -190,7 +187,7 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
190
187
|
completeMorph() {
|
|
191
188
|
if (morphCurveB !== null) {
|
|
192
189
|
if (_morphStrategy === "normalized" && curve.period !== morphCurveB.period) {
|
|
193
|
-
|
|
190
|
+
phase = phase / curve.period * morphCurveB.period;
|
|
194
191
|
}
|
|
195
192
|
curve = morphCurveB;
|
|
196
193
|
}
|
|
@@ -202,23 +199,20 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
202
199
|
const points2 = new Array(steps);
|
|
203
200
|
if (morphCurveB !== null && _morphAlpha !== null) {
|
|
204
201
|
for (let i = 0; i < steps; i++) {
|
|
205
|
-
const
|
|
206
|
-
const a = sampleSkeleton(curve,
|
|
207
|
-
const
|
|
208
|
-
|
|
209
|
-
? (sampleT / curve.period) * morphCurveB.period
|
|
210
|
-
: sampleT;
|
|
211
|
-
const b = sampleSkeleton(morphCurveB, tB);
|
|
202
|
+
const samplePhase = i / (steps - 1) * curve.period;
|
|
203
|
+
const a = sampleSkeleton(curve, samplePhase);
|
|
204
|
+
const phaseB = _morphStrategy === "normalized" ? samplePhase / curve.period * morphCurveB.period : samplePhase;
|
|
205
|
+
const b = sampleSkeleton(morphCurveB, phaseB);
|
|
212
206
|
points2[i] = {
|
|
213
207
|
x: a.x + (b.x - a.x) * _morphAlpha,
|
|
214
|
-
y: a.y + (b.y - a.y) * _morphAlpha
|
|
208
|
+
y: a.y + (b.y - a.y) * _morphAlpha
|
|
215
209
|
};
|
|
216
210
|
}
|
|
217
211
|
return points2;
|
|
218
212
|
}
|
|
219
213
|
for (let i = 0; i < steps; i++) {
|
|
220
|
-
const
|
|
221
|
-
points2[i] = sampleSkeleton(curve,
|
|
214
|
+
const samplePhase = i / (steps - 1) * curve.period;
|
|
215
|
+
points2[i] = sampleSkeleton(curve, samplePhase);
|
|
222
216
|
}
|
|
223
217
|
return points2;
|
|
224
218
|
},
|
|
@@ -259,7 +253,7 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
259
253
|
_speedTransition.reject(new Error("Speed transition cancelled"));
|
|
260
254
|
_speedTransition = null;
|
|
261
255
|
}
|
|
262
|
-
}
|
|
256
|
+
}
|
|
263
257
|
};
|
|
264
258
|
}
|
|
265
259
|
|
|
@@ -298,15 +292,7 @@ function computeNormal(trail, i) {
|
|
|
298
292
|
const tangent = computeTangent(trail, i);
|
|
299
293
|
return { x: -tangent.y, y: tangent.x };
|
|
300
294
|
}
|
|
301
|
-
function computeTrailQuad(
|
|
302
|
-
trail,
|
|
303
|
-
i,
|
|
304
|
-
trailCount,
|
|
305
|
-
toX,
|
|
306
|
-
toY,
|
|
307
|
-
minWidth = TRAIL_MIN_WIDTH,
|
|
308
|
-
maxWidth = TRAIL_MAX_WIDTH,
|
|
309
|
-
) {
|
|
295
|
+
function computeTrailQuad(trail, i, trailCount, toX, toY, minWidth = TRAIL_MIN_WIDTH, maxWidth = TRAIL_MAX_WIDTH) {
|
|
310
296
|
const progress = i / (trailCount - 1);
|
|
311
297
|
const nextProgress = (i + 1) / (trailCount - 1);
|
|
312
298
|
const opacity = Math.pow(progress, TRAIL_FADE_CURVE) * TRAIL_MAX_OPACITY;
|
|
@@ -330,16 +316,13 @@ function computeTrailQuad(
|
|
|
330
316
|
r1x: nx - n1.x * w1,
|
|
331
317
|
r1y: ny - n1.y * w1,
|
|
332
318
|
opacity,
|
|
333
|
-
progress
|
|
319
|
+
progress
|
|
334
320
|
};
|
|
335
321
|
}
|
|
336
322
|
function computeBoundaries(pts, logicalWidth, logicalHeight, minPaddingPx = FIT_PADDING_MIN) {
|
|
337
323
|
if (pts.length === 0) return null;
|
|
338
324
|
const first = pts[0];
|
|
339
|
-
let minX = first.x,
|
|
340
|
-
maxX = first.x,
|
|
341
|
-
minY = first.y,
|
|
342
|
-
maxY = first.y;
|
|
325
|
+
let minX = first.x, maxX = first.x, minY = first.y, maxY = first.y;
|
|
343
326
|
for (const p of pts) {
|
|
344
327
|
if (p.x < minX) {
|
|
345
328
|
minX = p.x;
|
|
@@ -358,7 +341,7 @@ function computeBoundaries(pts, logicalWidth, logicalHeight, minPaddingPx = FIT_
|
|
|
358
341
|
const h = maxY - minY;
|
|
359
342
|
if (w === 0 && h === 0) {
|
|
360
343
|
throw new Error(
|
|
361
|
-
"[sarmal] Degenerate curve: all skeleton points are identical. Check that your curve fn returns distinct points for different values of t."
|
|
344
|
+
"[sarmal] Degenerate curve: all skeleton points are identical. Check that your curve fn returns distinct points for different values of t."
|
|
362
345
|
);
|
|
363
346
|
}
|
|
364
347
|
const scaleXProportional = logicalWidth / (w * (1 + FIT_PADDING * 2));
|
|
@@ -369,12 +352,12 @@ function computeBoundaries(pts, logicalWidth, logicalHeight, minPaddingPx = FIT_
|
|
|
369
352
|
scaleXProportional,
|
|
370
353
|
scaleYProportional,
|
|
371
354
|
scaleXMinPadding,
|
|
372
|
-
scaleYMinPadding
|
|
355
|
+
scaleYMinPadding
|
|
373
356
|
);
|
|
374
357
|
return {
|
|
375
358
|
scale,
|
|
376
359
|
offsetX: (logicalWidth - w * scale) / 2 - minX * scale,
|
|
377
|
-
offsetY: (logicalHeight - h * scale) / 2 - minY * scale
|
|
360
|
+
offsetY: (logicalHeight - h * scale) / 2 - minY * scale
|
|
378
361
|
};
|
|
379
362
|
}
|
|
380
363
|
function enginePassthroughs(engine) {
|
|
@@ -385,7 +368,7 @@ function enginePassthroughs(engine) {
|
|
|
385
368
|
getSpeed: engine.getSpeed,
|
|
386
369
|
resetSpeed: engine.resetSpeed,
|
|
387
370
|
setSpeedOver: engine.setSpeedOver,
|
|
388
|
-
getSarmalSkeleton: engine.getSarmalSkeleton
|
|
371
|
+
getSarmalSkeleton: engine.getSarmalSkeleton
|
|
389
372
|
};
|
|
390
373
|
}
|
|
391
374
|
var palettes = {
|
|
@@ -394,16 +377,16 @@ var palettes = {
|
|
|
394
377
|
ocean: ["#1e3a8a", "#06b6d4", "#22d3ee", "#e0f2fe"],
|
|
395
378
|
ice: ["#1e3a8a", "#67e8f9"],
|
|
396
379
|
fire: ["#7f1d1d", "#fbbf24"],
|
|
397
|
-
forest: ["#14532d", "#86efac"]
|
|
380
|
+
forest: ["#14532d", "#86efac"]
|
|
398
381
|
};
|
|
399
382
|
function hexToRgb(hex) {
|
|
400
383
|
const n = parseInt(hex.slice(1), 16);
|
|
401
|
-
return { r: n >> 16, g:
|
|
384
|
+
return { r: n >> 16, g: n >> 8 & 255, b: n & 255 };
|
|
402
385
|
}
|
|
403
386
|
var lerpRgb = (a, b, t) => ({
|
|
404
387
|
r: Math.round(a.r + (b.r - a.r) * t),
|
|
405
388
|
g: Math.round(a.g + (b.g - a.g) * t),
|
|
406
|
-
b: Math.round(a.b + (b.b - a.b) * t)
|
|
389
|
+
b: Math.round(a.b + (b.b - a.b) * t)
|
|
407
390
|
});
|
|
408
391
|
function getPaletteColor(palette, position, timeOffset = 0) {
|
|
409
392
|
if (palette.length === 0) {
|
|
@@ -412,7 +395,7 @@ function getPaletteColor(palette, position, timeOffset = 0) {
|
|
|
412
395
|
if (palette.length === 1) {
|
|
413
396
|
return hexToRgb(palette[0]);
|
|
414
397
|
}
|
|
415
|
-
const cyclePos = ((
|
|
398
|
+
const cyclePos = ((position + timeOffset) % 1 + 1) % 1;
|
|
416
399
|
const scaled = cyclePos * palette.length;
|
|
417
400
|
const idx = Math.floor(scaled);
|
|
418
401
|
const t = scaled - idx;
|
|
@@ -427,7 +410,7 @@ var RENDER_OPTION_KEYS = /* @__PURE__ */ new Set([
|
|
|
427
410
|
"headColor",
|
|
428
411
|
"skeletonColor",
|
|
429
412
|
"trailStyle",
|
|
430
|
-
"headRadius"
|
|
413
|
+
"headRadius"
|
|
431
414
|
]);
|
|
432
415
|
function validateRenderOptions(partial) {
|
|
433
416
|
for (const key of Object.keys(partial)) {
|
|
@@ -455,7 +438,7 @@ function assertTrailColor(value) {
|
|
|
455
438
|
if (typeof value === "string") {
|
|
456
439
|
if (!HEX_COLOR_RE.test(value)) {
|
|
457
440
|
throw new TypeError(
|
|
458
|
-
`[sarmal] setRenderOptions: trailColor must be a 6-digit hex string, got "${value}"
|
|
441
|
+
`[sarmal] setRenderOptions: trailColor must be a 6-digit hex string, got "${value}"`
|
|
459
442
|
);
|
|
460
443
|
}
|
|
461
444
|
return;
|
|
@@ -463,21 +446,21 @@ function assertTrailColor(value) {
|
|
|
463
446
|
if (Array.isArray(value)) {
|
|
464
447
|
if (value.length < 2) {
|
|
465
448
|
throw new RangeError(
|
|
466
|
-
`[sarmal] setRenderOptions: trailColor array must have at least 2 entries, got ${value.length}
|
|
449
|
+
`[sarmal] setRenderOptions: trailColor array must have at least 2 entries, got ${value.length}`
|
|
467
450
|
);
|
|
468
451
|
}
|
|
469
452
|
for (let i = 0; i < value.length; i++) {
|
|
470
453
|
const entry = value[i];
|
|
471
454
|
if (typeof entry !== "string" || !HEX_COLOR_RE.test(entry)) {
|
|
472
455
|
throw new TypeError(
|
|
473
|
-
`[sarmal] setRenderOptions: trailColor[${i}] must be a 6-digit hex string, got ${JSON.stringify(entry)}
|
|
456
|
+
`[sarmal] setRenderOptions: trailColor[${i}] must be a 6-digit hex string, got ${JSON.stringify(entry)}`
|
|
474
457
|
);
|
|
475
458
|
}
|
|
476
459
|
}
|
|
477
460
|
return;
|
|
478
461
|
}
|
|
479
462
|
throw new TypeError(
|
|
480
|
-
`[sarmal] setRenderOptions: trailColor must be a 6-digit hex string or an array of hex strings, got ${JSON.stringify(value)}
|
|
463
|
+
`[sarmal] setRenderOptions: trailColor must be a 6-digit hex string or an array of hex strings, got ${JSON.stringify(value)}`
|
|
481
464
|
);
|
|
482
465
|
}
|
|
483
466
|
function assertHeadColor(value) {
|
|
@@ -486,7 +469,7 @@ function assertHeadColor(value) {
|
|
|
486
469
|
}
|
|
487
470
|
if (typeof value !== "string" || !HEX_COLOR_RE.test(value)) {
|
|
488
471
|
throw new TypeError(
|
|
489
|
-
`[sarmal] setRenderOptions: headColor must be a 6-digit hex string or null, got ${JSON.stringify(value)}
|
|
472
|
+
`[sarmal] setRenderOptions: headColor must be a 6-digit hex string or null, got ${JSON.stringify(value)}`
|
|
490
473
|
);
|
|
491
474
|
}
|
|
492
475
|
}
|
|
@@ -496,26 +479,26 @@ function assertSkeletonColor(value) {
|
|
|
496
479
|
}
|
|
497
480
|
if (typeof value !== "string" || !HEX_COLOR_RE.test(value)) {
|
|
498
481
|
throw new TypeError(
|
|
499
|
-
`[sarmal] setRenderOptions: skeletonColor must be a 6-digit hex string or "transparent", got ${JSON.stringify(value)}
|
|
482
|
+
`[sarmal] setRenderOptions: skeletonColor must be a 6-digit hex string or "transparent", got ${JSON.stringify(value)}`
|
|
500
483
|
);
|
|
501
484
|
}
|
|
502
485
|
}
|
|
503
486
|
function assertTrailStyle(value) {
|
|
504
487
|
if (!TRAIL_STYLES.includes(value)) {
|
|
505
488
|
throw new RangeError(
|
|
506
|
-
`[sarmal] setRenderOptions: trailStyle must be one of "default", "gradient-static", "gradient-animated", got ${JSON.stringify(value)}
|
|
489
|
+
`[sarmal] setRenderOptions: trailStyle must be one of "default", "gradient-static", "gradient-animated", got ${JSON.stringify(value)}`
|
|
507
490
|
);
|
|
508
491
|
}
|
|
509
492
|
}
|
|
510
493
|
function assertHeadRadius(value) {
|
|
511
494
|
if (typeof value !== "number") {
|
|
512
495
|
throw new TypeError(
|
|
513
|
-
`[sarmal] setRenderOptions: headRadius must be a number, got ${JSON.stringify(value)}
|
|
496
|
+
`[sarmal] setRenderOptions: headRadius must be a number, got ${JSON.stringify(value)}`
|
|
514
497
|
);
|
|
515
498
|
}
|
|
516
499
|
if (!Number.isFinite(value) || value <= 0) {
|
|
517
500
|
throw new TypeError(
|
|
518
|
-
`[sarmal] setRenderOptions: headRadius must be a finite positive number, got ${value}
|
|
501
|
+
`[sarmal] setRenderOptions: headRadius must be a finite positive number, got ${value}`
|
|
519
502
|
);
|
|
520
503
|
}
|
|
521
504
|
}
|
|
@@ -537,13 +520,13 @@ function resolveHeadColor(trailColor, trailStyle) {
|
|
|
537
520
|
function warnIfTrailColorMismatch(trailColor, trailStyle) {
|
|
538
521
|
if (trailStyle === "default" && Array.isArray(trailColor)) {
|
|
539
522
|
console.warn(
|
|
540
|
-
'[sarmal] trailColor is an array but trailStyle is "default"; only the first color will be used. Pass a gradient trailStyle to use the whole palette.'
|
|
523
|
+
'[sarmal] trailColor is an array but trailStyle is "default"; only the first color will be used. Pass a gradient trailStyle to use the whole palette.'
|
|
541
524
|
);
|
|
542
525
|
return;
|
|
543
526
|
}
|
|
544
527
|
if (trailStyle !== "default" && typeof trailColor === "string") {
|
|
545
528
|
console.warn(
|
|
546
|
-
`[sarmal] trailColor is a single color but trailStyle is "${trailStyle}"; the trail will render as a solid color. Pass an array of hex colors to use a real gradient
|
|
529
|
+
`[sarmal] trailColor is a single color but trailStyle is "${trailStyle}"; the trail will render as a solid color. Pass an array of hex colors to use a real gradient.`
|
|
547
530
|
);
|
|
548
531
|
}
|
|
549
532
|
}
|
|
@@ -553,7 +536,7 @@ var getHeadDotRadius = (w, h) => Math.max(1, 3 * Math.sqrt(Math.min(w, h) / 160)
|
|
|
553
536
|
var WHITE_HEX = "#ffffff";
|
|
554
537
|
function hexToRgbComponents(hex) {
|
|
555
538
|
const n = parseInt(hex.slice(1), 16);
|
|
556
|
-
return `${n >> 16},${
|
|
539
|
+
return `${n >> 16},${n >> 8 & 255},${n & 255}`;
|
|
557
540
|
}
|
|
558
541
|
function applyDprSizing(target, logicalWidth, logicalHeight, dpr) {
|
|
559
542
|
target.style.width = `${logicalWidth}px`;
|
|
@@ -680,7 +663,7 @@ function createRenderer(options) {
|
|
|
680
663
|
i,
|
|
681
664
|
trailCount,
|
|
682
665
|
toX,
|
|
683
|
-
toY
|
|
666
|
+
toY
|
|
684
667
|
);
|
|
685
668
|
if (trailStyle === "default") {
|
|
686
669
|
ctx.fillStyle = `rgba(${trailSolidRgb},${opacity})`;
|
|
@@ -760,8 +743,8 @@ function createRenderer(options) {
|
|
|
760
743
|
if (!engine.isLiveSkeleton) {
|
|
761
744
|
buildSkeletonCanvas();
|
|
762
745
|
}
|
|
763
|
-
if (options.
|
|
764
|
-
engine.seek(options.
|
|
746
|
+
if (options.initialPhase !== void 0) {
|
|
747
|
+
engine.seek(options.initialPhase);
|
|
765
748
|
}
|
|
766
749
|
renderFrame(0);
|
|
767
750
|
const shouldAutoStart = options.autoStart !== false;
|
|
@@ -845,7 +828,7 @@ function createRenderer(options) {
|
|
|
845
828
|
if (partial.trailColor !== void 0 || partial.trailStyle !== void 0) {
|
|
846
829
|
warnIfTrailColorMismatch(trailColor, trailStyle);
|
|
847
830
|
}
|
|
848
|
-
}
|
|
831
|
+
}
|
|
849
832
|
};
|
|
850
833
|
const pauseOnHidden = options.pauseOnHidden !== false;
|
|
851
834
|
function handleVisibilityChange() {
|
|
@@ -895,8 +878,8 @@ function sampleCurveSkeleton(curveDef) {
|
|
|
895
878
|
const samples = Math.ceil(period * 50);
|
|
896
879
|
const pts = Array.from({ length: samples });
|
|
897
880
|
for (let i = 0; i < samples; i++) {
|
|
898
|
-
const
|
|
899
|
-
pts[i] = curveDef.skeletonFn ? curveDef.skeletonFn(
|
|
881
|
+
const phase = i / (samples - 1) * period;
|
|
882
|
+
pts[i] = curveDef.skeletonFn ? curveDef.skeletonFn(phase) : curveDef.fn(phase, 0, EMPTY_PARAMS2);
|
|
900
883
|
}
|
|
901
884
|
return pts;
|
|
902
885
|
}
|
|
@@ -908,7 +891,7 @@ function createSVGRenderer(options) {
|
|
|
908
891
|
const poolSize = engine.trailLength;
|
|
909
892
|
if (poolSize > HIGH_TRAIL_LENGTH_THRESHOLD) {
|
|
910
893
|
console.warn(
|
|
911
|
-
`[sarmal] High trailLength in SVG renderer (${poolSize}). Consider using the canvas renderer for long trails
|
|
894
|
+
`[sarmal] High trailLength in SVG renderer (${poolSize}). Consider using the canvas renderer for long trails.`
|
|
912
895
|
);
|
|
913
896
|
}
|
|
914
897
|
let trailStyle = options.trailStyle ?? "default";
|
|
@@ -927,9 +910,9 @@ function createSVGRenderer(options) {
|
|
|
927
910
|
return rect.width && rect.height ? Math.min(rect.width, rect.height) : 200;
|
|
928
911
|
}
|
|
929
912
|
const containerPx = getContainerPixelSize();
|
|
930
|
-
const svgTrailMinWidth =
|
|
931
|
-
const svgTrailMaxWidth =
|
|
932
|
-
const svgSkeletonStrokeWidth = String(
|
|
913
|
+
const svgTrailMinWidth = TRAIL_MIN_WIDTH * viewSize / containerPx;
|
|
914
|
+
const svgTrailMaxWidth = TRAIL_MAX_WIDTH * viewSize / containerPx;
|
|
915
|
+
const svgSkeletonStrokeWidth = String(SKELETON_STROKE_WIDTH_PX * viewSize / containerPx);
|
|
933
916
|
headRadius = options.headRadius ?? SVG_DEFAULT_HEAD_RADIUS;
|
|
934
917
|
container.setAttribute("viewBox", `0 0 ${viewSize} ${viewSize}`);
|
|
935
918
|
container.setAttribute("role", "img");
|
|
@@ -1017,7 +1000,7 @@ function createSVGRenderer(options) {
|
|
|
1017
1000
|
px,
|
|
1018
1001
|
py,
|
|
1019
1002
|
svgTrailMinWidth,
|
|
1020
|
-
svgTrailMaxWidth
|
|
1003
|
+
svgTrailMaxWidth
|
|
1021
1004
|
);
|
|
1022
1005
|
const d = `M${l0x.toFixed(2)} ${l0y.toFixed(2)} L${l1x.toFixed(2)} ${l1y.toFixed(2)} L${r1x.toFixed(2)} ${r1y.toFixed(2)} L${r0x.toFixed(2)} ${r0y.toFixed(2)} Z`;
|
|
1023
1006
|
trailPaths[i].setAttribute("d", d);
|
|
@@ -1045,8 +1028,7 @@ function createSVGRenderer(options) {
|
|
|
1045
1028
|
let animationId = null;
|
|
1046
1029
|
let lastTime = 0;
|
|
1047
1030
|
let pausedByVisibility = false;
|
|
1048
|
-
const prefersReducedMotion =
|
|
1049
|
-
typeof window !== "undefined" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
|
1031
|
+
const prefersReducedMotion = typeof window !== "undefined" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
|
1050
1032
|
let morphResolve = null;
|
|
1051
1033
|
let morphReject = null;
|
|
1052
1034
|
let morphDurationMs = DEFAULT_MORPH_DURATION_MS;
|
|
@@ -1064,7 +1046,7 @@ function createSVGRenderer(options) {
|
|
|
1064
1046
|
skeletonPathA.setAttribute("visibility", "visible");
|
|
1065
1047
|
skeletonPathA.setAttribute(
|
|
1066
1048
|
"stroke-opacity",
|
|
1067
|
-
String((1 - morphAlpha) * DEFAULT_SKELETON_OPACITY)
|
|
1049
|
+
String((1 - morphAlpha) * DEFAULT_SKELETON_OPACITY)
|
|
1068
1050
|
);
|
|
1069
1051
|
}
|
|
1070
1052
|
if (morphPathBBuilt) {
|
|
@@ -1107,8 +1089,8 @@ function createSVGRenderer(options) {
|
|
|
1107
1089
|
animationId = requestAnimationFrame(loop);
|
|
1108
1090
|
}
|
|
1109
1091
|
}
|
|
1110
|
-
if (options.
|
|
1111
|
-
engine.seek(options.
|
|
1092
|
+
if (options.initialPhase !== void 0) {
|
|
1093
|
+
engine.seek(options.initialPhase);
|
|
1112
1094
|
}
|
|
1113
1095
|
renderFrame(0);
|
|
1114
1096
|
const shouldAutoStart = options.autoStart !== false;
|
|
@@ -1218,7 +1200,7 @@ function createSVGRenderer(options) {
|
|
|
1218
1200
|
if (partial.trailColor !== void 0 || partial.trailStyle !== void 0) {
|
|
1219
1201
|
warnIfTrailColorMismatch(trailColor, trailStyle);
|
|
1220
1202
|
}
|
|
1221
|
-
}
|
|
1203
|
+
}
|
|
1222
1204
|
};
|
|
1223
1205
|
const pauseOnHidden = options.pauseOnHidden !== false;
|
|
1224
1206
|
function handleVisibilityChange() {
|
|
@@ -1256,15 +1238,9 @@ var PERIOD = 2 * Math.PI;
|
|
|
1256
1238
|
function catmullRom1D(p0, p1, p2, p3, u) {
|
|
1257
1239
|
const u2 = u * u;
|
|
1258
1240
|
const u3 = u2 * u;
|
|
1259
|
-
return (
|
|
1260
|
-
0.5 *
|
|
1261
|
-
(2 * p1 +
|
|
1262
|
-
(-p0 + p2) * u +
|
|
1263
|
-
(2 * p0 - 5 * p1 + 4 * p2 - p3) * u2 +
|
|
1264
|
-
(-p0 + 3 * p1 - 3 * p2 + p3) * u3)
|
|
1265
|
-
);
|
|
1241
|
+
return 0.5 * (2 * p1 + (-p0 + p2) * u + (2 * p0 - 5 * p1 + 4 * p2 - p3) * u2 + (-p0 + 3 * p1 - 3 * p2 + p3) * u3);
|
|
1266
1242
|
}
|
|
1267
|
-
function evaluateCatmullRom(points2,
|
|
1243
|
+
function evaluateCatmullRom(points2, phase) {
|
|
1268
1244
|
const N = points2.length;
|
|
1269
1245
|
if (N === 0) {
|
|
1270
1246
|
return { x: 0, y: 0 };
|
|
@@ -1272,13 +1248,13 @@ function evaluateCatmullRom(points2, t) {
|
|
|
1272
1248
|
if (N === 1) {
|
|
1273
1249
|
return { x: points2[0][0], y: points2[0][1] };
|
|
1274
1250
|
}
|
|
1275
|
-
|
|
1251
|
+
phase = (phase % PERIOD + PERIOD) % PERIOD;
|
|
1276
1252
|
const segmentSize = PERIOD / N;
|
|
1277
|
-
let i = Math.floor(
|
|
1253
|
+
let i = Math.floor(phase / segmentSize);
|
|
1278
1254
|
if (i >= N) {
|
|
1279
1255
|
i = N - 1;
|
|
1280
1256
|
}
|
|
1281
|
-
let u = (
|
|
1257
|
+
let u = (phase - i * segmentSize) / segmentSize;
|
|
1282
1258
|
u = Math.max(0, Math.min(1, u));
|
|
1283
1259
|
const p0 = points2[(i - 1 + N) % N];
|
|
1284
1260
|
const p1 = points2[i];
|
|
@@ -1286,7 +1262,7 @@ function evaluateCatmullRom(points2, t) {
|
|
|
1286
1262
|
const p3 = points2[(i + 2) % N];
|
|
1287
1263
|
return {
|
|
1288
1264
|
x: catmullRom1D(p0[0], p1[0], p2[0], p3[0], u),
|
|
1289
|
-
y: catmullRom1D(p0[1], p1[1], p2[1], p3[1], u)
|
|
1265
|
+
y: catmullRom1D(p0[1], p1[1], p2[1], p3[1], u)
|
|
1290
1266
|
};
|
|
1291
1267
|
}
|
|
1292
1268
|
function drawCurve(points2, opts) {
|
|
@@ -1296,20 +1272,20 @@ function drawCurve(points2, opts) {
|
|
|
1296
1272
|
const first = points2[0];
|
|
1297
1273
|
if (points2.every((p) => p[0] === first[0] && p[1] === first[1])) {
|
|
1298
1274
|
console.warn(
|
|
1299
|
-
"[sarmal].drawCurve: all control points are identical. The curve will be a single point."
|
|
1275
|
+
"[sarmal].drawCurve: all control points are identical. The curve will be a single point."
|
|
1300
1276
|
);
|
|
1301
1277
|
}
|
|
1302
1278
|
const maxAbs = points2.reduce((m, p) => Math.max(m, Math.abs(p[0]), Math.abs(p[1])), 0);
|
|
1303
1279
|
if (maxAbs > 2) {
|
|
1304
1280
|
console.warn(
|
|
1305
|
-
`[sarmal].drawCurve: control points extend to \xB1${maxAbs.toFixed(1)}, which may render off-screen. Coordinates should be in [-1, 1]
|
|
1281
|
+
`[sarmal].drawCurve: control points extend to \xB1${maxAbs.toFixed(1)}, which may render off-screen. Coordinates should be in [-1, 1].`
|
|
1306
1282
|
);
|
|
1307
1283
|
}
|
|
1308
1284
|
const pts = points2.map(([x, y]) => [x, y]);
|
|
1309
1285
|
return {
|
|
1310
1286
|
name: opts?.name ?? "drawn",
|
|
1311
|
-
fn: (
|
|
1312
|
-
period: PERIOD
|
|
1287
|
+
fn: (phase) => evaluateCatmullRom(pts, phase),
|
|
1288
|
+
period: PERIOD
|
|
1313
1289
|
};
|
|
1314
1290
|
}
|
|
1315
1291
|
|
|
@@ -1335,74 +1311,74 @@ var points = [
|
|
|
1335
1311
|
[-0.69, -0.84],
|
|
1336
1312
|
[-0.87, -0.66],
|
|
1337
1313
|
[-0.9, -0.47],
|
|
1338
|
-
[-0.76, -0.35]
|
|
1314
|
+
[-0.76, -0.35]
|
|
1339
1315
|
];
|
|
1340
1316
|
var artemis2 = {
|
|
1341
1317
|
...drawCurve(points, { name: "Artemis II" }),
|
|
1342
|
-
speed: 0.7
|
|
1318
|
+
speed: 0.7
|
|
1343
1319
|
};
|
|
1344
1320
|
|
|
1345
1321
|
// src/curves/astroid.ts
|
|
1346
1322
|
var TWO_PI2 = Math.PI * 2;
|
|
1347
|
-
function astroidFn(
|
|
1348
|
-
const c = Math.cos(
|
|
1349
|
-
const s = Math.sin(
|
|
1323
|
+
function astroidFn(phase, _elapsed, _params) {
|
|
1324
|
+
const c = Math.cos(phase);
|
|
1325
|
+
const s = Math.sin(phase);
|
|
1350
1326
|
return {
|
|
1351
1327
|
x: c * c * c,
|
|
1352
|
-
y: s * s * s
|
|
1328
|
+
y: s * s * s
|
|
1353
1329
|
};
|
|
1354
1330
|
}
|
|
1355
1331
|
var astroid = {
|
|
1356
1332
|
name: "Astroid",
|
|
1357
1333
|
fn: astroidFn,
|
|
1358
1334
|
period: TWO_PI2,
|
|
1359
|
-
speed: 1.1
|
|
1335
|
+
speed: 1.1
|
|
1360
1336
|
};
|
|
1361
1337
|
|
|
1362
1338
|
// src/curves/deltoid.ts
|
|
1363
1339
|
var TWO_PI3 = Math.PI * 2;
|
|
1364
|
-
function deltoidFn(
|
|
1340
|
+
function deltoidFn(phase, _elapsed, _params) {
|
|
1365
1341
|
return {
|
|
1366
|
-
x: 2 * Math.cos(
|
|
1367
|
-
y: 2 * Math.sin(
|
|
1342
|
+
x: 2 * Math.cos(phase) + Math.cos(2 * phase),
|
|
1343
|
+
y: 2 * Math.sin(phase) - Math.sin(2 * phase)
|
|
1368
1344
|
};
|
|
1369
1345
|
}
|
|
1370
1346
|
var deltoid = {
|
|
1371
1347
|
name: "Deltoid",
|
|
1372
1348
|
fn: deltoidFn,
|
|
1373
1349
|
period: TWO_PI3,
|
|
1374
|
-
speed: 0.9
|
|
1350
|
+
speed: 0.9
|
|
1375
1351
|
};
|
|
1376
1352
|
|
|
1377
1353
|
// src/curves/epicycloid3.ts
|
|
1378
1354
|
var TWO_PI4 = Math.PI * 2;
|
|
1379
|
-
function epicycloid3Fn(
|
|
1355
|
+
function epicycloid3Fn(phase, _elapsed, _params) {
|
|
1380
1356
|
return {
|
|
1381
|
-
x: 4 * Math.cos(
|
|
1382
|
-
y: 4 * Math.sin(
|
|
1357
|
+
x: 4 * Math.cos(phase) - Math.cos(4 * phase),
|
|
1358
|
+
y: 4 * Math.sin(phase) - Math.sin(4 * phase)
|
|
1383
1359
|
};
|
|
1384
1360
|
}
|
|
1385
1361
|
var epicycloid3 = {
|
|
1386
1362
|
name: "Epicycloid (n=3)",
|
|
1387
1363
|
fn: epicycloid3Fn,
|
|
1388
1364
|
period: TWO_PI4,
|
|
1389
|
-
speed: 0.75
|
|
1365
|
+
speed: 0.75
|
|
1390
1366
|
};
|
|
1391
1367
|
|
|
1392
1368
|
// src/curves/epitrochoid7.ts
|
|
1393
1369
|
var TWO_PI5 = Math.PI * 2;
|
|
1394
|
-
function epitrochoid7Fn(
|
|
1395
|
-
const d = 1 + 0.55 * Math.sin(
|
|
1370
|
+
function epitrochoid7Fn(phase, _elapsed, _params) {
|
|
1371
|
+
const d = 1 + 0.55 * Math.sin(phase * 0.5);
|
|
1396
1372
|
return {
|
|
1397
|
-
x: 7 * Math.cos(
|
|
1398
|
-
y: 7 * Math.sin(
|
|
1373
|
+
x: 7 * Math.cos(phase) - d * Math.cos(7 * phase),
|
|
1374
|
+
y: 7 * Math.sin(phase) - d * Math.sin(7 * phase)
|
|
1399
1375
|
};
|
|
1400
1376
|
}
|
|
1401
|
-
function epitrochoid7SkeletonFn(
|
|
1377
|
+
function epitrochoid7SkeletonFn(phase) {
|
|
1402
1378
|
const d = 1.275;
|
|
1403
1379
|
return {
|
|
1404
|
-
x: 7 * Math.cos(
|
|
1405
|
-
y: 7 * Math.sin(
|
|
1380
|
+
x: 7 * Math.cos(phase) - d * Math.cos(7 * phase),
|
|
1381
|
+
y: 7 * Math.sin(phase) - d * Math.sin(7 * phase)
|
|
1406
1382
|
};
|
|
1407
1383
|
}
|
|
1408
1384
|
var epitrochoid7 = {
|
|
@@ -1410,16 +1386,16 @@ var epitrochoid7 = {
|
|
|
1410
1386
|
fn: epitrochoid7Fn,
|
|
1411
1387
|
period: TWO_PI5,
|
|
1412
1388
|
speed: 1.4,
|
|
1413
|
-
skeletonFn: epitrochoid7SkeletonFn
|
|
1389
|
+
skeletonFn: epitrochoid7SkeletonFn
|
|
1414
1390
|
};
|
|
1415
1391
|
|
|
1416
1392
|
// src/curves/lissajous32.ts
|
|
1417
1393
|
var TWO_PI6 = Math.PI * 2;
|
|
1418
|
-
function lissajous32Fn(
|
|
1419
|
-
const phi =
|
|
1394
|
+
function lissajous32Fn(phase, elapsed, _params) {
|
|
1395
|
+
const phi = elapsed * 0.45;
|
|
1420
1396
|
return {
|
|
1421
|
-
x: Math.sin(3 *
|
|
1422
|
-
y: Math.sin(2 *
|
|
1397
|
+
x: Math.sin(3 * phase + phi),
|
|
1398
|
+
y: Math.sin(2 * phase)
|
|
1423
1399
|
};
|
|
1424
1400
|
}
|
|
1425
1401
|
var lissajous32 = {
|
|
@@ -1427,16 +1403,16 @@ var lissajous32 = {
|
|
|
1427
1403
|
fn: lissajous32Fn,
|
|
1428
1404
|
period: TWO_PI6,
|
|
1429
1405
|
speed: 2,
|
|
1430
|
-
skeleton: "live"
|
|
1406
|
+
skeleton: "live"
|
|
1431
1407
|
};
|
|
1432
1408
|
|
|
1433
1409
|
// src/curves/lissajous43.ts
|
|
1434
1410
|
var TWO_PI7 = Math.PI * 2;
|
|
1435
|
-
function lissajous43Fn(
|
|
1436
|
-
const phi =
|
|
1411
|
+
function lissajous43Fn(phase, elapsed, _params) {
|
|
1412
|
+
const phi = elapsed * 0.38;
|
|
1437
1413
|
return {
|
|
1438
|
-
x: Math.sin(4 *
|
|
1439
|
-
y: Math.sin(3 *
|
|
1414
|
+
x: Math.sin(4 * phase + phi),
|
|
1415
|
+
y: Math.sin(3 * phase)
|
|
1440
1416
|
};
|
|
1441
1417
|
}
|
|
1442
1418
|
var lissajous43 = {
|
|
@@ -1444,18 +1420,17 @@ var lissajous43 = {
|
|
|
1444
1420
|
fn: lissajous43Fn,
|
|
1445
1421
|
period: TWO_PI7,
|
|
1446
1422
|
speed: 1.8,
|
|
1447
|
-
skeleton: "live"
|
|
1423
|
+
skeleton: "live"
|
|
1448
1424
|
};
|
|
1449
1425
|
|
|
1450
1426
|
// src/curves/lame.ts
|
|
1451
1427
|
var TWO_PI8 = Math.PI * 2;
|
|
1452
|
-
function lameFn(
|
|
1453
|
-
const p = 1.75 + 1.25 * Math.sin(
|
|
1454
|
-
const c = Math.cos(
|
|
1455
|
-
s = Math.sin(t);
|
|
1428
|
+
function lameFn(phase, elapsed, _params) {
|
|
1429
|
+
const p = 1.75 + 1.25 * Math.sin(elapsed * 0.48);
|
|
1430
|
+
const c = Math.cos(phase), s = Math.sin(phase);
|
|
1456
1431
|
return {
|
|
1457
1432
|
x: Math.sign(c) * Math.pow(Math.abs(c), p),
|
|
1458
|
-
y: Math.sign(s) * Math.pow(Math.abs(s), p)
|
|
1433
|
+
y: Math.sign(s) * Math.pow(Math.abs(s), p)
|
|
1459
1434
|
};
|
|
1460
1435
|
}
|
|
1461
1436
|
var lame = {
|
|
@@ -1463,112 +1438,103 @@ var lame = {
|
|
|
1463
1438
|
fn: lameFn,
|
|
1464
1439
|
period: TWO_PI8,
|
|
1465
1440
|
speed: 1,
|
|
1466
|
-
skeleton: "live"
|
|
1441
|
+
skeleton: "live"
|
|
1467
1442
|
};
|
|
1468
1443
|
|
|
1469
1444
|
// src/curves/rose3.ts
|
|
1470
1445
|
var TWO_PI9 = Math.PI * 2;
|
|
1471
|
-
function rose3Fn(
|
|
1472
|
-
const r = Math.cos(3 *
|
|
1446
|
+
function rose3Fn(phase, _elapsed, _params) {
|
|
1447
|
+
const r = Math.cos(3 * phase);
|
|
1473
1448
|
return {
|
|
1474
|
-
x: r * Math.cos(
|
|
1475
|
-
y: r * Math.sin(
|
|
1449
|
+
x: r * Math.cos(phase),
|
|
1450
|
+
y: r * Math.sin(phase)
|
|
1476
1451
|
};
|
|
1477
1452
|
}
|
|
1478
1453
|
var rose3 = {
|
|
1479
1454
|
name: "Rose (n=3)",
|
|
1480
1455
|
fn: rose3Fn,
|
|
1481
1456
|
period: TWO_PI9,
|
|
1482
|
-
speed: 1.15
|
|
1457
|
+
speed: 1.15
|
|
1483
1458
|
};
|
|
1484
1459
|
|
|
1485
1460
|
// src/curves/rose5.ts
|
|
1486
1461
|
var TWO_PI10 = Math.PI * 2;
|
|
1487
|
-
function rose5Fn(
|
|
1488
|
-
const r = Math.cos(5 *
|
|
1462
|
+
function rose5Fn(phase, _elapsed, _params) {
|
|
1463
|
+
const r = Math.cos(5 * phase);
|
|
1489
1464
|
return {
|
|
1490
|
-
x: r * Math.cos(
|
|
1491
|
-
y: r * Math.sin(
|
|
1465
|
+
x: r * Math.cos(phase),
|
|
1466
|
+
y: r * Math.sin(phase)
|
|
1492
1467
|
};
|
|
1493
1468
|
}
|
|
1494
1469
|
var rose5 = {
|
|
1495
1470
|
name: "Rose (n=5)",
|
|
1496
1471
|
fn: rose5Fn,
|
|
1497
1472
|
period: TWO_PI10,
|
|
1498
|
-
speed: 1
|
|
1473
|
+
speed: 1
|
|
1499
1474
|
};
|
|
1500
1475
|
|
|
1501
1476
|
// src/curves/rose52.ts
|
|
1502
1477
|
var FOUR_PI = Math.PI * 4;
|
|
1503
|
-
function rose52Fn(
|
|
1504
|
-
const r = Math.cos(
|
|
1478
|
+
function rose52Fn(phase, _elapsed, _params) {
|
|
1479
|
+
const r = Math.cos(5 / 2 * phase);
|
|
1505
1480
|
return {
|
|
1506
|
-
x: r * Math.cos(
|
|
1507
|
-
y: r * Math.sin(
|
|
1481
|
+
x: r * Math.cos(phase),
|
|
1482
|
+
y: r * Math.sin(phase)
|
|
1508
1483
|
};
|
|
1509
1484
|
}
|
|
1510
1485
|
var rose52 = {
|
|
1511
1486
|
name: "Rose (n=5/2)",
|
|
1512
1487
|
fn: rose52Fn,
|
|
1513
1488
|
period: FOUR_PI,
|
|
1514
|
-
speed: 0.8
|
|
1489
|
+
speed: 0.8
|
|
1515
1490
|
};
|
|
1516
1491
|
|
|
1517
1492
|
// src/curves/star.ts
|
|
1518
1493
|
var TWO_PI11 = Math.PI * 2;
|
|
1519
|
-
function starFn(
|
|
1520
|
-
const r =
|
|
1521
|
-
Math.abs(Math.cos((5 / 2) * t)) +
|
|
1522
|
-
0.35 * Math.abs(Math.cos((15 / 2) * t)) +
|
|
1523
|
-
0.15 * Math.abs(Math.cos((25 / 2) * t));
|
|
1494
|
+
function starFn(phase, _elapsed, _params) {
|
|
1495
|
+
const r = Math.abs(Math.cos(5 / 2 * phase)) + 0.35 * Math.abs(Math.cos(15 / 2 * phase)) + 0.15 * Math.abs(Math.cos(25 / 2 * phase));
|
|
1524
1496
|
return {
|
|
1525
|
-
x: r * Math.cos(
|
|
1526
|
-
y: r * Math.sin(
|
|
1497
|
+
x: r * Math.cos(phase),
|
|
1498
|
+
y: r * Math.sin(phase)
|
|
1527
1499
|
};
|
|
1528
1500
|
}
|
|
1529
1501
|
var star = {
|
|
1530
1502
|
name: "Star",
|
|
1531
1503
|
fn: starFn,
|
|
1532
1504
|
period: TWO_PI11,
|
|
1533
|
-
speed: 1
|
|
1505
|
+
speed: 1
|
|
1534
1506
|
};
|
|
1535
1507
|
|
|
1536
1508
|
// src/curves/star4.ts
|
|
1537
1509
|
var TWO_PI12 = Math.PI * 2;
|
|
1538
|
-
function star4Fn(
|
|
1539
|
-
const r =
|
|
1540
|
-
Math.abs(Math.cos(2 * t)) +
|
|
1541
|
-
0.35 * Math.abs(Math.cos(6 * t)) +
|
|
1542
|
-
0.15 * Math.abs(Math.cos(10 * t));
|
|
1510
|
+
function star4Fn(phase, _elapsed, _params) {
|
|
1511
|
+
const r = Math.abs(Math.cos(2 * phase)) + 0.35 * Math.abs(Math.cos(6 * phase)) + 0.15 * Math.abs(Math.cos(10 * phase));
|
|
1543
1512
|
return {
|
|
1544
|
-
x: r * Math.cos(
|
|
1545
|
-
y: r * Math.sin(
|
|
1513
|
+
x: r * Math.cos(phase),
|
|
1514
|
+
y: r * Math.sin(phase)
|
|
1546
1515
|
};
|
|
1547
1516
|
}
|
|
1548
1517
|
var star4 = {
|
|
1549
1518
|
name: "Star (4-arm)",
|
|
1550
1519
|
fn: star4Fn,
|
|
1551
1520
|
period: TWO_PI12,
|
|
1552
|
-
speed: 1
|
|
1521
|
+
speed: 1
|
|
1553
1522
|
};
|
|
1554
1523
|
|
|
1555
1524
|
// src/curves/star7.ts
|
|
1556
1525
|
var TWO_PI13 = Math.PI * 2;
|
|
1557
|
-
function star7Fn(
|
|
1558
|
-
const r =
|
|
1559
|
-
Math.abs(Math.cos((7 / 2) * t)) +
|
|
1560
|
-
0.35 * Math.abs(Math.cos((21 / 2) * t)) +
|
|
1561
|
-
0.15 * Math.abs(Math.cos((35 / 2) * t));
|
|
1526
|
+
function star7Fn(phase, _elapsed, _params) {
|
|
1527
|
+
const r = Math.abs(Math.cos(7 / 2 * phase)) + 0.35 * Math.abs(Math.cos(21 / 2 * phase)) + 0.15 * Math.abs(Math.cos(35 / 2 * phase));
|
|
1562
1528
|
return {
|
|
1563
|
-
x: r * Math.cos(
|
|
1564
|
-
y: r * Math.sin(
|
|
1529
|
+
x: r * Math.cos(phase),
|
|
1530
|
+
y: r * Math.sin(phase)
|
|
1565
1531
|
};
|
|
1566
1532
|
}
|
|
1567
1533
|
var star7 = {
|
|
1568
1534
|
name: "Star (7-arm)",
|
|
1569
1535
|
fn: star7Fn,
|
|
1570
1536
|
period: TWO_PI13,
|
|
1571
|
-
speed: 1
|
|
1537
|
+
speed: 1
|
|
1572
1538
|
};
|
|
1573
1539
|
|
|
1574
1540
|
// src/curves/index.ts
|
|
@@ -1586,7 +1552,7 @@ var curves = {
|
|
|
1586
1552
|
lissajous32,
|
|
1587
1553
|
lissajous43,
|
|
1588
1554
|
epicycloid3,
|
|
1589
|
-
lame
|
|
1555
|
+
lame
|
|
1590
1556
|
};
|
|
1591
1557
|
|
|
1592
1558
|
// src/index.ts
|
|
@@ -1596,27 +1562,6 @@ function createSarmal(canvas, curveDef, options) {
|
|
|
1596
1562
|
return createRenderer({ canvas, engine, ...rendererOpts });
|
|
1597
1563
|
}
|
|
1598
1564
|
|
|
1599
|
-
export {
|
|
1600
|
-
artemis2,
|
|
1601
|
-
astroid,
|
|
1602
|
-
computeBoundaries,
|
|
1603
|
-
createEngine,
|
|
1604
|
-
createRenderer,
|
|
1605
|
-
createSVGRenderer,
|
|
1606
|
-
createSarmal,
|
|
1607
|
-
createSarmalSVG,
|
|
1608
|
-
curves,
|
|
1609
|
-
deltoid,
|
|
1610
|
-
drawCurve,
|
|
1611
|
-
epicycloid3,
|
|
1612
|
-
epitrochoid7,
|
|
1613
|
-
evaluateCatmullRom,
|
|
1614
|
-
lame,
|
|
1615
|
-
lissajous32,
|
|
1616
|
-
lissajous43,
|
|
1617
|
-
palettes,
|
|
1618
|
-
rose3,
|
|
1619
|
-
rose5,
|
|
1620
|
-
};
|
|
1621
|
-
//# sourceMappingURL=index.js.map
|
|
1565
|
+
export { artemis2, astroid, computeBoundaries, createEngine, createRenderer, createSVGRenderer, createSarmal, createSarmalSVG, curves, deltoid, drawCurve, epicycloid3, epitrochoid7, evaluateCatmullRom, lame, lissajous32, lissajous43, palettes, rose3, rose5 };
|
|
1622
1566
|
//# sourceMappingURL=index.js.map
|
|
1567
|
+
//# sourceMappingURL=index.js.map
|