pixi-effects 0.40.0 → 0.41.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/README.md +5 -5
- package/ai/chat-template.html +3 -3
- package/ai/tools/check.mjs +19 -2
- package/dist/Composition-N6BOROJ2.cjs +16 -0
- package/dist/{Composition-C3UEVHQG.cjs.map → Composition-N6BOROJ2.cjs.map} +1 -1
- package/dist/Composition-YGBQX3HZ.js +7 -0
- package/dist/{Composition-KRWH72MA.js.map → Composition-YGBQX3HZ.js.map} +1 -1
- package/dist/Controller.d.cts +1 -1
- package/dist/Controller.d.ts +1 -1
- package/dist/{Movie-CG6Jy1tx.d.ts → Movie-CwqRLOzE.d.ts} +47 -1
- package/dist/{Movie-CMq4KFmc.d.cts → Movie-DWtxRiJ2.d.cts} +47 -1
- package/dist/{Spans-TWO4VN5H.js → Spans-6L2ZVECX.js} +4 -4
- package/dist/{Spans-TWO4VN5H.js.map → Spans-6L2ZVECX.js.map} +1 -1
- package/dist/{Spans-APNJHCYO.cjs → Spans-XTIWYSNO.cjs} +9 -9
- package/dist/{Spans-APNJHCYO.cjs.map → Spans-XTIWYSNO.cjs.map} +1 -1
- package/dist/{chunk-27PYJ4JY.cjs → chunk-3HZV3UHU.cjs} +67 -63
- package/dist/chunk-3HZV3UHU.cjs.map +1 -0
- package/dist/{chunk-LMWXR5OC.js → chunk-4QVQ5UJJ.js} +4 -4
- package/dist/{chunk-LMWXR5OC.js.map → chunk-4QVQ5UJJ.js.map} +1 -1
- package/dist/{chunk-26Z544SH.js → chunk-ICI6ACHY.js} +7 -3
- package/dist/chunk-ICI6ACHY.js.map +1 -0
- package/dist/{chunk-LEL7UNYQ.cjs → chunk-RN5FWGGM.cjs} +136 -39
- package/dist/chunk-RN5FWGGM.cjs.map +1 -0
- package/dist/{chunk-7EI2N7WO.cjs → chunk-X62H3RBG.cjs} +4 -4
- package/dist/{chunk-7EI2N7WO.cjs.map → chunk-X62H3RBG.cjs.map} +1 -1
- package/dist/{chunk-CT5CZVT5.js → chunk-Y2N6U3X5.js} +101 -4
- package/dist/chunk-Y2N6U3X5.js.map +1 -0
- package/dist/index.cjs +33 -33
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +3 -3
- package/dist/loader.css +1 -1
- package/dist/present.cjs +3 -3
- package/dist/present.d.cts +1 -1
- package/dist/present.d.ts +1 -1
- package/dist/present.js +3 -3
- package/dist/three.cjs +52 -6
- package/dist/three.cjs.map +1 -1
- package/dist/three.d.cts +16 -1
- package/dist/three.d.ts +16 -1
- package/dist/three.js +49 -3
- package/dist/three.js.map +1 -1
- package/docs/api.md +17 -0
- package/docs/dsl.md +1 -1
- package/llms-full.txt +44 -3
- package/package.json +1 -1
- package/skills/pixi-effects/SKILL.md +2 -2
- package/skills/pixi-effects/reference/cheatsheet.md +1 -0
- package/skills/pixi-effects/reference/recipes.md +23 -0
- package/skills/pixi-effects/template.html +6 -6
- package/dist/Composition-C3UEVHQG.cjs +0 -16
- package/dist/Composition-KRWH72MA.js +0 -7
- package/dist/chunk-26Z544SH.js.map +0 -1
- package/dist/chunk-27PYJ4JY.cjs.map +0 -1
- package/dist/chunk-CT5CZVT5.js.map +0 -1
- package/dist/chunk-LEL7UNYQ.cjs.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 0.41.0
|
|
4
|
+
|
|
5
|
+
`movie.pick` (what is under a point of the canvas) and a better fit of the light falloff in a `three` layer. Nothing breaks.
|
|
6
|
+
|
|
7
|
+
- **New: `movie.pick(x, y)`, `pickAll`, `canvasPoint(event)`: what is under a point of the canvas.** The layer on top (or every layer under the point, the top first) at the frame on screen, in canvas pixels: a flat layer by its own shape (a rotated bar by its rotated rectangle, a circle by the circle), a `threeD` card by its projected quad, a `three` layer by a ray through its camera (`hit.three.object` names the object it met, with the point and the distance; with `followCamera` it is the composition's camera). `canvasPoint(event)` turns a pointer event into canvas pixels when the canvas is shown at another size. A layer outside its life, at alpha 0, hidden by a parent or outside its mask is not hit; `{ only, ignore }` choose by name or path. No clock: it reads the frame as the last draw left it, so it is a function of the frame (a seek back gives the same answer). Not in this version: alpha-exact hits, hover and drag. `check --at 3.5 --pick 640,360` (repeatable) prints what is under that point at each moment, so an AI can answer "is the button where I think" without looking. Recipe `pick-click`; `docs/api.md`; tests `tests/core/pick.test.ts`, `tests/films/pick` (real Chrome: rotated bar, circle, a turned card, a cube, a gliding camera, a canvas shown at twice its size).
|
|
8
|
+
|
|
9
|
+
- **Changed: `followLights` fits the falloff better.** `falloff: 'smooth'` on a mirrored light is now three's cut-off distance and gain chosen from where the fall starts (before: the cut-off at `radius + falloffDistance`), which halves the largest difference to the composition's curve (0.15–0.40 before, 0.09–0.17 for a fall that is not steep; in the real picture mean 0.08–0.28 of 255, was 1.0–1.2). `'inverseSquare'` was already exact outside the radius (mean 0.02–0.03) but blows out inside it (three keeps rising where the composition holds 1; measured mean 21 of 255 with the lit objects inside the radius): the layer now says so once, with the distance and the way out (a smaller radius, or `'smooth'`). `tests/films/three-space`, `tests/three/spaceBridge.test.ts`.
|
|
10
|
+
|
|
3
11
|
## 0.40.0
|
|
4
12
|
|
|
5
13
|
The `three` layer grows up: it can live in the composition's space, it loads glTF models, `check` holds it to the library's contract, and it can use three's WebGPU renderer. Nothing else changed; one type-only break (the last entry).
|
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# pixi-effects
|
|
2
2
|
|
|
3
|
-
> **Status**: experimental — current release `0.
|
|
3
|
+
> **Status**: experimental — current release `0.41.0`. The API may still change between minor versions; see the [CHANGELOG](./CHANGELOG.md) for what each release changed.
|
|
4
4
|
|
|
5
5
|
**[Gallery →](https://yjmtmtk.github.io/pixi-effects/examples/gallery/)** · 43 pieces written as plain data by AI models · **[For AI →](https://yjmtmtk.github.io/pixi-effects/for-ai.html)** · what an AI reads and runs · **[Playground →](https://yjmtmtk.github.io/pixi-effects/examples/playground.html)** in the browser.
|
|
6
6
|
|
|
@@ -49,8 +49,8 @@ Drop the imports into an [importmap](https://developer.mozilla.org/docs/Web/HTML
|
|
|
49
49
|
"imports": {
|
|
50
50
|
"pixi.js": "https://esm.sh/pixi.js@8.22.0?bundle-deps",
|
|
51
51
|
"mediabunny": "https://esm.sh/mediabunny",
|
|
52
|
-
"pixi-effects": "https://cdn.jsdelivr.net/npm/pixi-effects@0.
|
|
53
|
-
"pixi-effects/controller": "https://cdn.jsdelivr.net/npm/pixi-effects@0.
|
|
52
|
+
"pixi-effects": "https://cdn.jsdelivr.net/npm/pixi-effects@0.41.0/dist/index.js",
|
|
53
|
+
"pixi-effects/controller": "https://cdn.jsdelivr.net/npm/pixi-effects@0.41.0/dist/Controller.js"
|
|
54
54
|
}
|
|
55
55
|
}
|
|
56
56
|
</script>
|
|
@@ -61,7 +61,7 @@ Drop the imports into an [importmap](https://developer.mozilla.org/docs/Web/HTML
|
|
|
61
61
|
</script>
|
|
62
62
|
```
|
|
63
63
|
|
|
64
|
-
Load the `dist/` files **as they are** (jsDelivr's `/npm/…/dist/…`, or unpkg's `https://unpkg.com/pixi-effects@0.
|
|
64
|
+
Load the `dist/` files **as they are** (jsDelivr's `/npm/…/dist/…`, or unpkg's `https://unpkg.com/pixi-effects@0.41.0/dist/index.js`) rather than a CDN-rebundled build such as `esm.sh/pixi-effects` or jsDelivr's `+esm`: the entries (`pixi-effects`, `…/controller`, `…/three`) share internal chunks, which only works when each file is served untouched.
|
|
65
65
|
|
|
66
66
|
> **Using three.js?** Add two more entries (`three` and `pixi-effects/three`) to this importmap — see [Adding three.js](#adding-threejs-optional) below.
|
|
67
67
|
>
|
|
@@ -78,7 +78,7 @@ Add two more entries to the importmap above: three.js itself, and the `pixi-effe
|
|
|
78
78
|
"...": "(everything from the importmap above)",
|
|
79
79
|
"three": "https://esm.sh/three@0.178.0",
|
|
80
80
|
"three/addons/": "https://cdn.jsdelivr.net/npm/three@0.178.0/examples/jsm/",
|
|
81
|
-
"pixi-effects/three": "https://cdn.jsdelivr.net/npm/pixi-effects@0.
|
|
81
|
+
"pixi-effects/three": "https://cdn.jsdelivr.net/npm/pixi-effects@0.41.0/dist/three.js"
|
|
82
82
|
}
|
|
83
83
|
}
|
|
84
84
|
</script>
|
package/ai/chat-template.html
CHANGED
|
@@ -59,9 +59,9 @@
|
|
|
59
59
|
"imports": {
|
|
60
60
|
"pixi.js": "https://cdn.jsdelivr.net/npm/pixi.js@8.22.0/dist/pixi.min.mjs",
|
|
61
61
|
"mediabunny": "https://cdn.jsdelivr.net/npm/mediabunny@1.61.3/+esm",
|
|
62
|
-
"pixi-effects": "https://cdn.jsdelivr.net/npm/pixi-effects@0.
|
|
63
|
-
"pixi-effects/controller": "https://cdn.jsdelivr.net/npm/pixi-effects@0.
|
|
64
|
-
"pixi-effects/present": "https://cdn.jsdelivr.net/npm/pixi-effects@0.
|
|
62
|
+
"pixi-effects": "https://cdn.jsdelivr.net/npm/pixi-effects@0.41.0/dist/index.js",
|
|
63
|
+
"pixi-effects/controller": "https://cdn.jsdelivr.net/npm/pixi-effects@0.41.0/dist/Controller.js",
|
|
64
|
+
"pixi-effects/present": "https://cdn.jsdelivr.net/npm/pixi-effects@0.41.0/dist/present.js"
|
|
65
65
|
}
|
|
66
66
|
}
|
|
67
67
|
</script>
|
package/ai/tools/check.mjs
CHANGED
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
* Options: --draft (the export is a draft: half size, low quality, no motion blur: a much smaller file; the drawing itself is not faster) · --at LIST (pictures at moments you name: 3.5, 50%, f120, title@end → frames/*.png and at.png) ·
|
|
17
17
|
* --query "a=1&b=2" (added to the page address: for a page that reads it, such as one video of a batch) ·
|
|
18
18
|
* --crop X,Y,W,H (with --at: each picture is that part of the canvas, in canvas pixels, enlarged up to 4x so a small figure can be judged) ·
|
|
19
|
+
* --pick X,Y (with --at, repeatable: what is under that canvas point at each moment, the top layer first, and the object a three layer met: `movie.pick`) ·
|
|
19
20
|
* --onion A:B (one picture of the movement between A and B seconds, frames overlaid: onion.png) ·
|
|
20
21
|
* --seam (a movie made to loop: the last frame to the first is compared with the steps between ordinary neighbouring frames; a jump is a problem) ·
|
|
21
22
|
* --strict (text overlaps and stops where the picture is still changing fail the check; by default they are only listed for review) · --out DIR · --frames N (contact sheet tiles, default 12) · --formats mp4,webm (default mp4) · --no-export ·
|
|
@@ -81,10 +82,10 @@ export function findChrome(env = process.env, exists = fs.existsSync, platform =
|
|
|
81
82
|
return candidates.find(c => c && exists(c)) ?? null;
|
|
82
83
|
}
|
|
83
84
|
|
|
84
|
-
export const USAGE = 'usage: node ai/tools/check.mjs <page.html> [--out DIR] [--frames N] [--formats mp4,webm] [--no-export] [--draft] [--at 3.5,title@end] [--crop X,Y,W,H] [--onion 1:3] [--seam] [--query a=1&b=2] [--var name=value] [--size 1920x1080,1080x1920] [--timeout S] [--root DIR] [--chrome PATH] [--strict] [--help]\n(the header of ai/tools/check.mjs explains each option)';
|
|
85
|
+
export const USAGE = 'usage: node ai/tools/check.mjs <page.html> [--out DIR] [--frames N] [--formats mp4,webm] [--no-export] [--draft] [--at 3.5,title@end] [--crop X,Y,W,H] [--pick X,Y] [--onion 1:3] [--seam] [--query a=1&b=2] [--var name=value] [--size 1920x1080,1080x1920] [--timeout S] [--root DIR] [--chrome PATH] [--strict] [--help]\n(the header of ai/tools/check.mjs explains each option)';
|
|
85
86
|
|
|
86
87
|
export function parseArgs(argv) {
|
|
87
|
-
const o = { page: null, out: null, frames: 12, formats: ['mp4'], export: true, timeout: 240, root: null, chrome: null, strict: false, at: null, crop: null, draft: false, onion: null, seam: false, query: null, vars: [], sizes: [], help: false };
|
|
88
|
+
const o = { page: null, out: null, frames: 12, formats: ['mp4'], export: true, timeout: 240, root: null, chrome: null, strict: false, at: null, crop: null, draft: false, onion: null, seam: false, query: null, pick: [], vars: [], sizes: [], help: false };
|
|
88
89
|
const need = (i, name) => { if (i + 1 >= argv.length) throw new Error(`${name} needs a value`); return argv[i + 1]; };
|
|
89
90
|
for (let i = 0; i < argv.length; i++) {
|
|
90
91
|
const a = argv[i];
|
|
@@ -102,6 +103,11 @@ export function parseArgs(argv) {
|
|
|
102
103
|
if (m.length !== 4 || !m.every(Number.isFinite) || m[0] < 0 || m[1] < 0 || m[2] < 1 || m[3] < 1) throw new Error(`--crop must look like 100,200,400,300 (x, y, width, height in canvas pixels, width and height at least 1), got "${argv[i]}"`);
|
|
103
104
|
o.crop = { x: Math.round(m[0]), y: Math.round(m[1]), width: Math.round(m[2]), height: Math.round(m[3]) };
|
|
104
105
|
}
|
|
106
|
+
else if (a === '--pick') {
|
|
107
|
+
const m = need(i++, a).split(',').map(Number);
|
|
108
|
+
if (m.length !== 2 || !m.every(Number.isFinite)) throw new Error(`--pick must look like 640,360 (x, y in canvas pixels), got "${argv[i]}"`);
|
|
109
|
+
o.pick.push({ x: m[0], y: m[1] });
|
|
110
|
+
}
|
|
105
111
|
else if (a === '--var') o.vars.push(parseVar(need(i++, a)));
|
|
106
112
|
else if (a === '--size') o.sizes.push(...parseSizes(need(i++, a)));
|
|
107
113
|
else if (a === '--seam') o.seam = true;
|
|
@@ -118,6 +124,7 @@ export function parseArgs(argv) {
|
|
|
118
124
|
else throw new Error(`unexpected argument ${a}`);
|
|
119
125
|
}
|
|
120
126
|
if (o.crop && !o.at) throw new Error('--crop crops the pictures of --at: give --at too (for example --at 3.5 --crop 100,200,400,300)');
|
|
127
|
+
if (o.pick.length && !o.at) throw new Error('--pick asks about the moments of --at: give --at too (for example --at 3.5 --pick 640,360)');
|
|
121
128
|
return o;
|
|
122
129
|
}
|
|
123
130
|
|
|
@@ -466,6 +473,10 @@ export async function runCheck(opts, log = console.log) {
|
|
|
466
473
|
// depth of field: the blur (px) each threeD layer has at this moment, so a focus pull can be read as numbers (0 = sharp)
|
|
467
474
|
const rows = await cdp.eval(`movie.inspect(${w.frame}).then(r => r.layers.filter(l => l.depthBlur !== undefined).map(l => [l.path, l.depthBlur]))`).catch(() => []);
|
|
468
475
|
if (rows.some(([, px]) => px > 0)) w.depthBlur = Object.fromEntries(rows);
|
|
476
|
+
// pick: what is under each --pick point at this moment (the frame is on screen after the snapshot above)
|
|
477
|
+
if (opts.pick.length) {
|
|
478
|
+
w.pick = await cdp.eval(`(${JSON.stringify(opts.pick)}).map(p => ({ x: p.x, y: p.y, hits: movie.pickAll(p.x, p.y).map(h => ({ name: h.name ?? h.path, path: h.path, kind: h.kind, object: h.three ? h.three.object : undefined })) }))`).catch(() => []);
|
|
479
|
+
}
|
|
469
480
|
// light: how lit each threeD layer is at this moment (left out when the composition has no light)
|
|
470
481
|
const lit = await cdp.eval(`movie.inspect(${w.frame}).then(r => r.layers.filter(l => l.light !== undefined).map(l => [l.path, l.light]))`).catch(() => []);
|
|
471
482
|
if (lit.length) w.light = Object.fromEntries(lit);
|
|
@@ -702,6 +713,12 @@ function finish(report, outDir, log) {
|
|
|
702
713
|
L.push(` sizes ${g.map(x => `${x.size} ${x.issues.length ? x.issues.length + ' layout issue kind(s)' : 'no layout issue'}`).join(' · ')}${g.length > 1 ? ' (one contact sheet each: sheet.png, sheet-<size>.png)' : ''}`);
|
|
703
714
|
for (const x of g) for (const i of x.issues.slice(0, 3)) L.push(` - ${x.size}: ${i.message}`);
|
|
704
715
|
}
|
|
716
|
+
for (const w of (report.at ?? []).filter(x => x.pick)) {
|
|
717
|
+
for (const p of w.pick) {
|
|
718
|
+
const says = p.hits.length ? p.hits.map(h => h.kind === 'three' ? `${h.name} (three: ${h.object || '?'})` : h.name).join(', ') : 'nothing';
|
|
719
|
+
L.push(` pick ${w.label} (${p.x}, ${p.y}) — ${says}`);
|
|
720
|
+
}
|
|
721
|
+
}
|
|
705
722
|
for (const w of (report.at ?? []).filter(x => x.depthBlur)) {
|
|
706
723
|
const shown = Object.entries(w.depthBlur).slice(0, 8).map(([k, px]) => `${k} ${px} px`).join(', ');
|
|
707
724
|
L.push(` depth ${w.label} — ${shown}${Object.keys(w.depthBlur).length > 8 ? ', …' : ''} (blur of each threeD layer at that moment; 0 = sharp)`);
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var chunk3HZV3UHU_cjs = require('./chunk-3HZV3UHU.cjs');
|
|
4
|
+
require('./chunk-X62H3RBG.cjs');
|
|
5
|
+
require('./chunk-JN7JHNZR.cjs');
|
|
6
|
+
require('./chunk-3SAS3ZE5.cjs');
|
|
7
|
+
require('./chunk-TWZNOUM7.cjs');
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
Object.defineProperty(exports, "CompositionSequence", {
|
|
12
|
+
enumerable: true,
|
|
13
|
+
get: function () { return chunk3HZV3UHU_cjs.CompositionSequence; }
|
|
14
|
+
});
|
|
15
|
+
//# sourceMappingURL=Composition-N6BOROJ2.cjs.map
|
|
16
|
+
//# sourceMappingURL=Composition-N6BOROJ2.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"Composition-
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"Composition-N6BOROJ2.cjs"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export { CompositionSequence } from './chunk-ICI6ACHY.js';
|
|
2
|
+
import './chunk-4QVQ5UJJ.js';
|
|
3
|
+
import './chunk-VNP7QCJE.js';
|
|
4
|
+
import './chunk-32MMNDDN.js';
|
|
5
|
+
import './chunk-BXOCEZ4U.js';
|
|
6
|
+
//# sourceMappingURL=Composition-YGBQX3HZ.js.map
|
|
7
|
+
//# sourceMappingURL=Composition-YGBQX3HZ.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"Composition-
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"Composition-YGBQX3HZ.js"}
|
package/dist/Controller.d.cts
CHANGED
package/dist/Controller.d.ts
CHANGED
|
@@ -235,6 +235,39 @@ interface InspectOptions {
|
|
|
235
235
|
layers?: 'all' | 'visible' | 'none';
|
|
236
236
|
}
|
|
237
237
|
|
|
238
|
+
interface PickHit {
|
|
239
|
+
/** The layer's `name` (when it has one). */
|
|
240
|
+
name?: string;
|
|
241
|
+
/** Names (or `type#index`) from the root, joined by `/`: the same as `movie.inspect()`'s `path`. */
|
|
242
|
+
path: string;
|
|
243
|
+
type: string;
|
|
244
|
+
/** `'flat'`: a 2D layer; `'card'`: a `threeD` layer (its projected card); `'three'`: a `three` layer, and `three` says what the ray met. */
|
|
245
|
+
kind: 'flat' | 'card' | 'three';
|
|
246
|
+
/** The point asked about, in canvas pixels. */
|
|
247
|
+
point: {
|
|
248
|
+
x: number;
|
|
249
|
+
y: number;
|
|
250
|
+
};
|
|
251
|
+
/** A flat layer: the point in the layer's own pixels (the top-left of its picture is 0, 0). */
|
|
252
|
+
local?: {
|
|
253
|
+
x: number;
|
|
254
|
+
y: number;
|
|
255
|
+
};
|
|
256
|
+
/** A `three` layer: what the ray through that point met first: the object (its name, or `''`), where (three's own units), and how far from the camera. */
|
|
257
|
+
three?: {
|
|
258
|
+
object: unknown;
|
|
259
|
+
point: [number, number, number];
|
|
260
|
+
distance: number;
|
|
261
|
+
object3d?: unknown;
|
|
262
|
+
};
|
|
263
|
+
}
|
|
264
|
+
interface PickOptions {
|
|
265
|
+
/** Only these layers can be hit (by `name` or by `path`). */
|
|
266
|
+
only?: string[];
|
|
267
|
+
/** These layers cannot be hit (by `name` or by `path`). */
|
|
268
|
+
ignore?: string[];
|
|
269
|
+
}
|
|
270
|
+
|
|
238
271
|
/** One layer (or a run of similar layers) on the timeline. Times are in seconds, absolute (from the start of the movie). */
|
|
239
272
|
interface TimelineRow {
|
|
240
273
|
/** `parent/child` for a layer inside a composition. */
|
|
@@ -678,6 +711,19 @@ declare class Movie {
|
|
|
678
711
|
* Where every layer is drawn at `frame` (canvas pixels, visibility) plus `issues` — text that is off
|
|
679
712
|
* the canvas, cut by an edge, empty, or overlapping other text. Seeks there and stays there.
|
|
680
713
|
*/
|
|
714
|
+
/**
|
|
715
|
+
* What is under the canvas point (x, y) (canvas pixels: the movie's own `width` x `height`; `canvasPoint(event)` makes them from a pointer event) at the frame on screen: the layer on
|
|
716
|
+
* top, or null. A flat layer is hit by its own shape, a `threeD` card by its projected quad, a `three` layer by a ray through its camera (`hit.three` has the object). It reads the
|
|
717
|
+
* frame as the last draw left it, so after `await movie.snapshot(frame)` or any seek it answers for that frame. `opts.only` / `opts.ignore`: layer names or paths.
|
|
718
|
+
*/
|
|
719
|
+
pick(x: number, y: number, opts?: PickOptions): PickHit | null;
|
|
720
|
+
/** Every layer under the canvas point, the one on top first (see `pick`). */
|
|
721
|
+
pickAll(x: number, y: number, opts?: PickOptions): PickHit[];
|
|
722
|
+
/** A pointer event's place in canvas pixels (the canvas may be shown larger or smaller than its own size): `movie.pick(...movie.canvasPoint(event))`. */
|
|
723
|
+
canvasPoint(event: {
|
|
724
|
+
clientX: number;
|
|
725
|
+
clientY: number;
|
|
726
|
+
}): [number, number];
|
|
681
727
|
inspect(frame?: number, opts?: InspectOptions): Promise<InspectReport>;
|
|
682
728
|
/** The canvas layers whose same frame is not the same picture (what `check` reports as a problem): one sentence each. */
|
|
683
729
|
canvasProblems(): string[];
|
|
@@ -768,4 +814,4 @@ declare class Movie {
|
|
|
768
814
|
destroy(): Promise<void>;
|
|
769
815
|
}
|
|
770
816
|
|
|
771
|
-
export { type ContactSheetOptions as C, type FontReport as F, type InspectOptions as I, type LayerInfo as L, Movie as M, type OnionSkinOptions as O, type
|
|
817
|
+
export { type ContactSheetOptions as C, type FontReport as F, type InspectOptions as I, type LayerInfo as L, Movie as M, type OnionSkinOptions as O, type PickHit as P, type RebuildOptions as R, type SnapshotOptions as S, type ThumbnailOptions as T, type VolumeEvent as V, type MotionBlurSpec as a, type FrameEvent as b, type InspectReport as c, type IssueGroup as d, type LoadProgressState as e, type LoadStage as f, type LoaderOption as g, type LoopEvent as h, type MotionBlurOptions as i, type MovieErrorEvent as j, type MovieOptions as k, type PickOptions as l, type ProgressEvent as m, type RebuildReason as n, type RebuildReport as o, type RenderOptions as p, type ReviewOptions as q, type ReviewReport as r, type TimelineData as s, type TimelineHtmlOptions as t, type TimelineRow as u, type TimelineSvgOptions as v, type TimelineTransition as w, dismissLoader as x, failLoader as y, resolveLoader as z };
|
|
@@ -235,6 +235,39 @@ interface InspectOptions {
|
|
|
235
235
|
layers?: 'all' | 'visible' | 'none';
|
|
236
236
|
}
|
|
237
237
|
|
|
238
|
+
interface PickHit {
|
|
239
|
+
/** The layer's `name` (when it has one). */
|
|
240
|
+
name?: string;
|
|
241
|
+
/** Names (or `type#index`) from the root, joined by `/`: the same as `movie.inspect()`'s `path`. */
|
|
242
|
+
path: string;
|
|
243
|
+
type: string;
|
|
244
|
+
/** `'flat'`: a 2D layer; `'card'`: a `threeD` layer (its projected card); `'three'`: a `three` layer, and `three` says what the ray met. */
|
|
245
|
+
kind: 'flat' | 'card' | 'three';
|
|
246
|
+
/** The point asked about, in canvas pixels. */
|
|
247
|
+
point: {
|
|
248
|
+
x: number;
|
|
249
|
+
y: number;
|
|
250
|
+
};
|
|
251
|
+
/** A flat layer: the point in the layer's own pixels (the top-left of its picture is 0, 0). */
|
|
252
|
+
local?: {
|
|
253
|
+
x: number;
|
|
254
|
+
y: number;
|
|
255
|
+
};
|
|
256
|
+
/** A `three` layer: what the ray through that point met first: the object (its name, or `''`), where (three's own units), and how far from the camera. */
|
|
257
|
+
three?: {
|
|
258
|
+
object: unknown;
|
|
259
|
+
point: [number, number, number];
|
|
260
|
+
distance: number;
|
|
261
|
+
object3d?: unknown;
|
|
262
|
+
};
|
|
263
|
+
}
|
|
264
|
+
interface PickOptions {
|
|
265
|
+
/** Only these layers can be hit (by `name` or by `path`). */
|
|
266
|
+
only?: string[];
|
|
267
|
+
/** These layers cannot be hit (by `name` or by `path`). */
|
|
268
|
+
ignore?: string[];
|
|
269
|
+
}
|
|
270
|
+
|
|
238
271
|
/** One layer (or a run of similar layers) on the timeline. Times are in seconds, absolute (from the start of the movie). */
|
|
239
272
|
interface TimelineRow {
|
|
240
273
|
/** `parent/child` for a layer inside a composition. */
|
|
@@ -678,6 +711,19 @@ declare class Movie {
|
|
|
678
711
|
* Where every layer is drawn at `frame` (canvas pixels, visibility) plus `issues` — text that is off
|
|
679
712
|
* the canvas, cut by an edge, empty, or overlapping other text. Seeks there and stays there.
|
|
680
713
|
*/
|
|
714
|
+
/**
|
|
715
|
+
* What is under the canvas point (x, y) (canvas pixels: the movie's own `width` x `height`; `canvasPoint(event)` makes them from a pointer event) at the frame on screen: the layer on
|
|
716
|
+
* top, or null. A flat layer is hit by its own shape, a `threeD` card by its projected quad, a `three` layer by a ray through its camera (`hit.three` has the object). It reads the
|
|
717
|
+
* frame as the last draw left it, so after `await movie.snapshot(frame)` or any seek it answers for that frame. `opts.only` / `opts.ignore`: layer names or paths.
|
|
718
|
+
*/
|
|
719
|
+
pick(x: number, y: number, opts?: PickOptions): PickHit | null;
|
|
720
|
+
/** Every layer under the canvas point, the one on top first (see `pick`). */
|
|
721
|
+
pickAll(x: number, y: number, opts?: PickOptions): PickHit[];
|
|
722
|
+
/** A pointer event's place in canvas pixels (the canvas may be shown larger or smaller than its own size): `movie.pick(...movie.canvasPoint(event))`. */
|
|
723
|
+
canvasPoint(event: {
|
|
724
|
+
clientX: number;
|
|
725
|
+
clientY: number;
|
|
726
|
+
}): [number, number];
|
|
681
727
|
inspect(frame?: number, opts?: InspectOptions): Promise<InspectReport>;
|
|
682
728
|
/** The canvas layers whose same frame is not the same picture (what `check` reports as a problem): one sentence each. */
|
|
683
729
|
canvasProblems(): string[];
|
|
@@ -768,4 +814,4 @@ declare class Movie {
|
|
|
768
814
|
destroy(): Promise<void>;
|
|
769
815
|
}
|
|
770
816
|
|
|
771
|
-
export { type ContactSheetOptions as C, type FontReport as F, type InspectOptions as I, type LayerInfo as L, Movie as M, type OnionSkinOptions as O, type
|
|
817
|
+
export { type ContactSheetOptions as C, type FontReport as F, type InspectOptions as I, type LayerInfo as L, Movie as M, type OnionSkinOptions as O, type PickHit as P, type RebuildOptions as R, type SnapshotOptions as S, type ThumbnailOptions as T, type VolumeEvent as V, type MotionBlurSpec as a, type FrameEvent as b, type InspectReport as c, type IssueGroup as d, type LoadProgressState as e, type LoadStage as f, type LoaderOption as g, type LoopEvent as h, type MotionBlurOptions as i, type MovieErrorEvent as j, type MovieOptions as k, type PickOptions as l, type ProgressEvent as m, type RebuildReason as n, type RebuildReport as o, type RenderOptions as p, type ReviewOptions as q, type ReviewReport as r, type TimelineData as s, type TimelineHtmlOptions as t, type TimelineRow as u, type TimelineSvgOptions as v, type TimelineTransition as w, dismissLoader as x, failLoader as y, resolveLoader as z };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { CompositionSequence } from './chunk-
|
|
2
|
-
import { spansMeta, resolveNumber, bindCounterKeyframes, TextSequence } from './chunk-
|
|
1
|
+
import { CompositionSequence } from './chunk-ICI6ACHY.js';
|
|
2
|
+
import { spansMeta, resolveNumber, bindCounterKeyframes, TextSequence } from './chunk-4QVQ5UJJ.js';
|
|
3
3
|
import './chunk-VNP7QCJE.js';
|
|
4
4
|
import './chunk-32MMNDDN.js';
|
|
5
5
|
import './chunk-BXOCEZ4U.js';
|
|
@@ -49,5 +49,5 @@ var SpansSequence = class extends CompositionSequence {
|
|
|
49
49
|
};
|
|
50
50
|
|
|
51
51
|
export { SpansSequence };
|
|
52
|
-
//# sourceMappingURL=Spans-
|
|
53
|
-
//# sourceMappingURL=Spans-
|
|
52
|
+
//# sourceMappingURL=Spans-6L2ZVECX.js.map
|
|
53
|
+
//# sourceMappingURL=Spans-6L2ZVECX.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/sequences/Spans.ts"],"names":[],"mappings":";;;;;;;AAQA,IAAM,KAAA,GAAQ,CAAC,KAAA,KAAgD;AAC7D,EAAA,IAAI,CAAC,KAAA,IAAS,EAAE,cAAA,IAAkB,QAAQ,OAAO,KAAA;AACjD,EAAA,MAAM,EAAE,YAAA,EAAc,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AACzC,EAAA,OAAO,IAAA;AACT,CAAA;AAEO,IAAM,aAAA,GAAN,cAA4B,mBAAA,CAAoB;AAAA,EACpC,KAAA;AAAA,EACA,MAAA,GAAuB,EAAE,KAAA,EAAO,CAAA,EAAG,cAAc,CAAA,EAAE;AAAA,EAEpE,WAAA,CAAY,IAAA,EAAoB,MAAA,EAAiC,IAAA,EAAwB;AACvF,IAAA,KAAA,CAAM,IAAA,EAAM,QAAQ,IAAI,CAAA;AACxB,IAAA,IAAA,CAAK,KAAA,GAAQ,SAAA,CAAU,GAAA,CAAI,IAAI,CAAA;AAAA,EACjC;AAAA;AAAA,EAGmB,YAAA,GAAyH;AAC1I,IAAA,MAAM,CAAA,GAAI,MAAM,YAAA,EAAa;AAC7B,IAAA,IAAI,CAAC,IAAA,CAAK,KAAA,EAAO,KAAA,EAAO,OAAO,CAAA;AAC/B,IAAA,OAAO;AAAA,MACL,OAAA,EAAS,KAAA,CAAM,CAAA,CAAE,OAA4B,CAAA;AAAA,MAC7C,SAAA,EAAW,EAAE,SAAA,EAAW,GAAA,CAAI,SAAO,EAAE,GAAG,EAAA,EAAI,GAAA,EAAK,KAAA,CAAM,EAAA,CAAG,GAAG,CAAA,EAAG,EAAA,EAAI,KAAA,CAAM,EAAA,CAAG,EAAE,CAAA,EAAG,MAAM,KAAA,CAAM,EAAA,CAAG,IAAI,CAAA,EAAE,CAAE;AAAA,KAC3G;AAAA,EACF;AAAA,EAES,YAAA,CAAa,QAAA,EAAoB,MAAA,GAAS,CAAA,EAAS;AAC1D,IAAA,KAAA,CAAM,YAAA,CAAa,UAAU,MAAM,CAAA;AACnC,IAAA,IAAI,CAAC,IAAA,CAAK,KAAA,EAAO,KAAA,EAAO;AACxB,IAAA,MAAM,KAAA,GAAQ,KAAK,KAAA,EAAM;AACzB,IAAA,MAAM,KAAA,GAAS,IAAA,CAAK,IAAA,CAAK,OAAA,EAAiD,YAAA;AAC1E,IAAA,IAAA,CAAK,OAAO,YAAA,GAAe,KAAA,KAAU,SAAY,CAAA,GAAI,aAAA,CAAc,OAAO,KAAK,CAAA;AAC/E,IAAA,oBAAA,CAAqB,UAAU,IAAA,CAAK,MAAA,EAAQ,gBAAgB,MAAM,IAAA,CAAK,aAAY,EAAG,IAAA,CAAK,IAAA,CAAK,SAAA,IAAa,EAAC,EAAG,IAAA,CAAK,UAAW,MAAA,GAAS,IAAA,CAAK,IAAI,KAAK,CAAA;AACxJ,IAAA,IAAA,CAAK,WAAA,EAAY;AAAA,EACnB;AAAA;AAAA,EAGQ,WAAA,GAAoB;AAC1B,IAAA,MAAM,MAAA,GAAS,KAAK,KAAA,CAAO,MAAA;AAC3B,IAAA,MAAM,KAAA,GAAQ,KAAK,GAAA,CAAI,CAAA,EAAG,KAAK,KAAA,CAAM,IAAA,CAAK,MAAA,CAAO,YAAY,CAAC,CAAA;AAC9D,IAAA,IAAI,CAAA,GAAI,CAAA;AACR,IAAA,KAAA,MAAW,KAAA,IAAS,KAAK,SAAA,EAAW;AAClC,MAAA,IAAI,EAAE,iBAAiB,YAAA,CAAA,EAAe;AACtC,MAAA,MAAM,CAAA,GAAI,OAAO,CAAA,EAAG,CAAA;AACpB,MAAA,IAAI,CAAA,EAAG,KAAA,CAAM,eAAA,CAAgB,IAAA,CAAK,IAAI,CAAA,CAAE,MAAA,EAAQ,IAAA,CAAK,GAAA,CAAI,CAAA,EAAG,KAAA,GAAQ,CAAA,CAAE,KAAK,CAAC,CAAC,CAAA;AAAA,IAC/E;AAAA,EACF;AACF","file":"Spans-
|
|
1
|
+
{"version":3,"sources":["../src/sequences/Spans.ts"],"names":[],"mappings":";;;;;;;AAQA,IAAM,KAAA,GAAQ,CAAC,KAAA,KAAgD;AAC7D,EAAA,IAAI,CAAC,KAAA,IAAS,EAAE,cAAA,IAAkB,QAAQ,OAAO,KAAA;AACjD,EAAA,MAAM,EAAE,YAAA,EAAc,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AACzC,EAAA,OAAO,IAAA;AACT,CAAA;AAEO,IAAM,aAAA,GAAN,cAA4B,mBAAA,CAAoB;AAAA,EACpC,KAAA;AAAA,EACA,MAAA,GAAuB,EAAE,KAAA,EAAO,CAAA,EAAG,cAAc,CAAA,EAAE;AAAA,EAEpE,WAAA,CAAY,IAAA,EAAoB,MAAA,EAAiC,IAAA,EAAwB;AACvF,IAAA,KAAA,CAAM,IAAA,EAAM,QAAQ,IAAI,CAAA;AACxB,IAAA,IAAA,CAAK,KAAA,GAAQ,SAAA,CAAU,GAAA,CAAI,IAAI,CAAA;AAAA,EACjC;AAAA;AAAA,EAGmB,YAAA,GAAyH;AAC1I,IAAA,MAAM,CAAA,GAAI,MAAM,YAAA,EAAa;AAC7B,IAAA,IAAI,CAAC,IAAA,CAAK,KAAA,EAAO,KAAA,EAAO,OAAO,CAAA;AAC/B,IAAA,OAAO;AAAA,MACL,OAAA,EAAS,KAAA,CAAM,CAAA,CAAE,OAA4B,CAAA;AAAA,MAC7C,SAAA,EAAW,EAAE,SAAA,EAAW,GAAA,CAAI,SAAO,EAAE,GAAG,EAAA,EAAI,GAAA,EAAK,KAAA,CAAM,EAAA,CAAG,GAAG,CAAA,EAAG,EAAA,EAAI,KAAA,CAAM,EAAA,CAAG,EAAE,CAAA,EAAG,MAAM,KAAA,CAAM,EAAA,CAAG,IAAI,CAAA,EAAE,CAAE;AAAA,KAC3G;AAAA,EACF;AAAA,EAES,YAAA,CAAa,QAAA,EAAoB,MAAA,GAAS,CAAA,EAAS;AAC1D,IAAA,KAAA,CAAM,YAAA,CAAa,UAAU,MAAM,CAAA;AACnC,IAAA,IAAI,CAAC,IAAA,CAAK,KAAA,EAAO,KAAA,EAAO;AACxB,IAAA,MAAM,KAAA,GAAQ,KAAK,KAAA,EAAM;AACzB,IAAA,MAAM,KAAA,GAAS,IAAA,CAAK,IAAA,CAAK,OAAA,EAAiD,YAAA;AAC1E,IAAA,IAAA,CAAK,OAAO,YAAA,GAAe,KAAA,KAAU,SAAY,CAAA,GAAI,aAAA,CAAc,OAAO,KAAK,CAAA;AAC/E,IAAA,oBAAA,CAAqB,UAAU,IAAA,CAAK,MAAA,EAAQ,gBAAgB,MAAM,IAAA,CAAK,aAAY,EAAG,IAAA,CAAK,IAAA,CAAK,SAAA,IAAa,EAAC,EAAG,IAAA,CAAK,UAAW,MAAA,GAAS,IAAA,CAAK,IAAI,KAAK,CAAA;AACxJ,IAAA,IAAA,CAAK,WAAA,EAAY;AAAA,EACnB;AAAA;AAAA,EAGQ,WAAA,GAAoB;AAC1B,IAAA,MAAM,MAAA,GAAS,KAAK,KAAA,CAAO,MAAA;AAC3B,IAAA,MAAM,KAAA,GAAQ,KAAK,GAAA,CAAI,CAAA,EAAG,KAAK,KAAA,CAAM,IAAA,CAAK,MAAA,CAAO,YAAY,CAAC,CAAA;AAC9D,IAAA,IAAI,CAAA,GAAI,CAAA;AACR,IAAA,KAAA,MAAW,KAAA,IAAS,KAAK,SAAA,EAAW;AAClC,MAAA,IAAI,EAAE,iBAAiB,YAAA,CAAA,EAAe;AACtC,MAAA,MAAM,CAAA,GAAI,OAAO,CAAA,EAAG,CAAA;AACpB,MAAA,IAAI,CAAA,EAAG,KAAA,CAAM,eAAA,CAAgB,IAAA,CAAK,IAAI,CAAA,CAAE,MAAA,EAAQ,IAAA,CAAK,GAAA,CAAI,CAAA,EAAG,KAAA,GAAQ,CAAA,CAAE,KAAK,CAAC,CAAC,CAAA;AAAA,IAC/E;AAAA,EACF;AACF","file":"Spans-6L2ZVECX.js","sourcesContent":["// The sequence behind a text layer with `spans`: a composition of ordinary text layers (see src/text/spans.ts) that also owns the typewriter\n// (`visibleChars`) of the whole text: it counts over every character of every piece, and tells each piece how many of its own to show.\nimport { CompositionSequence } from './Composition';\nimport { TextSequence, bindCounterKeyframes, resolveNumber, type CounterState } from './Text';\nimport { spansMeta, type SpansMeta } from '../text/spans';\nimport type { CompositionShape, SequenceSpec, Props } from '../types';\nimport type { Timeline } from '../core/timelineEngine';\n\nconst strip = (props: Props | undefined): Props | undefined => {\n if (!props || !('visibleChars' in props)) return props;\n const { visibleChars: _gone, ...rest } = props as Record<string, unknown>;\n return rest as unknown as Props;\n};\n\nexport class SpansSequence extends CompositionSequence {\n private readonly _meta: SpansMeta | undefined;\n private readonly _count: CounterState = { value: 0, visibleChars: 0 };\n\n constructor(spec: SequenceSpec, parent: CompositionShape | null, root: CompositionShape) {\n super(spec, parent, root);\n this._meta = spansMeta.get(spec);\n }\n\n /** `visibleChars` is the group's own counter, not a property to write on the container. */\n protected override displayProps(): { initial: CompositionSequence['spec']['initial']; keyframes: CompositionSequence['spec']['keyframes'] } {\n const p = super.displayProps();\n if (!this._meta?.typed) return p;\n return {\n initial: strip(p.initial as Props | undefined) as never,\n keyframes: p.keyframes?.map(kf => ({ ...kf, set: strip(kf.set), to: strip(kf.to), from: strip(kf.from) })),\n };\n }\n\n override bindTimeline(timeline: Timeline, offset = 0): void {\n super.bindTimeline(timeline, offset);\n if (!this._meta?.typed) return;\n const scope = this.scope();\n const first = (this.spec.initial as Record<string, unknown> | undefined)?.visibleChars;\n this._count.visibleChars = first === undefined ? 0 : resolveNumber(first, scope); // like a text: it starts at 0 once it is animated\n bindCounterKeyframes(timeline, this._count, 'visibleChars', () => this._distribute(), this.spec.keyframes ?? [], this.duration!, offset + this.at, scope);\n this._distribute();\n }\n\n /** Every piece shows its part of the first N characters of the whole text. */\n private _distribute(): void {\n const pieces = this._meta!.pieces;\n const total = Math.max(0, Math.floor(this._count.visibleChars));\n let i = 0;\n for (const child of this._children) {\n if (!(child instanceof TextSequence)) continue;\n const p = pieces[i++];\n if (p) child.setVisibleChars(Math.min(p.length, Math.max(0, total - p.start)));\n }\n }\n}\n"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
4
|
-
var
|
|
3
|
+
var chunk3HZV3UHU_cjs = require('./chunk-3HZV3UHU.cjs');
|
|
4
|
+
var chunkX62H3RBG_cjs = require('./chunk-X62H3RBG.cjs');
|
|
5
5
|
require('./chunk-JN7JHNZR.cjs');
|
|
6
6
|
require('./chunk-3SAS3ZE5.cjs');
|
|
7
7
|
require('./chunk-TWZNOUM7.cjs');
|
|
@@ -12,12 +12,12 @@ var strip = (props) => {
|
|
|
12
12
|
const { visibleChars: _gone, ...rest } = props;
|
|
13
13
|
return rest;
|
|
14
14
|
};
|
|
15
|
-
var SpansSequence = class extends
|
|
15
|
+
var SpansSequence = class extends chunk3HZV3UHU_cjs.CompositionSequence {
|
|
16
16
|
_meta;
|
|
17
17
|
_count = { value: 0, visibleChars: 0 };
|
|
18
18
|
constructor(spec, parent, root) {
|
|
19
19
|
super(spec, parent, root);
|
|
20
|
-
this._meta =
|
|
20
|
+
this._meta = chunkX62H3RBG_cjs.spansMeta.get(spec);
|
|
21
21
|
}
|
|
22
22
|
/** `visibleChars` is the group's own counter, not a property to write on the container. */
|
|
23
23
|
displayProps() {
|
|
@@ -33,8 +33,8 @@ var SpansSequence = class extends chunk27PYJ4JY_cjs.CompositionSequence {
|
|
|
33
33
|
if (!this._meta?.typed) return;
|
|
34
34
|
const scope = this.scope();
|
|
35
35
|
const first = this.spec.initial?.visibleChars;
|
|
36
|
-
this._count.visibleChars = first === void 0 ? 0 :
|
|
37
|
-
|
|
36
|
+
this._count.visibleChars = first === void 0 ? 0 : chunkX62H3RBG_cjs.resolveNumber(first, scope);
|
|
37
|
+
chunkX62H3RBG_cjs.bindCounterKeyframes(timeline, this._count, "visibleChars", () => this._distribute(), this.spec.keyframes ?? [], this.duration, offset + this.at, scope);
|
|
38
38
|
this._distribute();
|
|
39
39
|
}
|
|
40
40
|
/** Every piece shows its part of the first N characters of the whole text. */
|
|
@@ -43,7 +43,7 @@ var SpansSequence = class extends chunk27PYJ4JY_cjs.CompositionSequence {
|
|
|
43
43
|
const total = Math.max(0, Math.floor(this._count.visibleChars));
|
|
44
44
|
let i = 0;
|
|
45
45
|
for (const child of this._children) {
|
|
46
|
-
if (!(child instanceof
|
|
46
|
+
if (!(child instanceof chunkX62H3RBG_cjs.TextSequence)) continue;
|
|
47
47
|
const p = pieces[i++];
|
|
48
48
|
if (p) child.setVisibleChars(Math.min(p.length, Math.max(0, total - p.start)));
|
|
49
49
|
}
|
|
@@ -51,5 +51,5 @@ var SpansSequence = class extends chunk27PYJ4JY_cjs.CompositionSequence {
|
|
|
51
51
|
};
|
|
52
52
|
|
|
53
53
|
exports.SpansSequence = SpansSequence;
|
|
54
|
-
//# sourceMappingURL=Spans-
|
|
55
|
-
//# sourceMappingURL=Spans-
|
|
54
|
+
//# sourceMappingURL=Spans-XTIWYSNO.cjs.map
|
|
55
|
+
//# sourceMappingURL=Spans-XTIWYSNO.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/sequences/Spans.ts"],"names":["CompositionSequence","spansMeta","resolveNumber","bindCounterKeyframes","TextSequence"],"mappings":";;;;;;;;;AAQA,IAAM,KAAA,GAAQ,CAAC,KAAA,KAAgD;AAC7D,EAAA,IAAI,CAAC,KAAA,IAAS,EAAE,cAAA,IAAkB,QAAQ,OAAO,KAAA;AACjD,EAAA,MAAM,EAAE,YAAA,EAAc,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AACzC,EAAA,OAAO,IAAA;AACT,CAAA;AAEO,IAAM,aAAA,GAAN,cAA4BA,qCAAA,CAAoB;AAAA,EACpC,KAAA;AAAA,EACA,MAAA,GAAuB,EAAE,KAAA,EAAO,CAAA,EAAG,cAAc,CAAA,EAAE;AAAA,EAEpE,WAAA,CAAY,IAAA,EAAoB,MAAA,EAAiC,IAAA,EAAwB;AACvF,IAAA,KAAA,CAAM,IAAA,EAAM,QAAQ,IAAI,CAAA;AACxB,IAAA,IAAA,CAAK,KAAA,GAAQC,2BAAA,CAAU,GAAA,CAAI,IAAI,CAAA;AAAA,EACjC;AAAA;AAAA,EAGmB,YAAA,GAAyH;AAC1I,IAAA,MAAM,CAAA,GAAI,MAAM,YAAA,EAAa;AAC7B,IAAA,IAAI,CAAC,IAAA,CAAK,KAAA,EAAO,KAAA,EAAO,OAAO,CAAA;AAC/B,IAAA,OAAO;AAAA,MACL,OAAA,EAAS,KAAA,CAAM,CAAA,CAAE,OAA4B,CAAA;AAAA,MAC7C,SAAA,EAAW,EAAE,SAAA,EAAW,GAAA,CAAI,SAAO,EAAE,GAAG,EAAA,EAAI,GAAA,EAAK,KAAA,CAAM,EAAA,CAAG,GAAG,CAAA,EAAG,EAAA,EAAI,KAAA,CAAM,EAAA,CAAG,EAAE,CAAA,EAAG,MAAM,KAAA,CAAM,EAAA,CAAG,IAAI,CAAA,EAAE,CAAE;AAAA,KAC3G;AAAA,EACF;AAAA,EAES,YAAA,CAAa,QAAA,EAAoB,MAAA,GAAS,CAAA,EAAS;AAC1D,IAAA,KAAA,CAAM,YAAA,CAAa,UAAU,MAAM,CAAA;AACnC,IAAA,IAAI,CAAC,IAAA,CAAK,KAAA,EAAO,KAAA,EAAO;AACxB,IAAA,MAAM,KAAA,GAAQ,KAAK,KAAA,EAAM;AACzB,IAAA,MAAM,KAAA,GAAS,IAAA,CAAK,IAAA,CAAK,OAAA,EAAiD,YAAA;AAC1E,IAAA,IAAA,CAAK,OAAO,YAAA,GAAe,KAAA,KAAU,SAAY,CAAA,GAAIC,+BAAA,CAAc,OAAO,KAAK,CAAA;AAC/E,IAAAC,sCAAA,CAAqB,UAAU,IAAA,CAAK,MAAA,EAAQ,gBAAgB,MAAM,IAAA,CAAK,aAAY,EAAG,IAAA,CAAK,IAAA,CAAK,SAAA,IAAa,EAAC,EAAG,IAAA,CAAK,UAAW,MAAA,GAAS,IAAA,CAAK,IAAI,KAAK,CAAA;AACxJ,IAAA,IAAA,CAAK,WAAA,EAAY;AAAA,EACnB;AAAA;AAAA,EAGQ,WAAA,GAAoB;AAC1B,IAAA,MAAM,MAAA,GAAS,KAAK,KAAA,CAAO,MAAA;AAC3B,IAAA,MAAM,KAAA,GAAQ,KAAK,GAAA,CAAI,CAAA,EAAG,KAAK,KAAA,CAAM,IAAA,CAAK,MAAA,CAAO,YAAY,CAAC,CAAA;AAC9D,IAAA,IAAI,CAAA,GAAI,CAAA;AACR,IAAA,KAAA,MAAW,KAAA,IAAS,KAAK,SAAA,EAAW;AAClC,MAAA,IAAI,EAAE,iBAAiBC,8BAAA,CAAA,EAAe;AACtC,MAAA,MAAM,CAAA,GAAI,OAAO,CAAA,EAAG,CAAA;AACpB,MAAA,IAAI,CAAA,EAAG,KAAA,CAAM,eAAA,CAAgB,IAAA,CAAK,IAAI,CAAA,CAAE,MAAA,EAAQ,IAAA,CAAK,GAAA,CAAI,CAAA,EAAG,KAAA,GAAQ,CAAA,CAAE,KAAK,CAAC,CAAC,CAAA;AAAA,IAC/E;AAAA,EACF;AACF","file":"Spans-
|
|
1
|
+
{"version":3,"sources":["../src/sequences/Spans.ts"],"names":["CompositionSequence","spansMeta","resolveNumber","bindCounterKeyframes","TextSequence"],"mappings":";;;;;;;;;AAQA,IAAM,KAAA,GAAQ,CAAC,KAAA,KAAgD;AAC7D,EAAA,IAAI,CAAC,KAAA,IAAS,EAAE,cAAA,IAAkB,QAAQ,OAAO,KAAA;AACjD,EAAA,MAAM,EAAE,YAAA,EAAc,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AACzC,EAAA,OAAO,IAAA;AACT,CAAA;AAEO,IAAM,aAAA,GAAN,cAA4BA,qCAAA,CAAoB;AAAA,EACpC,KAAA;AAAA,EACA,MAAA,GAAuB,EAAE,KAAA,EAAO,CAAA,EAAG,cAAc,CAAA,EAAE;AAAA,EAEpE,WAAA,CAAY,IAAA,EAAoB,MAAA,EAAiC,IAAA,EAAwB;AACvF,IAAA,KAAA,CAAM,IAAA,EAAM,QAAQ,IAAI,CAAA;AACxB,IAAA,IAAA,CAAK,KAAA,GAAQC,2BAAA,CAAU,GAAA,CAAI,IAAI,CAAA;AAAA,EACjC;AAAA;AAAA,EAGmB,YAAA,GAAyH;AAC1I,IAAA,MAAM,CAAA,GAAI,MAAM,YAAA,EAAa;AAC7B,IAAA,IAAI,CAAC,IAAA,CAAK,KAAA,EAAO,KAAA,EAAO,OAAO,CAAA;AAC/B,IAAA,OAAO;AAAA,MACL,OAAA,EAAS,KAAA,CAAM,CAAA,CAAE,OAA4B,CAAA;AAAA,MAC7C,SAAA,EAAW,EAAE,SAAA,EAAW,GAAA,CAAI,SAAO,EAAE,GAAG,EAAA,EAAI,GAAA,EAAK,KAAA,CAAM,EAAA,CAAG,GAAG,CAAA,EAAG,EAAA,EAAI,KAAA,CAAM,EAAA,CAAG,EAAE,CAAA,EAAG,MAAM,KAAA,CAAM,EAAA,CAAG,IAAI,CAAA,EAAE,CAAE;AAAA,KAC3G;AAAA,EACF;AAAA,EAES,YAAA,CAAa,QAAA,EAAoB,MAAA,GAAS,CAAA,EAAS;AAC1D,IAAA,KAAA,CAAM,YAAA,CAAa,UAAU,MAAM,CAAA;AACnC,IAAA,IAAI,CAAC,IAAA,CAAK,KAAA,EAAO,KAAA,EAAO;AACxB,IAAA,MAAM,KAAA,GAAQ,KAAK,KAAA,EAAM;AACzB,IAAA,MAAM,KAAA,GAAS,IAAA,CAAK,IAAA,CAAK,OAAA,EAAiD,YAAA;AAC1E,IAAA,IAAA,CAAK,OAAO,YAAA,GAAe,KAAA,KAAU,SAAY,CAAA,GAAIC,+BAAA,CAAc,OAAO,KAAK,CAAA;AAC/E,IAAAC,sCAAA,CAAqB,UAAU,IAAA,CAAK,MAAA,EAAQ,gBAAgB,MAAM,IAAA,CAAK,aAAY,EAAG,IAAA,CAAK,IAAA,CAAK,SAAA,IAAa,EAAC,EAAG,IAAA,CAAK,UAAW,MAAA,GAAS,IAAA,CAAK,IAAI,KAAK,CAAA;AACxJ,IAAA,IAAA,CAAK,WAAA,EAAY;AAAA,EACnB;AAAA;AAAA,EAGQ,WAAA,GAAoB;AAC1B,IAAA,MAAM,MAAA,GAAS,KAAK,KAAA,CAAO,MAAA;AAC3B,IAAA,MAAM,KAAA,GAAQ,KAAK,GAAA,CAAI,CAAA,EAAG,KAAK,KAAA,CAAM,IAAA,CAAK,MAAA,CAAO,YAAY,CAAC,CAAA;AAC9D,IAAA,IAAI,CAAA,GAAI,CAAA;AACR,IAAA,KAAA,MAAW,KAAA,IAAS,KAAK,SAAA,EAAW;AAClC,MAAA,IAAI,EAAE,iBAAiBC,8BAAA,CAAA,EAAe;AACtC,MAAA,MAAM,CAAA,GAAI,OAAO,CAAA,EAAG,CAAA;AACpB,MAAA,IAAI,CAAA,EAAG,KAAA,CAAM,eAAA,CAAgB,IAAA,CAAK,IAAI,CAAA,CAAE,MAAA,EAAQ,IAAA,CAAK,GAAA,CAAI,CAAA,EAAG,KAAA,GAAQ,CAAA,CAAE,KAAK,CAAC,CAAC,CAAA;AAAA,IAC/E;AAAA,EACF;AACF","file":"Spans-XTIWYSNO.cjs","sourcesContent":["// The sequence behind a text layer with `spans`: a composition of ordinary text layers (see src/text/spans.ts) that also owns the typewriter\n// (`visibleChars`) of the whole text: it counts over every character of every piece, and tells each piece how many of its own to show.\nimport { CompositionSequence } from './Composition';\nimport { TextSequence, bindCounterKeyframes, resolveNumber, type CounterState } from './Text';\nimport { spansMeta, type SpansMeta } from '../text/spans';\nimport type { CompositionShape, SequenceSpec, Props } from '../types';\nimport type { Timeline } from '../core/timelineEngine';\n\nconst strip = (props: Props | undefined): Props | undefined => {\n if (!props || !('visibleChars' in props)) return props;\n const { visibleChars: _gone, ...rest } = props as Record<string, unknown>;\n return rest as unknown as Props;\n};\n\nexport class SpansSequence extends CompositionSequence {\n private readonly _meta: SpansMeta | undefined;\n private readonly _count: CounterState = { value: 0, visibleChars: 0 };\n\n constructor(spec: SequenceSpec, parent: CompositionShape | null, root: CompositionShape) {\n super(spec, parent, root);\n this._meta = spansMeta.get(spec);\n }\n\n /** `visibleChars` is the group's own counter, not a property to write on the container. */\n protected override displayProps(): { initial: CompositionSequence['spec']['initial']; keyframes: CompositionSequence['spec']['keyframes'] } {\n const p = super.displayProps();\n if (!this._meta?.typed) return p;\n return {\n initial: strip(p.initial as Props | undefined) as never,\n keyframes: p.keyframes?.map(kf => ({ ...kf, set: strip(kf.set), to: strip(kf.to), from: strip(kf.from) })),\n };\n }\n\n override bindTimeline(timeline: Timeline, offset = 0): void {\n super.bindTimeline(timeline, offset);\n if (!this._meta?.typed) return;\n const scope = this.scope();\n const first = (this.spec.initial as Record<string, unknown> | undefined)?.visibleChars;\n this._count.visibleChars = first === undefined ? 0 : resolveNumber(first, scope); // like a text: it starts at 0 once it is animated\n bindCounterKeyframes(timeline, this._count, 'visibleChars', () => this._distribute(), this.spec.keyframes ?? [], this.duration!, offset + this.at, scope);\n this._distribute();\n }\n\n /** Every piece shows its part of the first N characters of the whole text. */\n private _distribute(): void {\n const pieces = this._meta!.pieces;\n const total = Math.max(0, Math.floor(this._count.visibleChars));\n let i = 0;\n for (const child of this._children) {\n if (!(child instanceof TextSequence)) continue;\n const p = pieces[i++];\n if (p) child.setVisibleChars(Math.min(p.length, Math.max(0, total - p.start)));\n }\n }\n}\n"]}
|