@frybynite/image-cloud 0.8.1 → 0.8.2
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/image-cloud-auto-init.js +741 -733
- package/dist/image-cloud-auto-init.js.map +1 -1
- package/dist/image-cloud.js +438 -430
- package/dist/image-cloud.js.map +1 -1
- package/dist/image-cloud.umd.js +2 -2
- package/dist/image-cloud.umd.js.map +1 -1
- package/dist/index.d.ts +5 -0
- package/dist/react.d.ts +5 -0
- package/dist/react.js +416 -408
- package/dist/react.js.map +1 -1
- package/dist/vue.d.ts +5 -0
- package/dist/vue.js +416 -408
- package/dist/vue.js.map +1 -1
- package/dist/web-component.d.ts +5 -0
- package/dist/web-component.js +414 -406
- package/dist/web-component.js.map +1 -1
- package/package.json +1 -1
package/dist/image-cloud.js
CHANGED
|
@@ -51,18 +51,20 @@ const mt = Object.freeze({
|
|
|
51
51
|
shadow: "none"
|
|
52
52
|
})
|
|
53
53
|
}), _t = Object.freeze({
|
|
54
|
+
tightness: 1
|
|
55
|
+
}), Ut = Object.freeze({
|
|
54
56
|
rows: 1,
|
|
55
57
|
amplitude: 100,
|
|
56
58
|
frequency: 2,
|
|
57
59
|
phaseShift: 0,
|
|
58
60
|
synchronization: "offset"
|
|
59
61
|
// Note: Image rotation along wave is now controlled via image.rotation.mode = 'tangent'
|
|
60
|
-
}), Ut = Object.freeze({
|
|
61
|
-
spacing: 0
|
|
62
62
|
}), Ht = Object.freeze({
|
|
63
|
+
spacing: 0
|
|
64
|
+
}), Nt = Object.freeze({
|
|
63
65
|
mobile: Object.freeze({ maxWidth: 767 }),
|
|
64
66
|
tablet: Object.freeze({ maxWidth: 1199 })
|
|
65
|
-
}),
|
|
67
|
+
}), jt = Object.freeze({
|
|
66
68
|
mode: "adaptive",
|
|
67
69
|
// Default to adaptive sizing
|
|
68
70
|
minSize: 50,
|
|
@@ -74,15 +76,15 @@ const mt = Object.freeze({
|
|
|
74
76
|
// No variance by default
|
|
75
77
|
max: 1
|
|
76
78
|
})
|
|
77
|
-
}),
|
|
79
|
+
}), Wt = Object.freeze({
|
|
78
80
|
mode: "none",
|
|
79
81
|
range: Object.freeze({
|
|
80
82
|
min: -15,
|
|
81
83
|
max: 15
|
|
82
84
|
})
|
|
83
85
|
}), Ft = Object.freeze({
|
|
84
|
-
sizing:
|
|
85
|
-
rotation:
|
|
86
|
+
sizing: jt,
|
|
87
|
+
rotation: Wt
|
|
86
88
|
}), zt = Object.freeze({
|
|
87
89
|
validateUrls: !0,
|
|
88
90
|
validationTimeout: 5e3,
|
|
@@ -92,7 +94,7 @@ const mt = Object.freeze({
|
|
|
92
94
|
enabled: !1,
|
|
93
95
|
centers: !1,
|
|
94
96
|
loaders: !1
|
|
95
|
-
}),
|
|
97
|
+
}), E = Object.freeze({
|
|
96
98
|
// Loader configuration (always an array, composite behavior is implicit)
|
|
97
99
|
loaders: [],
|
|
98
100
|
// Shared loader settings and debug config
|
|
@@ -107,7 +109,7 @@ const mt = Object.freeze({
|
|
|
107
109
|
algorithm: "radial",
|
|
108
110
|
scaleDecay: 0,
|
|
109
111
|
// No decay by default (0-1 for radial/spiral)
|
|
110
|
-
responsive:
|
|
112
|
+
responsive: Nt,
|
|
111
113
|
targetCoverage: 0.6,
|
|
112
114
|
// Target 60% of container area
|
|
113
115
|
densityFactor: 1,
|
|
@@ -218,7 +220,7 @@ function Z(o, t) {
|
|
|
218
220
|
const i = { ...o };
|
|
219
221
|
return t.border !== void 0 && (i.border = { ...o.border, ...t.border }), t.borderTop !== void 0 && (i.borderTop = { ...o.borderTop, ...t.borderTop }), t.borderRight !== void 0 && (i.borderRight = { ...o.borderRight, ...t.borderRight }), t.borderBottom !== void 0 && (i.borderBottom = { ...o.borderBottom, ...t.borderBottom }), t.borderLeft !== void 0 && (i.borderLeft = { ...o.borderLeft, ...t.borderLeft }), t.filter !== void 0 && (i.filter = { ...o.filter, ...t.filter }), t.outline !== void 0 && (i.outline = { ...o.outline, ...t.outline }), t.shadow !== void 0 && (i.shadow = t.shadow), t.clipPath !== void 0 && (i.clipPath = t.clipPath), t.opacity !== void 0 && (i.opacity = t.opacity), t.cursor !== void 0 && (i.cursor = t.cursor), t.className !== void 0 && (i.className = t.className), t.objectFit !== void 0 && (i.objectFit = t.objectFit), t.aspectRatio !== void 0 && (i.aspectRatio = t.aspectRatio), t.borderRadiusTopLeft !== void 0 && (i.borderRadiusTopLeft = t.borderRadiusTopLeft), t.borderRadiusTopRight !== void 0 && (i.borderRadiusTopRight = t.borderRadiusTopRight), t.borderRadiusBottomRight !== void 0 && (i.borderRadiusBottomRight = t.borderRadiusBottomRight), t.borderRadiusBottomLeft !== void 0 && (i.borderRadiusBottomLeft = t.borderRadiusBottomLeft), i;
|
|
220
222
|
}
|
|
221
|
-
function
|
|
223
|
+
function kt(o, t) {
|
|
222
224
|
if (!t) return { ...o };
|
|
223
225
|
const i = Z(o.default, t.default), e = Z(
|
|
224
226
|
Z(i, o.hover),
|
|
@@ -233,7 +235,7 @@ function Wt(o, t) {
|
|
|
233
235
|
focused: n
|
|
234
236
|
};
|
|
235
237
|
}
|
|
236
|
-
function
|
|
238
|
+
function Gt(o, t) {
|
|
237
239
|
if (!t) return { ...o };
|
|
238
240
|
const i = { ...o };
|
|
239
241
|
if (t.sizing !== void 0 && (i.sizing = {
|
|
@@ -252,7 +254,7 @@ function kt(o, t) {
|
|
|
252
254
|
}
|
|
253
255
|
return i;
|
|
254
256
|
}
|
|
255
|
-
function
|
|
257
|
+
function qt(o) {
|
|
256
258
|
const t = o.layout?.rotation;
|
|
257
259
|
if (t && "enabled" in t)
|
|
258
260
|
return {
|
|
@@ -262,7 +264,7 @@ function Gt(o) {
|
|
|
262
264
|
}
|
|
263
265
|
};
|
|
264
266
|
}
|
|
265
|
-
function
|
|
267
|
+
function Xt(o) {
|
|
266
268
|
const t = o.layout?.sizing?.variance;
|
|
267
269
|
if (t)
|
|
268
270
|
return {
|
|
@@ -273,8 +275,8 @@ function qt(o) {
|
|
|
273
275
|
}
|
|
274
276
|
};
|
|
275
277
|
}
|
|
276
|
-
function
|
|
277
|
-
const t =
|
|
278
|
+
function Yt(o = {}) {
|
|
279
|
+
const t = qt(o), i = Xt(o);
|
|
278
280
|
let e = o.image;
|
|
279
281
|
(t || i) && (e = {
|
|
280
282
|
...i || {},
|
|
@@ -298,69 +300,69 @@ function Xt(o = {}) {
|
|
|
298
300
|
}, s = {
|
|
299
301
|
loaders: n,
|
|
300
302
|
config: r,
|
|
301
|
-
image:
|
|
302
|
-
layout: { ...
|
|
303
|
-
animation: { ...
|
|
304
|
-
interaction: { ...
|
|
305
|
-
rendering: { ...
|
|
306
|
-
styling:
|
|
303
|
+
image: Gt(Ft, e),
|
|
304
|
+
layout: { ...E.layout },
|
|
305
|
+
animation: { ...E.animation },
|
|
306
|
+
interaction: { ...E.interaction },
|
|
307
|
+
rendering: { ...E.rendering },
|
|
308
|
+
styling: kt(Mt, o.styling)
|
|
307
309
|
};
|
|
308
310
|
if (o.layout && (s.layout = {
|
|
309
|
-
...
|
|
311
|
+
...E.layout,
|
|
310
312
|
...o.layout
|
|
311
313
|
}, o.layout.responsive && (s.layout.responsive = {
|
|
312
|
-
...
|
|
313
|
-
mobile: o.layout.responsive.mobile ? { ...
|
|
314
|
-
tablet: o.layout.responsive.tablet ? { ...
|
|
314
|
+
...E.layout.responsive,
|
|
315
|
+
mobile: o.layout.responsive.mobile ? { ...E.layout.responsive.mobile, ...o.layout.responsive.mobile } : E.layout.responsive.mobile,
|
|
316
|
+
tablet: o.layout.responsive.tablet ? { ...E.layout.responsive.tablet, ...o.layout.responsive.tablet } : E.layout.responsive.tablet
|
|
315
317
|
}), o.layout.spacing && (s.layout.spacing = {
|
|
316
|
-
...
|
|
318
|
+
...E.layout.spacing,
|
|
317
319
|
...o.layout.spacing
|
|
318
320
|
})), o.animation && (s.animation = {
|
|
319
|
-
...
|
|
321
|
+
...E.animation,
|
|
320
322
|
...o.animation
|
|
321
323
|
}, o.animation.easing && (s.animation.easing = {
|
|
322
|
-
...
|
|
324
|
+
...E.animation.easing,
|
|
323
325
|
...o.animation.easing
|
|
324
326
|
}), o.animation.queue && (s.animation.queue = {
|
|
325
|
-
...
|
|
327
|
+
...E.animation.queue,
|
|
326
328
|
...o.animation.queue
|
|
327
329
|
}), o.animation.performance && (s.animation.performance = {
|
|
328
|
-
...
|
|
330
|
+
...E.animation.performance,
|
|
329
331
|
...o.animation.performance
|
|
330
332
|
}), o.animation.entry && (s.animation.entry = {
|
|
331
|
-
...
|
|
333
|
+
...E.animation.entry,
|
|
332
334
|
...o.animation.entry,
|
|
333
335
|
start: o.animation.entry.start ? {
|
|
334
|
-
...
|
|
336
|
+
...E.animation.entry.start,
|
|
335
337
|
...o.animation.entry.start,
|
|
336
|
-
circular: o.animation.entry.start.circular ? { ...
|
|
337
|
-
} :
|
|
338
|
-
timing: o.animation.entry.timing ? { ...
|
|
339
|
-
path: o.animation.entry.path ? { ...yt, ...o.animation.entry.path } :
|
|
340
|
-
rotation: o.animation.entry.rotation ? { ...vt, ...o.animation.entry.rotation } :
|
|
341
|
-
scale: o.animation.entry.scale ? { ...wt, ...o.animation.entry.scale } :
|
|
338
|
+
circular: o.animation.entry.start.circular ? { ...E.animation.entry.start.circular, ...o.animation.entry.start.circular } : E.animation.entry.start.circular
|
|
339
|
+
} : E.animation.entry.start,
|
|
340
|
+
timing: o.animation.entry.timing ? { ...E.animation.entry.timing, ...o.animation.entry.timing } : E.animation.entry.timing,
|
|
341
|
+
path: o.animation.entry.path ? { ...yt, ...o.animation.entry.path } : E.animation.entry.path,
|
|
342
|
+
rotation: o.animation.entry.rotation ? { ...vt, ...o.animation.entry.rotation } : E.animation.entry.rotation,
|
|
343
|
+
scale: o.animation.entry.scale ? { ...wt, ...o.animation.entry.scale } : E.animation.entry.scale
|
|
342
344
|
})), o.interaction && (s.interaction = {
|
|
343
|
-
...
|
|
345
|
+
...E.interaction,
|
|
344
346
|
...o.interaction
|
|
345
347
|
}, o.interaction.focus && (s.interaction.focus = {
|
|
346
|
-
...
|
|
348
|
+
...E.interaction.focus,
|
|
347
349
|
...o.interaction.focus
|
|
348
350
|
}), o.interaction.navigation && (s.interaction.navigation = {
|
|
349
|
-
...
|
|
351
|
+
...E.interaction.navigation,
|
|
350
352
|
...o.interaction.navigation
|
|
351
353
|
}), o.interaction.gestures && (s.interaction.gestures = {
|
|
352
|
-
...
|
|
354
|
+
...E.interaction.gestures,
|
|
353
355
|
...o.interaction.gestures
|
|
354
356
|
})), o.rendering && (s.rendering = {
|
|
355
|
-
...
|
|
357
|
+
...E.rendering,
|
|
356
358
|
...o.rendering
|
|
357
359
|
}, o.rendering.responsive && (s.rendering.responsive = {
|
|
358
|
-
...
|
|
360
|
+
...E.rendering.responsive,
|
|
359
361
|
...o.rendering.responsive,
|
|
360
|
-
breakpoints: o.rendering.responsive.breakpoints ? { ...
|
|
361
|
-
mobileDetection: o.rendering.responsive.mobileDetection ? o.rendering.responsive.mobileDetection :
|
|
362
|
+
breakpoints: o.rendering.responsive.breakpoints ? { ...E.rendering.responsive.breakpoints, ...o.rendering.responsive.breakpoints } : E.rendering.responsive.breakpoints,
|
|
363
|
+
mobileDetection: o.rendering.responsive.mobileDetection ? o.rendering.responsive.mobileDetection : E.rendering.responsive.mobileDetection
|
|
362
364
|
}), o.rendering.ui && (s.rendering.ui = {
|
|
363
|
-
...
|
|
365
|
+
...E.rendering.ui,
|
|
364
366
|
...o.rendering.ui
|
|
365
367
|
})), s.config.debug = {
|
|
366
368
|
...Ot,
|
|
@@ -376,16 +378,16 @@ function Xt(o = {}) {
|
|
|
376
378
|
}
|
|
377
379
|
return s;
|
|
378
380
|
}
|
|
379
|
-
function
|
|
381
|
+
function Bt(o, t) {
|
|
380
382
|
return { ...o ? Rt[o] : Rt.playful, ...t };
|
|
381
383
|
}
|
|
382
|
-
function
|
|
384
|
+
function Vt(o, t) {
|
|
383
385
|
return { ...o ? It[o] : It.gentle, ...t };
|
|
384
386
|
}
|
|
385
|
-
function
|
|
387
|
+
function Jt(o, t) {
|
|
386
388
|
return { ...o ? Tt[o] : Tt.gentle, ...t };
|
|
387
389
|
}
|
|
388
|
-
class
|
|
390
|
+
class Kt {
|
|
389
391
|
constructor(t) {
|
|
390
392
|
this.activeAnimations = /* @__PURE__ */ new Map(), this.animationIdCounter = 0, this.config = t;
|
|
391
393
|
}
|
|
@@ -544,31 +546,31 @@ class Jt {
|
|
|
544
546
|
function J(o, t, i) {
|
|
545
547
|
return o + (t - o) * i;
|
|
546
548
|
}
|
|
547
|
-
function
|
|
548
|
-
const { overshoot: n, bounces: a, decayRatio: r } = e, s = i.x - t.x, c = i.y - t.y, l =
|
|
549
|
-
let u = 0, h = 0, d = 1,
|
|
550
|
-
for (let
|
|
551
|
-
if (o <= l[
|
|
552
|
-
h =
|
|
549
|
+
function Zt(o, t, i, e) {
|
|
550
|
+
const { overshoot: n, bounces: a, decayRatio: r } = e, s = i.x - t.x, c = i.y - t.y, l = Qt(a, r);
|
|
551
|
+
let u = 0, h = 0, d = 1, f = n, b = !1;
|
|
552
|
+
for (let g = 0; g < l.length; g++)
|
|
553
|
+
if (o <= l[g].time) {
|
|
554
|
+
h = g === 0 ? 0 : l[g - 1].time, d = l[g].time, f = l[g].overshoot, b = l[g].isOvershoot;
|
|
553
555
|
break;
|
|
554
556
|
}
|
|
555
|
-
const
|
|
557
|
+
const p = (o - h) / (d - h);
|
|
556
558
|
if (b)
|
|
557
|
-
u = 1 +
|
|
559
|
+
u = 1 + f * nt(p);
|
|
558
560
|
else if (h === 0)
|
|
559
|
-
u = nt(
|
|
561
|
+
u = nt(p);
|
|
560
562
|
else {
|
|
561
|
-
const
|
|
562
|
-
(y,
|
|
563
|
-
)?.overshoot ||
|
|
564
|
-
u = J(
|
|
563
|
+
const m = 1 + (l.find(
|
|
564
|
+
(y, w) => y.time > h && w > 0 && l[w - 1].isOvershoot
|
|
565
|
+
)?.overshoot || f);
|
|
566
|
+
u = J(m, 1, nt(p));
|
|
565
567
|
}
|
|
566
568
|
return {
|
|
567
569
|
x: t.x + s * u,
|
|
568
570
|
y: t.y + c * u
|
|
569
571
|
};
|
|
570
572
|
}
|
|
571
|
-
function
|
|
573
|
+
function Qt(o, t) {
|
|
572
574
|
const i = [];
|
|
573
575
|
let e = 0.6;
|
|
574
576
|
i.push({ time: e, overshoot: 0, isOvershoot: !1 });
|
|
@@ -578,12 +580,12 @@ function Zt(o, t) {
|
|
|
578
580
|
e += r, i.push({ time: e, overshoot: n, isOvershoot: !0 }), e += r, i.push({ time: e, overshoot: n * t, isOvershoot: !1 }), n *= t;
|
|
579
581
|
return i.push({ time: 1, overshoot: 0, isOvershoot: !1 }), i;
|
|
580
582
|
}
|
|
581
|
-
function
|
|
583
|
+
function te(o, t, i, e) {
|
|
582
584
|
const { stiffness: n, damping: a, mass: r, oscillations: s } = e, c = i.x - t.x, l = i.y - t.y, u = Math.sqrt(n / r), h = a / (2 * Math.sqrt(n * r));
|
|
583
585
|
let d;
|
|
584
586
|
if (h < 1) {
|
|
585
|
-
const
|
|
586
|
-
d = 1 - b *
|
|
587
|
+
const f = u * Math.sqrt(1 - h * h), b = Math.exp(-h * u * o * 3), p = Math.cos(f * o * s * Math.PI);
|
|
588
|
+
d = 1 - b * p;
|
|
587
589
|
} else
|
|
588
590
|
d = 1 - Math.exp(-u * o * 3);
|
|
589
591
|
return d = Math.max(0, Math.min(d, 1.3)), {
|
|
@@ -591,44 +593,44 @@ function Qt(o, t, i, e) {
|
|
|
591
593
|
y: t.y + l * d
|
|
592
594
|
};
|
|
593
595
|
}
|
|
594
|
-
function
|
|
595
|
-
const { amplitude: n, frequency: a, decay: r, decayRate: s, phase: c } = e, l = i.x - t.x, u = i.y - t.y, h = Math.sqrt(l * l + u * u), d = h > 0 ? -u / h : 0,
|
|
596
|
+
function ee(o, t, i, e) {
|
|
597
|
+
const { amplitude: n, frequency: a, decay: r, decayRate: s, phase: c } = e, l = i.x - t.x, u = i.y - t.y, h = Math.sqrt(l * l + u * u), d = h > 0 ? -u / h : 0, f = h > 0 ? l / h : 1, b = a * Math.PI * 2 * o + c, p = r ? Math.pow(1 - o, s) : 1, g = n * Math.sin(b) * p, m = ie(o);
|
|
596
598
|
return {
|
|
597
|
-
x: J(t.x, i.x,
|
|
598
|
-
y: J(t.y, i.y,
|
|
599
|
+
x: J(t.x, i.x, m) + g * d,
|
|
600
|
+
y: J(t.y, i.y, m) + g * f
|
|
599
601
|
};
|
|
600
602
|
}
|
|
601
603
|
function nt(o) {
|
|
602
604
|
return 1 - (1 - o) * (1 - o);
|
|
603
605
|
}
|
|
604
|
-
function
|
|
606
|
+
function ie(o) {
|
|
605
607
|
return 1 - Math.pow(1 - o, 3);
|
|
606
608
|
}
|
|
607
|
-
function
|
|
609
|
+
function oe(o, t, i) {
|
|
608
610
|
const { amplitude: e, frequency: n, decay: a } = i, r = Math.sin(o * n * Math.PI * 2), s = a ? Math.pow(1 - o, 2) : 1, c = e * r * s;
|
|
609
611
|
return t + c;
|
|
610
612
|
}
|
|
611
|
-
function
|
|
613
|
+
function ne(o, t, i) {
|
|
612
614
|
const { overshoot: e, bounces: n } = i, a = [];
|
|
613
615
|
a.push({ time: 0.5, scale: e });
|
|
614
616
|
let r = e;
|
|
615
617
|
const s = 0.5, l = 0.5 / (n * 2);
|
|
616
618
|
let u = 0.5;
|
|
617
619
|
for (let d = 0; d < n; d++) {
|
|
618
|
-
const
|
|
619
|
-
u += l, a.push({ time: u, scale:
|
|
620
|
+
const f = 1 - (r - 1) * s;
|
|
621
|
+
u += l, a.push({ time: u, scale: f }), r = 1 + (r - 1) * s * s, u += l, d < n - 1 && a.push({ time: u, scale: r });
|
|
620
622
|
}
|
|
621
623
|
a.push({ time: 1, scale: 1 });
|
|
622
624
|
let h = 1;
|
|
623
625
|
for (let d = 0; d < a.length; d++)
|
|
624
626
|
if (o <= a[d].time) {
|
|
625
|
-
const
|
|
626
|
-
h = b + (a[d].scale - b) *
|
|
627
|
+
const f = d === 0 ? 0 : a[d - 1].time, b = d === 0 ? 1 : a[d - 1].scale, p = (o - f) / (a[d].time - f), g = nt(p);
|
|
628
|
+
h = b + (a[d].scale - b) * g;
|
|
627
629
|
break;
|
|
628
630
|
}
|
|
629
631
|
return h * t;
|
|
630
632
|
}
|
|
631
|
-
function
|
|
633
|
+
function se(o) {
|
|
632
634
|
const {
|
|
633
635
|
element: t,
|
|
634
636
|
startPosition: i,
|
|
@@ -642,60 +644,60 @@ function ne(o) {
|
|
|
642
644
|
onComplete: u,
|
|
643
645
|
rotationConfig: h,
|
|
644
646
|
startRotation: d,
|
|
645
|
-
scaleConfig:
|
|
647
|
+
scaleConfig: f,
|
|
646
648
|
startScale: b
|
|
647
|
-
} = o,
|
|
648
|
-
if ((
|
|
649
|
+
} = o, p = n.type, g = d !== void 0 && d !== c, m = h?.mode === "wobble", y = h?.wobble || { amplitude: 15, frequency: 3, decay: !0 }, w = g || m, v = b !== void 0 && b !== l, R = f?.mode === "pop", x = f?.pop || { overshoot: 1.2, bounces: 1 };
|
|
650
|
+
if ((p === "linear" || p === "arc") && !w && !(v || R)) {
|
|
649
651
|
u && u();
|
|
650
652
|
return;
|
|
651
653
|
}
|
|
652
|
-
const
|
|
653
|
-
function
|
|
654
|
-
const N =
|
|
655
|
-
let
|
|
656
|
-
switch (
|
|
654
|
+
const z = performance.now(), L = -r / 2, _ = -s / 2;
|
|
655
|
+
function O(H) {
|
|
656
|
+
const N = H - z, T = Math.min(N / a, 1);
|
|
657
|
+
let D;
|
|
658
|
+
switch (p) {
|
|
657
659
|
case "bounce": {
|
|
658
|
-
const
|
|
660
|
+
const j = Bt(
|
|
659
661
|
n.bouncePreset,
|
|
660
662
|
n.bounce
|
|
661
663
|
);
|
|
662
|
-
|
|
664
|
+
D = Zt(T, i, e, j);
|
|
663
665
|
break;
|
|
664
666
|
}
|
|
665
667
|
case "elastic": {
|
|
666
|
-
const
|
|
668
|
+
const j = Vt(
|
|
667
669
|
n.elasticPreset,
|
|
668
670
|
n.elastic
|
|
669
671
|
);
|
|
670
|
-
|
|
672
|
+
D = te(T, i, e, j);
|
|
671
673
|
break;
|
|
672
674
|
}
|
|
673
675
|
case "wave": {
|
|
674
|
-
const
|
|
676
|
+
const j = Jt(
|
|
675
677
|
n.wavePreset,
|
|
676
678
|
n.wave
|
|
677
679
|
);
|
|
678
|
-
|
|
680
|
+
D = ee(T, i, e, j);
|
|
679
681
|
break;
|
|
680
682
|
}
|
|
681
683
|
default:
|
|
682
|
-
|
|
684
|
+
D = {
|
|
683
685
|
x: J(i.x, e.x, T),
|
|
684
686
|
y: J(i.y, e.y, T)
|
|
685
687
|
};
|
|
686
688
|
}
|
|
687
|
-
const
|
|
689
|
+
const G = D.x - e.x, U = D.y - e.y;
|
|
690
|
+
let M;
|
|
691
|
+
m ? M = oe(T, c, y) : g ? M = J(d, c, T) : M = c;
|
|
688
692
|
let A;
|
|
689
|
-
|
|
690
|
-
let C;
|
|
691
|
-
S ? C = oe(T, l, E) : w ? C = J(b, l, T) : C = l, t.style.transform = `translate(${F}px, ${_}px) translate(${W}px, ${H}px) rotate(${A}deg) scale(${C})`, T < 1 ? requestAnimationFrame(U) : (t.style.transform = `translate(${F}px, ${_}px) rotate(${c}deg) scale(${l})`, u && u());
|
|
693
|
+
R ? A = ne(T, l, x) : v ? A = J(b, l, T) : A = l, t.style.transform = `translate(${L}px, ${_}px) translate(${G}px, ${U}px) rotate(${M}deg) scale(${A})`, T < 1 ? requestAnimationFrame(O) : (t.style.transform = `translate(${L}px, ${_}px) rotate(${c}deg) scale(${l})`, u && u());
|
|
692
694
|
}
|
|
693
|
-
requestAnimationFrame(
|
|
695
|
+
requestAnimationFrame(O);
|
|
694
696
|
}
|
|
695
|
-
function
|
|
697
|
+
function ae(o) {
|
|
696
698
|
return o === "bounce" || o === "elastic" || o === "wave";
|
|
697
699
|
}
|
|
698
|
-
const
|
|
700
|
+
const re = {
|
|
699
701
|
radial: "center",
|
|
700
702
|
spiral: "center",
|
|
701
703
|
grid: "top",
|
|
@@ -704,7 +706,7 @@ const ae = {
|
|
|
704
706
|
wave: "left",
|
|
705
707
|
honeycomb: "center"
|
|
706
708
|
};
|
|
707
|
-
class
|
|
709
|
+
class ce {
|
|
708
710
|
constructor(t, i) {
|
|
709
711
|
this.config = t, this.layoutAlgorithm = i, this.resolvedStartPosition = this.resolveStartPosition(), this.pathConfig = t.path || yt, this.rotationConfig = t.rotation || vt, this.scaleConfig = t.scale || wt;
|
|
710
712
|
}
|
|
@@ -712,7 +714,7 @@ class re {
|
|
|
712
714
|
* Get the effective start position, considering layout-aware defaults
|
|
713
715
|
*/
|
|
714
716
|
resolveStartPosition() {
|
|
715
|
-
return this.config.start.position ? this.config.start.position :
|
|
717
|
+
return this.config.start.position ? this.config.start.position : re[this.layoutAlgorithm] || "nearest-edge";
|
|
716
718
|
}
|
|
717
719
|
/**
|
|
718
720
|
* Calculate the starting position for an image's entry animation
|
|
@@ -751,8 +753,8 @@ class re {
|
|
|
751
753
|
*/
|
|
752
754
|
calculateNearestEdge(t, i, e, n) {
|
|
753
755
|
const a = t.x, r = t.y, s = a, c = e.width - a, l = r, u = e.height - r, h = Math.min(s, c, l, u);
|
|
754
|
-
let d = t.x,
|
|
755
|
-
return h === s ? d = -(i.width + n) : h === c ? d = e.width + n : h === l ?
|
|
756
|
+
let d = t.x, f = t.y;
|
|
757
|
+
return h === s ? d = -(i.width + n) : h === c ? d = e.width + n : h === l ? f = -(i.height + n) : f = e.height + n, { x: d, y: f };
|
|
756
758
|
}
|
|
757
759
|
/**
|
|
758
760
|
* Calculate start position from a specific edge
|
|
@@ -802,16 +804,16 @@ class re {
|
|
|
802
804
|
let c;
|
|
803
805
|
const l = r.radius || "120%";
|
|
804
806
|
if (typeof l == "string" && l.endsWith("%")) {
|
|
805
|
-
const
|
|
807
|
+
const p = parseFloat(l) / 100;
|
|
806
808
|
c = Math.sqrt(
|
|
807
809
|
e.width ** 2 + e.height ** 2
|
|
808
|
-
) *
|
|
810
|
+
) * p / 2;
|
|
809
811
|
} else
|
|
810
812
|
c = typeof l == "number" ? l : 500;
|
|
811
813
|
let u;
|
|
812
814
|
s === "even" ? u = n / a * 2 * Math.PI : u = Math.random() * 2 * Math.PI;
|
|
813
|
-
const h = e.width / 2, d = e.height / 2,
|
|
814
|
-
return { x:
|
|
815
|
+
const h = e.width / 2, d = e.height / 2, f = h + Math.cos(u) * c, b = d + Math.sin(u) * c;
|
|
816
|
+
return { x: f, y: b };
|
|
815
817
|
}
|
|
816
818
|
/**
|
|
817
819
|
* Get animation parameters for an image
|
|
@@ -831,8 +833,8 @@ class re {
|
|
|
831
833
|
* Uses pixel-based centering offset for reliable cross-browser behavior
|
|
832
834
|
*/
|
|
833
835
|
buildStartTransform(t, i, e, n, a, r, s, c) {
|
|
834
|
-
const l = t.x - i.x, u = t.y - i.y, h = s !== void 0 ? s : e, d = c !== void 0 ? c : n,
|
|
835
|
-
return t.useScale ? `${
|
|
836
|
+
const l = t.x - i.x, u = t.y - i.y, h = s !== void 0 ? s : e, d = c !== void 0 ? c : n, f = a !== void 0 ? -a / 2 : 0, b = r !== void 0 ? -r / 2 : 0, p = a !== void 0 ? `translate(${f}px, ${b}px)` : "translate(-50%, -50%)";
|
|
837
|
+
return t.useScale ? `${p} translate(${l}px, ${u}px) rotate(${h}deg) scale(0)` : `${p} translate(${l}px, ${u}px) rotate(${h}deg) scale(${d})`;
|
|
836
838
|
}
|
|
837
839
|
/**
|
|
838
840
|
* Build the final CSS transform string
|
|
@@ -857,7 +859,7 @@ class re {
|
|
|
857
859
|
* Check if the current path type requires JavaScript animation
|
|
858
860
|
*/
|
|
859
861
|
requiresJSAnimation() {
|
|
860
|
-
return
|
|
862
|
+
return ae(this.pathConfig.type);
|
|
861
863
|
}
|
|
862
864
|
/**
|
|
863
865
|
* Get the path configuration
|
|
@@ -1048,7 +1050,7 @@ class re {
|
|
|
1048
1050
|
return 1 - (1 - t) * (1 - t);
|
|
1049
1051
|
}
|
|
1050
1052
|
}
|
|
1051
|
-
class
|
|
1053
|
+
class le {
|
|
1052
1054
|
constructor(t, i = {}) {
|
|
1053
1055
|
this.config = t, this.imageConfig = i;
|
|
1054
1056
|
}
|
|
@@ -1060,17 +1062,17 @@ class ce {
|
|
|
1060
1062
|
* @returns Array of layout objects with position, rotation, scale
|
|
1061
1063
|
*/
|
|
1062
1064
|
generate(t, i, e = {}) {
|
|
1063
|
-
const n = [], { width: a, height: r } = i, s = this.config.spacing.padding, c = e.fixedHeight ?? 200, l = this.imageConfig.rotation?.mode ?? "none", u = this.imageConfig.rotation?.range?.min ?? -15, h = this.imageConfig.rotation?.range?.max ?? 15, d = this.imageConfig.sizing?.variance?.min ?? 1,
|
|
1064
|
-
for (let
|
|
1065
|
-
const I = this.random(
|
|
1066
|
-
id:
|
|
1065
|
+
const n = [], { width: a, height: r } = i, s = this.config.spacing.padding, c = e.fixedHeight ?? 200, l = this.imageConfig.rotation?.mode ?? "none", u = this.imageConfig.rotation?.range?.min ?? -15, h = this.imageConfig.rotation?.range?.max ?? 15, d = this.imageConfig.sizing?.variance?.min ?? 1, f = this.imageConfig.sizing?.variance?.max ?? 1, b = d !== 1 || f !== 1, g = c * 1.5 / 2, m = c / 2, y = a - s - g, w = r - s - m, v = s + g, R = s + m;
|
|
1066
|
+
for (let x = 0; x < t; x++) {
|
|
1067
|
+
const I = this.random(v, y), z = this.random(R, w), L = l === "random" ? this.random(u, h) : 0, _ = b ? this.random(d, f) : 1, O = c * _, H = {
|
|
1068
|
+
id: x,
|
|
1067
1069
|
x: I,
|
|
1068
|
-
y:
|
|
1069
|
-
rotation:
|
|
1070
|
+
y: z,
|
|
1071
|
+
rotation: L,
|
|
1070
1072
|
scale: _,
|
|
1071
|
-
baseSize:
|
|
1073
|
+
baseSize: O
|
|
1072
1074
|
};
|
|
1073
|
-
n.push(
|
|
1075
|
+
n.push(H);
|
|
1074
1076
|
}
|
|
1075
1077
|
return n;
|
|
1076
1078
|
}
|
|
@@ -1084,7 +1086,7 @@ class ce {
|
|
|
1084
1086
|
return Math.random() * (i - t) + t;
|
|
1085
1087
|
}
|
|
1086
1088
|
}
|
|
1087
|
-
class
|
|
1089
|
+
class he {
|
|
1088
1090
|
constructor(t, i = {}) {
|
|
1089
1091
|
this.config = t, this.imageConfig = i;
|
|
1090
1092
|
}
|
|
@@ -1096,47 +1098,53 @@ class le {
|
|
|
1096
1098
|
* @returns Array of layout objects with position, rotation, scale
|
|
1097
1099
|
*/
|
|
1098
1100
|
generate(t, i, e = {}) {
|
|
1099
|
-
const n = [], { width: a, height: r } = i, s = e.fixedHeight ?? 200, c = this.imageConfig.rotation?.mode ?? "none", l = this.imageConfig.rotation?.range?.min ?? -15, u = this.imageConfig.rotation?.range?.max ?? 15, h = this.imageConfig.sizing?.variance?.min ?? 1, d = this.imageConfig.sizing?.variance?.max ?? 1,
|
|
1101
|
+
const n = [], { width: a, height: r } = i, s = e.fixedHeight ?? 200, c = this.imageConfig.rotation?.mode ?? "none", l = this.imageConfig.rotation?.range?.min ?? -15, u = this.imageConfig.rotation?.range?.max ?? 15, h = this.imageConfig.sizing?.variance?.min ?? 1, d = this.imageConfig.sizing?.variance?.max ?? 1, f = h !== 1 || d !== 1, b = this.config.scaleDecay ?? 0, p = {
|
|
1102
|
+
..._t,
|
|
1103
|
+
...this.config.radial
|
|
1104
|
+
}, g = e.fixedHeight ?? s, m = a / 2, y = r / 2, w = Math.ceil(Math.sqrt(t)), v = this.config.spacing.padding ?? 50, R = Math.max(g * 0.8, Math.min(
|
|
1105
|
+
m - v - g / 2,
|
|
1106
|
+
y - v - g / 2
|
|
1107
|
+
));
|
|
1100
1108
|
if (t > 0) {
|
|
1101
|
-
const
|
|
1109
|
+
const z = f ? this.random(h, d) : 1, L = g * z;
|
|
1102
1110
|
n.push({
|
|
1103
1111
|
id: 0,
|
|
1104
|
-
x:
|
|
1105
|
-
y
|
|
1112
|
+
x: m,
|
|
1113
|
+
y,
|
|
1106
1114
|
rotation: c === "random" ? this.random(l * 0.33, u * 0.33) : 0,
|
|
1107
1115
|
// Less rotation for center
|
|
1108
|
-
scale:
|
|
1109
|
-
baseSize:
|
|
1116
|
+
scale: z,
|
|
1117
|
+
baseSize: L,
|
|
1110
1118
|
zIndex: 100
|
|
1111
1119
|
// Center image is highest
|
|
1112
1120
|
});
|
|
1113
1121
|
}
|
|
1114
|
-
let
|
|
1115
|
-
for (;
|
|
1116
|
-
const
|
|
1117
|
-
if (
|
|
1118
|
-
|
|
1122
|
+
let x = 1, I = 1;
|
|
1123
|
+
for (; x < t; ) {
|
|
1124
|
+
const z = I / w, L = b > 0 ? 1 - z * b * 0.5 : 1, _ = Math.max(g * 0.8, R / w * 1.5 / p.tightness), O = I * _, H = O * 1.5, N = Math.PI * (3 * (H + O) - Math.sqrt((3 * H + O) * (H + 3 * O))), T = this.estimateWidth(g), D = Math.floor(N / (T * 0.7));
|
|
1125
|
+
if (D === 0) {
|
|
1126
|
+
I++;
|
|
1119
1127
|
continue;
|
|
1120
1128
|
}
|
|
1121
|
-
const
|
|
1122
|
-
for (let
|
|
1123
|
-
const
|
|
1124
|
-
let
|
|
1125
|
-
const
|
|
1126
|
-
|
|
1127
|
-
const
|
|
1129
|
+
const G = 2 * Math.PI / D, U = I * (20 * Math.PI / 180);
|
|
1130
|
+
for (let M = 0; M < D && x < t; M++) {
|
|
1131
|
+
const A = M * G + U, j = f ? this.random(h, d) : 1, X = L * j, C = g * X;
|
|
1132
|
+
let $ = m + Math.cos(A) * H, F = y + Math.sin(A) * O;
|
|
1133
|
+
const P = C * 1.5 / 2, W = C / 2;
|
|
1134
|
+
$ - P < v ? $ = v + P : $ + P > a - v && ($ = a - v - P), F - W < v ? F = v + W : F + W > r - v && (F = r - v - W);
|
|
1135
|
+
const B = c === "random" ? this.random(l, u) : 0;
|
|
1128
1136
|
n.push({
|
|
1129
|
-
id:
|
|
1130
|
-
x:
|
|
1131
|
-
y:
|
|
1132
|
-
rotation:
|
|
1133
|
-
scale:
|
|
1134
|
-
baseSize:
|
|
1135
|
-
zIndex: Math.max(1, 100 -
|
|
1137
|
+
id: x,
|
|
1138
|
+
x: $,
|
|
1139
|
+
y: F,
|
|
1140
|
+
rotation: B,
|
|
1141
|
+
scale: X,
|
|
1142
|
+
baseSize: C,
|
|
1143
|
+
zIndex: Math.max(1, 100 - I)
|
|
1136
1144
|
// Outer rings have lower z-index
|
|
1137
|
-
}),
|
|
1145
|
+
}), x++;
|
|
1138
1146
|
}
|
|
1139
|
-
|
|
1147
|
+
I++;
|
|
1140
1148
|
}
|
|
1141
1149
|
return n;
|
|
1142
1150
|
}
|
|
@@ -1159,7 +1167,7 @@ class le {
|
|
|
1159
1167
|
return Math.random() * (i - t) + t;
|
|
1160
1168
|
}
|
|
1161
1169
|
}
|
|
1162
|
-
const
|
|
1170
|
+
const de = {
|
|
1163
1171
|
columns: "auto",
|
|
1164
1172
|
rows: "auto",
|
|
1165
1173
|
stagger: "none",
|
|
@@ -1169,7 +1177,7 @@ const he = {
|
|
|
1169
1177
|
alignment: "center",
|
|
1170
1178
|
gap: 10,
|
|
1171
1179
|
overflowOffset: 0.25
|
|
1172
|
-
},
|
|
1180
|
+
}, At = [
|
|
1173
1181
|
{ x: 1, y: 1 },
|
|
1174
1182
|
// bottom-right
|
|
1175
1183
|
{ x: -1, y: -1 },
|
|
@@ -1187,7 +1195,7 @@ const he = {
|
|
|
1187
1195
|
{ x: 0, y: 1 }
|
|
1188
1196
|
// down
|
|
1189
1197
|
];
|
|
1190
|
-
class
|
|
1198
|
+
class ue {
|
|
1191
1199
|
constructor(t, i = {}) {
|
|
1192
1200
|
this.config = t, this.imageConfig = i;
|
|
1193
1201
|
}
|
|
@@ -1199,59 +1207,59 @@ class de {
|
|
|
1199
1207
|
* @returns Array of layout objects with position, rotation, scale
|
|
1200
1208
|
*/
|
|
1201
1209
|
generate(t, i, e = {}) {
|
|
1202
|
-
const n = [], { width: a, height: r } = i, s = { ...
|
|
1210
|
+
const n = [], { width: a, height: r } = i, s = { ...de, ...this.config.grid }, c = this.config.spacing.padding, l = e.fixedHeight ?? 200, u = this.imageConfig.rotation?.mode ?? "none", h = this.imageConfig.sizing?.variance?.min ?? 1, d = this.imageConfig.sizing?.variance?.max ?? 1, f = h !== 1 || d !== 1, b = a - 2 * c, p = r - 2 * c, { columns: g, rows: m } = this.calculateGridDimensions(
|
|
1203
1211
|
t,
|
|
1204
1212
|
b,
|
|
1205
|
-
|
|
1213
|
+
p,
|
|
1206
1214
|
l,
|
|
1207
1215
|
s
|
|
1208
|
-
), y = s.stagger === "row",
|
|
1216
|
+
), y = s.stagger === "row", w = s.stagger === "column", v = y ? g + 0.5 : g, R = w ? m + 0.5 : m, x = (b - s.gap * (g - 1)) / v, I = (p - s.gap * (m - 1)) / R, z = y ? x / 2 : 0, L = w ? I / 2 : 0, _ = 1 + s.overlap, O = Math.min(x, I) * _, H = e.fixedHeight ? Math.min(e.fixedHeight, O) : O, N = g * x + (g - 1) * s.gap + z, T = m * I + (m - 1) * s.gap + L, D = c + (b - N) / 2, G = c + (p - T) / 2, U = g * m, M = s.columns !== "auto" && s.rows !== "auto", A = M && t > U;
|
|
1209
1217
|
typeof window < "u" && (window.__gridOverflowDebug = {
|
|
1210
1218
|
gridConfigColumns: s.columns,
|
|
1211
1219
|
gridConfigRows: s.rows,
|
|
1212
|
-
columns:
|
|
1213
|
-
rows:
|
|
1214
|
-
cellCount:
|
|
1215
|
-
hasFixedGrid:
|
|
1220
|
+
columns: g,
|
|
1221
|
+
rows: m,
|
|
1222
|
+
cellCount: U,
|
|
1223
|
+
hasFixedGrid: M,
|
|
1216
1224
|
imageCount: t,
|
|
1217
|
-
isOverflowMode:
|
|
1225
|
+
isOverflowMode: A
|
|
1218
1226
|
});
|
|
1219
|
-
const
|
|
1220
|
-
for (let
|
|
1221
|
-
let
|
|
1222
|
-
if (
|
|
1223
|
-
const q =
|
|
1224
|
-
|
|
1227
|
+
const j = A ? new Array(U).fill(0) : [], X = Math.min(x, I) * s.overflowOffset;
|
|
1228
|
+
for (let C = 0; C < t; C++) {
|
|
1229
|
+
let $, F, Y = 0;
|
|
1230
|
+
if (A && C >= U) {
|
|
1231
|
+
const q = C - U, k = q % U;
|
|
1232
|
+
Y = Math.floor(q / U) + 1, j[k]++, s.fillDirection === "row" ? ($ = k % g, F = Math.floor(k / g)) : (F = k % m, $ = Math.floor(k / m));
|
|
1225
1233
|
} else
|
|
1226
|
-
s.fillDirection === "row" ? (
|
|
1227
|
-
let
|
|
1228
|
-
if (s.stagger === "row" &&
|
|
1229
|
-
const q = (
|
|
1230
|
-
|
|
1234
|
+
s.fillDirection === "row" ? ($ = C % g, F = Math.floor(C / g)) : (F = C % m, $ = Math.floor(C / m));
|
|
1235
|
+
let P = D + $ * (x + s.gap) + x / 2, W = G + F * (I + s.gap) + I / 2;
|
|
1236
|
+
if (s.stagger === "row" && F % 2 === 1 ? P += x / 2 : s.stagger === "column" && $ % 2 === 1 && (W += I / 2), Y > 0) {
|
|
1237
|
+
const q = (Y - 1) % At.length, k = At[q];
|
|
1238
|
+
P += k.x * X, W += k.y * X;
|
|
1231
1239
|
}
|
|
1232
1240
|
if (s.jitter > 0) {
|
|
1233
|
-
const q =
|
|
1234
|
-
|
|
1241
|
+
const q = x / 2 * s.jitter, k = I / 2 * s.jitter;
|
|
1242
|
+
P += this.random(-q, q), W += this.random(-k, k);
|
|
1235
1243
|
}
|
|
1236
|
-
let B =
|
|
1237
|
-
if (!
|
|
1238
|
-
const q = t %
|
|
1239
|
-
if (
|
|
1240
|
-
const St = q *
|
|
1244
|
+
let B = P, V = W;
|
|
1245
|
+
if (!A && s.fillDirection === "row") {
|
|
1246
|
+
const q = t % g || g;
|
|
1247
|
+
if (F === Math.floor((t - 1) / g) && q < g) {
|
|
1248
|
+
const St = q * x + (q - 1) * s.gap;
|
|
1241
1249
|
let gt = 0;
|
|
1242
1250
|
s.alignment === "center" ? gt = (N - St) / 2 : s.alignment === "end" && (gt = N - St), B += gt;
|
|
1243
1251
|
}
|
|
1244
1252
|
}
|
|
1245
|
-
const rt =
|
|
1253
|
+
const rt = f ? this.random(h, d) : 1, K = H * rt, it = K * 1.5 / 2, ot = K / 2, lt = c + it, ht = a - c - it, $t = c + ot, Pt = r - c - ot;
|
|
1246
1254
|
B = Math.max(lt, Math.min(B, ht)), V = Math.max($t, Math.min(V, Pt));
|
|
1247
1255
|
let dt = 0;
|
|
1248
1256
|
if (u === "random") {
|
|
1249
|
-
const q = this.imageConfig.rotation?.range?.min ?? -15,
|
|
1250
|
-
s.jitter > 0 ? dt = this.random(q * s.jitter,
|
|
1257
|
+
const q = this.imageConfig.rotation?.range?.min ?? -15, k = this.imageConfig.rotation?.range?.max ?? 15;
|
|
1258
|
+
s.jitter > 0 ? dt = this.random(q * s.jitter, k * s.jitter) : dt = this.random(q, k);
|
|
1251
1259
|
}
|
|
1252
1260
|
let ut;
|
|
1253
|
-
|
|
1254
|
-
id:
|
|
1261
|
+
A && Y > 0 ? ut = 50 - Y : ut = A ? 100 + C : C + 1, n.push({
|
|
1262
|
+
id: C,
|
|
1255
1263
|
x: B,
|
|
1256
1264
|
y: V,
|
|
1257
1265
|
rotation: dt,
|
|
@@ -1287,14 +1295,14 @@ class de {
|
|
|
1287
1295
|
return Math.random() * (i - t) + t;
|
|
1288
1296
|
}
|
|
1289
1297
|
}
|
|
1290
|
-
const
|
|
1298
|
+
const ge = Math.PI * (3 - Math.sqrt(5)), fe = {
|
|
1291
1299
|
spiralType: "golden",
|
|
1292
1300
|
direction: "counterclockwise",
|
|
1293
1301
|
tightness: 1,
|
|
1294
1302
|
scaleDecay: 0,
|
|
1295
1303
|
startAngle: 0
|
|
1296
1304
|
};
|
|
1297
|
-
class
|
|
1305
|
+
class me {
|
|
1298
1306
|
constructor(t, i = {}) {
|
|
1299
1307
|
this.config = t, this.imageConfig = i;
|
|
1300
1308
|
}
|
|
@@ -1306,36 +1314,36 @@ class fe {
|
|
|
1306
1314
|
* @returns Array of layout objects with position, rotation, scale
|
|
1307
1315
|
*/
|
|
1308
1316
|
generate(t, i, e = {}) {
|
|
1309
|
-
const n = [], { width: a, height: r } = i, s = { ...
|
|
1310
|
-
|
|
1317
|
+
const n = [], { width: a, height: r } = i, s = { ...fe, ...this.config.spiral }, c = this.config.spacing.padding, l = e.fixedHeight ?? 200, u = this.imageConfig.rotation?.mode ?? "none", h = this.imageConfig.rotation?.range?.min ?? -15, d = this.imageConfig.rotation?.range?.max ?? 15, f = this.imageConfig.sizing?.variance?.min ?? 1, b = this.imageConfig.sizing?.variance?.max ?? 1, p = f !== 1 || b !== 1, g = this.config.scaleDecay ?? s.scaleDecay, m = a / 2, y = r / 2, w = Math.min(
|
|
1318
|
+
m - c - l / 2,
|
|
1311
1319
|
y - c - l / 2
|
|
1312
|
-
),
|
|
1313
|
-
for (let
|
|
1314
|
-
let
|
|
1320
|
+
), v = s.direction === "clockwise" ? -1 : 1;
|
|
1321
|
+
for (let R = 0; R < t; R++) {
|
|
1322
|
+
let x, I;
|
|
1315
1323
|
if (s.spiralType === "golden")
|
|
1316
|
-
|
|
1324
|
+
x = R * ge * v + s.startAngle, I = this.calculateGoldenRadius(R, t, w, s.tightness);
|
|
1317
1325
|
else if (s.spiralType === "archimedean") {
|
|
1318
|
-
const
|
|
1319
|
-
|
|
1326
|
+
const P = R * 0.5 * s.tightness;
|
|
1327
|
+
x = P * v + s.startAngle, I = this.calculateArchimedeanRadius(P, t, w, s.tightness);
|
|
1320
1328
|
} else {
|
|
1321
|
-
const
|
|
1322
|
-
|
|
1329
|
+
const P = R * 0.3 * s.tightness;
|
|
1330
|
+
x = P * v + s.startAngle, I = this.calculateLogarithmicRadius(P, t, w, s.tightness);
|
|
1323
1331
|
}
|
|
1324
|
-
const
|
|
1325
|
-
let
|
|
1332
|
+
const z = m + Math.cos(x) * I, L = y + Math.sin(x) * I, _ = I / w, O = g > 0 ? 1 - _ * g * 0.5 : 1, H = p ? this.random(f, b) : 1, N = O * H, T = l * N, G = T * 1.5 / 2, U = T / 2, M = c + G, A = a - c - G, j = c + U, X = r - c - U, C = Math.max(M, Math.min(z, A)), $ = Math.max(j, Math.min(L, X));
|
|
1333
|
+
let F = 0;
|
|
1326
1334
|
if (u === "random") {
|
|
1327
|
-
const
|
|
1328
|
-
|
|
1329
|
-
} else u === "tangent" && (
|
|
1330
|
-
const
|
|
1335
|
+
const P = x * 180 / Math.PI % 360, W = this.random(h, d);
|
|
1336
|
+
F = s.spiralType === "golden" ? W : P * 0.1 + W * 0.9;
|
|
1337
|
+
} else u === "tangent" && (F = this.calculateSpiralTangent(x, I, s));
|
|
1338
|
+
const Y = t - R;
|
|
1331
1339
|
n.push({
|
|
1332
|
-
id:
|
|
1333
|
-
x:
|
|
1334
|
-
y:
|
|
1335
|
-
rotation:
|
|
1340
|
+
id: R,
|
|
1341
|
+
x: C,
|
|
1342
|
+
y: $,
|
|
1343
|
+
rotation: F,
|
|
1336
1344
|
scale: N,
|
|
1337
1345
|
baseSize: T,
|
|
1338
|
-
zIndex:
|
|
1346
|
+
zIndex: Y
|
|
1339
1347
|
});
|
|
1340
1348
|
}
|
|
1341
1349
|
return n;
|
|
@@ -1388,7 +1396,7 @@ class fe {
|
|
|
1388
1396
|
return Math.random() * (i - t) + t;
|
|
1389
1397
|
}
|
|
1390
1398
|
}
|
|
1391
|
-
const
|
|
1399
|
+
const pe = {
|
|
1392
1400
|
clusterCount: "auto",
|
|
1393
1401
|
clusterSpread: 150,
|
|
1394
1402
|
clusterSpacing: 200,
|
|
@@ -1396,7 +1404,7 @@ const me = {
|
|
|
1396
1404
|
overlap: 0.3,
|
|
1397
1405
|
distribution: "gaussian"
|
|
1398
1406
|
};
|
|
1399
|
-
class
|
|
1407
|
+
class be {
|
|
1400
1408
|
constructor(t, i = {}) {
|
|
1401
1409
|
this.config = t, this.imageConfig = i;
|
|
1402
1410
|
}
|
|
@@ -1408,48 +1416,48 @@ class pe {
|
|
|
1408
1416
|
* @returns Array of layout objects with position, rotation, scale
|
|
1409
1417
|
*/
|
|
1410
1418
|
generate(t, i, e = {}) {
|
|
1411
|
-
const n = [], { width: a, height: r } = i, s = { ...
|
|
1419
|
+
const n = [], { width: a, height: r } = i, s = { ...pe, ...this.config.cluster }, c = this.config.spacing.padding, l = e.fixedHeight ?? 200, u = this.imageConfig.rotation?.mode ?? "none", h = this.imageConfig.rotation?.range?.min ?? -15, d = this.imageConfig.rotation?.range?.max ?? 15, f = this.imageConfig.sizing?.variance?.min ?? 1, b = this.imageConfig.sizing?.variance?.max ?? 1, p = f !== 1 || b !== 1, g = this.calculateClusterCount(
|
|
1412
1420
|
t,
|
|
1413
1421
|
s.clusterCount,
|
|
1414
1422
|
a,
|
|
1415
1423
|
r,
|
|
1416
1424
|
s.clusterSpacing
|
|
1417
|
-
),
|
|
1418
|
-
|
|
1425
|
+
), m = this.generateClusterCenters(
|
|
1426
|
+
g,
|
|
1419
1427
|
a,
|
|
1420
1428
|
r,
|
|
1421
1429
|
c,
|
|
1422
1430
|
s
|
|
1423
|
-
), y = new Array(
|
|
1424
|
-
for (let
|
|
1425
|
-
y[
|
|
1426
|
-
let
|
|
1427
|
-
for (let
|
|
1428
|
-
const
|
|
1429
|
-
for (let I = 0; I <
|
|
1430
|
-
let
|
|
1431
|
+
), y = new Array(g).fill(0);
|
|
1432
|
+
for (let v = 0; v < t; v++)
|
|
1433
|
+
y[v % g]++;
|
|
1434
|
+
let w = 0;
|
|
1435
|
+
for (let v = 0; v < g; v++) {
|
|
1436
|
+
const R = m[v], x = y[v];
|
|
1437
|
+
for (let I = 0; I < x; I++) {
|
|
1438
|
+
let z, L;
|
|
1431
1439
|
if (s.distribution === "gaussian")
|
|
1432
|
-
|
|
1440
|
+
z = this.gaussianRandom() * R.spread, L = this.gaussianRandom() * R.spread;
|
|
1433
1441
|
else {
|
|
1434
|
-
const
|
|
1435
|
-
|
|
1442
|
+
const F = this.random(0, Math.PI * 2), Y = this.random(0, R.spread);
|
|
1443
|
+
z = Math.cos(F) * Y, L = Math.sin(F) * Y;
|
|
1436
1444
|
}
|
|
1437
|
-
const _ = 1 + s.overlap * 0.5,
|
|
1438
|
-
|
|
1439
|
-
const
|
|
1440
|
-
let
|
|
1441
|
-
const
|
|
1442
|
-
|
|
1443
|
-
const
|
|
1445
|
+
const _ = 1 + s.overlap * 0.5, O = 1 + s.overlap * 0.3;
|
|
1446
|
+
z /= _, L /= _;
|
|
1447
|
+
const H = p ? this.random(f, b) : 1, N = O * H, T = l * N;
|
|
1448
|
+
let D = R.x + z, G = R.y + L;
|
|
1449
|
+
const M = T * 1.5 / 2, A = T / 2;
|
|
1450
|
+
D = Math.max(c + M, Math.min(D, a - c - M)), G = Math.max(c + A, Math.min(G, r - c - A));
|
|
1451
|
+
const j = u === "random" ? this.random(h, d) : 0, C = Math.sqrt(z * z + L * L) / R.spread, $ = Math.round((1 - C) * 50) + 1;
|
|
1444
1452
|
n.push({
|
|
1445
|
-
id:
|
|
1446
|
-
x:
|
|
1447
|
-
y:
|
|
1448
|
-
rotation:
|
|
1453
|
+
id: w,
|
|
1454
|
+
x: D,
|
|
1455
|
+
y: G,
|
|
1456
|
+
rotation: j,
|
|
1449
1457
|
scale: N,
|
|
1450
1458
|
baseSize: T,
|
|
1451
|
-
zIndex:
|
|
1452
|
-
}),
|
|
1459
|
+
zIndex: $
|
|
1460
|
+
}), w++;
|
|
1453
1461
|
}
|
|
1454
1462
|
}
|
|
1455
1463
|
return n;
|
|
@@ -1471,22 +1479,22 @@ class pe {
|
|
|
1471
1479
|
generateClusterCenters(t, i, e, n, a) {
|
|
1472
1480
|
const r = [], c = n + a.clusterSpread, l = i - n - a.clusterSpread, u = n + a.clusterSpread, h = e - n - a.clusterSpread;
|
|
1473
1481
|
for (let d = 0; d < t; d++) {
|
|
1474
|
-
let
|
|
1475
|
-
for (let
|
|
1476
|
-
const
|
|
1482
|
+
let f = null, b = -1;
|
|
1483
|
+
for (let p = 0; p < 100; p++) {
|
|
1484
|
+
const g = {
|
|
1477
1485
|
x: this.random(c, l),
|
|
1478
1486
|
y: this.random(u, h),
|
|
1479
1487
|
spread: this.calculateClusterSpread(a)
|
|
1480
1488
|
};
|
|
1481
|
-
let
|
|
1489
|
+
let m = 1 / 0;
|
|
1482
1490
|
for (const y of r) {
|
|
1483
|
-
const
|
|
1484
|
-
|
|
1491
|
+
const w = g.x - y.x, v = g.y - y.y, R = Math.sqrt(w * w + v * v);
|
|
1492
|
+
m = Math.min(m, R);
|
|
1485
1493
|
}
|
|
1486
|
-
if ((r.length === 0 ||
|
|
1494
|
+
if ((r.length === 0 || m > b) && (f = g, b = m), m >= a.clusterSpacing)
|
|
1487
1495
|
break;
|
|
1488
1496
|
}
|
|
1489
|
-
|
|
1497
|
+
f && r.push(f);
|
|
1490
1498
|
}
|
|
1491
1499
|
return r;
|
|
1492
1500
|
}
|
|
@@ -1514,7 +1522,7 @@ class pe {
|
|
|
1514
1522
|
return Math.random() * (i - t) + t;
|
|
1515
1523
|
}
|
|
1516
1524
|
}
|
|
1517
|
-
class
|
|
1525
|
+
class ye {
|
|
1518
1526
|
constructor(t, i = {}) {
|
|
1519
1527
|
this.config = t, this.imageConfig = i;
|
|
1520
1528
|
}
|
|
@@ -1526,29 +1534,29 @@ class be {
|
|
|
1526
1534
|
* @returns Array of layout objects with position, rotation, scale
|
|
1527
1535
|
*/
|
|
1528
1536
|
generate(t, i, e = {}) {
|
|
1529
|
-
const n = [], { width: a, height: r } = i, s = e.fixedHeight ?? 200, c = this.config.spacing.padding ?? 50, l = this.imageConfig.rotation?.mode ?? "none", u = this.imageConfig.rotation?.range?.min ?? -15, h = this.imageConfig.rotation?.range?.max ?? 15, d = this.imageConfig.sizing?.variance?.min ?? 1,
|
|
1530
|
-
...
|
|
1537
|
+
const n = [], { width: a, height: r } = i, s = e.fixedHeight ?? 200, c = this.config.spacing.padding ?? 50, l = this.imageConfig.rotation?.mode ?? "none", u = this.imageConfig.rotation?.range?.min ?? -15, h = this.imageConfig.rotation?.range?.max ?? 15, d = this.imageConfig.sizing?.variance?.min ?? 1, f = this.imageConfig.sizing?.variance?.max ?? 1, b = d !== 1 || f !== 1, p = e.fixedHeight ?? s, g = {
|
|
1538
|
+
...Ut,
|
|
1531
1539
|
...this.config.wave
|
|
1532
|
-
}, { rows:
|
|
1533
|
-
let
|
|
1534
|
-
for (let
|
|
1535
|
-
const
|
|
1536
|
-
let
|
|
1537
|
-
|
|
1538
|
-
for (let
|
|
1539
|
-
const
|
|
1540
|
+
}, { rows: m, amplitude: y, frequency: w, phaseShift: v, synchronization: R } = g, x = Math.ceil(t / m), L = p * 1.5 / 2, _ = c + L, O = a - c - L, H = O - _, N = x > 1 ? H / (x - 1) : 0, T = c + y + p / 2, D = r - c - y - p / 2, G = D - T, U = m > 1 ? G / (m - 1) : 0;
|
|
1541
|
+
let M = 0;
|
|
1542
|
+
for (let A = 0; A < m && M < t; A++) {
|
|
1543
|
+
const j = m === 1 ? (T + D) / 2 : T + A * U;
|
|
1544
|
+
let X = 0;
|
|
1545
|
+
R === "offset" ? X = A * v : R === "alternating" && (X = A * Math.PI);
|
|
1546
|
+
for (let C = 0; C < x && M < t; C++) {
|
|
1547
|
+
const $ = x === 1 ? (_ + O) / 2 : _ + C * N, F = this.calculateWaveY($, a, y, w, X), Y = $, P = j + F, W = b ? this.random(d, f) : 1, B = p * W;
|
|
1540
1548
|
let V = 0;
|
|
1541
|
-
l === "tangent" ? V = this.calculateRotation(
|
|
1549
|
+
l === "tangent" ? V = this.calculateRotation($, a, y, w, X) : l === "random" && (V = this.random(u, h));
|
|
1542
1550
|
const K = B * 1.5 / 2, ct = B / 2, it = c + K, ot = a - c - K, lt = c + ct, ht = r - c - ct;
|
|
1543
1551
|
n.push({
|
|
1544
|
-
id:
|
|
1545
|
-
x: Math.max(it, Math.min(
|
|
1546
|
-
y: Math.max(lt, Math.min(
|
|
1552
|
+
id: M,
|
|
1553
|
+
x: Math.max(it, Math.min(Y, ot)),
|
|
1554
|
+
y: Math.max(lt, Math.min(P, ht)),
|
|
1547
1555
|
rotation: V,
|
|
1548
|
-
scale:
|
|
1556
|
+
scale: W,
|
|
1549
1557
|
baseSize: B,
|
|
1550
|
-
zIndex:
|
|
1551
|
-
}),
|
|
1558
|
+
zIndex: M + 1
|
|
1559
|
+
}), M++;
|
|
1552
1560
|
}
|
|
1553
1561
|
}
|
|
1554
1562
|
return n;
|
|
@@ -1604,21 +1612,21 @@ const xt = 100, Q = 100 / Math.sqrt(3), Et = [
|
|
|
1604
1612
|
// lower-left
|
|
1605
1613
|
[0, 50]
|
|
1606
1614
|
// left
|
|
1607
|
-
],
|
|
1608
|
-
function
|
|
1615
|
+
], ve = Et[1][0] / xt, we = Et[2][1] / xt;
|
|
1616
|
+
function xe(o) {
|
|
1609
1617
|
return {
|
|
1610
|
-
colStep:
|
|
1611
|
-
rowOffset:
|
|
1618
|
+
colStep: ve * o,
|
|
1619
|
+
rowOffset: we * o
|
|
1612
1620
|
};
|
|
1613
1621
|
}
|
|
1614
|
-
function
|
|
1615
|
-
const { colStep: r } =
|
|
1622
|
+
function Ee(o, t, i, e, n, a) {
|
|
1623
|
+
const { colStep: r } = xe(a);
|
|
1616
1624
|
return {
|
|
1617
1625
|
px: e + r * o,
|
|
1618
1626
|
py: n + a * (t + o / 2)
|
|
1619
1627
|
};
|
|
1620
1628
|
}
|
|
1621
|
-
const
|
|
1629
|
+
const Se = [
|
|
1622
1630
|
[1, 0, -1],
|
|
1623
1631
|
[0, 1, -1],
|
|
1624
1632
|
[-1, 1, 0],
|
|
@@ -1626,16 +1634,16 @@ const Ee = [
|
|
|
1626
1634
|
[0, -1, 1],
|
|
1627
1635
|
[1, -1, 0]
|
|
1628
1636
|
];
|
|
1629
|
-
function
|
|
1637
|
+
function Re(o) {
|
|
1630
1638
|
if (o === 0) return [[0, 0, 0]];
|
|
1631
1639
|
const t = [];
|
|
1632
1640
|
let [i, e, n] = [0, -o, o];
|
|
1633
|
-
for (const [a, r, s] of
|
|
1641
|
+
for (const [a, r, s] of Se)
|
|
1634
1642
|
for (let c = 0; c < o; c++)
|
|
1635
1643
|
t.push([i, e, n]), i += a, e += r, n += s;
|
|
1636
1644
|
return t;
|
|
1637
1645
|
}
|
|
1638
|
-
class
|
|
1646
|
+
class Ie {
|
|
1639
1647
|
// imageConfig intentionally not stored — honeycomb forces uniform sizing (rotation/variance
|
|
1640
1648
|
// would break hex tiling). Kept as parameter for interface compatibility.
|
|
1641
1649
|
constructor(t, i = {}) {
|
|
@@ -1643,32 +1651,32 @@ class Re {
|
|
|
1643
1651
|
}
|
|
1644
1652
|
generate(t, i, e = {}) {
|
|
1645
1653
|
const n = [], { width: a, height: r } = i, s = a / 2, c = r / 2, l = e.fixedHeight ?? 200, h = {
|
|
1646
|
-
...
|
|
1654
|
+
...Ht,
|
|
1647
1655
|
...this.config.honeycomb
|
|
1648
1656
|
}.spacing ?? 0, d = l + h;
|
|
1649
|
-
let
|
|
1650
|
-
for (;
|
|
1651
|
-
const
|
|
1652
|
-
for (const [
|
|
1653
|
-
if (
|
|
1654
|
-
const { px:
|
|
1657
|
+
let f = 0, b = 0;
|
|
1658
|
+
for (; f < t; ) {
|
|
1659
|
+
const p = Re(b);
|
|
1660
|
+
for (const [g, m, y] of p) {
|
|
1661
|
+
if (f >= t) break;
|
|
1662
|
+
const { px: w, py: v } = Ee(g, m, y, s, c, d);
|
|
1655
1663
|
n.push({
|
|
1656
|
-
id:
|
|
1657
|
-
x:
|
|
1658
|
-
y:
|
|
1664
|
+
id: f,
|
|
1665
|
+
x: w,
|
|
1666
|
+
y: v,
|
|
1659
1667
|
rotation: 0,
|
|
1660
1668
|
scale: 1,
|
|
1661
1669
|
baseSize: l,
|
|
1662
1670
|
// Inner rings render above outer rings
|
|
1663
1671
|
zIndex: Math.max(1, 100 - b)
|
|
1664
|
-
}),
|
|
1672
|
+
}), f++;
|
|
1665
1673
|
}
|
|
1666
1674
|
b++;
|
|
1667
1675
|
}
|
|
1668
1676
|
return n;
|
|
1669
1677
|
}
|
|
1670
1678
|
}
|
|
1671
|
-
class
|
|
1679
|
+
class Te {
|
|
1672
1680
|
constructor(t) {
|
|
1673
1681
|
this.config = t.layout, this.imageConfig = t.image, this.layouts = /* @__PURE__ */ new Map(), this.placementLayout = this.initLayout();
|
|
1674
1682
|
}
|
|
@@ -1679,19 +1687,19 @@ class Ie {
|
|
|
1679
1687
|
initLayout() {
|
|
1680
1688
|
switch (this.config.algorithm) {
|
|
1681
1689
|
case "radial":
|
|
1682
|
-
return new
|
|
1690
|
+
return new he(this.config, this.imageConfig);
|
|
1683
1691
|
case "grid":
|
|
1684
|
-
return new
|
|
1692
|
+
return new ue(this.config, this.imageConfig);
|
|
1685
1693
|
case "spiral":
|
|
1686
|
-
return new
|
|
1694
|
+
return new me(this.config, this.imageConfig);
|
|
1687
1695
|
case "cluster":
|
|
1688
|
-
return new pe(this.config, this.imageConfig);
|
|
1689
|
-
case "wave":
|
|
1690
1696
|
return new be(this.config, this.imageConfig);
|
|
1697
|
+
case "wave":
|
|
1698
|
+
return new ye(this.config, this.imageConfig);
|
|
1691
1699
|
case "honeycomb":
|
|
1692
|
-
return new
|
|
1700
|
+
return new Ie(this.config, this.imageConfig);
|
|
1693
1701
|
default:
|
|
1694
|
-
return new
|
|
1702
|
+
return new le(this.config, this.imageConfig);
|
|
1695
1703
|
}
|
|
1696
1704
|
}
|
|
1697
1705
|
/**
|
|
@@ -1773,13 +1781,13 @@ class Ie {
|
|
|
1773
1781
|
const a = this.imageConfig.sizing, r = this.resolveBaseHeight(n);
|
|
1774
1782
|
if (r !== void 0)
|
|
1775
1783
|
return { height: r };
|
|
1776
|
-
const s = a?.minSize ?? 50, c = a?.maxSize ?? 400, l = this.config.targetCoverage ?? 0.6, u = this.config.densityFactor ?? 1, { width: h, height: d } = t,
|
|
1777
|
-
let
|
|
1778
|
-
|
|
1779
|
-
let y = this.clamp(
|
|
1780
|
-
if (y === s &&
|
|
1781
|
-
const
|
|
1782
|
-
y = Math.max(
|
|
1784
|
+
const s = a?.minSize ?? 50, c = a?.maxSize ?? 400, l = this.config.targetCoverage ?? 0.6, u = this.config.densityFactor ?? 1, { width: h, height: d } = t, p = h * d * l / i;
|
|
1785
|
+
let m = Math.sqrt(p / 1.4);
|
|
1786
|
+
m *= u, m = Math.min(m, e);
|
|
1787
|
+
let y = this.clamp(m, s, c);
|
|
1788
|
+
if (y === s && m < s) {
|
|
1789
|
+
const w = Math.max(s * 0.05, 20);
|
|
1790
|
+
y = Math.max(w, m);
|
|
1783
1791
|
}
|
|
1784
1792
|
return this.config.algorithm === "honeycomb" && (y = Math.min(y, this.honeycombMaxImageHeight(i, t))), { height: y };
|
|
1785
1793
|
}
|
|
@@ -1803,8 +1811,8 @@ class Ie {
|
|
|
1803
1811
|
return Math.max(i, Math.min(e, t));
|
|
1804
1812
|
}
|
|
1805
1813
|
}
|
|
1806
|
-
var
|
|
1807
|
-
const
|
|
1814
|
+
var S = /* @__PURE__ */ ((o) => (o.IDLE = "idle", o.FOCUSING = "focusing", o.FOCUSED = "focused", o.UNFOCUSING = "unfocusing", o.CROSS_ANIMATING = "cross_animating", o))(S || {});
|
|
1815
|
+
const Ct = {
|
|
1808
1816
|
// Geometric shapes - uses percentages for responsive sizing
|
|
1809
1817
|
circle: "circle(50%)",
|
|
1810
1818
|
square: "polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)",
|
|
@@ -1813,7 +1821,7 @@ const At = {
|
|
|
1813
1821
|
hexagon: "polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%)",
|
|
1814
1822
|
octagon: "polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%)",
|
|
1815
1823
|
diamond: "polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)"
|
|
1816
|
-
},
|
|
1824
|
+
}, Ae = {
|
|
1817
1825
|
// Circle - uses radius in pixels (refHeight of 100px = 50px radius)
|
|
1818
1826
|
circle: {
|
|
1819
1827
|
refHeight: 100,
|
|
@@ -1853,27 +1861,27 @@ const At = {
|
|
|
1853
1861
|
};
|
|
1854
1862
|
function Ce(o) {
|
|
1855
1863
|
if (o)
|
|
1856
|
-
return o in
|
|
1864
|
+
return o in Ct ? Ct[o] : o;
|
|
1857
1865
|
}
|
|
1858
|
-
function
|
|
1859
|
-
const e =
|
|
1866
|
+
function Le(o, t, i) {
|
|
1867
|
+
const e = Ae[o];
|
|
1860
1868
|
if (!e) return "";
|
|
1861
1869
|
const n = t / e.refHeight;
|
|
1862
1870
|
if (o === "circle")
|
|
1863
1871
|
return `circle(${Math.round(50 * n * 100) / 100}px)`;
|
|
1864
|
-
const a = e.points.map(([
|
|
1865
|
-
return `polygon(${e.points.map(([
|
|
1866
|
-
const
|
|
1867
|
-
return `${
|
|
1872
|
+
const a = e.points.map(([p]) => p), r = e.points.map(([, p]) => p), s = (Math.min(...a) + Math.max(...a)) / 2 * n, c = (Math.min(...r) + Math.max(...r)) / 2 * n, l = (Math.max(...a) - Math.min(...a)) * n, u = (i ?? l) / 2, h = t / 2, d = u - s, f = h - c;
|
|
1873
|
+
return `polygon(${e.points.map(([p, g]) => {
|
|
1874
|
+
const m = Math.round((p * n + d) * 100) / 100, y = Math.round((g * n + f) * 100) / 100;
|
|
1875
|
+
return `${m}px ${y}px`;
|
|
1868
1876
|
}).join(", ")})`;
|
|
1869
1877
|
}
|
|
1870
|
-
function Le(o) {
|
|
1871
|
-
return o in mt;
|
|
1872
|
-
}
|
|
1873
1878
|
function Me(o) {
|
|
1874
|
-
return o
|
|
1879
|
+
return o in mt;
|
|
1875
1880
|
}
|
|
1876
1881
|
function Fe(o) {
|
|
1882
|
+
return o ? Me(o) ? mt[o] : o : mt.md;
|
|
1883
|
+
}
|
|
1884
|
+
function ze(o) {
|
|
1877
1885
|
if (!o) return "";
|
|
1878
1886
|
const t = [];
|
|
1879
1887
|
if (o.grayscale !== void 0 && t.push(`grayscale(${o.grayscale})`), o.blur !== void 0 && t.push(`blur(${o.blur}px)`), o.brightness !== void 0 && t.push(`brightness(${o.brightness})`), o.contrast !== void 0 && t.push(`contrast(${o.contrast})`), o.saturate !== void 0 && t.push(`saturate(${o.saturate})`), o.opacity !== void 0 && t.push(`opacity(${o.opacity})`), o.sepia !== void 0 && t.push(`sepia(${o.sepia})`), o.hueRotate !== void 0 && t.push(`hue-rotate(${o.hueRotate}deg)`), o.invert !== void 0 && t.push(`invert(${o.invert})`), o.dropShadow !== void 0)
|
|
@@ -1902,8 +1910,8 @@ function et(o, t, i) {
|
|
|
1902
1910
|
const s = o.border || {}, c = { ...s, ...o.borderTop }, l = { ...s, ...o.borderRight }, u = { ...s, ...o.borderBottom }, h = { ...s, ...o.borderLeft };
|
|
1903
1911
|
e.borderTop = tt(c), e.borderRight = tt(l), e.borderBottom = tt(u), e.borderLeft = tt(h);
|
|
1904
1912
|
} else o.border && (e.border = tt(o.border));
|
|
1905
|
-
o.shadow !== void 0 && (e.boxShadow =
|
|
1906
|
-
const r =
|
|
1913
|
+
o.shadow !== void 0 && (e.boxShadow = Fe(o.shadow));
|
|
1914
|
+
const r = ze(o.filter);
|
|
1907
1915
|
if (e.filter = r || "none", o.opacity !== void 0 && (e.opacity = String(o.opacity)), o.cursor !== void 0 && (e.cursor = o.cursor), o.outline && o.outline.style !== "none" && (o.outline.width ?? 0) > 0) {
|
|
1908
1916
|
const s = o.outline.width ?? 0, c = o.outline.style ?? "solid", l = o.outline.color ?? "#000000";
|
|
1909
1917
|
e.outline = `${s}px ${c} ${l}`, o.outline.offset !== void 0 && (e.outlineOffset = `${o.outline.offset}px`);
|
|
@@ -1912,7 +1920,7 @@ function et(o, t, i) {
|
|
|
1912
1920
|
let s;
|
|
1913
1921
|
const c = typeof o.clipPath == "object" && o.clipPath !== null && "shape" in o.clipPath, l = c ? o.clipPath : void 0;
|
|
1914
1922
|
if (l?.mode === "height-relative" && t)
|
|
1915
|
-
s =
|
|
1923
|
+
s = Le(l.shape, t, i);
|
|
1916
1924
|
else {
|
|
1917
1925
|
const u = c && l ? l.shape : o.clipPath;
|
|
1918
1926
|
s = Ce(u);
|
|
@@ -1921,12 +1929,12 @@ function et(o, t, i) {
|
|
|
1921
1929
|
}
|
|
1922
1930
|
return e;
|
|
1923
1931
|
}
|
|
1924
|
-
function
|
|
1932
|
+
function Oe(o, t) {
|
|
1925
1933
|
t.borderRadius !== void 0 && (o.style.borderRadius = t.borderRadius), t.borderTopLeftRadius !== void 0 && (o.style.borderTopLeftRadius = t.borderTopLeftRadius), t.borderTopRightRadius !== void 0 && (o.style.borderTopRightRadius = t.borderTopRightRadius), t.borderBottomRightRadius !== void 0 && (o.style.borderBottomRightRadius = t.borderBottomRightRadius), t.borderBottomLeftRadius !== void 0 && (o.style.borderBottomLeftRadius = t.borderBottomLeftRadius), t.border !== void 0 && (o.style.border = t.border), t.borderTop !== void 0 && (o.style.borderTop = t.borderTop), t.borderRight !== void 0 && (o.style.borderRight = t.borderRight), t.borderBottom !== void 0 && (o.style.borderBottom = t.borderBottom), t.borderLeft !== void 0 && (o.style.borderLeft = t.borderLeft), t.boxShadow !== void 0 && (o.style.boxShadow = t.boxShadow), t.filter !== void 0 && (o.style.filter = t.filter), t.opacity !== void 0 && (o.style.opacity = t.opacity), t.cursor !== void 0 && (o.style.cursor = t.cursor), t.outline !== void 0 && (o.style.outline = t.outline), t.outlineOffset !== void 0 && (o.style.outlineOffset = t.outlineOffset), t.objectFit !== void 0 && (o.style.objectFit = t.objectFit), t.aspectRatio !== void 0 && (o.style.aspectRatio = t.aspectRatio), t.clipPath !== void 0 && (o.style.clipPath = t.clipPath), t.overflow !== void 0 && (o.style.overflow = t.overflow);
|
|
1926
1934
|
}
|
|
1927
1935
|
function ft(o, t, i, e) {
|
|
1928
1936
|
const n = et(t, i, e);
|
|
1929
|
-
|
|
1937
|
+
Oe(o, n);
|
|
1930
1938
|
}
|
|
1931
1939
|
function Dt(o) {
|
|
1932
1940
|
return o ? Array.isArray(o) ? o.join(" ") : o : "";
|
|
@@ -1947,9 +1955,9 @@ const Lt = {
|
|
|
1947
1955
|
UNFOCUSING: 999,
|
|
1948
1956
|
FOCUSING: 1e3
|
|
1949
1957
|
};
|
|
1950
|
-
class
|
|
1958
|
+
class De {
|
|
1951
1959
|
constructor(t, i, e) {
|
|
1952
|
-
this.state =
|
|
1960
|
+
this.state = S.IDLE, this.currentFocus = null, this.focusData = null, this.outgoing = null, this.incoming = null, this.focusGeneration = 0, this.config = t, this.animationEngine = i, this.styling = e, this.focusedClassName = e?.focused?.className;
|
|
1953
1961
|
}
|
|
1954
1962
|
/**
|
|
1955
1963
|
* Get current state machine state
|
|
@@ -1961,7 +1969,7 @@ class Oe {
|
|
|
1961
1969
|
* Check if any animation is in progress
|
|
1962
1970
|
*/
|
|
1963
1971
|
isAnimating() {
|
|
1964
|
-
return this.state !==
|
|
1972
|
+
return this.state !== S.IDLE && this.state !== S.FOCUSED;
|
|
1965
1973
|
}
|
|
1966
1974
|
/**
|
|
1967
1975
|
* Normalize scalePercent value
|
|
@@ -2080,19 +2088,19 @@ class Oe {
|
|
|
2080
2088
|
rotation: e.rotation,
|
|
2081
2089
|
scale: 1
|
|
2082
2090
|
// No scale - using dimensions
|
|
2083
|
-
},
|
|
2091
|
+
}, f = a?.width ?? s, b = a?.height ?? c, p = this.animateWithDimensions(
|
|
2084
2092
|
t,
|
|
2085
2093
|
d,
|
|
2086
2094
|
u,
|
|
2087
|
-
|
|
2095
|
+
f,
|
|
2088
2096
|
b,
|
|
2089
2097
|
l.width,
|
|
2090
2098
|
l.height,
|
|
2091
2099
|
h
|
|
2092
|
-
),
|
|
2100
|
+
), g = {
|
|
2093
2101
|
id: `focus-${Date.now()}`,
|
|
2094
2102
|
element: t,
|
|
2095
|
-
animation:
|
|
2103
|
+
animation: p,
|
|
2096
2104
|
fromState: d,
|
|
2097
2105
|
toState: u,
|
|
2098
2106
|
startTime: performance.now(),
|
|
@@ -2107,10 +2115,10 @@ class Oe {
|
|
|
2107
2115
|
originalHeight: c,
|
|
2108
2116
|
focusWidth: l.width,
|
|
2109
2117
|
focusHeight: l.height
|
|
2110
|
-
}, this.startClipPathAnimation(t,
|
|
2118
|
+
}, this.startClipPathAnimation(t, g, !0), {
|
|
2111
2119
|
element: t,
|
|
2112
2120
|
originalState: e,
|
|
2113
|
-
animationHandle:
|
|
2121
|
+
animationHandle: g,
|
|
2114
2122
|
direction: "in",
|
|
2115
2123
|
originalWidth: s,
|
|
2116
2124
|
originalHeight: c
|
|
@@ -2140,7 +2148,7 @@ class Oe {
|
|
|
2140
2148
|
u,
|
|
2141
2149
|
h,
|
|
2142
2150
|
a
|
|
2143
|
-
),
|
|
2151
|
+
), f = {
|
|
2144
2152
|
id: `unfocus-${Date.now()}`,
|
|
2145
2153
|
element: t,
|
|
2146
2154
|
animation: d,
|
|
@@ -2149,10 +2157,10 @@ class Oe {
|
|
|
2149
2157
|
startTime: performance.now(),
|
|
2150
2158
|
duration: a
|
|
2151
2159
|
};
|
|
2152
|
-
return this.startClipPathAnimation(t,
|
|
2160
|
+
return this.startClipPathAnimation(t, f, !1), {
|
|
2153
2161
|
element: t,
|
|
2154
2162
|
originalState: i,
|
|
2155
|
-
animationHandle:
|
|
2163
|
+
animationHandle: f,
|
|
2156
2164
|
direction: "out",
|
|
2157
2165
|
originalWidth: u,
|
|
2158
2166
|
originalHeight: h
|
|
@@ -2201,26 +2209,26 @@ class Oe {
|
|
|
2201
2209
|
* Implements cross-animation when swapping focus
|
|
2202
2210
|
*/
|
|
2203
2211
|
async focusImage(t, i, e) {
|
|
2204
|
-
if (this.currentFocus === t && this.state ===
|
|
2212
|
+
if (this.currentFocus === t && this.state === S.FOCUSED)
|
|
2205
2213
|
return this.unfocusImage();
|
|
2206
|
-
if (this.incoming?.element === t && this.state ===
|
|
2214
|
+
if (this.incoming?.element === t && this.state === S.FOCUSING) {
|
|
2207
2215
|
const { transform: a, dimensions: r } = this.captureMidAnimationState(t);
|
|
2208
2216
|
this.animationEngine.cancelAllAnimations(t), this.outgoing = this.startUnfocusAnimation(
|
|
2209
2217
|
t,
|
|
2210
2218
|
this.incoming.originalState,
|
|
2211
2219
|
a,
|
|
2212
2220
|
r
|
|
2213
|
-
), this.incoming = null, this.state =
|
|
2221
|
+
), this.incoming = null, this.state = S.UNFOCUSING, await this.waitForAnimation(this.outgoing.animationHandle), this.removeFocusedStyling(this.outgoing.element, this.focusData?.originalZIndex || ""), this.outgoing = null, this.currentFocus = null, this.focusData = null, this.state = S.IDLE;
|
|
2214
2222
|
return;
|
|
2215
2223
|
}
|
|
2216
2224
|
const n = ++this.focusGeneration;
|
|
2217
2225
|
switch (this.state) {
|
|
2218
|
-
case
|
|
2219
|
-
if (this.state =
|
|
2220
|
-
this.currentFocus = t, this.incoming = null, this.state =
|
|
2226
|
+
case S.IDLE:
|
|
2227
|
+
if (this.state = S.FOCUSING, this.incoming = this.startFocusAnimation(t, i, e), await this.waitForAnimation(this.incoming.animationHandle), this.focusGeneration !== n) return;
|
|
2228
|
+
this.currentFocus = t, this.incoming = null, this.state = S.FOCUSED;
|
|
2221
2229
|
break;
|
|
2222
|
-
case
|
|
2223
|
-
if (this.state =
|
|
2230
|
+
case S.FOCUSED:
|
|
2231
|
+
if (this.state = S.CROSS_ANIMATING, this.currentFocus && this.focusData && (this.outgoing = this.startUnfocusAnimation(
|
|
2224
2232
|
this.currentFocus,
|
|
2225
2233
|
this.focusData.originalState
|
|
2226
2234
|
)), this.incoming = this.startFocusAnimation(t, i, e), await Promise.all([
|
|
@@ -2228,9 +2236,9 @@ class Oe {
|
|
|
2228
2236
|
this.waitForAnimation(this.incoming.animationHandle)
|
|
2229
2237
|
]), this.focusGeneration !== n)
|
|
2230
2238
|
return;
|
|
2231
|
-
this.outgoing && (this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.outgoing = null), this.currentFocus = t, this.incoming = null, this.state =
|
|
2239
|
+
this.outgoing && (this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.outgoing = null), this.currentFocus = t, this.incoming = null, this.state = S.FOCUSED;
|
|
2232
2240
|
break;
|
|
2233
|
-
case
|
|
2241
|
+
case S.FOCUSING:
|
|
2234
2242
|
if (this.incoming && (this.animationEngine.cancelAnimation(this.incoming.animationHandle, !1), this.resetElementInstantly(
|
|
2235
2243
|
this.incoming.element,
|
|
2236
2244
|
this.incoming.originalState,
|
|
@@ -2238,16 +2246,16 @@ class Oe {
|
|
|
2238
2246
|
this.focusData?.originalWidth,
|
|
2239
2247
|
this.focusData?.originalHeight
|
|
2240
2248
|
), this.incoming = null), this.incoming = this.startFocusAnimation(t, i, e), await this.waitForAnimation(this.incoming.animationHandle), this.focusGeneration !== n) return;
|
|
2241
|
-
this.currentFocus = t, this.incoming = null, this.state =
|
|
2249
|
+
this.currentFocus = t, this.incoming = null, this.state = S.FOCUSED;
|
|
2242
2250
|
break;
|
|
2243
|
-
case
|
|
2244
|
-
if (this.state =
|
|
2251
|
+
case S.UNFOCUSING:
|
|
2252
|
+
if (this.state = S.CROSS_ANIMATING, this.incoming = this.startFocusAnimation(t, i, e), await Promise.all([
|
|
2245
2253
|
this.outgoing ? this.waitForAnimation(this.outgoing.animationHandle) : Promise.resolve(),
|
|
2246
2254
|
this.waitForAnimation(this.incoming.animationHandle)
|
|
2247
2255
|
]), this.focusGeneration !== n) return;
|
|
2248
|
-
this.outgoing && (this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.outgoing = null), this.currentFocus = t, this.incoming = null, this.state =
|
|
2256
|
+
this.outgoing && (this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.outgoing = null), this.currentFocus = t, this.incoming = null, this.state = S.FOCUSED;
|
|
2249
2257
|
break;
|
|
2250
|
-
case
|
|
2258
|
+
case S.CROSS_ANIMATING:
|
|
2251
2259
|
if (this.incoming?.element === t)
|
|
2252
2260
|
return;
|
|
2253
2261
|
if (this.outgoing?.element === t) {
|
|
@@ -2266,7 +2274,7 @@ class Oe {
|
|
|
2266
2274
|
this.outgoing ? this.waitForAnimation(this.outgoing.animationHandle) : Promise.resolve(),
|
|
2267
2275
|
this.waitForAnimation(this.incoming.animationHandle)
|
|
2268
2276
|
]), this.focusGeneration !== n) return;
|
|
2269
|
-
this.outgoing && (this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.outgoing = null), this.currentFocus = t, this.incoming = null, this.state =
|
|
2277
|
+
this.outgoing && (this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.outgoing = null), this.currentFocus = t, this.incoming = null, this.state = S.FOCUSED;
|
|
2270
2278
|
return;
|
|
2271
2279
|
}
|
|
2272
2280
|
if (this.outgoing && (this.animationEngine.cancelAnimation(this.outgoing.animationHandle, !1), this.resetElementInstantly(
|
|
@@ -2288,7 +2296,7 @@ class Oe {
|
|
|
2288
2296
|
this.outgoing ? this.waitForAnimation(this.outgoing.animationHandle) : Promise.resolve(),
|
|
2289
2297
|
this.waitForAnimation(this.incoming.animationHandle)
|
|
2290
2298
|
]), this.focusGeneration !== n) return;
|
|
2291
|
-
this.outgoing && (this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.outgoing = null), this.currentFocus = t, this.incoming = null, this.state =
|
|
2299
|
+
this.outgoing && (this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.outgoing = null), this.currentFocus = t, this.incoming = null, this.state = S.FOCUSED;
|
|
2292
2300
|
break;
|
|
2293
2301
|
}
|
|
2294
2302
|
}
|
|
@@ -2296,23 +2304,23 @@ class Oe {
|
|
|
2296
2304
|
* Unfocus current image, returning it to original position
|
|
2297
2305
|
*/
|
|
2298
2306
|
async unfocusImage() {
|
|
2299
|
-
if (this.state ===
|
|
2307
|
+
if (this.state === S.UNFOCUSING)
|
|
2300
2308
|
return;
|
|
2301
2309
|
const t = ++this.focusGeneration;
|
|
2302
2310
|
if (!this.currentFocus || !this.focusData) {
|
|
2303
|
-
if (this.incoming && this.state ===
|
|
2311
|
+
if (this.incoming && this.state === S.FOCUSING) {
|
|
2304
2312
|
const { transform: a, dimensions: r } = this.captureMidAnimationState(this.incoming.element);
|
|
2305
2313
|
if (this.animationEngine.cancelAllAnimations(this.incoming.element), this.outgoing = this.startUnfocusAnimation(
|
|
2306
2314
|
this.incoming.element,
|
|
2307
2315
|
this.incoming.originalState,
|
|
2308
2316
|
a,
|
|
2309
2317
|
r
|
|
2310
|
-
), this.incoming = null, this.state =
|
|
2311
|
-
this.removeFocusedStyling(this.outgoing.element, this.focusData?.originalZIndex || ""), this.outgoing = null, this.focusData = null, this.state =
|
|
2318
|
+
), this.incoming = null, this.state = S.UNFOCUSING, await this.waitForAnimation(this.outgoing.animationHandle), this.focusGeneration !== t) return;
|
|
2319
|
+
this.removeFocusedStyling(this.outgoing.element, this.focusData?.originalZIndex || ""), this.outgoing = null, this.focusData = null, this.state = S.IDLE;
|
|
2312
2320
|
}
|
|
2313
2321
|
return;
|
|
2314
2322
|
}
|
|
2315
|
-
if (this.state ===
|
|
2323
|
+
if (this.state === S.CROSS_ANIMATING && this.incoming) {
|
|
2316
2324
|
const { transform: a, dimensions: r } = this.captureMidAnimationState(this.incoming.element);
|
|
2317
2325
|
this.animationEngine.cancelAllAnimations(this.incoming.element);
|
|
2318
2326
|
const s = this.startUnfocusAnimation(
|
|
@@ -2325,12 +2333,12 @@ class Oe {
|
|
|
2325
2333
|
this.outgoing ? this.waitForAnimation(this.outgoing.animationHandle) : Promise.resolve(),
|
|
2326
2334
|
this.waitForAnimation(s.animationHandle)
|
|
2327
2335
|
]), this.focusGeneration !== t) return;
|
|
2328
|
-
this.outgoing && this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.removeFocusedStyling(s.element, this.incoming.originalState.zIndex?.toString() || ""), this.outgoing = null, this.incoming = null, this.currentFocus = null, this.focusData = null, this.state =
|
|
2336
|
+
this.outgoing && this.removeFocusedStyling(this.outgoing.element, this.outgoing.originalState.zIndex?.toString() || ""), this.removeFocusedStyling(s.element, this.incoming.originalState.zIndex?.toString() || ""), this.outgoing = null, this.incoming = null, this.currentFocus = null, this.focusData = null, this.state = S.IDLE;
|
|
2329
2337
|
return;
|
|
2330
2338
|
}
|
|
2331
|
-
this.state =
|
|
2339
|
+
this.state = S.UNFOCUSING;
|
|
2332
2340
|
const i = this.currentFocus, e = this.focusData.originalState, n = this.focusData.originalZIndex;
|
|
2333
|
-
this.outgoing = this.startUnfocusAnimation(i, e), await this.waitForAnimation(this.outgoing.animationHandle), this.focusGeneration === t && (this.removeFocusedStyling(i, n), this.outgoing = null, this.currentFocus = null, this.focusData = null, this.state =
|
|
2341
|
+
this.outgoing = this.startUnfocusAnimation(i, e), await this.waitForAnimation(this.outgoing.animationHandle), this.focusGeneration === t && (this.removeFocusedStyling(i, n), this.outgoing = null, this.currentFocus = null, this.focusData = null, this.state = S.IDLE);
|
|
2334
2342
|
}
|
|
2335
2343
|
/**
|
|
2336
2344
|
* Swap focus from current image to a new one (alias for focusImage with cross-animation)
|
|
@@ -2348,7 +2356,7 @@ class Oe {
|
|
|
2348
2356
|
* Check if an image is currently focused (stable state)
|
|
2349
2357
|
*/
|
|
2350
2358
|
isFocused(t) {
|
|
2351
|
-
return this.currentFocus === t && this.state ===
|
|
2359
|
+
return this.currentFocus === t && this.state === S.FOCUSED;
|
|
2352
2360
|
}
|
|
2353
2361
|
/**
|
|
2354
2362
|
* Check if an image is the target of current focus animation
|
|
@@ -2369,7 +2377,7 @@ class Oe {
|
|
|
2369
2377
|
* Used during swipe gestures for visual feedback
|
|
2370
2378
|
*/
|
|
2371
2379
|
setDragOffset(t) {
|
|
2372
|
-
if (!this.currentFocus || !this.focusData || this.state !==
|
|
2380
|
+
if (!this.currentFocus || !this.focusData || this.state !== S.FOCUSED) return;
|
|
2373
2381
|
const i = this.currentFocus, e = this.focusData.focusTransform, n = ["translate(-50%, -50%)"], a = (e.x ?? 0) + t, r = e.y ?? 0;
|
|
2374
2382
|
n.push(`translate(${a}px, ${r}px)`), e.rotation !== void 0 && n.push(`rotate(${e.rotation}deg)`), i.style.transition = "none", i.style.transform = n.join(" ");
|
|
2375
2383
|
}
|
|
@@ -2379,7 +2387,7 @@ class Oe {
|
|
|
2379
2387
|
* @param duration - Animation duration in ms (default 150)
|
|
2380
2388
|
*/
|
|
2381
2389
|
clearDragOffset(t, i = 150) {
|
|
2382
|
-
if (!this.currentFocus || !this.focusData || this.state !==
|
|
2390
|
+
if (!this.currentFocus || !this.focusData || this.state !== S.FOCUSED) return;
|
|
2383
2391
|
const e = this.currentFocus, n = this.focusData.focusTransform, a = ["translate(-50%, -50%)"], r = n.x ?? 0, s = n.y ?? 0;
|
|
2384
2392
|
a.push(`translate(${r}px, ${s}px)`), n.rotation !== void 0 && a.push(`rotate(${n.rotation}deg)`);
|
|
2385
2393
|
const c = a.join(" ");
|
|
@@ -2409,10 +2417,10 @@ class Oe {
|
|
|
2409
2417
|
this.focusData.originalZIndex,
|
|
2410
2418
|
this.focusData.originalWidth,
|
|
2411
2419
|
this.focusData.originalHeight
|
|
2412
|
-
), this.state =
|
|
2420
|
+
), this.state = S.IDLE, this.currentFocus = null, this.focusData = null, this.outgoing = null, this.incoming = null;
|
|
2413
2421
|
}
|
|
2414
2422
|
}
|
|
2415
|
-
const
|
|
2423
|
+
const $e = 50, Pe = 0.5, _e = 20, Ue = 0.3, He = 150, Ne = 30, at = class at {
|
|
2416
2424
|
constructor(t, i) {
|
|
2417
2425
|
this.enabled = !1, this.touchState = null, this.recentTouchTimestamp = 0, this.container = t, this.callbacks = i, this.boundTouchStart = this.handleTouchStart.bind(this), this.boundTouchMove = this.handleTouchMove.bind(this), this.boundTouchEnd = this.handleTouchEnd.bind(this), this.boundTouchCancel = this.handleTouchCancel.bind(this);
|
|
2418
2426
|
}
|
|
@@ -2459,11 +2467,11 @@ const De = 50, $e = 0.5, Pe = 20, _e = 0.3, Ue = 150, He = 30, at = class at {
|
|
|
2459
2467
|
const i = t.touches[0], e = i.clientX - this.touchState.startX, n = i.clientY - this.touchState.startY;
|
|
2460
2468
|
if (this.touchState.isHorizontalSwipe === null && Math.sqrt(e * e + n * n) > 10) {
|
|
2461
2469
|
const s = Math.atan2(Math.abs(n), Math.abs(e)) * (180 / Math.PI);
|
|
2462
|
-
this.touchState.isHorizontalSwipe = s <=
|
|
2470
|
+
this.touchState.isHorizontalSwipe = s <= Ne;
|
|
2463
2471
|
}
|
|
2464
2472
|
if (this.touchState.isHorizontalSwipe !== !1 && this.touchState.isHorizontalSwipe === !0) {
|
|
2465
2473
|
t.preventDefault(), this.touchState.isDragging = !0, this.touchState.currentX = i.clientX;
|
|
2466
|
-
const a = e *
|
|
2474
|
+
const a = e * Ue;
|
|
2467
2475
|
this.callbacks.onDragOffset(a);
|
|
2468
2476
|
}
|
|
2469
2477
|
}
|
|
@@ -2472,7 +2480,7 @@ const De = 50, $e = 0.5, Pe = 20, _e = 0.3, Ue = 150, He = 30, at = class at {
|
|
|
2472
2480
|
this.recentTouchTimestamp = Date.now();
|
|
2473
2481
|
const i = this.touchState.currentX - this.touchState.startX, e = performance.now() - this.touchState.startTime, n = Math.abs(i) / e, a = Math.abs(i);
|
|
2474
2482
|
let r = !1;
|
|
2475
|
-
this.touchState.isHorizontalSwipe === !0 && this.touchState.isDragging && (a >=
|
|
2483
|
+
this.touchState.isHorizontalSwipe === !0 && this.touchState.isDragging && (a >= $e || n >= Pe && a >= _e) && (r = !0, i < 0 ? this.callbacks.onNext() : this.callbacks.onPrev()), this.touchState.isDragging && this.callbacks.onDragEnd(r), this.touchState = null;
|
|
2476
2484
|
}
|
|
2477
2485
|
handleTouchCancel(t) {
|
|
2478
2486
|
this.touchState?.isDragging && this.callbacks.onDragEnd(!1), this.touchState = null;
|
|
@@ -2480,7 +2488,7 @@ const De = 50, $e = 0.5, Pe = 20, _e = 0.3, Ue = 150, He = 30, at = class at {
|
|
|
2480
2488
|
};
|
|
2481
2489
|
at.TOUCH_CLICK_DELAY = 300;
|
|
2482
2490
|
let bt = at;
|
|
2483
|
-
class
|
|
2491
|
+
class je {
|
|
2484
2492
|
constructor(t) {
|
|
2485
2493
|
if (this._prepared = !1, this._discoveredUrls = [], this.apiKey = t.apiKey ?? "", this.apiEndpoint = t.apiEndpoint ?? "https://www.googleapis.com/drive/v3/files", this.debugLogging = t.debugLogging ?? !1, this.sources = t.sources ?? [], !this.sources || this.sources.length === 0)
|
|
2486
2494
|
throw new Error("GoogleDriveLoader requires at least one source to be configured");
|
|
@@ -2701,7 +2709,7 @@ class Ne {
|
|
|
2701
2709
|
this.debugLogging && typeof console < "u" && console.log(...t);
|
|
2702
2710
|
}
|
|
2703
2711
|
}
|
|
2704
|
-
class
|
|
2712
|
+
class We {
|
|
2705
2713
|
constructor(t) {
|
|
2706
2714
|
if (this._prepared = !1, this._discoveredUrls = [], this.validateUrls = t.validateUrls !== !1, this.validationTimeout = t.validationTimeout ?? 5e3, this.validationMethod = t.validationMethod ?? "head", this.debugLogging = t.debugLogging ?? !1, this.sources = t.sources ?? [], !this.sources || this.sources.length === 0)
|
|
2707
2715
|
throw new Error("StaticImageLoader requires at least one source to be configured");
|
|
@@ -2881,7 +2889,7 @@ class je {
|
|
|
2881
2889
|
this.debugLogging && typeof console < "u" && console.log(...t);
|
|
2882
2890
|
}
|
|
2883
2891
|
}
|
|
2884
|
-
class
|
|
2892
|
+
class ke {
|
|
2885
2893
|
constructor(t) {
|
|
2886
2894
|
if (this._prepared = !1, this._discoveredUrls = [], this.loaders = t.loaders, this.debugLogging = t.debugLogging ?? !1, !this.loaders || this.loaders.length === 0)
|
|
2887
2895
|
throw new Error("CompositeLoader requires at least one loader to be configured");
|
|
@@ -2938,7 +2946,7 @@ class We {
|
|
|
2938
2946
|
this.debugLogging && typeof console < "u" && console.log("[CompositeLoader]", ...t);
|
|
2939
2947
|
}
|
|
2940
2948
|
}
|
|
2941
|
-
class
|
|
2949
|
+
class Ge {
|
|
2942
2950
|
/**
|
|
2943
2951
|
* Create a new ImageFilter
|
|
2944
2952
|
* @param extensions - Array of allowed file extensions (without dots)
|
|
@@ -2975,7 +2983,7 @@ class ke {
|
|
|
2975
2983
|
// isAllowedDate(date: Date): boolean
|
|
2976
2984
|
// isAllowedDimensions(width: number, height: number): boolean
|
|
2977
2985
|
}
|
|
2978
|
-
const
|
|
2986
|
+
const qe = `
|
|
2979
2987
|
.fbn-ic-gallery {
|
|
2980
2988
|
position: relative;
|
|
2981
2989
|
width: 100%;
|
|
@@ -3025,21 +3033,21 @@ const Ge = `
|
|
|
3025
3033
|
display: none !important;
|
|
3026
3034
|
}
|
|
3027
3035
|
`;
|
|
3028
|
-
function
|
|
3036
|
+
function Xe() {
|
|
3029
3037
|
if (typeof document > "u") return;
|
|
3030
3038
|
const o = "fbn-ic-functional-styles";
|
|
3031
3039
|
if (document.getElementById(o)) return;
|
|
3032
3040
|
const t = document.createElement("style");
|
|
3033
|
-
t.id = o, t.textContent =
|
|
3041
|
+
t.id = o, t.textContent = qe, document.head.appendChild(t);
|
|
3034
3042
|
}
|
|
3035
|
-
class
|
|
3043
|
+
class Ye {
|
|
3036
3044
|
constructor(t = {}) {
|
|
3037
|
-
this.fullConfig =
|
|
3045
|
+
this.fullConfig = Yt(t), t.container instanceof HTMLElement ? (this.containerRef = t.container, this.containerId = null) : (this.containerRef = null, this.containerId = t.container || "imageCloud"), this.imagesLoaded = !1, this.imageElements = [], this.imageLayouts = [], this.currentImageHeight = 225, this.currentFocusIndex = null, this.hoveredImage = null, this.resizeTimeout = null, this.displayQueue = [], this.queueInterval = null, this.loadGeneration = 0, this.loadingElAutoCreated = !1, this.errorElAutoCreated = !1, this.counterEl = null, this.counterElAutoCreated = !1, this.animationEngine = new Kt(this.fullConfig.animation), this.layoutEngine = new Te({
|
|
3038
3046
|
layout: this.fullConfig.layout,
|
|
3039
3047
|
image: this.fullConfig.image
|
|
3040
|
-
}), this.zoomEngine = new
|
|
3041
|
-
const i = this.fullConfig.animation.entry ||
|
|
3042
|
-
this.entryAnimationEngine = new
|
|
3048
|
+
}), this.zoomEngine = new De(this.fullConfig.interaction.focus, this.animationEngine, this.fullConfig.styling), this.defaultStyles = et(this.fullConfig.styling?.default), this.defaultClassName = this.fullConfig.styling?.default?.className, this.hoverClassName = this.fullConfig.styling?.hover?.className;
|
|
3049
|
+
const i = this.fullConfig.animation.entry || E.animation.entry;
|
|
3050
|
+
this.entryAnimationEngine = new ce(
|
|
3043
3051
|
i,
|
|
3044
3052
|
this.fullConfig.layout.algorithm
|
|
3045
3053
|
), this.swipeEngine = null, this.imageFilter = this.createImageFilter(), this.imageLoader = this.createLoader(), this.containerEl = null, this.loadingEl = null, this.errorEl = null;
|
|
@@ -3049,7 +3057,7 @@ class Xe {
|
|
|
3049
3057
|
*/
|
|
3050
3058
|
createImageFilter() {
|
|
3051
3059
|
const t = this.fullConfig.config.loaders?.allowedExtensions;
|
|
3052
|
-
return new
|
|
3060
|
+
return new Ge(t);
|
|
3053
3061
|
}
|
|
3054
3062
|
/**
|
|
3055
3063
|
* Create appropriate image loader based on config
|
|
@@ -3060,7 +3068,7 @@ class Xe {
|
|
|
3060
3068
|
if (!t || t.length === 0)
|
|
3061
3069
|
throw new Error("No loaders configured. Provide `images`, `loaders`, or both.");
|
|
3062
3070
|
const e = t.map((n) => this.createLoaderFromEntry(n, i));
|
|
3063
|
-
return e.length === 1 ? e[0] : new
|
|
3071
|
+
return e.length === 1 ? e[0] : new ke({
|
|
3064
3072
|
loaders: e,
|
|
3065
3073
|
debugLogging: this.fullConfig.config.debug?.loaders
|
|
3066
3074
|
});
|
|
@@ -3078,14 +3086,14 @@ class Xe {
|
|
|
3078
3086
|
allowedExtensions: e.allowedExtensions ?? i.allowedExtensions,
|
|
3079
3087
|
debugLogging: e.debugLogging ?? this.fullConfig.config.debug?.loaders
|
|
3080
3088
|
};
|
|
3081
|
-
return new
|
|
3089
|
+
return new We(n);
|
|
3082
3090
|
} else if ("googleDrive" in t) {
|
|
3083
3091
|
const e = t.googleDrive, n = {
|
|
3084
3092
|
...e,
|
|
3085
3093
|
allowedExtensions: e.allowedExtensions ?? i.allowedExtensions,
|
|
3086
3094
|
debugLogging: e.debugLogging ?? this.fullConfig.config.debug?.loaders
|
|
3087
3095
|
};
|
|
3088
|
-
return new
|
|
3096
|
+
return new je(n);
|
|
3089
3097
|
} else
|
|
3090
3098
|
throw new Error(`Unknown loader entry: ${JSON.stringify(t)}`);
|
|
3091
3099
|
}
|
|
@@ -3094,7 +3102,7 @@ class Xe {
|
|
|
3094
3102
|
*/
|
|
3095
3103
|
async init() {
|
|
3096
3104
|
try {
|
|
3097
|
-
if (
|
|
3105
|
+
if (Xe(), this.containerRef)
|
|
3098
3106
|
this.containerEl = this.containerRef;
|
|
3099
3107
|
else if (this.containerEl = document.getElementById(this.containerId), !this.containerEl)
|
|
3100
3108
|
throw new Error(`Container #${this.containerId} not found`);
|
|
@@ -3103,7 +3111,7 @@ class Xe {
|
|
|
3103
3111
|
onPrev: () => this.navigateToPreviousImage(),
|
|
3104
3112
|
onDragOffset: (t) => this.zoomEngine.setDragOffset(t),
|
|
3105
3113
|
onDragEnd: (t) => {
|
|
3106
|
-
t ? this.zoomEngine.clearDragOffset(!1) : this.zoomEngine.clearDragOffset(!0,
|
|
3114
|
+
t ? this.zoomEngine.clearDragOffset(!1) : this.zoomEngine.clearDragOffset(!0, He);
|
|
3107
3115
|
}
|
|
3108
3116
|
}), this.setupUI(), this.setupEventListeners(), this.logDebug("ImageCloud initialized"), await this.loadImages();
|
|
3109
3117
|
} catch (t) {
|
|
@@ -3230,24 +3238,24 @@ class Xe {
|
|
|
3230
3238
|
const d = {
|
|
3231
3239
|
x: parseFloat(l.dataset.startX),
|
|
3232
3240
|
y: parseFloat(l.dataset.startY)
|
|
3233
|
-
},
|
|
3241
|
+
}, f = {
|
|
3234
3242
|
x: parseFloat(l.dataset.endX),
|
|
3235
3243
|
y: parseFloat(l.dataset.endY)
|
|
3236
|
-
}, b = parseFloat(l.dataset.imageWidth),
|
|
3237
|
-
|
|
3244
|
+
}, b = parseFloat(l.dataset.imageWidth), p = parseFloat(l.dataset.imageHeight), g = parseFloat(l.dataset.rotation), m = parseFloat(l.dataset.scale), y = l.dataset.startRotation ? parseFloat(l.dataset.startRotation) : g, w = l.dataset.startScale ? parseFloat(l.dataset.startScale) : m, v = this.entryAnimationEngine.getTiming();
|
|
3245
|
+
se({
|
|
3238
3246
|
element: l,
|
|
3239
3247
|
startPosition: d,
|
|
3240
|
-
endPosition:
|
|
3248
|
+
endPosition: f,
|
|
3241
3249
|
pathConfig: this.entryAnimationEngine.getPathConfig(),
|
|
3242
|
-
duration:
|
|
3250
|
+
duration: v.duration,
|
|
3243
3251
|
imageWidth: b,
|
|
3244
|
-
imageHeight:
|
|
3245
|
-
rotation:
|
|
3246
|
-
scale:
|
|
3252
|
+
imageHeight: p,
|
|
3253
|
+
rotation: g,
|
|
3254
|
+
scale: m,
|
|
3247
3255
|
rotationConfig: this.entryAnimationEngine.getRotationConfig(),
|
|
3248
3256
|
startRotation: y,
|
|
3249
3257
|
scaleConfig: this.entryAnimationEngine.getScaleConfig(),
|
|
3250
|
-
startScale:
|
|
3258
|
+
startScale: w
|
|
3251
3259
|
});
|
|
3252
3260
|
} else {
|
|
3253
3261
|
const d = l.dataset.finalTransform || "";
|
|
@@ -3300,59 +3308,59 @@ class Xe {
|
|
|
3300
3308
|
this.fullConfig.config.debug?.centers && this.containerEl && (this.containerEl.querySelectorAll(".fbn-ic-debug-center").forEach((l) => l.remove()), a.forEach((l, u) => {
|
|
3301
3309
|
const h = document.createElement("div");
|
|
3302
3310
|
h.className = "fbn-ic-debug-center", h.style.position = "absolute", h.style.width = "12px", h.style.height = "12px", h.style.borderRadius = "50%", h.style.backgroundColor = "red", h.style.border = "2px solid yellow", h.style.zIndex = "9999", h.style.pointerEvents = "none";
|
|
3303
|
-
const d = l.x,
|
|
3304
|
-
h.style.left = `${d - 6}px`, h.style.top = `${
|
|
3311
|
+
const d = l.x, f = l.y;
|
|
3312
|
+
h.style.left = `${d - 6}px`, h.style.top = `${f - 6}px`, h.title = `Image ${u}: center (${Math.round(d)}, ${Math.round(f)})`, this.containerEl.appendChild(h);
|
|
3305
3313
|
})), t.forEach((l, u) => {
|
|
3306
3314
|
const h = document.createElement("img");
|
|
3307
3315
|
h.referrerPolicy = "no-referrer", h.classList.add("fbn-ic-image"), h.dataset.imageId = String(u), h.dataset.createdFlag = "true";
|
|
3308
3316
|
const d = a[u];
|
|
3309
3317
|
h.style.position = "absolute", h.style.width = "auto", h.style.height = `${i}px`, h.style.left = `${d.x}px`, h.style.top = `${d.y}px`, d.zIndex && (h.style.zIndex = String(d.zIndex)), st(h, this.defaultClassName), h.addEventListener("mouseenter", () => {
|
|
3310
3318
|
if (this.hoveredImage = { element: h, layout: d }, !this.zoomEngine.isInvolved(h)) {
|
|
3311
|
-
const
|
|
3312
|
-
ft(h, this.fullConfig.styling?.hover, i,
|
|
3319
|
+
const f = h.cachedRenderedWidth;
|
|
3320
|
+
ft(h, this.fullConfig.styling?.hover, i, f), st(h, this.hoverClassName);
|
|
3313
3321
|
}
|
|
3314
3322
|
}), h.addEventListener("mouseleave", () => {
|
|
3315
3323
|
if (this.hoveredImage = null, !this.zoomEngine.isInvolved(h)) {
|
|
3316
|
-
const
|
|
3317
|
-
ft(h, this.fullConfig.styling?.default, i,
|
|
3324
|
+
const f = h.cachedRenderedWidth;
|
|
3325
|
+
ft(h, this.fullConfig.styling?.default, i, f), pt(h, this.hoverClassName), st(h, this.defaultClassName);
|
|
3318
3326
|
}
|
|
3319
|
-
}), h.addEventListener("click", (
|
|
3320
|
-
|
|
3327
|
+
}), h.addEventListener("click", (f) => {
|
|
3328
|
+
f.stopPropagation(), this.handleImageClick(h, d);
|
|
3321
3329
|
}), h.style.opacity = "0", h.style.transition = this.entryAnimationEngine.getTransitionCSS(), h.onload = () => {
|
|
3322
3330
|
if (n !== this.loadGeneration)
|
|
3323
3331
|
return;
|
|
3324
|
-
const
|
|
3325
|
-
h.dataset.onloadCalled = "true", window.DEBUG_CLIPPATH && console.log(`[onload #${u}] Called with imageHeight=${i}, renderedWidth=${b}`), h.style.width = `${b}px`, h.cachedRenderedWidth = b, h.aspectRatio =
|
|
3326
|
-
const
|
|
3327
|
-
|
|
3328
|
-
|
|
3332
|
+
const f = h.naturalWidth / h.naturalHeight, b = i * f;
|
|
3333
|
+
h.dataset.onloadCalled = "true", window.DEBUG_CLIPPATH && console.log(`[onload #${u}] Called with imageHeight=${i}, renderedWidth=${b}`), h.style.width = `${b}px`, h.cachedRenderedWidth = b, h.aspectRatio = f, ft(h, this.fullConfig.styling?.default, i, b);
|
|
3334
|
+
const p = { x: d.x, y: d.y }, g = { width: b, height: i }, m = this.entryAnimationEngine.calculateStartPosition(
|
|
3335
|
+
p,
|
|
3336
|
+
g,
|
|
3329
3337
|
e,
|
|
3330
3338
|
u,
|
|
3331
3339
|
t.length
|
|
3332
|
-
), y = this.entryAnimationEngine.calculateStartRotation(d.rotation),
|
|
3340
|
+
), y = this.entryAnimationEngine.calculateStartRotation(d.rotation), w = this.entryAnimationEngine.calculateStartScale(d.scale), v = this.entryAnimationEngine.buildFinalTransform(
|
|
3333
3341
|
d.rotation,
|
|
3334
3342
|
d.scale,
|
|
3335
3343
|
b,
|
|
3336
3344
|
i
|
|
3337
|
-
),
|
|
3338
|
-
p,
|
|
3345
|
+
), R = this.entryAnimationEngine.buildStartTransform(
|
|
3339
3346
|
m,
|
|
3347
|
+
p,
|
|
3340
3348
|
d.rotation,
|
|
3341
3349
|
d.scale,
|
|
3342
3350
|
b,
|
|
3343
3351
|
i,
|
|
3344
3352
|
y,
|
|
3345
|
-
|
|
3353
|
+
w
|
|
3346
3354
|
);
|
|
3347
3355
|
this.fullConfig.config.debug?.enabled && u < 3 && console.log(`Image ${u}:`, {
|
|
3348
|
-
finalPosition:
|
|
3349
|
-
imageSize:
|
|
3356
|
+
finalPosition: p,
|
|
3357
|
+
imageSize: g,
|
|
3350
3358
|
left: d.x,
|
|
3351
3359
|
top: d.y,
|
|
3352
|
-
finalTransform:
|
|
3360
|
+
finalTransform: v,
|
|
3353
3361
|
renderedWidth: b,
|
|
3354
3362
|
renderedHeight: i
|
|
3355
|
-
}), h.style.transform =
|
|
3363
|
+
}), h.style.transform = R, h.dataset.finalTransform = v, (this.entryAnimationEngine.requiresJSAnimation() || this.entryAnimationEngine.requiresJSRotation() || this.entryAnimationEngine.requiresJSScale() || y !== d.rotation || w !== d.scale) && (h.dataset.startX = String(m.x), h.dataset.startY = String(m.y), h.dataset.endX = String(p.x), h.dataset.endY = String(p.y), h.dataset.imageWidth = String(b), h.dataset.imageHeight = String(i), h.dataset.rotation = String(d.rotation), h.dataset.scale = String(d.scale), h.dataset.startRotation = String(y), h.dataset.startScale = String(w)), this.displayQueue.push(h);
|
|
3356
3364
|
}, h.onerror = () => r++, h.src = l;
|
|
3357
3365
|
});
|
|
3358
3366
|
}
|
|
@@ -3398,30 +3406,30 @@ class Xe {
|
|
|
3398
3406
|
}
|
|
3399
3407
|
}
|
|
3400
3408
|
export {
|
|
3401
|
-
|
|
3409
|
+
Kt as AnimationEngine,
|
|
3402
3410
|
Rt as BOUNCE_PRESETS,
|
|
3403
|
-
|
|
3404
|
-
|
|
3405
|
-
|
|
3411
|
+
be as ClusterPlacementLayout,
|
|
3412
|
+
ke as CompositeLoader,
|
|
3413
|
+
E as DEFAULT_CONFIG,
|
|
3406
3414
|
zt as DEFAULT_SHARED_LOADER_CONFIG,
|
|
3407
3415
|
It as ELASTIC_PRESETS,
|
|
3408
|
-
|
|
3409
|
-
|
|
3410
|
-
|
|
3411
|
-
|
|
3412
|
-
|
|
3413
|
-
|
|
3414
|
-
|
|
3415
|
-
|
|
3416
|
-
|
|
3417
|
-
|
|
3418
|
-
|
|
3419
|
-
|
|
3416
|
+
ce as EntryAnimationEngine,
|
|
3417
|
+
qe as FUNCTIONAL_CSS,
|
|
3418
|
+
je as GoogleDriveLoader,
|
|
3419
|
+
ue as GridPlacementLayout,
|
|
3420
|
+
Ye as ImageCloud,
|
|
3421
|
+
Ge as ImageFilter,
|
|
3422
|
+
Ye as ImageGallery,
|
|
3423
|
+
Te as LayoutEngine,
|
|
3424
|
+
he as RadialPlacementLayout,
|
|
3425
|
+
le as RandomPlacementLayout,
|
|
3426
|
+
me as SpiralPlacementLayout,
|
|
3427
|
+
We as StaticImageLoader,
|
|
3420
3428
|
Tt as WAVE_PATH_PRESETS,
|
|
3421
|
-
|
|
3422
|
-
|
|
3423
|
-
|
|
3424
|
-
|
|
3425
|
-
|
|
3429
|
+
ye as WavePlacementLayout,
|
|
3430
|
+
De as ZoomEngine,
|
|
3431
|
+
se as animatePath,
|
|
3432
|
+
Xe as injectFunctionalStyles,
|
|
3433
|
+
ae as requiresJSAnimation
|
|
3426
3434
|
};
|
|
3427
3435
|
//# sourceMappingURL=image-cloud.js.map
|