@sarmal/core 0.25.0 → 0.25.1
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 +140 -105
- package/dist/auto-init.cjs.map +1 -1
- package/dist/auto-init.js +139 -104
- package/dist/auto-init.js.map +1 -1
- package/dist/curves/artemis2.cjs +15 -10
- 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 +14 -9
- package/dist/curves/artemis2.js.map +1 -1
- package/dist/curves/astroid.cjs +4 -4
- package/dist/curves/astroid.d.cts +1 -1
- package/dist/curves/astroid.d.ts +1 -1
- package/dist/curves/astroid.js +3 -3
- package/dist/curves/deltoid.cjs +4 -4
- package/dist/curves/deltoid.d.cts +1 -1
- package/dist/curves/deltoid.d.ts +1 -1
- package/dist/curves/deltoid.js +3 -3
- package/dist/curves/epicycloid3.cjs +4 -4
- package/dist/curves/epicycloid3.d.cts +1 -1
- package/dist/curves/epicycloid3.d.ts +1 -1
- package/dist/curves/epicycloid3.js +3 -3
- package/dist/curves/epitrochoid7.cjs +5 -5
- package/dist/curves/epitrochoid7.d.cts +1 -1
- package/dist/curves/epitrochoid7.d.ts +1 -1
- package/dist/curves/epitrochoid7.js +4 -4
- package/dist/curves/index.cjs +58 -43
- 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 +74 -43
- package/dist/curves/index.js.map +1 -1
- package/dist/curves/lame.cjs +6 -5
- package/dist/curves/lame.d.cts +1 -1
- package/dist/curves/lame.d.ts +1 -1
- package/dist/curves/lame.js +5 -4
- package/dist/curves/lissajous32.cjs +4 -4
- package/dist/curves/lissajous32.d.cts +1 -1
- package/dist/curves/lissajous32.d.ts +1 -1
- package/dist/curves/lissajous32.js +3 -3
- package/dist/curves/lissajous43.cjs +4 -4
- package/dist/curves/lissajous43.d.cts +1 -1
- package/dist/curves/lissajous43.d.ts +1 -1
- package/dist/curves/lissajous43.js +3 -3
- package/dist/curves/rose3.cjs +4 -4
- package/dist/curves/rose3.d.cts +1 -1
- package/dist/curves/rose3.d.ts +1 -1
- package/dist/curves/rose3.js +3 -3
- package/dist/curves/rose5.cjs +4 -4
- package/dist/curves/rose5.d.cts +1 -1
- package/dist/curves/rose5.d.ts +1 -1
- package/dist/curves/rose5.js +3 -3
- package/dist/curves/rose52.cjs +5 -5
- package/dist/curves/rose52.d.cts +1 -1
- package/dist/curves/rose52.d.ts +1 -1
- package/dist/curves/rose52.js +4 -4
- package/dist/curves/star.cjs +8 -5
- package/dist/curves/star.d.cts +1 -1
- package/dist/curves/star.d.ts +1 -1
- package/dist/curves/star.js +7 -4
- package/dist/curves/star4.cjs +8 -5
- package/dist/curves/star4.d.cts +1 -1
- package/dist/curves/star4.d.ts +1 -1
- package/dist/curves/star4.js +7 -4
- package/dist/curves/star7.cjs +8 -5
- package/dist/curves/star7.d.cts +1 -1
- package/dist/curves/star7.d.ts +1 -1
- package/dist/curves/star7.js +7 -4
- package/dist/index.cjs +126 -93
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +92 -40
- package/dist/index.d.ts +92 -40
- package/dist/index.js +147 -93
- package/dist/index.js.map +1 -1
- package/dist/types-Z9i1_AQZ.d.cts +339 -0
- package/dist/types-Z9i1_AQZ.d.ts +339 -0
- package/package.json +1 -1
- package/dist/types-BZpzgNau.d.cts +0 -332
- package/dist/types-BZpzgNau.d.ts +0 -332
package/dist/auto-init.js
CHANGED
|
@@ -61,13 +61,13 @@ 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);
|
|
@@ -108,7 +108,7 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
108
108
|
actualTime += deltaTime;
|
|
109
109
|
if (morphCurveB !== null && _morphAlpha !== null) {
|
|
110
110
|
const a = curve.fn(t, actualTime, EMPTY_PARAMS);
|
|
111
|
-
const tB = _morphStrategy === "normalized" ? t / curve.period * morphCurveB.period : t;
|
|
111
|
+
const tB = _morphStrategy === "normalized" ? (t / curve.period) * morphCurveB.period : t;
|
|
112
112
|
const b = morphCurveB.fn(tB, actualTime, EMPTY_PARAMS);
|
|
113
113
|
trail.push(a.x + (b.x - a.x) * _morphAlpha, a.y + (b.y - a.y) * _morphAlpha);
|
|
114
114
|
} else {
|
|
@@ -135,14 +135,14 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
135
135
|
trail.clear();
|
|
136
136
|
},
|
|
137
137
|
jump(newT, { clearTrail = false } = {}) {
|
|
138
|
-
t = (newT % curve.period + curve.period) % curve.period;
|
|
138
|
+
t = ((newT % curve.period) + curve.period) % curve.period;
|
|
139
139
|
if (clearTrail) {
|
|
140
140
|
trail.clear();
|
|
141
141
|
}
|
|
142
142
|
},
|
|
143
143
|
seek(targetT, { wrap = false, step = curve.period / trailLength } = {}) {
|
|
144
144
|
const advance = curve.speed * step;
|
|
145
|
-
const target = (targetT % curve.period + curve.period) % curve.period;
|
|
145
|
+
const target = ((targetT % curve.period) + curve.period) % curve.period;
|
|
146
146
|
const targetTime = target / curve.speed;
|
|
147
147
|
t = target;
|
|
148
148
|
actualTime = targetTime;
|
|
@@ -151,7 +151,7 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
151
151
|
const count = wrap ? trailLength : Math.min(trailLength, pointsFromStart);
|
|
152
152
|
for (let i = count - 1; i >= 0; i--) {
|
|
153
153
|
const sampleT = target - i * advance;
|
|
154
|
-
const wrappedT = (sampleT % curve.period + curve.period) % curve.period;
|
|
154
|
+
const wrappedT = ((sampleT % curve.period) + curve.period) % curve.period;
|
|
155
155
|
const time = targetTime - i * step;
|
|
156
156
|
const point = curve.fn(wrappedT, time, EMPTY_PARAMS);
|
|
157
157
|
trail.push(point.x, point.y);
|
|
@@ -168,13 +168,16 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
168
168
|
...frozenB,
|
|
169
169
|
fn: (sampleT, time, params) => {
|
|
170
170
|
const a = frozenA.fn(sampleT, time, params);
|
|
171
|
-
const tB =
|
|
171
|
+
const tB =
|
|
172
|
+
frozenStrategy === "normalized"
|
|
173
|
+
? (sampleT / frozenA.period) * frozenB.period
|
|
174
|
+
: sampleT;
|
|
172
175
|
const b = frozenB.fn(tB, time, params);
|
|
173
176
|
return {
|
|
174
177
|
x: a.x + (b.x - a.x) * frozenAlpha,
|
|
175
|
-
y: a.y + (b.y - a.y) * frozenAlpha
|
|
178
|
+
y: a.y + (b.y - a.y) * frozenAlpha,
|
|
176
179
|
};
|
|
177
|
-
}
|
|
180
|
+
},
|
|
178
181
|
};
|
|
179
182
|
}
|
|
180
183
|
_morphStrategy = strategy;
|
|
@@ -187,7 +190,7 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
187
190
|
completeMorph() {
|
|
188
191
|
if (morphCurveB !== null) {
|
|
189
192
|
if (_morphStrategy === "normalized" && curve.period !== morphCurveB.period) {
|
|
190
|
-
t = t / curve.period * morphCurveB.period;
|
|
193
|
+
t = (t / curve.period) * morphCurveB.period;
|
|
191
194
|
}
|
|
192
195
|
curve = morphCurveB;
|
|
193
196
|
}
|
|
@@ -199,19 +202,22 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
199
202
|
const points2 = new Array(steps);
|
|
200
203
|
if (morphCurveB !== null && _morphAlpha !== null) {
|
|
201
204
|
for (let i = 0; i < steps; i++) {
|
|
202
|
-
const sampleT = i / (steps - 1) * curve.period;
|
|
205
|
+
const sampleT = (i / (steps - 1)) * curve.period;
|
|
203
206
|
const a = sampleSkeleton(curve, sampleT);
|
|
204
|
-
const tB =
|
|
207
|
+
const tB =
|
|
208
|
+
_morphStrategy === "normalized"
|
|
209
|
+
? (sampleT / curve.period) * morphCurveB.period
|
|
210
|
+
: sampleT;
|
|
205
211
|
const b = sampleSkeleton(morphCurveB, tB);
|
|
206
212
|
points2[i] = {
|
|
207
213
|
x: a.x + (b.x - a.x) * _morphAlpha,
|
|
208
|
-
y: a.y + (b.y - a.y) * _morphAlpha
|
|
214
|
+
y: a.y + (b.y - a.y) * _morphAlpha,
|
|
209
215
|
};
|
|
210
216
|
}
|
|
211
217
|
return points2;
|
|
212
218
|
}
|
|
213
219
|
for (let i = 0; i < steps; i++) {
|
|
214
|
-
const sampleT = i / (steps - 1) * curve.period;
|
|
220
|
+
const sampleT = (i / (steps - 1)) * curve.period;
|
|
215
221
|
points2[i] = sampleSkeleton(curve, sampleT);
|
|
216
222
|
}
|
|
217
223
|
return points2;
|
|
@@ -253,7 +259,7 @@ function createEngine(curveDef, trailLength = 120) {
|
|
|
253
259
|
_speedTransition.reject(new Error("Speed transition cancelled"));
|
|
254
260
|
_speedTransition = null;
|
|
255
261
|
}
|
|
256
|
-
}
|
|
262
|
+
},
|
|
257
263
|
};
|
|
258
264
|
}
|
|
259
265
|
|
|
@@ -292,7 +298,15 @@ function computeNormal(trail, i) {
|
|
|
292
298
|
const tangent = computeTangent(trail, i);
|
|
293
299
|
return { x: -tangent.y, y: tangent.x };
|
|
294
300
|
}
|
|
295
|
-
function computeTrailQuad(
|
|
301
|
+
function computeTrailQuad(
|
|
302
|
+
trail,
|
|
303
|
+
i,
|
|
304
|
+
trailCount,
|
|
305
|
+
toX,
|
|
306
|
+
toY,
|
|
307
|
+
minWidth = TRAIL_MIN_WIDTH,
|
|
308
|
+
maxWidth = TRAIL_MAX_WIDTH,
|
|
309
|
+
) {
|
|
296
310
|
const progress = i / (trailCount - 1);
|
|
297
311
|
const nextProgress = (i + 1) / (trailCount - 1);
|
|
298
312
|
const opacity = Math.pow(progress, TRAIL_FADE_CURVE) * TRAIL_MAX_OPACITY;
|
|
@@ -316,13 +330,16 @@ function computeTrailQuad(trail, i, trailCount, toX, toY, minWidth = TRAIL_MIN_W
|
|
|
316
330
|
r1x: nx - n1.x * w1,
|
|
317
331
|
r1y: ny - n1.y * w1,
|
|
318
332
|
opacity,
|
|
319
|
-
progress
|
|
333
|
+
progress,
|
|
320
334
|
};
|
|
321
335
|
}
|
|
322
336
|
function computeBoundaries(pts, logicalWidth, logicalHeight, minPaddingPx = FIT_PADDING_MIN) {
|
|
323
337
|
if (pts.length === 0) return null;
|
|
324
338
|
const first = pts[0];
|
|
325
|
-
let minX = first.x,
|
|
339
|
+
let minX = first.x,
|
|
340
|
+
maxX = first.x,
|
|
341
|
+
minY = first.y,
|
|
342
|
+
maxY = first.y;
|
|
326
343
|
for (const p of pts) {
|
|
327
344
|
if (p.x < minX) {
|
|
328
345
|
minX = p.x;
|
|
@@ -341,7 +358,7 @@ function computeBoundaries(pts, logicalWidth, logicalHeight, minPaddingPx = FIT_
|
|
|
341
358
|
const h = maxY - minY;
|
|
342
359
|
if (w === 0 && h === 0) {
|
|
343
360
|
throw new Error(
|
|
344
|
-
"[sarmal] Degenerate curve: all skeleton points are identical. Check that your curve fn returns distinct points for different values of t."
|
|
361
|
+
"[sarmal] Degenerate curve: all skeleton points are identical. Check that your curve fn returns distinct points for different values of t.",
|
|
345
362
|
);
|
|
346
363
|
}
|
|
347
364
|
const scaleXProportional = logicalWidth / (w * (1 + FIT_PADDING * 2));
|
|
@@ -352,12 +369,12 @@ function computeBoundaries(pts, logicalWidth, logicalHeight, minPaddingPx = FIT_
|
|
|
352
369
|
scaleXProportional,
|
|
353
370
|
scaleYProportional,
|
|
354
371
|
scaleXMinPadding,
|
|
355
|
-
scaleYMinPadding
|
|
372
|
+
scaleYMinPadding,
|
|
356
373
|
);
|
|
357
374
|
return {
|
|
358
375
|
scale,
|
|
359
376
|
offsetX: (logicalWidth - w * scale) / 2 - minX * scale,
|
|
360
|
-
offsetY: (logicalHeight - h * scale) / 2 - minY * scale
|
|
377
|
+
offsetY: (logicalHeight - h * scale) / 2 - minY * scale,
|
|
361
378
|
};
|
|
362
379
|
}
|
|
363
380
|
function enginePassthroughs(engine) {
|
|
@@ -368,17 +385,17 @@ function enginePassthroughs(engine) {
|
|
|
368
385
|
getSpeed: engine.getSpeed,
|
|
369
386
|
resetSpeed: engine.resetSpeed,
|
|
370
387
|
setSpeedOver: engine.setSpeedOver,
|
|
371
|
-
getSarmalSkeleton: engine.getSarmalSkeleton
|
|
388
|
+
getSarmalSkeleton: engine.getSarmalSkeleton,
|
|
372
389
|
};
|
|
373
390
|
}
|
|
374
391
|
function hexToRgb(hex) {
|
|
375
392
|
const n = parseInt(hex.slice(1), 16);
|
|
376
|
-
return { r: n >> 16, g: n >> 8 & 255, b: n & 255 };
|
|
393
|
+
return { r: n >> 16, g: (n >> 8) & 255, b: n & 255 };
|
|
377
394
|
}
|
|
378
395
|
var lerpRgb = (a, b, t) => ({
|
|
379
396
|
r: Math.round(a.r + (b.r - a.r) * t),
|
|
380
397
|
g: Math.round(a.g + (b.g - a.g) * t),
|
|
381
|
-
b: Math.round(a.b + (b.b - a.b) * t)
|
|
398
|
+
b: Math.round(a.b + (b.b - a.b) * t),
|
|
382
399
|
});
|
|
383
400
|
function getPaletteColor(palette, position, timeOffset = 0) {
|
|
384
401
|
if (palette.length === 0) {
|
|
@@ -387,7 +404,7 @@ function getPaletteColor(palette, position, timeOffset = 0) {
|
|
|
387
404
|
if (palette.length === 1) {
|
|
388
405
|
return hexToRgb(palette[0]);
|
|
389
406
|
}
|
|
390
|
-
const cyclePos = ((position + timeOffset) % 1 + 1) % 1;
|
|
407
|
+
const cyclePos = (((position + timeOffset) % 1) + 1) % 1;
|
|
391
408
|
const scaled = cyclePos * palette.length;
|
|
392
409
|
const idx = Math.floor(scaled);
|
|
393
410
|
const t = scaled - idx;
|
|
@@ -402,7 +419,7 @@ var RENDER_OPTION_KEYS = /* @__PURE__ */ new Set([
|
|
|
402
419
|
"headColor",
|
|
403
420
|
"skeletonColor",
|
|
404
421
|
"trailStyle",
|
|
405
|
-
"headRadius"
|
|
422
|
+
"headRadius",
|
|
406
423
|
]);
|
|
407
424
|
function validateRenderOptions(partial) {
|
|
408
425
|
for (const key of Object.keys(partial)) {
|
|
@@ -430,7 +447,7 @@ function assertTrailColor(value) {
|
|
|
430
447
|
if (typeof value === "string") {
|
|
431
448
|
if (!HEX_COLOR_RE.test(value)) {
|
|
432
449
|
throw new TypeError(
|
|
433
|
-
`[sarmal] setRenderOptions: trailColor must be a 6-digit hex string, got "${value}"
|
|
450
|
+
`[sarmal] setRenderOptions: trailColor must be a 6-digit hex string, got "${value}"`,
|
|
434
451
|
);
|
|
435
452
|
}
|
|
436
453
|
return;
|
|
@@ -438,21 +455,21 @@ function assertTrailColor(value) {
|
|
|
438
455
|
if (Array.isArray(value)) {
|
|
439
456
|
if (value.length < 2) {
|
|
440
457
|
throw new RangeError(
|
|
441
|
-
`[sarmal] setRenderOptions: trailColor array must have at least 2 entries, got ${value.length}
|
|
458
|
+
`[sarmal] setRenderOptions: trailColor array must have at least 2 entries, got ${value.length}`,
|
|
442
459
|
);
|
|
443
460
|
}
|
|
444
461
|
for (let i = 0; i < value.length; i++) {
|
|
445
462
|
const entry = value[i];
|
|
446
463
|
if (typeof entry !== "string" || !HEX_COLOR_RE.test(entry)) {
|
|
447
464
|
throw new TypeError(
|
|
448
|
-
`[sarmal] setRenderOptions: trailColor[${i}] must be a 6-digit hex string, got ${JSON.stringify(entry)}
|
|
465
|
+
`[sarmal] setRenderOptions: trailColor[${i}] must be a 6-digit hex string, got ${JSON.stringify(entry)}`,
|
|
449
466
|
);
|
|
450
467
|
}
|
|
451
468
|
}
|
|
452
469
|
return;
|
|
453
470
|
}
|
|
454
471
|
throw new TypeError(
|
|
455
|
-
`[sarmal] setRenderOptions: trailColor must be a 6-digit hex string or an array of hex strings, got ${JSON.stringify(value)}
|
|
472
|
+
`[sarmal] setRenderOptions: trailColor must be a 6-digit hex string or an array of hex strings, got ${JSON.stringify(value)}`,
|
|
456
473
|
);
|
|
457
474
|
}
|
|
458
475
|
function assertHeadColor(value) {
|
|
@@ -461,7 +478,7 @@ function assertHeadColor(value) {
|
|
|
461
478
|
}
|
|
462
479
|
if (typeof value !== "string" || !HEX_COLOR_RE.test(value)) {
|
|
463
480
|
throw new TypeError(
|
|
464
|
-
`[sarmal] setRenderOptions: headColor must be a 6-digit hex string or null, got ${JSON.stringify(value)}
|
|
481
|
+
`[sarmal] setRenderOptions: headColor must be a 6-digit hex string or null, got ${JSON.stringify(value)}`,
|
|
465
482
|
);
|
|
466
483
|
}
|
|
467
484
|
}
|
|
@@ -471,26 +488,26 @@ function assertSkeletonColor(value) {
|
|
|
471
488
|
}
|
|
472
489
|
if (typeof value !== "string" || !HEX_COLOR_RE.test(value)) {
|
|
473
490
|
throw new TypeError(
|
|
474
|
-
`[sarmal] setRenderOptions: skeletonColor must be a 6-digit hex string or "transparent", got ${JSON.stringify(value)}
|
|
491
|
+
`[sarmal] setRenderOptions: skeletonColor must be a 6-digit hex string or "transparent", got ${JSON.stringify(value)}`,
|
|
475
492
|
);
|
|
476
493
|
}
|
|
477
494
|
}
|
|
478
495
|
function assertTrailStyle(value) {
|
|
479
496
|
if (!TRAIL_STYLES.includes(value)) {
|
|
480
497
|
throw new RangeError(
|
|
481
|
-
`[sarmal] setRenderOptions: trailStyle must be one of "default", "gradient-static", "gradient-animated", got ${JSON.stringify(value)}
|
|
498
|
+
`[sarmal] setRenderOptions: trailStyle must be one of "default", "gradient-static", "gradient-animated", got ${JSON.stringify(value)}`,
|
|
482
499
|
);
|
|
483
500
|
}
|
|
484
501
|
}
|
|
485
502
|
function assertHeadRadius(value) {
|
|
486
503
|
if (typeof value !== "number") {
|
|
487
504
|
throw new TypeError(
|
|
488
|
-
`[sarmal] setRenderOptions: headRadius must be a number, got ${JSON.stringify(value)}
|
|
505
|
+
`[sarmal] setRenderOptions: headRadius must be a number, got ${JSON.stringify(value)}`,
|
|
489
506
|
);
|
|
490
507
|
}
|
|
491
508
|
if (!Number.isFinite(value) || value <= 0) {
|
|
492
509
|
throw new TypeError(
|
|
493
|
-
`[sarmal] setRenderOptions: headRadius must be a finite positive number, got ${value}
|
|
510
|
+
`[sarmal] setRenderOptions: headRadius must be a finite positive number, got ${value}`,
|
|
494
511
|
);
|
|
495
512
|
}
|
|
496
513
|
}
|
|
@@ -512,13 +529,13 @@ function resolveHeadColor(trailColor, trailStyle) {
|
|
|
512
529
|
function warnIfTrailColorMismatch(trailColor, trailStyle) {
|
|
513
530
|
if (trailStyle === "default" && Array.isArray(trailColor)) {
|
|
514
531
|
console.warn(
|
|
515
|
-
'[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.'
|
|
532
|
+
'[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.',
|
|
516
533
|
);
|
|
517
534
|
return;
|
|
518
535
|
}
|
|
519
536
|
if (trailStyle !== "default" && typeof trailColor === "string") {
|
|
520
537
|
console.warn(
|
|
521
|
-
`[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
|
|
538
|
+
`[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.`,
|
|
522
539
|
);
|
|
523
540
|
}
|
|
524
541
|
}
|
|
@@ -528,7 +545,7 @@ var getHeadDotRadius = (w, h) => Math.max(1, 3 * Math.sqrt(Math.min(w, h) / 160)
|
|
|
528
545
|
var WHITE_HEX = "#ffffff";
|
|
529
546
|
function hexToRgbComponents(hex) {
|
|
530
547
|
const n = parseInt(hex.slice(1), 16);
|
|
531
|
-
return `${n >> 16},${n >> 8 & 255},${n & 255}`;
|
|
548
|
+
return `${n >> 16},${(n >> 8) & 255},${n & 255}`;
|
|
532
549
|
}
|
|
533
550
|
function applyDprSizing(target, logicalWidth, logicalHeight, dpr) {
|
|
534
551
|
target.style.width = `${logicalWidth}px`;
|
|
@@ -655,7 +672,7 @@ function createRenderer(options) {
|
|
|
655
672
|
i,
|
|
656
673
|
trailCount,
|
|
657
674
|
toX,
|
|
658
|
-
toY
|
|
675
|
+
toY,
|
|
659
676
|
);
|
|
660
677
|
if (trailStyle === "default") {
|
|
661
678
|
ctx.fillStyle = `rgba(${trailSolidRgb},${opacity})`;
|
|
@@ -820,7 +837,7 @@ function createRenderer(options) {
|
|
|
820
837
|
if (partial.trailColor !== void 0 || partial.trailStyle !== void 0) {
|
|
821
838
|
warnIfTrailColorMismatch(trailColor, trailStyle);
|
|
822
839
|
}
|
|
823
|
-
}
|
|
840
|
+
},
|
|
824
841
|
};
|
|
825
842
|
const pauseOnHidden = options.pauseOnHidden !== false;
|
|
826
843
|
function handleVisibilityChange() {
|
|
@@ -870,7 +887,7 @@ function sampleCurveSkeleton(curveDef) {
|
|
|
870
887
|
const samples = Math.ceil(period * 50);
|
|
871
888
|
const pts = Array.from({ length: samples });
|
|
872
889
|
for (let i = 0; i < samples; i++) {
|
|
873
|
-
const t = i / (samples - 1) * period;
|
|
890
|
+
const t = (i / (samples - 1)) * period;
|
|
874
891
|
pts[i] = curveDef.skeletonFn ? curveDef.skeletonFn(t) : curveDef.fn(t, 0, EMPTY_PARAMS2);
|
|
875
892
|
}
|
|
876
893
|
return pts;
|
|
@@ -883,7 +900,7 @@ function createSVGRenderer(options) {
|
|
|
883
900
|
const poolSize = engine.trailLength;
|
|
884
901
|
if (poolSize > HIGH_TRAIL_LENGTH_THRESHOLD) {
|
|
885
902
|
console.warn(
|
|
886
|
-
`[sarmal] High trailLength in SVG renderer (${poolSize}). Consider using the canvas renderer for long trails
|
|
903
|
+
`[sarmal] High trailLength in SVG renderer (${poolSize}). Consider using the canvas renderer for long trails.`,
|
|
887
904
|
);
|
|
888
905
|
}
|
|
889
906
|
let trailStyle = options.trailStyle ?? "default";
|
|
@@ -902,9 +919,9 @@ function createSVGRenderer(options) {
|
|
|
902
919
|
return rect.width && rect.height ? Math.min(rect.width, rect.height) : 200;
|
|
903
920
|
}
|
|
904
921
|
const containerPx = getContainerPixelSize();
|
|
905
|
-
const svgTrailMinWidth = TRAIL_MIN_WIDTH * viewSize / containerPx;
|
|
906
|
-
const svgTrailMaxWidth = TRAIL_MAX_WIDTH * viewSize / containerPx;
|
|
907
|
-
const svgSkeletonStrokeWidth = String(SKELETON_STROKE_WIDTH_PX * viewSize / containerPx);
|
|
922
|
+
const svgTrailMinWidth = (TRAIL_MIN_WIDTH * viewSize) / containerPx;
|
|
923
|
+
const svgTrailMaxWidth = (TRAIL_MAX_WIDTH * viewSize) / containerPx;
|
|
924
|
+
const svgSkeletonStrokeWidth = String((SKELETON_STROKE_WIDTH_PX * viewSize) / containerPx);
|
|
908
925
|
headRadius = options.headRadius ?? SVG_DEFAULT_HEAD_RADIUS;
|
|
909
926
|
container.setAttribute("viewBox", `0 0 ${viewSize} ${viewSize}`);
|
|
910
927
|
container.setAttribute("role", "img");
|
|
@@ -992,7 +1009,7 @@ function createSVGRenderer(options) {
|
|
|
992
1009
|
px,
|
|
993
1010
|
py,
|
|
994
1011
|
svgTrailMinWidth,
|
|
995
|
-
svgTrailMaxWidth
|
|
1012
|
+
svgTrailMaxWidth,
|
|
996
1013
|
);
|
|
997
1014
|
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`;
|
|
998
1015
|
trailPaths[i].setAttribute("d", d);
|
|
@@ -1020,7 +1037,8 @@ function createSVGRenderer(options) {
|
|
|
1020
1037
|
let animationId = null;
|
|
1021
1038
|
let lastTime = 0;
|
|
1022
1039
|
let pausedByVisibility = false;
|
|
1023
|
-
const prefersReducedMotion =
|
|
1040
|
+
const prefersReducedMotion =
|
|
1041
|
+
typeof window !== "undefined" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
|
1024
1042
|
let morphResolve = null;
|
|
1025
1043
|
let morphReject = null;
|
|
1026
1044
|
let morphDurationMs = DEFAULT_MORPH_DURATION_MS;
|
|
@@ -1038,7 +1056,7 @@ function createSVGRenderer(options) {
|
|
|
1038
1056
|
skeletonPathA.setAttribute("visibility", "visible");
|
|
1039
1057
|
skeletonPathA.setAttribute(
|
|
1040
1058
|
"stroke-opacity",
|
|
1041
|
-
String((1 - morphAlpha) * DEFAULT_SKELETON_OPACITY)
|
|
1059
|
+
String((1 - morphAlpha) * DEFAULT_SKELETON_OPACITY),
|
|
1042
1060
|
);
|
|
1043
1061
|
}
|
|
1044
1062
|
if (morphPathBBuilt) {
|
|
@@ -1192,7 +1210,7 @@ function createSVGRenderer(options) {
|
|
|
1192
1210
|
if (partial.trailColor !== void 0 || partial.trailStyle !== void 0) {
|
|
1193
1211
|
warnIfTrailColorMismatch(trailColor, trailStyle);
|
|
1194
1212
|
}
|
|
1195
|
-
}
|
|
1213
|
+
},
|
|
1196
1214
|
};
|
|
1197
1215
|
const pauseOnHidden = options.pauseOnHidden !== false;
|
|
1198
1216
|
function handleVisibilityChange() {
|
|
@@ -1230,7 +1248,13 @@ var PERIOD = 2 * Math.PI;
|
|
|
1230
1248
|
function catmullRom1D(p0, p1, p2, p3, u) {
|
|
1231
1249
|
const u2 = u * u;
|
|
1232
1250
|
const u3 = u2 * u;
|
|
1233
|
-
return
|
|
1251
|
+
return (
|
|
1252
|
+
0.5 *
|
|
1253
|
+
(2 * p1 +
|
|
1254
|
+
(-p0 + p2) * u +
|
|
1255
|
+
(2 * p0 - 5 * p1 + 4 * p2 - p3) * u2 +
|
|
1256
|
+
(-p0 + 3 * p1 - 3 * p2 + p3) * u3)
|
|
1257
|
+
);
|
|
1234
1258
|
}
|
|
1235
1259
|
function evaluateCatmullRom(points2, t) {
|
|
1236
1260
|
const N = points2.length;
|
|
@@ -1240,7 +1264,7 @@ function evaluateCatmullRom(points2, t) {
|
|
|
1240
1264
|
if (N === 1) {
|
|
1241
1265
|
return { x: points2[0][0], y: points2[0][1] };
|
|
1242
1266
|
}
|
|
1243
|
-
t = (t % PERIOD + PERIOD) % PERIOD;
|
|
1267
|
+
t = ((t % PERIOD) + PERIOD) % PERIOD;
|
|
1244
1268
|
const segmentSize = PERIOD / N;
|
|
1245
1269
|
let i = Math.floor(t / segmentSize);
|
|
1246
1270
|
if (i >= N) {
|
|
@@ -1254,7 +1278,7 @@ function evaluateCatmullRom(points2, t) {
|
|
|
1254
1278
|
const p3 = points2[(i + 2) % N];
|
|
1255
1279
|
return {
|
|
1256
1280
|
x: catmullRom1D(p0[0], p1[0], p2[0], p3[0], u),
|
|
1257
|
-
y: catmullRom1D(p0[1], p1[1], p2[1], p3[1], u)
|
|
1281
|
+
y: catmullRom1D(p0[1], p1[1], p2[1], p3[1], u),
|
|
1258
1282
|
};
|
|
1259
1283
|
}
|
|
1260
1284
|
function drawCurve(points2, opts) {
|
|
@@ -1264,13 +1288,13 @@ function drawCurve(points2, opts) {
|
|
|
1264
1288
|
const first = points2[0];
|
|
1265
1289
|
if (points2.every((p) => p[0] === first[0] && p[1] === first[1])) {
|
|
1266
1290
|
console.warn(
|
|
1267
|
-
"[sarmal].drawCurve: all control points are identical. The curve will be a single point."
|
|
1291
|
+
"[sarmal].drawCurve: all control points are identical. The curve will be a single point.",
|
|
1268
1292
|
);
|
|
1269
1293
|
}
|
|
1270
1294
|
const maxAbs = points2.reduce((m, p) => Math.max(m, Math.abs(p[0]), Math.abs(p[1])), 0);
|
|
1271
1295
|
if (maxAbs > 2) {
|
|
1272
1296
|
console.warn(
|
|
1273
|
-
`[sarmal].drawCurve: control points extend to \xB1${maxAbs.toFixed(1)}, which may render off-screen. Coordinates should be in [-1, 1]
|
|
1297
|
+
`[sarmal].drawCurve: control points extend to \xB1${maxAbs.toFixed(1)}, which may render off-screen. Coordinates should be in [-1, 1].`,
|
|
1274
1298
|
);
|
|
1275
1299
|
}
|
|
1276
1300
|
const pts = points2.map(([x, y]) => [x, y]);
|
|
@@ -1278,7 +1302,6 @@ function drawCurve(points2, opts) {
|
|
|
1278
1302
|
name: opts?.name ?? "drawn",
|
|
1279
1303
|
fn: (t) => evaluateCatmullRom(pts, t),
|
|
1280
1304
|
period: PERIOD,
|
|
1281
|
-
kind: "drawn"
|
|
1282
1305
|
};
|
|
1283
1306
|
}
|
|
1284
1307
|
|
|
@@ -1304,11 +1327,11 @@ var points = [
|
|
|
1304
1327
|
[-0.69, -0.84],
|
|
1305
1328
|
[-0.87, -0.66],
|
|
1306
1329
|
[-0.9, -0.47],
|
|
1307
|
-
[-0.76, -0.35]
|
|
1330
|
+
[-0.76, -0.35],
|
|
1308
1331
|
];
|
|
1309
1332
|
var artemis2 = {
|
|
1310
1333
|
...drawCurve(points, { name: "Artemis II" }),
|
|
1311
|
-
speed: 0.7
|
|
1334
|
+
speed: 0.7,
|
|
1312
1335
|
};
|
|
1313
1336
|
|
|
1314
1337
|
// src/curves/astroid.ts
|
|
@@ -1318,14 +1341,14 @@ function astroidFn(t, _time, _params) {
|
|
|
1318
1341
|
const s = Math.sin(t);
|
|
1319
1342
|
return {
|
|
1320
1343
|
x: c * c * c,
|
|
1321
|
-
y: s * s * s
|
|
1344
|
+
y: s * s * s,
|
|
1322
1345
|
};
|
|
1323
1346
|
}
|
|
1324
1347
|
var astroid = {
|
|
1325
1348
|
name: "Astroid",
|
|
1326
1349
|
fn: astroidFn,
|
|
1327
1350
|
period: TWO_PI2,
|
|
1328
|
-
speed: 1.1
|
|
1351
|
+
speed: 1.1,
|
|
1329
1352
|
};
|
|
1330
1353
|
|
|
1331
1354
|
// src/curves/deltoid.ts
|
|
@@ -1333,14 +1356,14 @@ var TWO_PI3 = Math.PI * 2;
|
|
|
1333
1356
|
function deltoidFn(t, _time, _params) {
|
|
1334
1357
|
return {
|
|
1335
1358
|
x: 2 * Math.cos(t) + Math.cos(2 * t),
|
|
1336
|
-
y: 2 * Math.sin(t) - Math.sin(2 * t)
|
|
1359
|
+
y: 2 * Math.sin(t) - Math.sin(2 * t),
|
|
1337
1360
|
};
|
|
1338
1361
|
}
|
|
1339
1362
|
var deltoid = {
|
|
1340
1363
|
name: "Deltoid",
|
|
1341
1364
|
fn: deltoidFn,
|
|
1342
1365
|
period: TWO_PI3,
|
|
1343
|
-
speed: 0.9
|
|
1366
|
+
speed: 0.9,
|
|
1344
1367
|
};
|
|
1345
1368
|
|
|
1346
1369
|
// src/curves/epicycloid3.ts
|
|
@@ -1348,14 +1371,14 @@ var TWO_PI4 = Math.PI * 2;
|
|
|
1348
1371
|
function epicycloid3Fn(t, _time, _params) {
|
|
1349
1372
|
return {
|
|
1350
1373
|
x: 4 * Math.cos(t) - Math.cos(4 * t),
|
|
1351
|
-
y: 4 * Math.sin(t) - Math.sin(4 * t)
|
|
1374
|
+
y: 4 * Math.sin(t) - Math.sin(4 * t),
|
|
1352
1375
|
};
|
|
1353
1376
|
}
|
|
1354
1377
|
var epicycloid3 = {
|
|
1355
1378
|
name: "Epicycloid (n=3)",
|
|
1356
1379
|
fn: epicycloid3Fn,
|
|
1357
1380
|
period: TWO_PI4,
|
|
1358
|
-
speed: 0.75
|
|
1381
|
+
speed: 0.75,
|
|
1359
1382
|
};
|
|
1360
1383
|
|
|
1361
1384
|
// src/curves/epitrochoid7.ts
|
|
@@ -1364,14 +1387,14 @@ function epitrochoid7Fn(t, _time, _params) {
|
|
|
1364
1387
|
const d = 1 + 0.55 * Math.sin(t * 0.5);
|
|
1365
1388
|
return {
|
|
1366
1389
|
x: 7 * Math.cos(t) - d * Math.cos(7 * t),
|
|
1367
|
-
y: 7 * Math.sin(t) - d * Math.sin(7 * t)
|
|
1390
|
+
y: 7 * Math.sin(t) - d * Math.sin(7 * t),
|
|
1368
1391
|
};
|
|
1369
1392
|
}
|
|
1370
1393
|
function epitrochoid7SkeletonFn(t) {
|
|
1371
1394
|
const d = 1.275;
|
|
1372
1395
|
return {
|
|
1373
1396
|
x: 7 * Math.cos(t) - d * Math.cos(7 * t),
|
|
1374
|
-
y: 7 * Math.sin(t) - d * Math.sin(7 * t)
|
|
1397
|
+
y: 7 * Math.sin(t) - d * Math.sin(7 * t),
|
|
1375
1398
|
};
|
|
1376
1399
|
}
|
|
1377
1400
|
var epitrochoid7 = {
|
|
@@ -1379,7 +1402,7 @@ var epitrochoid7 = {
|
|
|
1379
1402
|
fn: epitrochoid7Fn,
|
|
1380
1403
|
period: TWO_PI5,
|
|
1381
1404
|
speed: 1.4,
|
|
1382
|
-
skeletonFn: epitrochoid7SkeletonFn
|
|
1405
|
+
skeletonFn: epitrochoid7SkeletonFn,
|
|
1383
1406
|
};
|
|
1384
1407
|
|
|
1385
1408
|
// src/curves/lissajous32.ts
|
|
@@ -1388,7 +1411,7 @@ function lissajous32Fn(t, time, _params) {
|
|
|
1388
1411
|
const phi = time * 0.45;
|
|
1389
1412
|
return {
|
|
1390
1413
|
x: Math.sin(3 * t + phi),
|
|
1391
|
-
y: Math.sin(2 * t)
|
|
1414
|
+
y: Math.sin(2 * t),
|
|
1392
1415
|
};
|
|
1393
1416
|
}
|
|
1394
1417
|
var lissajous32 = {
|
|
@@ -1396,7 +1419,7 @@ var lissajous32 = {
|
|
|
1396
1419
|
fn: lissajous32Fn,
|
|
1397
1420
|
period: TWO_PI6,
|
|
1398
1421
|
speed: 2,
|
|
1399
|
-
skeleton: "live"
|
|
1422
|
+
skeleton: "live",
|
|
1400
1423
|
};
|
|
1401
1424
|
|
|
1402
1425
|
// src/curves/lissajous43.ts
|
|
@@ -1405,7 +1428,7 @@ function lissajous43Fn(t, time, _params) {
|
|
|
1405
1428
|
const phi = time * 0.38;
|
|
1406
1429
|
return {
|
|
1407
1430
|
x: Math.sin(4 * t + phi),
|
|
1408
|
-
y: Math.sin(3 * t)
|
|
1431
|
+
y: Math.sin(3 * t),
|
|
1409
1432
|
};
|
|
1410
1433
|
}
|
|
1411
1434
|
var lissajous43 = {
|
|
@@ -1413,17 +1436,18 @@ var lissajous43 = {
|
|
|
1413
1436
|
fn: lissajous43Fn,
|
|
1414
1437
|
period: TWO_PI7,
|
|
1415
1438
|
speed: 1.8,
|
|
1416
|
-
skeleton: "live"
|
|
1439
|
+
skeleton: "live",
|
|
1417
1440
|
};
|
|
1418
1441
|
|
|
1419
1442
|
// src/curves/lame.ts
|
|
1420
1443
|
var TWO_PI8 = Math.PI * 2;
|
|
1421
1444
|
function lameFn(t, time, _params) {
|
|
1422
1445
|
const p = 1.75 + 1.25 * Math.sin(time * 0.48);
|
|
1423
|
-
const c = Math.cos(t),
|
|
1446
|
+
const c = Math.cos(t),
|
|
1447
|
+
s = Math.sin(t);
|
|
1424
1448
|
return {
|
|
1425
1449
|
x: Math.sign(c) * Math.pow(Math.abs(c), p),
|
|
1426
|
-
y: Math.sign(s) * Math.pow(Math.abs(s), p)
|
|
1450
|
+
y: Math.sign(s) * Math.pow(Math.abs(s), p),
|
|
1427
1451
|
};
|
|
1428
1452
|
}
|
|
1429
1453
|
var lame = {
|
|
@@ -1431,7 +1455,7 @@ var lame = {
|
|
|
1431
1455
|
fn: lameFn,
|
|
1432
1456
|
period: TWO_PI8,
|
|
1433
1457
|
speed: 1,
|
|
1434
|
-
skeleton: "live"
|
|
1458
|
+
skeleton: "live",
|
|
1435
1459
|
};
|
|
1436
1460
|
|
|
1437
1461
|
// src/curves/rose3.ts
|
|
@@ -1440,14 +1464,14 @@ function rose3Fn(t, _time, _params) {
|
|
|
1440
1464
|
const r = Math.cos(3 * t);
|
|
1441
1465
|
return {
|
|
1442
1466
|
x: r * Math.cos(t),
|
|
1443
|
-
y: r * Math.sin(t)
|
|
1467
|
+
y: r * Math.sin(t),
|
|
1444
1468
|
};
|
|
1445
1469
|
}
|
|
1446
1470
|
var rose3 = {
|
|
1447
1471
|
name: "Rose (n=3)",
|
|
1448
1472
|
fn: rose3Fn,
|
|
1449
1473
|
period: TWO_PI9,
|
|
1450
|
-
speed: 1.15
|
|
1474
|
+
speed: 1.15,
|
|
1451
1475
|
};
|
|
1452
1476
|
|
|
1453
1477
|
// src/curves/rose5.ts
|
|
@@ -1456,78 +1480,87 @@ function rose5Fn(t, _time, _params) {
|
|
|
1456
1480
|
const r = Math.cos(5 * t);
|
|
1457
1481
|
return {
|
|
1458
1482
|
x: r * Math.cos(t),
|
|
1459
|
-
y: r * Math.sin(t)
|
|
1483
|
+
y: r * Math.sin(t),
|
|
1460
1484
|
};
|
|
1461
1485
|
}
|
|
1462
1486
|
var rose5 = {
|
|
1463
1487
|
name: "Rose (n=5)",
|
|
1464
1488
|
fn: rose5Fn,
|
|
1465
1489
|
period: TWO_PI10,
|
|
1466
|
-
speed: 1
|
|
1490
|
+
speed: 1,
|
|
1467
1491
|
};
|
|
1468
1492
|
|
|
1469
1493
|
// src/curves/rose52.ts
|
|
1470
1494
|
var FOUR_PI = Math.PI * 4;
|
|
1471
1495
|
function rose52Fn(t, _time, _params) {
|
|
1472
|
-
const r = Math.cos(5 / 2 * t);
|
|
1496
|
+
const r = Math.cos((5 / 2) * t);
|
|
1473
1497
|
return {
|
|
1474
1498
|
x: r * Math.cos(t),
|
|
1475
|
-
y: r * Math.sin(t)
|
|
1499
|
+
y: r * Math.sin(t),
|
|
1476
1500
|
};
|
|
1477
1501
|
}
|
|
1478
1502
|
var rose52 = {
|
|
1479
1503
|
name: "Rose (n=5/2)",
|
|
1480
1504
|
fn: rose52Fn,
|
|
1481
1505
|
period: FOUR_PI,
|
|
1482
|
-
speed: 0.8
|
|
1506
|
+
speed: 0.8,
|
|
1483
1507
|
};
|
|
1484
1508
|
|
|
1485
1509
|
// src/curves/star.ts
|
|
1486
1510
|
var TWO_PI11 = Math.PI * 2;
|
|
1487
1511
|
function starFn(t, _time, _params) {
|
|
1488
|
-
const r =
|
|
1512
|
+
const r =
|
|
1513
|
+
Math.abs(Math.cos((5 / 2) * t)) +
|
|
1514
|
+
0.35 * Math.abs(Math.cos((15 / 2) * t)) +
|
|
1515
|
+
0.15 * Math.abs(Math.cos((25 / 2) * t));
|
|
1489
1516
|
return {
|
|
1490
1517
|
x: r * Math.cos(t),
|
|
1491
|
-
y: r * Math.sin(t)
|
|
1518
|
+
y: r * Math.sin(t),
|
|
1492
1519
|
};
|
|
1493
1520
|
}
|
|
1494
1521
|
var star = {
|
|
1495
1522
|
name: "Star",
|
|
1496
1523
|
fn: starFn,
|
|
1497
1524
|
period: TWO_PI11,
|
|
1498
|
-
speed: 1
|
|
1525
|
+
speed: 1,
|
|
1499
1526
|
};
|
|
1500
1527
|
|
|
1501
1528
|
// src/curves/star4.ts
|
|
1502
1529
|
var TWO_PI12 = Math.PI * 2;
|
|
1503
1530
|
function star4Fn(t, _time, _params) {
|
|
1504
|
-
const r =
|
|
1531
|
+
const r =
|
|
1532
|
+
Math.abs(Math.cos(2 * t)) +
|
|
1533
|
+
0.35 * Math.abs(Math.cos(6 * t)) +
|
|
1534
|
+
0.15 * Math.abs(Math.cos(10 * t));
|
|
1505
1535
|
return {
|
|
1506
1536
|
x: r * Math.cos(t),
|
|
1507
|
-
y: r * Math.sin(t)
|
|
1537
|
+
y: r * Math.sin(t),
|
|
1508
1538
|
};
|
|
1509
1539
|
}
|
|
1510
1540
|
var star4 = {
|
|
1511
1541
|
name: "Star (4-arm)",
|
|
1512
1542
|
fn: star4Fn,
|
|
1513
1543
|
period: TWO_PI12,
|
|
1514
|
-
speed: 1
|
|
1544
|
+
speed: 1,
|
|
1515
1545
|
};
|
|
1516
1546
|
|
|
1517
1547
|
// src/curves/star7.ts
|
|
1518
1548
|
var TWO_PI13 = Math.PI * 2;
|
|
1519
1549
|
function star7Fn(t, _time, _params) {
|
|
1520
|
-
const r =
|
|
1550
|
+
const r =
|
|
1551
|
+
Math.abs(Math.cos((7 / 2) * t)) +
|
|
1552
|
+
0.35 * Math.abs(Math.cos((21 / 2) * t)) +
|
|
1553
|
+
0.15 * Math.abs(Math.cos((35 / 2) * t));
|
|
1521
1554
|
return {
|
|
1522
1555
|
x: r * Math.cos(t),
|
|
1523
|
-
y: r * Math.sin(t)
|
|
1556
|
+
y: r * Math.sin(t),
|
|
1524
1557
|
};
|
|
1525
1558
|
}
|
|
1526
1559
|
var star7 = {
|
|
1527
1560
|
name: "Star (7-arm)",
|
|
1528
1561
|
fn: star7Fn,
|
|
1529
1562
|
period: TWO_PI13,
|
|
1530
|
-
speed: 1
|
|
1563
|
+
speed: 1,
|
|
1531
1564
|
};
|
|
1532
1565
|
|
|
1533
1566
|
// src/curves/index.ts
|
|
@@ -1545,7 +1578,7 @@ var curves = {
|
|
|
1545
1578
|
lissajous32,
|
|
1546
1579
|
lissajous43,
|
|
1547
1580
|
epicycloid3,
|
|
1548
|
-
lame
|
|
1581
|
+
lame,
|
|
1549
1582
|
};
|
|
1550
1583
|
|
|
1551
1584
|
// src/index.ts
|
|
@@ -1562,22 +1595,21 @@ function parseTrailColor(value) {
|
|
|
1562
1595
|
if (Array.isArray(parsed)) {
|
|
1563
1596
|
return parsed;
|
|
1564
1597
|
}
|
|
1565
|
-
} catch {
|
|
1566
|
-
}
|
|
1598
|
+
} catch {}
|
|
1567
1599
|
return value;
|
|
1568
1600
|
}
|
|
1569
1601
|
function buildOptions(el2) {
|
|
1570
1602
|
return {
|
|
1571
|
-
...el2.dataset.trailColor && {
|
|
1572
|
-
trailColor: parseTrailColor(el2.dataset.trailColor)
|
|
1573
|
-
},
|
|
1574
|
-
...el2.dataset.skeletonColor && { skeletonColor: el2.dataset.skeletonColor },
|
|
1575
|
-
...el2.dataset.headColor && { headColor: el2.dataset.headColor },
|
|
1576
|
-
...el2.dataset.headRadius && { headRadius: parseFloat(el2.dataset.headRadius) },
|
|
1577
|
-
...el2.dataset.trailLength && { trailLength: parseInt(el2.dataset.trailLength, 10) },
|
|
1578
|
-
...el2.dataset.trailStyle && {
|
|
1579
|
-
trailStyle: el2.dataset.trailStyle
|
|
1580
|
-
}
|
|
1603
|
+
...(el2.dataset.trailColor && {
|
|
1604
|
+
trailColor: parseTrailColor(el2.dataset.trailColor),
|
|
1605
|
+
}),
|
|
1606
|
+
...(el2.dataset.skeletonColor && { skeletonColor: el2.dataset.skeletonColor }),
|
|
1607
|
+
...(el2.dataset.headColor && { headColor: el2.dataset.headColor }),
|
|
1608
|
+
...(el2.dataset.headRadius && { headRadius: parseFloat(el2.dataset.headRadius) }),
|
|
1609
|
+
...(el2.dataset.trailLength && { trailLength: parseInt(el2.dataset.trailLength, 10) }),
|
|
1610
|
+
...(el2.dataset.trailStyle && {
|
|
1611
|
+
trailStyle: el2.dataset.trailStyle,
|
|
1612
|
+
}),
|
|
1581
1613
|
};
|
|
1582
1614
|
}
|
|
1583
1615
|
function init() {
|
|
@@ -1592,7 +1624,10 @@ function init() {
|
|
|
1592
1624
|
return console.error(`[sarmal] "${curveName}" is not a valid curve name`);
|
|
1593
1625
|
}
|
|
1594
1626
|
const options = buildOptions(el2);
|
|
1595
|
-
const instance =
|
|
1627
|
+
const instance =
|
|
1628
|
+
el2 instanceof HTMLCanvasElement
|
|
1629
|
+
? createSarmal(el2, curveDef, options)
|
|
1630
|
+
: createSarmalSVG(el2, curveDef, options);
|
|
1596
1631
|
if (el2.dataset.speed) {
|
|
1597
1632
|
instance.setSpeed(parseFloat(el2.dataset.speed));
|
|
1598
1633
|
}
|
|
@@ -1608,4 +1643,4 @@ if (document.readyState === "loading") {
|
|
|
1608
1643
|
|
|
1609
1644
|
export { init };
|
|
1610
1645
|
//# sourceMappingURL=auto-init.js.map
|
|
1611
|
-
//# sourceMappingURL=auto-init.js.map
|
|
1646
|
+
//# sourceMappingURL=auto-init.js.map
|