@swf2es/player 0.0.0-stage → 0.1.0

package/src/bitmap/png.ts

@@ -0,0 +1,152 @@
+// BitmapData.encode's PNG: a file of IHDR, one IDAT and IEND, as Flash
+// writes, RGBA for a transparent bitmap and RGB for an opaque one. The
+// colours are divided out of alpha as Flash's encoder does it,
+// floor(c * 256 / a) up to 255 (every alpha and value checked under adl),
+// which is not getPixel32's rounding. The bytes need not be Flash's, only
+// what they decode to: fast compression filters no row and deflates at
+// level 1, as Flash does; otherwise each row takes the filter whose output
+// sums smallest, libpng's heuristic, deflated at level 6 where Flash uses
+// 9: a 1080p frame takes a quarter of the time for 1% more bytes.
+import { zlibCompress } from "@swf2es/format";
+import type { BitmapStore, PixelRect } from "./bitmap.js";
+
+const CRC = new Uint32Array(256);
+for (let n = 0; n < 256; n++) {
+  let c = n;
+  for (let k = 0; k < 8; k++) {
+    c = c & 1 ? 0xedb88320 ^ (c >>> 1) : c >>> 1;
+  }
+
+  CRC[n] = c >>> 0;
+}
+
+function crc32(bytes: Uint8Array, start: number, end: number): number {
+  let c = 0xffffffff;
+  for (let i = start; i < end; i++) {
+    c = CRC[(c ^ bytes[i]) & 0xff] ^ (c >>> 8);
+  }
+
+  return (c ^ 0xffffffff) >>> 0;
+}
+
+/** `rect` of the store, clipped to it and not empty, as a PNG file. */
+export function encodePng(store: BitmapStore, rect: PixelRect, fast: boolean): Uint8Array {
+  const { x: x0, y: y0, width, height } = rect;
+  const channels = store.transparent ? 4 : 3;
+  const stride = 1 + width * channels;
+  const raw = new Uint8Array(stride * height);
+  const pixels = store.drawable;
+  for (let y = 0; y < height; y++) {
+    let j = y * stride + 1;
+    for (let i = (y0 + y) * store.width + x0, end = i + width; i < end; i++) {
+      const p = pixels[i];
+      const a = p >>> 24;
+      let r = (p >>> 16) & 0xff;
+      let g = (p >>> 8) & 0xff;
+      let b = p & 0xff;
+      if (a === 0) {
+        r = g = b = 0;
+      } else if (a !== 255) {
+        r = Math.min(255, ((r << 8) / a) | 0);
+        g = Math.min(255, ((g << 8) / a) | 0);
+        b = Math.min(255, ((b << 8) / a) | 0);
+      }
+
+      raw[j++] = r;
+      raw[j++] = g;
+      raw[j++] = b;
+      if (channels === 4) {
+        raw[j++] = a;
+      }
+    }
+  }
+
+  if (!fast) {
+    filterRows(raw, stride, height, channels);
+  }
+
+  const data = zlibCompress(raw, fast ? 1 : 6);
+  const out = new Uint8Array(8 + 25 + 12 + data.length + 12);
+  const view = new DataView(out.buffer);
+  out.set([0x89, 0x50, 0x4e, 0x47, 0x0d, 0x0a, 0x1a, 0x0a]);
+  let at = 8;
+  const chunk = (type: string, length: number, write: (at: number) => void) => {
+    view.setUint32(at, length);
+    for (let k = 0; k < 4; k++) {
+      out[at + 4 + k] = type.charCodeAt(k);
+    }
+
+    write(at + 8);
+    view.setUint32(at + 8 + length, crc32(out, at + 4, at + 8 + length));
+    at += 12 + length;
+  };
+  chunk("IHDR", 13, (p) => {
+    view.setUint32(p, width);
+    view.setUint32(p + 4, height);
+    // 8 bits a channel, RGBA (6) or RGB (2), deflate, adaptive filtering, no interlace.
+    out.set([8, channels === 4 ? 6 : 2, 0, 0, 0], p + 8);
+  });
+  chunk("IDAT", data.length, (p) => out.set(data, p));
+  chunk("IEND", 0, () => {});
+  return out;
+}
+
+/**
+ * Each row, its filter byte 0 as written, given the filter of the five
+ * whose output's bytes, taken as signed, sum smallest; rows are filtered
+ * bottom up, so each still sees the unfiltered row above it.
+ */
+function filterRows(raw: Uint8Array, stride: number, height: number, bpp: number): void {
+  const length = stride - 1;
+  const candidates = Array.from({ length: 5 }, () => new Uint8Array(length));
+  for (let y = height - 1; y >= 0; y--) {
+    const row = y * stride + 1;
+    const up = y > 0 ? row - stride : -1;
+    let best = 0;
+    let bestSum = Number.POSITIVE_INFINITY;
+    for (let f = 0; f < 5; f++) {
+      const out = candidates[f];
+      let sum = 0;
+      for (let i = 0; i < length; i++) {
+        const x = raw[row + i];
+        const a = i >= bpp ? raw[row + i - bpp] : 0;
+        const b = up >= 0 ? raw[up + i] : 0;
+        const c = up >= 0 && i >= bpp ? raw[up + i - bpp] : 0;
+        let v: number;
+        switch (f) {
+          case 0:
+            v = x;
+            break;
+          case 1:
+            v = x - a;
+            break;
+          case 2:
+            v = x - b;
+            break;
+          case 3:
+            v = x - ((a + b) >> 1);
+            break;
+          default: {
+            const p = a + b - c;
+            const pa = Math.abs(p - a);
+            const pb = Math.abs(p - b);
+            const pc = Math.abs(p - c);
+            v = x - (pa <= pb && pa <= pc ? a : pb <= pc ? b : c);
+          }
+        }
+
+        out[i] = v;
+        const s = out[i];
+        sum += s < 128 ? s : 256 - s;
+      }
+
+      if (sum < bestSum) {
+        bestSum = sum;
+        best = f;
+      }
+    }
+
+    raw[row - 1] = best;
+    raw.set(candidates[best], row);
+  }
+}

package/src/bitmap/turbulence.ts

@@ -0,0 +1,117 @@
+// Perlin noise as BitmapData.perlinNoise makes it: the reference
+// implementation of SVG's feTurbulence, which Flash's matches, with an
+// offset for each octave, as Ruffle ports it (turbulence.rs).
+//
+// Derived from https://www.w3.org/TR/SVG11/filters.html#feTurbulenceElement,
+// Copyright © 2015 W3C® (MIT, ERCIM, Keio, Beihang), under the W3C software
+// license.
+
+const RAND_M = 2147483647;
+const RAND_A = 16807;
+const RAND_Q = 127773;
+const RAND_R = 2836;
+const B_SIZE = 0x100;
+
+/** Park and Miller's minimal standard seed: in [1, 2^31 - 2]. */
+function setupSeed(seed: number): number {
+  let s = seed;
+  if (s <= 0) {
+    s = -(s % (RAND_M - 1)) + 1;
+  }
+
+  if (s > RAND_M - 1) {
+    s = RAND_M - 1;
+  }
+
+  return s;
+}
+
+function random(seed: number): number {
+  let result = RAND_A * (seed % RAND_Q) - RAND_R * Math.trunc(seed / RAND_Q);
+  if (result <= 0) {
+    result += RAND_M;
+  }
+
+  return result;
+}
+
+/**
+ * perlinNoise's set-up of `seed`: the lattice, and four channels'
+ * gradients, x and y interleaved, one after another; the frequencies,
+ * adjusted where stitching to tile a `width` by `height` image, and the
+ * tile in lattice cells at the first octave. The render module draws the
+ * noise of them (pixels.zig).
+ */
+export function perlinSetup(
+  seed: number,
+  base: [number, number],
+  stitching: boolean,
+  width: number,
+  height: number,
+): {
+  lattice: Int32Array;
+  gradients: Float64Array;
+  fx: number;
+  fy: number;
+  stitch: boolean;
+  stitchWidth: number;
+  stitchHeight: number;
+} {
+  const lattice = new Int32Array(B_SIZE + B_SIZE + 2);
+  const cells = (B_SIZE + B_SIZE + 2) * 2;
+  const gradients = new Float64Array(cells * 4);
+  let s = setupSeed(seed);
+  for (let c = 0; c < 4; c++) {
+    const g = gradients.subarray(c * cells, (c + 1) * cells);
+    for (let i = 0; i < B_SIZE; i++) {
+      lattice[i] = i;
+      for (let j = 0; j < 2; j++) {
+        s = random(s);
+        g[i * 2 + j] = ((s % (B_SIZE + B_SIZE)) - B_SIZE) / B_SIZE;
+      }
+
+      const length = Math.sqrt(g[i * 2] * g[i * 2] + g[i * 2 + 1] * g[i * 2 + 1]);
+      g[i * 2] /= length;
+      g[i * 2 + 1] /= length;
+    }
+  }
+
+  for (let i = B_SIZE - 1; i > 0; i--) {
+    const k = lattice[i];
+    s = random(s);
+    const j = s % B_SIZE;
+    lattice[i] = lattice[j];
+    lattice[j] = k;
+  }
+
+  for (let i = 0; i < B_SIZE + 2; i++) {
+    lattice[B_SIZE + i] = lattice[i];
+    for (let c = 0; c < 4; c++) {
+      gradients[c * cells + (B_SIZE + i) * 2] = gradients[c * cells + i * 2];
+      gradients[c * cells + (B_SIZE + i) * 2 + 1] = gradients[c * cells + i * 2 + 1];
+    }
+  }
+
+  let [fx, fy] = base;
+  let stitchWidth = 0;
+  let stitchHeight = 0;
+  if (stitching) {
+    if (fx !== 0) {
+      const lo = Math.floor(width * fx) / width;
+      const hi = Math.ceil(width * fx) / width;
+      fx = fx / lo < hi / fx ? lo : hi;
+    }
+
+    // Not the reference's slip, which Ruffle keeps, the y frequency's floor from the x one (adl).
+    if (fy !== 0) {
+      const lo = Math.floor(height * fy) / height;
+      const hi = Math.ceil(height * fy) / height;
+      fy = fy / lo < hi / fy ? lo : hi;
+    }
+
+    stitchWidth = Math.trunc(width * fx + 0.5);
+    stitchHeight = Math.trunc(height * fy + 0.5);
+  }
+
+  return { lattice, gradients, fx, fy, stitch: stitching, stitchWidth, stitchHeight };
+}

package/src/clock.ts

@@ -0,0 +1,196 @@
+// A script's clock that skips a spin on getTimer: a loop that only reads
+// the clock until it reaches a time, as a game that caps its frame rate
+// waits for the next frame. In Flash the wait costs nothing visible; in a
+// browser it holds the main thread. Once a spin is told from other reads,
+// each read moves the clock a small step on instead, so the wait ends at
+// once, and the clock holds at the time it waited for until the real one
+// passes it, the next frame with it (Player.advance). AS3's getTimer
+// (scripting/timers.ts) and AVM1's (avm1/timers.ts) share one of these
+// each, so both clocks skip alike.
+
+/**
+ * The clock of one movie's scripts on a real clock: what getTimer tells,
+ * unrounded, and how far ahead of the real clock a spin has moved it.
+ */
+export class SpinClock {
+  /**
+   * How far a spin on getTimer in the running pass has moved the clock
+   * ahead of the real one, in ms; once the pass is over, `floor` holds it.
+   */
+  private skip = 0;
+  /** The least time the clock tells: where the last pass that skipped left it, until the real clock passes it. */
+  private floor = Number.NEGATIVE_INFINITY;
+  /** The time getTimer last told, unrounded: a spin's steps go on from it. */
+  private told = Number.NEGATIVE_INFINITY;
+  /** The spin's detection: the real time of the last call to getTimer, and of the run of calls. */
+  private lastCall = Number.NEGATIVE_INFINITY;
+  private windowStart = Number.NaN;
+  private windowCalls = 0;
+  private denseSince = Number.NaN;
+  /** Set while the running pass's calls to getTimer are a spin, each moving the clock a step. */
+  private spinning = false;
+  /** Set once the running pass's dense calls came from more than one place: no spin in it. */
+  private refused = false;
+  /** A call site being checked over the next calls, and how many are still to be checked. */
+  private checking = "";
+  private checks = 0;
+  /** Where the last spin called getTimer from: the same loop next time is known at once. */
+  private site: string | null = null;
+
+  /** `elapsed`: the real clock's ms since the start, unrounded, never going back. */
+  constructor(private readonly elapsed: () => number) {}
+
+  /**
+   * What getTimer tells, unrounded: the real time, or past it by what a
+   * spin has skipped. Each call counts towards telling a spin.
+   */
+  read(): number {
+    const real = this.elapsed();
+    let time = Math.max(real + this.skip, this.floor);
+    if (real - this.lastCall > SPIN_GAP) {
+      // A pause between calls: whatever ran was no spin, or the spin is over.
+      this.spinning = false;
+      this.checks = 0;
+      this.windowStart = real;
+      this.windowCalls = 0;
+      this.denseSince = Number.NaN;
+    }
+
+    this.lastCall = real;
+    if (this.spinning || this.spins(real)) {
+      // Each call a small step on from the last, so the wait ends within a
+      // step of its time, and the time read just after it is the same ms.
+      const next = Math.max(time, this.told + SPIN_STEP);
+      if (next - real <= MAX_SKIP) {
+        this.skip = next - real;
+        time = next;
+      } else {
+        // Waiting longer than any frame limiter: it spins in real time, as it did.
+        this.spinning = false;
+        this.refused = true;
+      }
+    }
+
+    this.told = time;
+    return time;
+  }
+
+  /**
+   * Whether the calls to getTimer up to this one make a spin, a loop that
+   * does nothing but read the clock until it reaches a time: at least
+   * SPIN_DENSITY calls a ms, for SPIN_MS on end, all from one place in the
+   * script. Code that times itself, or does work between its reads, calls
+   * it far less often; a profiler's begin and end are two places. A place
+   * that spun before is known after one dense window.
+   */
+  private spins(real: number): boolean {
+    if (this.refused) {
+      return false;
+    }
+
+    if (this.checks === 0) {
+      this.windowCalls++;
+      if (this.windowCalls < SPIN_WINDOW) {
+        return false;
+      }
+
+      const dense = real - this.windowStart <= SPIN_WINDOW / SPIN_DENSITY;
+      if (dense && Number.isNaN(this.denseSince)) {
+        this.denseSince = this.windowStart;
+      } else if (!dense) {
+        this.denseSince = Number.NaN;
+      }
+
+      this.windowStart = real;
+      this.windowCalls = 0;
+      if (!dense) {
+        return false;
+      }
+    }
+
+    // Read on this one line alone: the stacks differ by where they were read.
+    const site = callSite();
+    if (this.checks > 0) {
+      this.checks--;
+      if (site !== this.checking) {
+        this.refused = true;
+        this.checks = 0;
+        return false;
+      }
+
+      if (this.checks > 0) {
+        return false;
+      }
+
+      this.site = site;
+    } else if (site !== this.site) {
+      if (real - this.denseSince >= SPIN_MS) {
+        this.checking = site;
+        this.checks = SPIN_CHECKS;
+      }
+
+      return false;
+    }
+
+    this.spinning = true;
+    return true;
+  }
+
+  /**
+   * A pass is over: a spin's skip becomes the floor the clock holds at
+   * until the real clock passes it, and the next pass's calls start anew.
+   */
+  settle(): void {
+    if (this.skip > 0) {
+      this.floor = Math.max(this.floor, this.elapsed() + this.skip);
+      this.skip = 0;
+    }
+
+    this.spinning = false;
+    this.refused = false;
+    this.checks = 0;
+    this.lastCall = Number.NEGATIVE_INFINITY;
+  }
+
+  /**
+   * How far getTimer and the timers run ahead of the real clock, in ms,
+   * since a spin had the clock skip to the time it waited for: the frames
+   * wait for the real clock (Player.advance). Ends the pass that ran.
+   */
+  ahead(): number {
+    this.settle();
+    return Math.max(0, this.floor - this.elapsed());
+  }
+
+  /** What the clock tells beyond the real clock at `real`: the timers' time keeps to getTimer's. */
+  lead(real: number): number {
+    return Math.max(real + this.skip, this.floor) - real;
+  }
+}
+
+/** Calls to getTimer a spin's dense windows are counted in. */
+const SPIN_WINDOW = 1024;
+/**
+ * Calls a ms that a window must reach to be dense: a loop that only reads
+ * the clock makes 5,000 to 10,000 in Chrome, one with a microsecond's
+ * work between its reads at most 1,000.
+ */
+const SPIN_DENSITY = 1000;
+/** Real ms of dense calls before a place not seen spinning before counts as a spin. */
+const SPIN_MS = 2;
+/** Consecutive calls whose place is checked to be the first's. */
+const SPIN_CHECKS = 3;
+/** Real ms between two calls that end a spin or a run of dense calls. */
+const SPIN_GAP = 1;
+/** How far each call in a spin moves the clock on, in ms: a wait overshoots its time by about that. */
+const SPIN_STEP = 1 / 8;
+/** The most a pass's spin moves the clock ahead of the real one, in ms. */
+const MAX_SKIP = 1000;
+
+/**
+ * Where getTimer was called from, the script's frames included, AS3's or
+ * AVM1's: the same loop's calls give the same, whatever depth they are at.
+ */
+function callSite(): string {
+  return new Error().stack ?? "";
+}

package/src/display/bitmapobject.ts

@@ -0,0 +1,31 @@
+import type { BitmapStore } from "../bitmap/bitmap.js";
+import { CONTENT, DisplayObject } from "./displayobject.js";
+import type { BitmapCharacter } from "./timeline.js";
+
+/** A Bitmap: a display object that shows a BitmapData's pixels, its bounds the data's size. */
+export class BitmapObject extends DisplayObject {
+  private shown: BitmapStore | null = null;
+  smoothing = false;
+  pixelSnapping = "auto";
+  /** The SWF's bitmap it shows a copy of, placed by a timeline or made by its class; null for one a script made. */
+  character: BitmapCharacter | null = null;
+  /** PlaceObject3's HasImage where a timeline placed it: Flash then takes a bound class for its data's. */
+  hasImage = false;
+
+  constructor(store: BitmapStore | null) {
+    super();
+    this.store = store;
+  }
+
+  /** The store shown; the object watches it, so a pixel set marks the object for the renderer. */
+  get store(): BitmapStore | null {
+    return this.shown;
+  }
+
+  set store(store: BitmapStore | null) {
+    this.shown?.views.delete(this.ref);
+    this.shown = store;
+    store?.views.add(this.ref);
+    this.invalidate(CONTENT);
+  }
+}