pa_encoder 0.1.0

package/dist/index.js

@@ -0,0 +1,514 @@
+// src/live.js
+async function startLiveCapture({
+  canvas,
+  exporter,
+  fps = 30,
+  concurrency = 2,
+  maxQueue = 8,
+  policy = "drop",
+  // "drop" | "block"
+  onProgress,
+  signal
+} = {}) {
+  if (!(canvas instanceof HTMLCanvasElement)) {
+    throw new TypeError("canvas must be an HTMLCanvasElement");
+  }
+  if (!exporter || typeof exporter.write !== "function" || typeof exporter.finalize !== "function") {
+    throw new TypeError("exporter must have write() and finalize()");
+  }
+  if (!Number.isFinite(fps) || fps <= 0)
+    throw new TypeError("fps must be positive");
+  if (!Number.isInteger(concurrency) || concurrency < 1)
+    throw new TypeError("concurrency must be >= 1");
+  if (!Number.isInteger(maxQueue) || maxQueue < 0)
+    throw new TypeError("maxQueue must be >= 0");
+  if (policy !== "drop" && policy !== "block")
+    throw new TypeError('policy must be "drop" or "block"');
+  const worker = new Worker(new URL("./worker.js", import.meta.url), {
+    type: "module"
+  });
+  await new Promise((resolve, reject) => {
+    const onMsg = (ev) => {
+      var _a, _b;
+      if (((_a = ev.data) == null ? void 0 : _a.type) === "ready") {
+        worker.removeEventListener("message", onMsg);
+        resolve();
+      } else if (((_b = ev.data) == null ? void 0 : _b.type) === "error") {
+        worker.removeEventListener("message", onMsg);
+        reject(new Error(ev.data.message || "Worker error"));
+      }
+    };
+    worker.addEventListener("message", onMsg);
+    worker.addEventListener("error", reject);
+  });
+  const stats = {
+    captured: 0,
+    encoded: 0,
+    written: 0,
+    dropped: 0,
+    queueMax: 0,
+    inFlightMax: 0,
+    lastBitmapMs: 0,
+    bitmapMsAvg: 0,
+    lastEncodeMs: 0,
+    encodeMsAvg: 0,
+    lastWriteMs: 0,
+    writeMsAvg: 0
+  };
+  let stopped = false;
+  let rafId = null;
+  let inFlight = 0;
+  const queue = [];
+  const waiters = [];
+  const ack = /* @__PURE__ */ new Map();
+  function throwIfAborted() {
+    if (signal == null ? void 0 : signal.aborted) {
+      throw signal.reason ?? new DOMException("Aborted", "AbortError");
+    }
+  }
+  function wakeOneWaiter() {
+    const w = waiters.shift();
+    if (w) w();
+  }
+  async function enqueueFrame(item) {
+    if (policy === "drop") {
+      if (queue.length >= maxQueue) {
+        stats.dropped++;
+        if (typeof item.bitmap.close === "function") item.bitmap.close();
+        onProgress == null ? void 0 : onProgress({ ...stats });
+        return false;
+      }
+      queue.push(item);
+      stats.queueMax = Math.max(stats.queueMax, queue.length);
+      return true;
+    }
+    while (queue.length >= maxQueue) {
+      await new Promise((r) => waiters.push(r));
+      throwIfAborted();
+      if (stopped) return false;
+    }
+    queue.push(item);
+    stats.queueMax = Math.max(stats.queueMax, queue.length);
+    return true;
+  }
+  function dispatchIfPossible() {
+    while (!stopped && inFlight < concurrency && queue.length > 0) {
+      const item = queue.shift();
+      wakeOneWaiter();
+      inFlight++;
+      stats.inFlightMax = Math.max(stats.inFlightMax, inFlight);
+      const { seq: seq2, bitmap, w, h } = item;
+      const p = new Promise(
+        (resolve, reject) => ack.set(seq2, { resolve, reject })
+      );
+      worker.postMessage(
+        { type: "encode", frameIndex: seq2, bitmap, width: w, height: h },
+        [bitmap]
+      );
+      p.catch(() => {
+      });
+    }
+  }
+  worker.addEventListener("message", async (ev) => {
+    const msg = ev.data;
+    if (!msg || typeof msg !== "object") return;
+    if (msg.type === "frame") {
+      const { frameIndex: seq2, blob, encodeMs } = msg;
+      stats.encoded++;
+      if (typeof encodeMs === "number") {
+        stats.lastEncodeMs = encodeMs;
+        stats.encodeMsAvg = stats.encodeMsAvg ? stats.encodeMsAvg * 0.9 + encodeMs * 0.1 : encodeMs;
+      }
+      try {
+        const w0 = performance.now();
+        await exporter.write(seq2, blob);
+        const w1 = performance.now();
+        stats.written++;
+        const writeMs = w1 - w0;
+        stats.lastWriteMs = writeMs;
+        stats.writeMsAvg = stats.writeMsAvg ? stats.writeMsAvg * 0.9 + writeMs * 0.1 : writeMs;
+        const entry = ack.get(seq2);
+        if (entry) entry.resolve();
+      } catch (err) {
+        const entry = ack.get(seq2);
+        if (entry) entry.reject(err);
+      } finally {
+        ack.delete(seq2);
+        inFlight--;
+        dispatchIfPossible();
+        onProgress == null ? void 0 : onProgress({ ...stats });
+      }
+    } else if (msg.type === "error") {
+      console.error("Worker error:", msg.message);
+    }
+  });
+  const frameIntervalMs = 1e3 / fps;
+  let accMs = 0;
+  let lastTickMs = null;
+  let seq = 0;
+  function tick(ts) {
+    if (stopped) return;
+    try {
+      throwIfAborted();
+    } catch {
+      stop().catch(() => {
+      });
+      return;
+    }
+    if (lastTickMs == null) lastTickMs = ts;
+    const dt = ts - lastTickMs;
+    lastTickMs = ts;
+    accMs += dt;
+    while (accMs >= frameIntervalMs) {
+      accMs -= frameIntervalMs;
+      const b0 = performance.now();
+      createImageBitmap(canvas).then(async (bitmap) => {
+        const b1 = performance.now();
+        const bitmapMs = b1 - b0;
+        stats.lastBitmapMs = bitmapMs;
+        stats.bitmapMsAvg = stats.bitmapMsAvg ? stats.bitmapMsAvg * 0.9 + bitmapMs * 0.1 : bitmapMs;
+        if (stopped) {
+          if (typeof bitmap.close === "function") bitmap.close();
+          return;
+        }
+        stats.captured++;
+        const ok = await enqueueFrame({
+          seq: seq++,
+          bitmap,
+          w: canvas.width,
+          h: canvas.height
+        });
+        if (ok) dispatchIfPossible();
+        onProgress == null ? void 0 : onProgress({ ...stats });
+      }).catch((e) => console.error("createImageBitmap failed:", e));
+    }
+    rafId = requestAnimationFrame(tick);
+  }
+  rafId = requestAnimationFrame(tick);
+  async function stop() {
+    if (stopped) return;
+    stopped = true;
+    if (rafId != null) cancelAnimationFrame(rafId);
+    while (waiters.length) wakeOneWaiter();
+    for (const item of queue.splice(0, queue.length)) {
+      if (typeof item.bitmap.close === "function") item.bitmap.close();
+    }
+    while (inFlight > 0 || ack.size > 0) {
+      await new Promise((r) => setTimeout(r, 25));
+    }
+    await exporter.finalize();
+    worker.terminate();
+  }
+  return { stop, stats };
+}
+
+// src/virtual_time.js
+function installVirtualTime({
+  fps = 60,
+  hookDateNow = true,
+  hookPerformanceNow = true
+} = {}) {
+  if (!Number.isFinite(fps) || fps <= 0)
+    throw new TypeError("fps must be positive");
+  const dtMs = 1e3 / fps;
+  const _requestAnimationFrame = window.requestAnimationFrame.bind(window);
+  const _cancelAnimationFrame = window.cancelAnimationFrame.bind(window);
+  const _dateNow = Date.now.bind(Date);
+  const _perfNow = performance.now.bind(performance);
+  let vNowMs = 0;
+  let running = true;
+  let nextId = 1;
+  const pending = /* @__PURE__ */ new Map();
+  const scheduled = [];
+  function hookedRAF(cb) {
+    if (!running) return _requestAnimationFrame(cb);
+    const id = nextId++;
+    pending.set(id, cb);
+    scheduled.push(id);
+    return id;
+  }
+  function hookedCancelRAF(id) {
+    if (!running) return _cancelAnimationFrame(id);
+    pending.delete(id);
+  }
+  window.requestAnimationFrame = hookedRAF;
+  window.cancelAnimationFrame = hookedCancelRAF;
+  if (hookDateNow) {
+    Date.now = function() {
+      return running ? vNowMs : _dateNow();
+    };
+  }
+  if (hookPerformanceNow) {
+    performance.now = function() {
+      return running ? vNowMs : _perfNow();
+    };
+  }
+  function flushRAFFrame() {
+    const ids = scheduled.splice(0, scheduled.length);
+    for (const id of ids) {
+      const cb = pending.get(id);
+      if (!cb) continue;
+      pending.delete(id);
+      try {
+        cb(vNowMs);
+      } catch (e) {
+        console.error("Error in rAF callback:", e);
+        throw e;
+      }
+    }
+  }
+  function step(frames = 1) {
+    if (!running) throw new Error("Virtual time is not running");
+    if (!Number.isInteger(frames) || frames < 1)
+      throw new TypeError("frames must be >= 1");
+    for (let i = 0; i < frames; i++) {
+      vNowMs += dtMs;
+      flushRAFFrame();
+    }
+  }
+  function stopVirtualTime() {
+    running = false;
+  }
+  function restore() {
+    window.requestAnimationFrame = _requestAnimationFrame;
+    window.cancelAnimationFrame = _cancelAnimationFrame;
+    if (hookDateNow) Date.now = _dateNow;
+    if (hookPerformanceNow) performance.now = _perfNow;
+    running = false;
+    pending.clear();
+    scheduled.length = 0;
+  }
+  return {
+    get nowMs() {
+      return vNowMs;
+    },
+    dtMs,
+    step,
+    stopVirtualTime,
+    restore
+  };
+}
+
+// src/virtual_capture.js
+function resolveCanvas(canvasOrSelector) {
+  if (canvasOrSelector instanceof HTMLCanvasElement) return canvasOrSelector;
+  if (typeof canvasOrSelector === "string") {
+    const el = document.querySelector(canvasOrSelector);
+    if (el instanceof HTMLCanvasElement) return el;
+    throw new Error(`No canvas found for selector: ${canvasOrSelector}`);
+  }
+  const first = document.querySelector("canvas");
+  if (first instanceof HTMLCanvasElement) return first;
+  throw new Error("No canvas found on the page");
+}
+async function virtualTimeCapture({
+  // IMPORTANT: loadSketch must be called AFTER hooks are installed
+  loadSketch,
+  // () => import("...")  (or any function that executes the sketch module)
+  canvas: canvasOrSelector,
+  // canvas element OR selector OR omit to use first canvas
+  fps = 60,
+  frames = 300,
+  warmupFrames = 0,
+  exporter,
+  concurrency = 2,
+  onProgress,
+  hookDateNow = true,
+  hookPerformanceNow = true,
+  signal
+} = {}) {
+  if (typeof loadSketch !== "function") {
+    throw new TypeError(
+      "loadSketch must be a function returning a Promise (dynamic import)"
+    );
+  }
+  if (!exporter || typeof exporter.write !== "function" || typeof exporter.finalize !== "function") {
+    throw new TypeError("exporter must have write() and finalize()");
+  }
+  if (!Number.isFinite(fps) || fps <= 0)
+    throw new TypeError("fps must be positive");
+  if (!Number.isInteger(frames) || frames < 1)
+    throw new TypeError("frames must be >= 1");
+  if (!Number.isInteger(warmupFrames) || warmupFrames < 0)
+    throw new TypeError("warmupFrames must be >= 0");
+  if (!Number.isInteger(concurrency) || concurrency < 1)
+    throw new TypeError("concurrency must be >= 1");
+  const vt = installVirtualTime({ fps, hookDateNow, hookPerformanceNow });
+  const worker = new Worker(new URL("./worker.js", import.meta.url), {
+    type: "module"
+  });
+  const ready = new Promise((resolve, reject) => {
+    const onMsg = (ev) => {
+      var _a, _b;
+      if (((_a = ev.data) == null ? void 0 : _a.type) === "ready") {
+        worker.removeEventListener("message", onMsg);
+        resolve();
+      } else if (((_b = ev.data) == null ? void 0 : _b.type) === "error") {
+        worker.removeEventListener("message", onMsg);
+        reject(new Error(ev.data.message || "Worker error"));
+      }
+    };
+    worker.addEventListener("message", onMsg);
+    worker.addEventListener("error", reject);
+  });
+  function throwIfAborted() {
+    if (signal == null ? void 0 : signal.aborted) {
+      throw signal.reason ?? new DOMException("Aborted", "AbortError");
+    }
+  }
+  await ready;
+  await loadSketch();
+  const canvas = resolveCanvas(canvasOrSelector);
+  for (let i = 0; i < warmupFrames; i++) {
+    throwIfAborted();
+    vt.step(1);
+  }
+  let inFlight = 0;
+  const waiters = [];
+  const ack = /* @__PURE__ */ new Map();
+  function acquireSlot() {
+    if (inFlight < concurrency) return Promise.resolve();
+    return new Promise((r) => waiters.push(r));
+  }
+  function releaseSlot() {
+    inFlight--;
+    const w = waiters.shift();
+    if (w) w();
+  }
+  worker.addEventListener("message", async (ev) => {
+    const msg = ev.data;
+    if (!msg || typeof msg !== "object") return;
+    if (msg.type === "frame") {
+      const { frameIndex, blob } = msg;
+      try {
+        await exporter.write(frameIndex, blob);
+        const entry = ack.get(frameIndex);
+        if (entry) entry.resolve();
+      } catch (e) {
+        const entry = ack.get(frameIndex);
+        if (entry) entry.reject(e);
+      } finally {
+        ack.delete(frameIndex);
+        releaseSlot();
+      }
+    } else if (msg.type === "error") {
+      console.error("Worker error:", msg.message);
+    }
+  });
+  try {
+    for (let i = 0; i < frames; i++) {
+      throwIfAborted();
+      vt.step(1);
+      const bitmap = await createImageBitmap(canvas);
+      await acquireSlot();
+      inFlight++;
+      const done = new Promise(
+        (resolve, reject) => ack.set(i, { resolve, reject })
+      );
+      worker.postMessage(
+        {
+          type: "encode",
+          frameIndex: i,
+          bitmap,
+          width: canvas.width,
+          height: canvas.height
+        },
+        [bitmap]
+      );
+      await done;
+      onProgress == null ? void 0 : onProgress(i + 1, frames, { nowMs: vt.nowMs });
+    }
+    while (inFlight > 0) {
+      await new Promise((r) => setTimeout(r, 20));
+    }
+    await exporter.finalize();
+  } finally {
+    worker.terminate();
+    vt.restore();
+  }
+}
+
+// src/exporters/fs.js
+async function createFsExporter({
+  dirNameHint = "frames",
+  filename = (i) => `frame_${String(i).padStart(6, "0")}.png`
+} = {}) {
+  if (!("showDirectoryPicker" in window)) {
+    throw new Error("File System Access API is not supported in this browser.");
+  }
+  const dirHandle = await window.showDirectoryPicker({ id: dirNameHint });
+  return {
+    async write(frameIndex, blob) {
+      const name = filename(frameIndex);
+      const fileHandle = await dirHandle.getFileHandle(name, { create: true });
+      const writable = await fileHandle.createWritable();
+      await writable.write(blob);
+      await writable.close();
+    },
+    async finalize() {
+    }
+  };
+}
+
+// src/exporters/zip.js
+import JSZip from "jszip";
+function downloadBlob(filename, blob) {
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = filename;
+  document.body.appendChild(a);
+  a.click();
+  a.remove();
+  setTimeout(() => URL.revokeObjectURL(url), 1e3);
+}
+async function createZipExporter({
+  zipName = "frames.zip",
+  filename = (i) => `frame_${String(i).padStart(6, "0")}.png`,
+  compressionLevel = 6
+  // 0..9
+} = {}) {
+  const zip = new JSZip();
+  let count = 0;
+  return {
+    async write(frameIndex, blob) {
+      const name = filename(frameIndex);
+      const arr = await blob.arrayBuffer();
+      zip.file(name, arr);
+      count++;
+    },
+    async finalize() {
+      const out = await zip.generateAsync({
+        type: "blob",
+        compression: "DEFLATE",
+        compressionOptions: { level: compressionLevel }
+      });
+      downloadBlob(zipName, out);
+      return { files: count };
+    }
+  };
+}
+
+// src/exporters/best.js
+async function createBestExporter({
+  prefer = "fs",
+  // "fs" | "zip"
+  fs,
+  zip
+} = {}) {
+  const canFS = typeof window !== "undefined" && window.isSecureContext === true && "showDirectoryPicker" in window;
+  if (prefer === "fs" && canFS) {
+    return await createFsExporter(fs);
+  }
+  if (prefer === "zip") {
+    return await createZipExporter(zip);
+  }
+  return await createZipExporter(zip);
+}
+export {
+  createBestExporter,
+  createFsExporter,
+  createZipExporter,
+  startLiveCapture,
+  virtualTimeCapture
+};

package/dist/worker.js

@@ -0,0 +1,36 @@
+// src/worker.js
+let offscreen = null;
+let ctx = null;
+
+self.postMessage({ type: "ready" });
+
+self.onmessage = async (ev) => {
+  const msg = ev.data;
+  if (!msg || msg.type !== "encode") return;
+
+  const { frameIndex, bitmap, width, height } = msg;
+
+  const t0 = performance.now();
+  try {
+    if (
+      !offscreen ||
+      offscreen.width !== width ||
+      offscreen.height !== height
+    ) {
+      offscreen = new OffscreenCanvas(width, height);
+      ctx = offscreen.getContext("2d", { alpha: true });
+      if (!ctx) throw new Error("Failed to get 2d context on OffscreenCanvas");
+    }
+
+    ctx.clearRect(0, 0, width, height);
+    ctx.drawImage(bitmap, 0, 0);
+    if (typeof bitmap.close === "function") bitmap.close();
+
+    const blob = await offscreen.convertToBlob({ type: "image/png" });
+    const t1 = performance.now();
+
+    self.postMessage({ type: "frame", frameIndex, blob, encodeMs: t1 - t0 });
+  } catch (e) {
+    self.postMessage({ type: "error", message: e?.message ?? String(e) });
+  }
+};

package/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "pa_encoder",
+  "version": "0.1.0",
+  "type": "module",
+  "sideEffects": false,
+  "files": [
+    "dist"
+  ],
+  "exports": {
+    ".": {
+      "import": "./dist/index.js"
+    }
+  },
+  "scripts": {
+    "build": "tsup src/index.js --format esm --clean && cp src/worker.js dist/worker.js",
+    "dev": "python -m http.server 5500",
+    "prepublishOnly": "npm run build"
+  },
+  "dependencies": {
+    "jszip": "^3.10.1"
+  },
+  "devDependencies": {
+    "tsup": "^8.0.0",
+    "typescript": "^5.9.3"
+  }
+}