@swf2es/player-hosts 0.0.0-stage → 0.1.1

package/dist/thread/player/stage.js

@@ -0,0 +1,4 @@
+export function stageAlignment(value) {
+    const input = value.toUpperCase();
+    return `${input.includes("T") ? "T" : ""}${input.includes("B") ? "B" : ""}${input.includes("L") ? "L" : ""}${input.includes("R") ? "R" : ""}`;
+}

package/dist/thread/player/text/csm.js

@@ -0,0 +1,113 @@
+// Advanced anti-aliasing's (Saffron's) cutoffs: Flash draws a glyph of an
+// advanced field with each pixel's coverage a ramp over its signed
+// distance to the outline, in pixels, inside positive, from 0 at the
+// outside cutoff to 1 at the inside one. The cutoffs come from a table
+// by the size in pixels on the screen, the font's CSM hint (its
+// DefineFontAlignZones; none is thin) and whether the text is light or
+// dark, linear between a table's sizes and flat past its ends; thickness
+// and sharpness then move them, and TextRenderer's
+// setAdvancedAntiAliasingTable puts a table of a font's own in place of
+// both colours'.
+//
+// The tables were measured in adl (AIR 51), from the ramps across the
+// edges of a block glyph drawn at each size from 4 to 96 pixels: the
+// sizes here are where the ramp's ends stop being one straight line, to
+// within 0.004 of a pixel.
+const table = (...entries) => entries.flat();
+/** By CSM hint, thin, medium and thick: light text's table, then dark text's. */
+const DEFAULTS = [
+    [
+        table([8, 0.081, -0.82], [12, 0.029, -0.821], [16, 0.127, -0.813], [26, 0.333, -0.852], [27, 0.349, -0.854]),
+        table([8, 0.255, -0.528], [12, 0.206, -0.441], [13, 0.234, -0.439], [16, 0.276, -0.469], [26, 0.398, -0.591], [27, 0.407, -0.601]),
+    ],
+    [
+        table([8, 0.08, -0.671], [12, 0.309, -0.54], [16, 0.445, -0.492], [20, 0.525, -0.513], [26, 0.645, -0.54], [27, 0.656, -0.541]),
+        table([8, 0.442, -0.439], 
+        // biome-ignore lint/suspicious/noApproximativeNumericConstant: measured, not log10(e)
+        [10, 0.486, -0.434], [11, 0.515, -0.428], [12, 0.566, -0.421], [18, 0.57, -0.422], [27, 0.619, -0.469]),
+    ],
+    [
+        table([8, 0.18, -0.571], [12, 0.46, -0.39], [16, 0.526, -0.415], [26, 0.649, -0.536], [27, 0.656, -0.541]),
+        table([8, 0.566, -0.42], [16, 0.567, -0.419], [27, 0.619, -0.469]),
+    ],
+];
+/**
+ * Tables set by TextRenderer.setAdvancedAntiAliasingTable, by font name
+ * and style; adl uses one for light and dark text alike, whichever
+ * colour type it was set for. TextRenderer's settings are the player's,
+ * not a SWF's: they are kept for the page, as Flash keeps them for its
+ * process.
+ */
+const custom = new Map();
+const styleKey = (name, bold, italic) => `${name}\u0000${bold ? (italic ? "boldItalic" : "bold") : italic ? "italic" : "regular"}`;
+/**
+ * Set a font's own table, entries of size, inside and outside cutoff, in
+ * any order; none takes it away. Text drawn by it before is drawn by it
+ * once drawn again. An entry with NaN or an infinity in it is left out,
+ * as the shader could make nothing of it.
+ */
+export function setCsmTable(name, style, entries) {
+    const key = `${name}\u0000${style}`;
+    const usable = entries.filter((entry) => entry.every(Number.isFinite));
+    if (usable.length === 0) {
+        custom.delete(key);
+    }
+    else {
+        usable.sort((a, b) => a[0] - b[0]);
+        custom.set(key, usable.flat());
+    }
+}
+/**
+ * Whether Flash takes a colour, 0xRRGGBB, for light text: its luma,
+ * 30:59:11, over 200 of 255. It is the colour as drawn, under the
+ * object's colour transform. This and cutoffs mirror what
+ * the renderer's glyph program (@swf2es/render's webgl/programs.ts) does
+ * in GLSL, which draws by it: a
+ * change to one is a change to the other.
+ */
+export function isLight(color) {
+    return 30 * ((color >> 16) & 0xff) + 59 * ((color >> 8) & 0xff) + 11 * (color & 0xff) > 20000;
+}
+/** The tables a font's text is drawn by, light and dark. */
+export function csmTables(font) {
+    const own = custom.size > 0 ? custom.get(styleKey(font.name, font.bold, font.italic)) : undefined;
+    if (own) {
+        return [own, own];
+    }
+    return DEFAULTS[Math.min(2, Math.max(0, font.csmHint ?? 0))];
+}
+/**
+ * The cutoffs at `ppem` pixels to the em, under `thickness` (-200 to
+ * 200) and `sharpness` (-400 to 400), into `out` as inside, outside: each
+ * moves them by a fiftieth of a pixel per pixel of size at its end of its
+ * range, thickness both outward, sharpness the two together; met, they
+ * stay where they met. The renderer's glyph program does the same per glyph.
+ */
+export function cutoffs(table, ppem, thickness, sharpness, out) {
+    let inside = table[1];
+    let outside = table[2];
+    if (ppem >= table[table.length - 3]) {
+        inside = table[table.length - 2];
+        outside = table[table.length - 1];
+    }
+    else if (ppem > table[0]) {
+        for (let i = 3; i < table.length; i += 3) {
+            if (ppem <= table[i]) {
+                const t = (ppem - table[i - 3]) / (table[i] - table[i - 3]);
+                inside = table[i - 2] + (table[i + 1] - table[i - 2]) * t;
+                outside = table[i - 1] + (table[i + 2] - table[i - 1]) * t;
+                break;
+            }
+        }
+    }
+    const unit = 0.0001 * ppem;
+    const t = Math.max(-200, Math.min(200, thickness));
+    const s = Math.max(-400, Math.min(400, sharpness));
+    inside -= unit * (t + s / 2);
+    outside -= unit * (t - s / 2);
+    if (inside < outside) {
+        inside = outside = (inside + outside) / 2;
+    }
+    out[0] = inside;
+    out[1] = outside;
+}

package/dist/thread/player/text/css.js

@@ -0,0 +1,167 @@
+// The CSS that StyleSheet.parseCSS reads, as Flash reads it: selectors
+// before a block, properties name: value inside, comments skipped. Flash
+// finds few things wrong, and on any of them the whole sheet is ignored
+// (Ruffle's CssStream, which its corpus checks against Flash).
+const WHITESPACE = " \n\r\t";
+/** Each selector's properties, names as written; null for a sheet Flash rejects. */
+export function parseCss(input) {
+    let pos = 0;
+    const peek = () => input[pos];
+    const skipComment = () => {
+        if (input.startsWith("/*", pos)) {
+            pos += 2;
+            while (!input.startsWith("*/", pos)) {
+                pos++;
+                if (pos >= input.length) {
+                    return false;
+                }
+            }
+            pos += 2;
+            return true;
+        }
+        return false;
+    };
+    const skip = () => {
+        let found = false;
+        while (skipComment() || (pos < input.length && WHITESPACE.includes(input[pos]))) {
+            if (pos < input.length && WHITESPACE.includes(input[pos])) {
+                pos++;
+            }
+            found = true;
+        }
+        return found;
+    };
+    const until = (stops) => {
+        const start = pos;
+        while (pos < input.length && !stops.includes(input[pos])) {
+            pos++;
+        }
+        return input.slice(start, pos);
+    };
+    const selectors = () => {
+        const out = [];
+        for (;;) {
+            skip();
+            const name = until("{, \n\r\t");
+            if (name) {
+                out.push(name);
+            }
+            skip();
+            const next = peek();
+            if (next === "{") {
+                pos++;
+                if (!out.length) {
+                    out.push("");
+                }
+                return out;
+            }
+            if (next !== ",") {
+                return null;
+            }
+            pos++;
+        }
+    };
+    const properties = () => {
+        const out = new Map();
+        for (;;) {
+            skip();
+            if (peek() === "}") {
+                pos++;
+                return out;
+            }
+            if (peek() === undefined) {
+                return out;
+            }
+            // Spaces before a name are skipped, after it kept, and within it an error.
+            const start = pos;
+            let name = until(": \n\r\t");
+            if (skip()) {
+                if (peek() === ":") {
+                    name = input.slice(start, pos);
+                }
+                else if (peek() !== undefined) {
+                    return null;
+                }
+            }
+            if (peek() !== ":") {
+                return null;
+            }
+            pos++;
+            skip();
+            const valueStart = pos;
+            let value = until(";:}");
+            for (;;) {
+                const next = peek();
+                if (next === ":") {
+                    // A colon in a value ends it at the line's end, if it has one.
+                    pos = valueStart;
+                    const line = until("\n\r");
+                    if (peek() !== undefined) {
+                        pos++;
+                        out.set(name, line);
+                        break;
+                    }
+                    pos = valueStart;
+                    value = until(";}");
+                    continue;
+                }
+                if (next === ";") {
+                    pos++;
+                    out.set(name, value);
+                    break;
+                }
+                if (next === "}") {
+                    pos++;
+                    const end = value.search(/[\n\r]/);
+                    out.set(name, end < 0 ? value : value.slice(0, end));
+                    return out;
+                }
+                return null;
+            }
+        }
+    };
+    const result = new Map();
+    for (;;) {
+        skip();
+        if (peek() === undefined) {
+            return result;
+        }
+        const names = selectors();
+        if (!names) {
+            return null;
+        }
+        const block = properties();
+        if (!block) {
+            return null;
+        }
+        for (const name of names) {
+            result.set(name, new Map(block));
+        }
+    }
+}
+/** A property name as a style object has it: font-size is fontSize. */
+export function camelCase(name) {
+    return name.replace(/-(.)/g, (_, c) => c.toUpperCase());
+}
+/** A font-family list as a TextFormat's font: the generic families as Flash names them, spaces dropped around names. */
+export function fontList(input) {
+    const generic = {
+        mono: "_typewriter",
+        "sans-serif": "_sans",
+        serif: "_serif",
+    };
+    return input
+        .split(",")
+        .map((name) => name.replace(/^ +/, ""))
+        .filter((name) => name !== "")
+        .map((name) => generic[name] ?? name)
+        .join(",");
+}
+/** A colour #RRGGBB, of at most six digits; 0 for anything else. */
+export function cssColor(input) {
+    if (!input.startsWith("#")) {
+        return 0;
+    }
+    const digits = input.slice(1).trimEnd();
+    return digits.length <= 6 && /^[0-9a-fA-F]+$/.test(digits) ? Number.parseInt(digits, 16) : 0;
+}

package/dist/thread/player/text/fonts.js

@@ -0,0 +1,97 @@
+/** A SWF's embedded fonts: DefineFont through 3, by name. */
+export class FontSet {
+    byName = new Map();
+    add(font) {
+        const fonts = this.byName.get(font.name);
+        if (fonts) {
+            fonts.push(font);
+        }
+        else {
+            this.byName.set(font.name, [font]);
+        }
+    }
+    /** Prefer a font with layout metrics when a library has more than one of the same name. */
+    find(name, bold, italic) {
+        const fonts = this.byName.get(name);
+        if (!fonts) {
+            return null;
+        }
+        return (fonts.find((f) => f.bold === bold && f.italic === italic && f.layout) ??
+            fonts.find((f) => f.layout) ??
+            fonts.find((f) => f.bold === bold && f.italic === italic) ??
+            fonts[0]);
+    }
+}
+/** A device font as the browser has it: `_sans`, `_serif` and `_typewriter` as its kinds, any other by name, then serif, as Flash's default is. */
+function fontFamily(font) {
+    switch (font) {
+        case "_sans":
+            return ["Arial", "Helvetica", "sans-serif"];
+        case "_serif":
+            return ["Times New Roman", "Times", "serif"];
+        case "_typewriter":
+            return ["Courier New", "Courier", "monospace"];
+        default:
+            return [font, "serif"];
+    }
+}
+let canvas;
+function context() {
+    if (canvas === undefined) {
+        canvas = null;
+        if (typeof OffscreenCanvas !== "undefined") {
+            const c = new OffscreenCanvas(1, 1).getContext("2d");
+            canvas = c ? { context: c } : null;
+        }
+        else if (typeof document !== "undefined") {
+            const c = document.createElement("canvas").getContext("2d");
+            canvas = c ? { context: c } : null;
+        }
+    }
+    return canvas?.context ?? null;
+}
+const measured = new Map();
+/** The CSS font a device format is measured and drawn in. */
+export function cssFont(font, size, bold, italic) {
+    const families = fontFamily(font)
+        .map((f) => (/^[a-z-]+$/.test(f) ? f : `"${f}"`))
+        .join(", ");
+    return `${italic ? "italic " : ""}${bold ? "bold " : ""}${size}px ${families}`;
+}
+/**
+ * A device font's metrics: the browser's, from its canvas, where there is
+ * one; else (node) a stand-in, half the size a character, ascent 0.9 and
+ * descent 0.2 of it. Flash's system fonts are neither.
+ */
+export function deviceMetrics(font, size, bold, italic) {
+    const key = `${font}|${size}|${bold}|${italic}`;
+    let metrics = measured.get(key);
+    if (metrics) {
+        return metrics;
+    }
+    const c = context();
+    if (c) {
+        const css = cssFont(font, size, bold, italic);
+        const widths = new Map();
+        c.font = css;
+        const box = c.measureText("Mg");
+        metrics = {
+            advance: (char) => {
+                let w = widths.get(char);
+                if (w === undefined) {
+                    c.font = css;
+                    w = c.measureText(char).width;
+                    widths.set(char, w);
+                }
+                return w;
+            },
+            ascent: box.fontBoundingBoxAscent ?? size * 0.9,
+            descent: box.fontBoundingBoxDescent ?? size * 0.2,
+        };
+    }
+    else {
+        metrics = { advance: () => size / 2, ascent: size * 0.9, descent: size * 0.2 };
+    }
+    measured.set(key, metrics);
+    return metrics;
+}