@argo-video/cli 0.4.0 → 0.4.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/README.md +1 -1
- package/dist/effects.d.ts +2 -0
- package/dist/effects.d.ts.map +1 -1
- package/dist/effects.js +90 -82
- package/dist/effects.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -192,7 +192,7 @@ import { defineConfig, demosProject } from '@argo-video/cli';
|
|
|
192
192
|
| `showOverlay(page, scene, cue, durationMs)` | Show a templated overlay (lower-third, headline-card, callout, image-card) |
|
|
193
193
|
| `withOverlay(page, scene, cue, action)` | Show overlay during an async action |
|
|
194
194
|
| `hideOverlay(page, zone?)` | Remove overlay from a zone |
|
|
195
|
-
| `showConfetti(page, opts?)` |
|
|
195
|
+
| `showConfetti(page, opts?)` | Non-blocking confetti animation (`spread: 'burst' \| 'rain'`, `wait: true` to block) |
|
|
196
196
|
| `showCaption(page, scene, text, durationMs)` | Show a simple text caption |
|
|
197
197
|
| `withCaption(page, scene, text, action)` | Show caption during an async action |
|
|
198
198
|
| `hideCaption(page)` | Remove caption |
|
package/dist/effects.d.ts
CHANGED
|
@@ -10,6 +10,8 @@ export interface ConfettiOptions {
|
|
|
10
10
|
colors?: string[];
|
|
11
11
|
/** Fade-out duration in ms. Default: 800 */
|
|
12
12
|
fadeOut?: number;
|
|
13
|
+
/** Block until animation completes. Default: false (non-blocking, fire-and-forget safe). */
|
|
14
|
+
wait?: boolean;
|
|
13
15
|
}
|
|
14
16
|
export declare function showConfetti(page: Page, opts?: ConfettiOptions): Promise<void>;
|
|
15
17
|
//# sourceMappingURL=effects.d.ts.map
|
package/dist/effects.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"effects.d.ts","sourceRoot":"","sources":["../src/effects.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE7C,MAAM,WAAW,eAAe;IAC9B,mDAAmD;IACnD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8CAA8C;IAC9C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,qGAAqG;IACrG,MAAM,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC1B,4FAA4F;IAC5F,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,4CAA4C;IAC5C,OAAO,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"effects.d.ts","sourceRoot":"","sources":["../src/effects.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE7C,MAAM,WAAW,eAAe;IAC9B,mDAAmD;IACnD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8CAA8C;IAC9C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,qGAAqG;IACrG,MAAM,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC1B,4FAA4F;IAC5F,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,4CAA4C;IAC5C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4FAA4F;IAC5F,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAMD,wBAAsB,YAAY,CAChC,IAAI,EAAE,IAAI,EACV,IAAI,CAAC,EAAE,eAAe,GACrB,OAAO,CAAC,IAAI,CAAC,CA8Hf"}
|
package/dist/effects.js
CHANGED
|
@@ -6,94 +6,102 @@ export async function showConfetti(page, opts) {
|
|
|
6
6
|
const spread = opts?.spread ?? 'burst';
|
|
7
7
|
const colors = opts?.colors ?? DEFAULT_COLORS;
|
|
8
8
|
const fadeOut = opts?.fadeOut ?? 800;
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
const
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
const cx = canvas.width / 2;
|
|
30
|
-
const angle = -Math.PI / 2 + (Math.random() - 0.5) * Math.PI * 0.8;
|
|
31
|
-
const speed = 4 + Math.random() * 8;
|
|
32
|
-
particles.push({
|
|
33
|
-
x: cx + (Math.random() - 0.5) * 40,
|
|
34
|
-
y: -10,
|
|
35
|
-
w,
|
|
36
|
-
h,
|
|
37
|
-
color,
|
|
38
|
-
vx: Math.cos(angle) * speed,
|
|
39
|
-
vy: Math.sin(angle) * speed,
|
|
40
|
-
rot,
|
|
41
|
-
rv,
|
|
42
|
-
});
|
|
43
|
-
}
|
|
44
|
-
else {
|
|
45
|
-
// Rain: spawn across full width above viewport
|
|
46
|
-
particles.push({
|
|
47
|
-
x: Math.random() * canvas.width,
|
|
48
|
-
y: -Math.random() * canvas.height,
|
|
49
|
-
w,
|
|
50
|
-
h,
|
|
51
|
-
color,
|
|
52
|
-
vx: (Math.random() - 0.5) * 4,
|
|
53
|
-
vy: 2 + Math.random() * 4,
|
|
54
|
-
rot,
|
|
55
|
-
rv,
|
|
56
|
-
});
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
const startTime = performance.now();
|
|
60
|
-
function frame() {
|
|
61
|
-
const elapsed = performance.now() - startTime;
|
|
62
|
-
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
|
63
|
-
for (const p of particles) {
|
|
64
|
-
p.x += p.vx;
|
|
65
|
-
p.y += p.vy;
|
|
66
|
-
p.rot += p.rv;
|
|
67
|
-
p.vy += 0.15; // gravity
|
|
9
|
+
const wait = opts?.wait ?? false;
|
|
10
|
+
try {
|
|
11
|
+
await page.evaluate(({ pieces, spread, colors, duration, fadeOut, id }) => {
|
|
12
|
+
// Remove any existing confetti
|
|
13
|
+
document.getElementById(id)?.remove();
|
|
14
|
+
const canvas = document.createElement('canvas');
|
|
15
|
+
canvas.id = id;
|
|
16
|
+
canvas.style.cssText =
|
|
17
|
+
'position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:99999';
|
|
18
|
+
document.body.appendChild(canvas);
|
|
19
|
+
canvas.width = window.innerWidth;
|
|
20
|
+
canvas.height = window.innerHeight;
|
|
21
|
+
const ctx = canvas.getContext('2d');
|
|
22
|
+
const particles = [];
|
|
23
|
+
for (let i = 0; i < pieces; i++) {
|
|
24
|
+
const color = colors[Math.floor(Math.random() * colors.length)];
|
|
25
|
+
const w = 6 + Math.random() * 8;
|
|
26
|
+
const h = 4 + Math.random() * 6;
|
|
27
|
+
const rot = Math.random() * Math.PI * 2;
|
|
28
|
+
const rv = (Math.random() - 0.5) * 0.2;
|
|
68
29
|
if (spread === 'burst') {
|
|
69
|
-
|
|
30
|
+
// Raycast-style: burst from center-top, fan outward
|
|
31
|
+
const cx = canvas.width / 2;
|
|
32
|
+
const angle = -Math.PI / 2 + (Math.random() - 0.5) * Math.PI * 0.8;
|
|
33
|
+
const speed = 4 + Math.random() * 8;
|
|
34
|
+
particles.push({
|
|
35
|
+
x: cx + (Math.random() - 0.5) * 40,
|
|
36
|
+
y: -10,
|
|
37
|
+
w,
|
|
38
|
+
h,
|
|
39
|
+
color,
|
|
40
|
+
vx: Math.cos(angle) * speed,
|
|
41
|
+
vy: Math.sin(angle) * speed,
|
|
42
|
+
rot,
|
|
43
|
+
rv,
|
|
44
|
+
});
|
|
45
|
+
}
|
|
46
|
+
else {
|
|
47
|
+
// Rain: spawn across full width above viewport
|
|
48
|
+
particles.push({
|
|
49
|
+
x: Math.random() * canvas.width,
|
|
50
|
+
y: -Math.random() * canvas.height,
|
|
51
|
+
w,
|
|
52
|
+
h,
|
|
53
|
+
color,
|
|
54
|
+
vx: (Math.random() - 0.5) * 4,
|
|
55
|
+
vy: 2 + Math.random() * 4,
|
|
56
|
+
rot,
|
|
57
|
+
rv,
|
|
58
|
+
});
|
|
70
59
|
}
|
|
71
|
-
ctx.save();
|
|
72
|
-
ctx.translate(p.x, p.y);
|
|
73
|
-
ctx.rotate(p.rot);
|
|
74
|
-
ctx.fillStyle = p.color;
|
|
75
|
-
ctx.fillRect(-p.w / 2, -p.h / 2, p.w, p.h);
|
|
76
|
-
ctx.restore();
|
|
77
60
|
}
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
const
|
|
81
|
-
|
|
82
|
-
|
|
61
|
+
const startTime = performance.now();
|
|
62
|
+
function frame() {
|
|
63
|
+
const elapsed = performance.now() - startTime;
|
|
64
|
+
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
|
65
|
+
for (const p of particles) {
|
|
66
|
+
p.x += p.vx;
|
|
67
|
+
p.y += p.vy;
|
|
68
|
+
p.rot += p.rv;
|
|
69
|
+
p.vy += 0.15; // gravity
|
|
70
|
+
if (spread === 'burst') {
|
|
71
|
+
p.vx *= 0.99; // air resistance for burst spread
|
|
72
|
+
}
|
|
73
|
+
ctx.save();
|
|
74
|
+
ctx.translate(p.x, p.y);
|
|
75
|
+
ctx.rotate(p.rot);
|
|
76
|
+
ctx.fillStyle = p.color;
|
|
77
|
+
ctx.fillRect(-p.w / 2, -p.h / 2, p.w, p.h);
|
|
78
|
+
ctx.restore();
|
|
79
|
+
}
|
|
80
|
+
// Start fade-out when duration reached
|
|
81
|
+
if (elapsed >= duration) {
|
|
82
|
+
const fadeProgress = Math.min(1, (elapsed - duration) / fadeOut);
|
|
83
|
+
canvas.style.opacity = String(1 - fadeProgress);
|
|
84
|
+
if (fadeProgress >= 1) {
|
|
85
|
+
canvas.remove();
|
|
86
|
+
return;
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
if (particles.some((p) => p.y < canvas.height + 50) || elapsed < duration + fadeOut) {
|
|
90
|
+
requestAnimationFrame(frame);
|
|
91
|
+
}
|
|
92
|
+
else {
|
|
83
93
|
canvas.remove();
|
|
84
|
-
return;
|
|
85
94
|
}
|
|
86
95
|
}
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
canvas.remove();
|
|
92
|
-
}
|
|
96
|
+
requestAnimationFrame(frame);
|
|
97
|
+
}, { pieces, spread, colors, duration, fadeOut, id: CONFETTI_ID });
|
|
98
|
+
if (wait) {
|
|
99
|
+
await page.waitForTimeout(duration + fadeOut);
|
|
93
100
|
}
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
101
|
+
}
|
|
102
|
+
catch {
|
|
103
|
+
// Swallow errors (page/context disposal) so fire-and-forget callers
|
|
104
|
+
// never see an unhandled rejection.
|
|
105
|
+
}
|
|
98
106
|
}
|
|
99
107
|
//# sourceMappingURL=effects.js.map
|
package/dist/effects.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"effects.js","sourceRoot":"","sources":["../src/effects.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"effects.js","sourceRoot":"","sources":["../src/effects.ts"],"names":[],"mappings":"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"}
|