@swf2es/player-hosts 0.0.0-stage → 0.1.1

package/dist/thread/player/display/perspective.js

@@ -0,0 +1,193 @@
+// A 3D display object's plane in perspective (docs/architecture/rendering.md, "3D
+// display objects"): as Flash Player and adl project it, through the
+// perspective projection of the nearest container above it that has one
+// set, or else of its SWF's root (the stage's, for one put on the stage).
+// Its matrix3D, those of the 3D objects above it and the 2D matrices
+// between go into one 3D transform to that container's space, which the
+// projection then divides: a 3D object inside another is in true 3D, not
+// flattened into the other's plane. The plane of each object, 2D or 3D,
+// is then a projective map of its space to the container's, and a 3D
+// object's in its parent's is the parent's inverse after its own.
+import { apply, concat, invert } from "./geometry.js";
+/** Each player's stage's size, for the default projection of a root: centred on the stage and as wide. */
+const stageSizes = new WeakMap();
+export function setStageSize(stage, width, height) {
+    stageSizes.set(stage, { width, height });
+}
+/**
+ * A BitmapData's draw of what is on no stage, `top` the topmost of it: as
+ * in Flash, what is in 3D in it projects as on a stage the bitmap's size,
+ * centred on it, for the draw. Returns how to put it back, or null where it
+ * is on a stage already.
+ */
+export function drawnAsStage(top, width, height) {
+    if (top.parent || top.loaderInfo || stageSizes.has(top)) {
+        return null;
+    }
+    stageSizes.set(top, { width, height });
+    return () => stageSizes.delete(top);
+}
+/** The size of the stage `d` is under, or Flash's default stage's where it is under none. */
+function stageSizeOf(d) {
+    let top = d;
+    while (top.parent) {
+        top = top.parent;
+    }
+    return stageSizes.get(top) ?? { width: 550, height: 400 };
+}
+/** Flash's default field of view, 55 degrees, in radians. */
+const FIELD_OF_VIEW = (55 * Math.PI) / 180;
+/** The projection of what has none set: Flash's field of view, centred on (centerX, centerY). */
+export function defaultProjection(centerX, centerY) {
+    return { fieldOfView: FIELD_OF_VIEW, centerX, centerY };
+}
+/** The focal length of a field of view in radians over a width, in float32 as Flash's. */
+export function focalLengthOver(radians, width) {
+    return Math.fround((width / 2) * Math.fround(Math.tan((Math.PI - radians) / 2)));
+}
+/** Whether `d` projects what is in it: a projection set on it, a SWF's root, or the stage (no parent). */
+function projects(d) {
+    return d.projection !== null || d.loaderInfo !== null || d.parent === null;
+}
+/** The container whose projection `o` is drawn through: the nearest above it that projects. */
+function projectorOf(o) {
+    for (let p = o.parent; p; p = p.parent) {
+        if (projects(p)) {
+            return p;
+        }
+    }
+    return null;
+}
+/** The projection `d` projects through: its own, or the default of the stage or a root. */
+function projectionOf(d) {
+    if (d.projection) {
+        return d.projection;
+    }
+    const stage = d.parent === null && d.loaderInfo !== null;
+    const size = stageSizeOf(d);
+    return stage ? defaultProjection(250, 250) : defaultProjection(size.width / 2, size.height / 2);
+}
+/**
+ * The focal length of a field of view in radians as `d` projects through
+ * it: the stage's projection measures 500 wide, any other object's the
+ * stage's width.
+ */
+function focalLength(radians, d) {
+    const width = d.parent === null && d.loaderInfo !== null ? 500 : stageSizeOf(d).width;
+    return focalLengthOver(radians, width);
+}
+/** `m`, `d`'s own transform in 3D: its matrix3D, or its 2D matrix with z kept (a 3D object has no scroll). */
+function own3D(d) {
+    const m = new Float64Array(16);
+    const space = d.space;
+    if (space) {
+        m.set(space.shown);
+    }
+    else {
+        const p = d.placed;
+        m.set([p.a, p.b, 0, 0, p.c, p.d, 0, 0, 0, 0, 1, 0, p.tx, p.ty, 0, 1]);
+    }
+    return m;
+}
+/** `a` after `b`: b's columns through a. */
+function multiply(a, b) {
+    const out = new Float64Array(16);
+    for (let c = 0; c < 4; c++) {
+        for (let r = 0; r < 4; r++) {
+            out[c * 4 + r] =
+                a[r] * b[c * 4] +
+                    a[4 + r] * b[c * 4 + 1] +
+                    a[8 + r] * b[c * 4 + 2] +
+                    a[12 + r] * b[c * 4 + 3];
+        }
+    }
+    return out;
+}
+/** `d`'s space to `top`'s in 3D, `top` excluded; null where `top` is not above it. */
+function toSpace(d, top) {
+    let m = own3D(d);
+    for (let p = d.parent; p !== top; p = p.parent) {
+        if (!p) {
+            return null;
+        }
+        m = multiply(own3D(p), m);
+    }
+    return m;
+}
+/**
+ * A point in the projector's 3D space projected into its plane, as
+ * homogeneous coordinates: the field of view's focal length f, the centre
+ * (cx, cy), and a point at depth z drawn at f / (f + z) of its distance
+ * from the centre.
+ */
+function project(projector, x, y, z) {
+    const p = projectionOf(projector);
+    const k = 1 / focalLength(p.fieldOfView, projector);
+    return [x + p.centerX * k * z, y + p.centerY * k * z, 1 + k * z];
+}
+/** The plane z = 0 of a 3D space `m` puts in the projector's, projected: a projective map. */
+function planeOf(projector, m) {
+    const p = projectionOf(projector);
+    const k = 1 / focalLength(p.fieldOfView, projector);
+    const cx = p.centerX * k;
+    const cy = p.centerY * k;
+    return {
+        a: m[0] + cx * m[2],
+        b: m[1] + cy * m[2],
+        u: k * m[2] + m[3],
+        c: m[4] + cx * m[6],
+        d: m[5] + cy * m[6],
+        v: k * m[6] + m[7],
+        tx: m[12] + cx * m[14],
+        ty: m[13] + cy * m[14],
+        w: k * m[14] + m[15],
+    };
+}
+/**
+ * A 3D object's plane in its parent's space, in perspective (`placed`):
+ * through its projector's projection, its plane in the projector's space
+ * (`own`), and back through the parent's plane there (`back`, null where
+ * the parent is the projector), which is flat but for a 3D object above
+ * it. An object off the list projects through its topmost container's, as
+ * a root's.
+ */
+export function placedInPerspective(o) {
+    const parent = o.parent;
+    if (!parent) {
+        const m = own3D(o);
+        const placed = { a: m[0], b: m[1], c: m[4], d: m[5], tx: m[12], ty: m[13], u: 0, v: 0, w: 1 };
+        return { placed, own: placed, back: null };
+    }
+    const projector = projectorOf(o);
+    const up = parent === projector ? null : toSpace(parent, projector);
+    const m = up ? multiply(up, own3D(o)) : own3D(o);
+    // A NaN anywhere, as an infinite scale's column has, goes into all of Flash's projection, which
+    // then draws nothing: the plane's z column alone would leave it out.
+    if (m.some(Number.isNaN)) {
+        m.fill(Number.NaN);
+    }
+    const own = planeOf(projector, m);
+    if (!up) {
+        return { placed: own, own, back: null };
+    }
+    const back = invert(planeOf(projector, up));
+    return { placed: (back ? concat(own, back) : own), own, back };
+}
+/**
+ * A point of `d`'s 3D space on the stage (`stage` itself excluded): into
+ * its projector's space, projected there, then through the projector's
+ * matrices up to the stage.
+ */
+export function stagePoint3D(d, x, y, z, stage) {
+    const projector = projectorOf(d);
+    const m = projector && toSpace(d, projector);
+    if (!projector || !m) {
+        return apply(d.placed, x, y);
+    }
+    const [px, py, q] = project(projector, m[0] * x + m[4] * y + m[8] * z + m[12], m[1] * x + m[5] * y + m[9] * z + m[13], m[2] * x + m[6] * y + m[10] * z + m[14]);
+    let at = [px / q, py / q];
+    for (let p = projector; p && p !== stage; p = p.parent) {
+        at = apply(p.placed, at[0], at[1]);
+    }
+    return at;
+}

package/dist/thread/player/display/scale9.js

@@ -0,0 +1,236 @@
+import { ownBounds } from "./bounds.js";
+import { Container, ShapeObject, StaticTextObject, TextObject, } from "./display.js";
+import { apply, invert, union } from "./geometry.js";
+import { MOVE, pointsOf } from "./shapes.js";
+import { makeRoom, moveLast, same } from "./value-lists.js";
+/**
+ * Flash slices only an object whose own matrix neither turns nor skews,
+ * to a 4096th, and mirrors neither way; any other scales as ever. adl
+ * slices b = 0.000244 and not 0.0002442: a 16.16 fraction under 16.
+ */
+const SKEW = 1 / 4096;
+/**
+ * An axis from the bounds' edges lo and hi and the grid's gLo and gHi,
+ * scaled by s: the corners keep their size in the parent's units, or,
+ * where the scaled size is less than theirs, share it in proportion and
+ * leave the centre none.
+ */
+export function axis(lo, gLo, gHi, hi, s) {
+    const corners = gLo - lo + (hi - gHi);
+    const k = Math.min(1, (s * (hi - lo)) / corners);
+    return {
+        from: [lo, gLo, gHi, hi],
+        to: [lo, lo + (k * (gLo - lo)) / s, hi - (k * (hi - gHi)) / s, hi],
+    };
+}
+/**
+ * The bounds a grid divides: what `o` draws, without lines, and what each
+ * of its children draws itself, each in the child's own space, its matrix
+ * ignored, and nothing of the grandchildren; a text field or a static
+ * text counts for nothing, a bitmap or a video does. So adl slices: a
+ * child's bars moved 30 to the right leave the edges where the panel's
+ * are, one drawn out to 120 moves the right edge to 120 wherever the child
+ * is, and a grandchild's moves nothing.
+ */
+export function sliceBounds(o) {
+    let r = ownBounds(o, false);
+    if (o instanceof Container) {
+        for (const child of o.children) {
+            if (!(child instanceof TextObject || child instanceof StaticTextObject)) {
+                const b = ownBounds(child, false);
+                if (b) {
+                    r = union(r, b);
+                }
+            }
+        }
+    }
+    return r;
+}
+/** Whether `grid` is strictly inside `r` both ways, as Flash slices only by such a grid. */
+export function gridInside(r, grid) {
+    return (r !== null &&
+        r.xMin < grid.xMin &&
+        grid.xMin < grid.xMax &&
+        grid.xMax < r.xMax &&
+        r.yMin < grid.yMin &&
+        grid.yMin < grid.yMax &&
+        grid.yMax < r.yMax);
+}
+/**
+ * The slice `o` draws its shapes with under its matrix `m`: null where it
+ * has no grid, or one not strictly inside its sliceBounds both ways, or a
+ * transform Flash does not slice under, or one that changes nothing.
+ */
+export function sliceOf(o, m = o.matrix) {
+    const grid = o.scale9Grid;
+    if (!grid ||
+        !(m.a > 0 && m.d > 0 && Math.abs(m.b) < SKEW && Math.abs(m.c) < SKEW) ||
+        (m.a === 1 && m.d === 1)) {
+        return null;
+    }
+    const r = sliceBounds(o);
+    if (!r || !gridInside(r, grid)) {
+        return null;
+    }
+    const kept = slices.get(o);
+    if (kept &&
+        kept.grid === grid &&
+        kept.a === m.a &&
+        kept.d === m.d &&
+        kept.r.xMin === r.xMin &&
+        kept.r.yMin === r.yMin &&
+        kept.r.xMax === r.xMax &&
+        kept.r.yMax === r.yMax) {
+        return kept.slice;
+    }
+    const x = axis(r.xMin, grid.xMin, grid.xMax, r.xMax, m.a);
+    const y = axis(r.yMin, grid.yMin, grid.yMax, r.yMax, m.d);
+    const slice = { x, y, key: `${x.to.join()},${y.to.join()},${x.from.join()},${y.from.join()}` };
+    slices.set(o, { grid, a: m.a, d: m.d, r, slice });
+    return slice;
+}
+/**
+ * The slice `o` draws with as it is drawn: a MorphShape, it or a child,
+ * takes its ratio's blend first, as it does later in the same draw, so
+ * that a new ratio's bounds slice on its own frame, as adl's do, and not
+ * a frame late.
+ */
+export function sliceDrawn(o) {
+    if (o instanceof ShapeObject && o.morph) {
+        o.drawn();
+    }
+    else if (o instanceof Container) {
+        for (const child of o.children) {
+            if (child instanceof ShapeObject && child.morph) {
+                child.drawn();
+            }
+        }
+    }
+    return sliceOf(o);
+}
+/** Each object's last slice and what it was made of: a hit test asks for it on every pointer move. */
+const slices = new WeakMap();
+/**
+ * Where `v` is drawn on the axis: piecewise linear through the edges, and
+ * on past the bounds at the corners' rate, as a curve's control point may be.
+ */
+export function onAxis(axis, v) {
+    const { from, to } = axis;
+    const i = v < from[1] ? 0 : v < from[2] ? 1 : 2;
+    return to[i] + ((v - from[i]) * (to[i + 1] - to[i])) / (from[i + 1] - from[i]);
+}
+/**
+ * The slice that reshapes what `d` itself draws, and the matrix from its
+ * space to the owner's, null for the owner itself: its own grid's, or,
+ * for a shape, its parent's, unless it is filtered, which adl draws as a
+ * bitmap of it, stretched whole (the `slice-filtered` case). Null for none.
+ */
+export function sliceFor(d) {
+    if (withinMask(d)) {
+        return null;
+    }
+    if (d.scale9Grid) {
+        const slice = sliceOf(d);
+        if (slice) {
+            return { slice, m: null };
+        }
+    }
+    const parent = d.parent;
+    if (d instanceof ShapeObject && parent?.scale9Grid && d.filters.length === 0) {
+        const slice = sliceOf(parent);
+        if (slice) {
+            return { slice, m: d.placed };
+        }
+    }
+    return null;
+}
+/**
+ * Whether `d` is a mask, a script's or a timeline's, or is in one: adl
+ * draws it unsliced, and its shape test hits nothing of it.
+ */
+export function withinMask(d) {
+    for (let o = d; o; o = o.parent) {
+        if (o.maskOf !== null || o.clipDepth > 0) {
+            return true;
+        }
+    }
+    return false;
+}
+/**
+ * Layers with every point of their paths, fills' and lines' alike, moved
+ * as the slice moves them. A fill's gradient or bitmap keeps its matrix,
+ * stretched as ever, as Flash's does. `version` is a drawing's, whose
+ * layers change in place.
+ */
+export function sliceLayers(layers, slice, m, version = 0) {
+    // Compared as values, not by a key formatted from them on every draw and hit test: the slice
+    // by its own key, made once with it, its matrix by its numbers.
+    let kept = sliced.get(layers);
+    for (let i = kept ? kept.length - 1 : -1; i >= 0; i--) {
+        const e = kept[i];
+        if (e.version === version &&
+            (e.slice === slice || e.slice.key === slice.key) &&
+            (e.m === null
+                ? m === null
+                : m !== null &&
+                    same(e.m.a, m.a) &&
+                    same(e.m.b, m.b) &&
+                    same(e.m.c, m.c) &&
+                    same(e.m.d, m.d) &&
+                    same(e.m.tx, m.tx) &&
+                    same(e.m.ty, m.ty))) {
+            return (i === kept.length - 1 ? e : moveLast(kept, i))
+                .layers;
+        }
+    }
+    const made = moveLayers(layers, slice, m);
+    if (!kept) {
+        kept = [];
+        sliced.set(layers, kept);
+    }
+    // The least lately used goes past a few: instances of one symbol at a few sizes alternate.
+    makeRoom(kept, SLICES_KEPT, () => false, () => { });
+    kept.push({ slice, m: m && { ...m }, version, layers: made });
+    return made;
+}
+const SLICES_KEPT = 4;
+/**
+ * The latest slices of each set of layers, with the slice, matrix and
+ * version each was made for: a hit test asks on every pointer move, and
+ * the renderer again on a redraw that is not a reslice.
+ */
+const sliced = new WeakMap();
+function moveLayers(layers, slice, m) {
+    const inverse = m && invert(m);
+    if (m && !inverse) {
+        return layers;
+    }
+    const move = (path) => {
+        const out = path.slice();
+        for (let i = 0; i < out.length;) {
+            const points = pointsOf(out[i]);
+            for (let k = 0; k < points; k++) {
+                const at = i + 1 + 2 * k;
+                const [ox, oy] = m ? apply(m, out[at], out[at + 1]) : [out[at], out[at + 1]];
+                const sx = onAxis(slice.x, ox);
+                const sy = onAxis(slice.y, oy);
+                [out[at], out[at + 1]] = inverse ? apply(inverse, sx, sy) : [sx, sy];
+            }
+            i += 1 + 2 * points;
+        }
+        return out;
+    };
+    // drawTriangles' textured triangles stay where they were drawn.
+    return layers.map((layer) => ({
+        ...layer,
+        fills: layer.fills.map((f) => ({ ...f, contours: f.contours.map(move) })),
+        strokes: layer.strokes.map((s) => ({
+            ...s,
+            paths: s.paths.map(move),
+            closes: s.closes?.map((c) => {
+                const [, x, y] = move([MOVE, c.x, c.y]);
+                return { at: c.at, x, y };
+            }),
+        })),
+    }));
+}

package/dist/thread/player/display/shapeobject.js

@@ -0,0 +1,131 @@
+import { IDENTITY_COLOR } from "./color.js";
+import { CONTENT, DisplayObject, pickWork, TRANSFORM } from "./displayobject.js";
+import { morphAt } from "./morph.js";
+export class ShapeObject extends DisplayObject {
+    /** The shape it draws, or last drew; null for a Shape a script made, which draws nothing yet. */
+    shape;
+    /** A MorphShape's morph, which `shape` is a blend of. */
+    morph = null;
+    /**
+     * The blend drawn() last made, and its morph and ratio: it stands while
+     * `shape` is still it, which a swap to a shape is not.
+     */
+    blended = null;
+    /**
+     * The shape Flash's bitmap cache of it still shows, given another of the
+     * same bounds while cached (`swap`), and the look it was cached with;
+     * null where it draws what it is. It goes for good when the look does.
+     */
+    stale = null;
+    constructor(shape) {
+        super();
+        this.shape = shape;
+        this.character = shape;
+    }
+    /** A MorphShape, its morph's start until it is drawn at another ratio. */
+    static ofMorph(morph) {
+        const shape = morphAt(morph, 0);
+        const object = new ShapeObject(shape);
+        object.morph = morph;
+        object.blended = { morph, ratio: 0, shape };
+        object.character = morph;
+        return object;
+    }
+    /**
+     * A MorphShape takes on a new ratio when it is next drawn (drawn): until
+     * then its bounds and hit tests are the last drawn blend's, as Flash's
+     * are (the corpus's hittest_morph).
+     */
+    applyPlace(place) {
+        const ratio = this.ratio;
+        super.applyPlace(place);
+        if (this.morph && this.ratio !== ratio) {
+            this.invalidate(CONTENT);
+        }
+    }
+    /** The shape to draw now: a MorphShape's blend at its ratio, which it keeps from here. */
+    drawn() {
+        // The blend it has is kept while its morph and ratio are: asking the
+        // morph again would turn over its few latest blends for nothing.
+        const b = this.blended;
+        if (this.morph &&
+            (b?.morph !== this.morph || b.ratio !== this.ratio || b.shape !== this.shape)) {
+            this.shape = morphAt(this.morph, this.ratio);
+            this.blended = { morph: this.morph, ratio: this.ratio, shape: this.shape };
+            // New bounds, which no invalidate tells of: the change of ratio did,
+            // but those it marked may have been measured since, with the old blend.
+            pickWork.changes++;
+            this.pickChanged(true);
+        }
+        return this.shape;
+    }
+    /**
+     * Flash draws the object again, its cache gone stale or not, for another
+     * scale, turn or skew, colour or filters; not when it only moves
+     * (`cache-replace`). The cache turned off counts only where a frame is
+     * drawn so: off and on again in between, it stands (the view's to tell).
+     */
+    invalidate(what) {
+        const stale = this.stale;
+        if (stale && what & TRANSFORM && !stale.stands(this)) {
+            this.stale = null;
+            what |= CONTENT;
+        }
+        super.invalidate(what);
+    }
+}
+/** What a bitmap cache was drawn of, and the look it was drawn with. */
+export class StaleCache {
+    shape;
+    a;
+    b;
+    c;
+    d;
+    color;
+    filters;
+    constructor(shape, o) {
+        this.shape = shape;
+        ({ a: this.a, b: this.b, c: this.c, d: this.d } = o.matrix);
+        this.color = o.colorTransform;
+        this.filters = o.filters;
+    }
+    stands(o) {
+        const m = o.matrix;
+        return (m.a === this.a &&
+            m.b === this.b &&
+            m.c === this.c &&
+            m.d === this.d &&
+            sameColor(o.colorTransform, this.color) &&
+            sameFilters(o.filters, this.filters));
+    }
+}
+/**
+ * A place's filters are read anew at each move, the same or not. Those
+ * from a SWF are plain records; a script's displacement map holds its
+ * bitmap, so another list with one counts as other filters.
+ */
+function sameFilters(a, b) {
+    if (a === b) {
+        return true;
+    }
+    if (a.length !== b.length || a.some((f) => f.kind === "displacementMap")) {
+        return false;
+    }
+    return JSON.stringify(a) === JSON.stringify(b);
+}
+/** Whether Flash draws `o` from a bitmap it keeps: cacheAsBitmap set, or filters. */
+export function cached(o) {
+    return o.cachedAsBitmap || o.filters.length > 0;
+}
+function sameColor(a, b) {
+    const x = a ?? IDENTITY_COLOR;
+    const y = b ?? IDENTITY_COLOR;
+    return (x.rMul === y.rMul &&
+        x.gMul === y.gMul &&
+        x.bMul === y.bMul &&
+        x.aMul === y.aMul &&
+        x.rAdd === y.rAdd &&
+        x.gAdd === y.gAdd &&
+        x.bAdd === y.bAdd &&
+        x.aAdd === y.aAdd);
+}