@kvman/kvvideo 0.0.0-stage → 0.1.1

package/dist/record/cursor-script.js

@@ -0,0 +1,59 @@
+// What a recorded page draws (plan 16 §16.5; ADR 0115, 9 and 53): a browser's recording has no pointer, so on a
+// desktop the page draws an arrow that follows the mouse, hidden until the mouse first moves; a press shrinks it for
+// 120 ms and shows a ring. On a phone it draws a round mark at each touch instead. Scroll bars are hidden. The script
+// is added to every page before its own scripts run.
+const arrowPath = 'M3 2 L3 20 L7.6 15.6 L10.6 22.6 L13.8 21.2 L10.9 14.4 L17.2 14.4 Z';
+const shared = `
+  const hideScrollBars = () => {
+    const style = document.createElement('style');
+    style.textContent = 'html { scrollbar-width: none; } ::-webkit-scrollbar { display: none; }';
+    document.documentElement.appendChild(style);
+  };
+  const ring = (x, y, size, color) => {
+    const mark = document.createElement('div');
+    mark.className = 'kvvideo-ring';
+    mark.style.cssText = 'position:fixed;direction:ltr;inset-inline-start:' + (x - size / 2) + 'px;inset-block-start:' + (y - size / 2) + 'px;inline-size:' + size + 'px;block-size:' + size + 'px;border-radius:50%;box-sizing:border-box;border:3px solid ' + color + ';pointer-events:none;z-index:2147483646';
+    document.documentElement.appendChild(mark);
+    mark.animate([{ opacity: 1, transform: 'scale(.4)' }, { opacity: 0, transform: 'scale(1.3)' }], { duration: 500 }).onfinish = () => mark.remove();
+  };`;
+const desktop = `
+  const draw = () => {
+    if (document.getElementById('kvvideo-cursor')) return;
+    hideScrollBars();
+    const pointer = document.createElement('div');
+    pointer.id = 'kvvideo-cursor';
+    const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+    for (const [name, value] of [['width', '26'], ['height', '26'], ['viewBox', '0 0 26 26']]) svg.setAttribute(name, value);
+    const shape = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+    for (const [name, value] of [['d', ${JSON.stringify(arrowPath)}], ['fill', '#fff'], ['stroke', '#111'], ['stroke-width', '1.6'], ['stroke-linejoin', 'round']]) shape.setAttribute(name, value);
+    svg.appendChild(shape);
+    pointer.appendChild(svg);
+    pointer.style.cssText = 'position:fixed;direction:ltr;inset-inline-start:0;inset-block-start:0;inline-size:26px;block-size:26px;margin-block-start:-2px;margin-inline-start:-3px;display:none;transform-origin:3px 2px;pointer-events:none;z-index:2147483647;filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))';
+    document.documentElement.appendChild(pointer);
+    let x = 0; let y = 0; let scale = 1;
+    const place = () => { pointer.style.transform = 'translate(' + x + 'px,' + y + 'px) scale(' + scale + ')'; };
+    window.addEventListener('mousemove', (event) => { x = event.clientX; y = event.clientY; pointer.style.display = 'block'; place(); }, true);
+    window.addEventListener('mousedown', (event) => {
+      scale = 0.85; place();
+      setTimeout(() => { scale = 1; place(); }, 120);
+      ring(event.clientX, event.clientY, 44, 'rgba(255,190,0,.9)');
+    }, true);
+  };`;
+const phone = `
+  const draw = () => {
+    if (document.getElementById('kvvideo-touch')) return;
+    hideScrollBars();
+    const marker = document.createElement('meta');
+    marker.id = 'kvvideo-touch';
+    document.documentElement.appendChild(marker);
+    window.addEventListener('touchstart', (event) => {
+      for (const touch of event.changedTouches) ring(touch.clientX, touch.clientY, 40, 'rgba(255,255,255,.9)');
+    }, true);
+  };`;
+/** The script a page of the device gets. */
+export function cursorScript(device) {
+    return `(() => {${shared}${device === 'phone' ? phone : desktop}
+  if (document.documentElement) draw(); else document.addEventListener('DOMContentLoaded', draw);
+})();`;
+}
+//# sourceMappingURL=cursor-script.js.map

package/dist/record/cursor-script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cursor-script.js","sourceRoot":"","sources":["../../src/record/cursor-script.ts"],"names":[],"mappings":"AAAA,gHAAgH;AAChH,qHAAqH;AACrH,sHAAsH;AACtH,qDAAqD;AAErD,MAAM,SAAS,GAAG,oEAAoE,CAAC;AAEvF,MAAM,MAAM,GAAG;;;;;;;;;;;;KAYV,CAAC;AAEN,MAAM,OAAO,GAAG;;;;;;;;;yCASyB,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC;;;;;;;;;;;;;KAa7D,CAAC;AAEN,MAAM,KAAK,GAAG;;;;;;;;;;KAUT,CAAC;AAEN,4CAA4C;AAC5C,MAAM,UAAU,YAAY,CAAC,MAA2B;IACtD,OAAO,WAAW,MAAM,GAAG,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO;;MAE3D,CAAC;AACP,CAAC"}

package/dist/record/encoder-args.d.ts

@@ -0,0 +1,3 @@
+/** ffmpeg's arguments for a recording's frames, JPEGs on stdin, to an H.264 file of the size (ADR 0107, 25). */
+export declare function recordEncoderArgs(width: number, height: number, output: string): string[];
+//# sourceMappingURL=encoder-args.d.ts.map

package/dist/record/encoder-args.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"encoder-args.d.ts","sourceRoot":"","sources":["../../src/record/encoder-args.ts"],"names":[],"mappings":"AAEA,gHAAgH;AAChH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CASzF"}

package/dist/record/encoder-args.js

@@ -0,0 +1,13 @@
+import { framesPerSecond } from "./frame-writer.js";
+/** ffmpeg's arguments for a recording's frames, JPEGs on stdin, to an H.264 file of the size (ADR 0107, 25). */
+export function recordEncoderArgs(width, height, output) {
+    const fit = `scale=${String(width)}:${String(height)}:force_original_aspect_ratio=decrease,pad=${String(width)}:${String(height)}:(ow-iw)/2:(oh-ih)/2:color=black,format=yuv420p`;
+    return [
+        '-hide_banner', '-loglevel', 'error',
+        '-f', 'image2pipe', '-framerate', String(framesPerSecond), '-c:v', 'mjpeg', '-i', '-',
+        '-vf', fit,
+        '-c:v', 'libx264', '-preset', 'veryfast', '-crf', '14', '-r', String(framesPerSecond),
+        '-an', '-movflags', '+faststart', '-y', output,
+    ];
+}
+//# sourceMappingURL=encoder-args.js.map

package/dist/record/encoder-args.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"encoder-args.js","sourceRoot":"","sources":["../../src/record/encoder-args.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,gHAAgH;AAChH,MAAM,UAAU,iBAAiB,CAAC,KAAa,EAAE,MAAc,EAAE,MAAc;IAC7E,MAAM,GAAG,GAAG,SAAS,MAAM,CAAC,KAAK,CAAC,IAAI,MAAM,CAAC,MAAM,CAAC,6CAA6C,MAAM,CAAC,KAAK,CAAC,IAAI,MAAM,CAAC,MAAM,CAAC,iDAAiD,CAAC;IAClL,OAAO;QACL,cAAc,EAAE,WAAW,EAAE,OAAO;QACpC,IAAI,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,CAAC,eAAe,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG;QACrF,KAAK,EAAE,GAAG;QACV,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,CAAC,eAAe,CAAC;QACrF,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM;KAC/C,CAAC;AACJ,CAAC"}

package/dist/record/frame-writer.d.ts

@@ -0,0 +1,8 @@
+export declare const framesPerSecond = 30;
+export type FrameWriter = {
+    frame(data: Buffer, atMs: number): Promise<void>;
+    finish(atMs: number): Promise<number>;
+};
+/** Writes frames to `sink`, timed from `startedAt` (ms); `finish` answers how many slots were written. */
+export declare function frameWriter(sink: (frame: Buffer) => Promise<void>, startedAt: number): FrameWriter;
+//# sourceMappingURL=frame-writer.d.ts.map

package/dist/record/frame-writer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"frame-writer.d.ts","sourceRoot":"","sources":["../../src/record/frame-writer.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,eAAe,KAAK,CAAC;AAElC,MAAM,MAAM,WAAW,GAAG;IAAE,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAAC,MAAM,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,CAAA;CAAE,CAAC;AAEtH,0GAA0G;AAC1G,wBAAgB,WAAW,CAAC,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,MAAM,GAAG,WAAW,CAsBlG"}

package/dist/record/frame-writer.js

@@ -0,0 +1,30 @@
+// A steady 30 frames a second from a screencast that sends a frame only when the picture changes (plan 16 §16.5):
+// each frame is written again, one copy a slot, until the next one comes, and the last until the recording ends.
+export const framesPerSecond = 30;
+/** Writes frames to `sink`, timed from `startedAt` (ms); `finish` answers how many slots were written. */
+export function frameWriter(sink, startedAt) {
+    let previous;
+    let written = 0;
+    const slotAt = (atMs) => Math.max(0, Math.round(((atMs - startedAt) * framesPerSecond) / 1000));
+    const fillTo = async (slot) => {
+        if (previous === undefined)
+            return;
+        while (written < slot) {
+            await sink(previous);
+            written += 1;
+        }
+    };
+    return {
+        frame: async (data, atMs) => {
+            if (previous === undefined)
+                previous = data;
+            await fillTo(slotAt(atMs));
+            previous = data;
+        },
+        finish: async (atMs) => {
+            await fillTo(Math.max(slotAt(atMs), written + 1));
+            return written;
+        },
+    };
+}
+//# sourceMappingURL=frame-writer.js.map

package/dist/record/frame-writer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"frame-writer.js","sourceRoot":"","sources":["../../src/record/frame-writer.ts"],"names":[],"mappings":"AAAA,kHAAkH;AAClH,iHAAiH;AAEjH,MAAM,CAAC,MAAM,eAAe,GAAG,EAAE,CAAC;AAIlC,0GAA0G;AAC1G,MAAM,UAAU,WAAW,CAAC,IAAsC,EAAE,SAAiB;IACnF,IAAI,QAA4B,CAAC;IACjC,IAAI,OAAO,GAAG,CAAC,CAAC;IAChB,MAAM,MAAM,GAAG,CAAC,IAAY,EAAU,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,GAAG,SAAS,CAAC,GAAG,eAAe,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC;IAChH,MAAM,MAAM,GAAG,KAAK,EAAE,IAAY,EAAiB,EAAE;QACnD,IAAI,QAAQ,KAAK,SAAS;YAAE,OAAO;QACnC,OAAO,OAAO,GAAG,IAAI,EAAE,CAAC;YACtB,MAAM,IAAI,CAAC,QAAQ,CAAC,CAAC;YACrB,OAAO,IAAI,CAAC,CAAC;QACf,CAAC;IACH,CAAC,CAAC;IACF,OAAO;QACL,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE;YAC1B,IAAI,QAAQ,KAAK,SAAS;gBAAE,QAAQ,GAAG,IAAI,CAAC;YAC5C,MAAM,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;YAC3B,QAAQ,GAAG,IAAI,CAAC;QAClB,CAAC;QACD,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE;YACrB,MAAM,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC,CAAC,CAAC;YAClD,OAAO,OAAO,CAAC;QACjB,CAAC;KACF,CAAC;AACJ,CAAC"}

package/dist/record/motion.d.ts

@@ -0,0 +1,19 @@
+export declare const frameMs = 16;
+export type Point = {
+    x: number;
+    y: number;
+};
+/** Cubic easing in and out, from 0 to 1. */
+export declare function easeInOut(share: number): number;
+/** How long the pointer takes to travel `distance` pixels. */
+export declare function glideMs(distance: number): number;
+/** The pointer's positions, one a frame, from `from` (left out) to `to`, along a gentle curve. */
+export declare function glidePath(from: Point, to: Point): Point[];
+/** The wait before each character of `text`: 35 to 110 ms, and 150 ms more after a space or a punctuation mark. */
+export declare function typingDelays(text: string): number[];
+/** An eased scroll of `pixels`: its length and its move in each frame, which add up to `pixels`. */
+export declare function scrollPlan(pixels: number): {
+    durationMs: number;
+    moves: number[];
+};
+//# sourceMappingURL=motion.d.ts.map

package/dist/record/motion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.d.ts","sourceRoot":"","sources":["../../src/record/motion.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,KAAK,CAAC;AAE1B,MAAM,MAAM,KAAK,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAE7C,4CAA4C;AAC5C,wBAAgB,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAE/C;AAID,8DAA8D;AAC9D,wBAAgB,OAAO,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAEhD;AAED,kGAAkG;AAClG,wBAAgB,SAAS,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,GAAG,KAAK,EAAE,CAYzD;AAgBD,mHAAmH;AACnH,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,EAAE,CAInD;AAED,oGAAoG;AACpG,wBAAgB,UAAU,CAAC,MAAM,EAAE,MAAM,GAAG;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,EAAE,CAAA;CAAE,CAWlF"}

package/dist/record/motion.js

@@ -0,0 +1,59 @@
+// How things move in a recording (plan 16 §16.5; ADR 0115, 9): the pointer's eased, gently curved path, a typing
+// pace that varies but is the same for the same text, and an eased scroll. Each is planned in frames of `frameMs`.
+export const frameMs = 16;
+/** Cubic easing in and out, from 0 to 1. */
+export function easeInOut(share) {
+    return share < 0.5 ? 4 * share ** 3 : 1 - (-2 * share + 2) ** 3 / 2;
+}
+const frameCount = (durationMs) => Math.max(1, Math.round(durationMs / frameMs));
+/** How long the pointer takes to travel `distance` pixels. */
+export function glideMs(distance) {
+    return Math.min(900, Math.max(400, Math.round(300 + 0.6 * distance)));
+}
+/** The pointer's positions, one a frame, from `from` (left out) to `to`, along a gentle curve. */
+export function glidePath(from, to) {
+    const dx = to.x - from.x;
+    const dy = to.y - from.y;
+    const bend = 0.08;
+    const control = { x: (from.x + to.x) / 2 - dy * bend, y: (from.y + to.y) / 2 + dx * bend };
+    const frames = frameCount(glideMs(Math.hypot(dx, dy)));
+    return Array.from({ length: frames }, (_, index) => {
+        const share = easeInOut((index + 1) / frames);
+        const toControl = 2 * (1 - share) * share;
+        const toEnd = share * share;
+        return { x: from.x + toControl * (control.x - from.x) + toEnd * dx, y: from.y + toControl * (control.y - from.y) + toEnd * dy };
+    });
+}
+// A small seeded generator (mulberry32 over an FNV-1a hash of the text), so the same text types the same way.
+function seededRandom(text) {
+    let seed = 0x811c9dc5;
+    for (const unit of text)
+        seed = Math.imul(seed ^ (unit.codePointAt(0) ?? 0), 0x01000193);
+    return () => {
+        seed = (seed + 0x6d2b79f5) | 0;
+        let mixed = Math.imul(seed ^ (seed >>> 15), seed | 1);
+        mixed ^= mixed + Math.imul(mixed ^ (mixed >>> 7), mixed | 61);
+        return ((mixed ^ (mixed >>> 14)) >>> 0) / 4_294_967_296;
+    };
+}
+const pausesAfter = (character) => /[\s\p{P}]/u.test(character);
+/** The wait before each character of `text`: 35 to 110 ms, and 150 ms more after a space or a punctuation mark. */
+export function typingDelays(text) {
+    const random = seededRandom(text);
+    const characters = [...text];
+    return characters.map((_, index) => 35 + Math.floor(random() * 76) + (index > 0 && pausesAfter(characters[index - 1] ?? '') ? 150 : 0));
+}
+/** An eased scroll of `pixels`: its length and its move in each frame, which add up to `pixels`. */
+export function scrollPlan(pixels) {
+    const durationMs = Math.min(3000, Math.round(400 + 0.5 * Math.abs(pixels)));
+    const frames = frameCount(durationMs);
+    let before = 0;
+    const moves = Array.from({ length: frames }, (_, index) => {
+        const at = Math.round(pixels * easeInOut((index + 1) / frames));
+        const move = at - before;
+        before = at;
+        return move;
+    });
+    return { durationMs, moves };
+}
+//# sourceMappingURL=motion.js.map

package/dist/record/motion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.js","sourceRoot":"","sources":["../../src/record/motion.ts"],"names":[],"mappings":"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"}

package/dist/record/narration-cues.d.ts

@@ -0,0 +1,14 @@
+export declare const narrationLeadMs = 300;
+export type Cues = {
+    lineStartsMs: number[];
+    leastLengthMs: number;
+};
+export declare function cuesOf(narration: {
+    durationMs: number;
+    captions: readonly {
+        startMs: number;
+    }[];
+}): Cues;
+/** How long to wait, `nowMs` into the recording, until `atMs`; nothing once it has passed. */
+export declare function waitUntilMs(atMs: number, nowMs: number): number;
+//# sourceMappingURL=narration-cues.d.ts.map

package/dist/record/narration-cues.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"narration-cues.d.ts","sourceRoot":"","sources":["../../src/record/narration-cues.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,eAAe,MAAM,CAAC;AAEnC,MAAM,MAAM,IAAI,GAAG;IAAE,YAAY,EAAE,MAAM,EAAE,CAAC;IAAC,aAAa,EAAE,MAAM,CAAA;CAAE,CAAC;AAErE,wBAAgB,MAAM,CAAC,SAAS,EAAE;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,SAAS;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;CAAE,GAAG,IAAI,CAExG;AAED,8FAA8F;AAC9F,wBAAgB,WAAW,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAE/D"}

package/dist/record/narration-cues.js

@@ -0,0 +1,12 @@
+// When a recording's steps start, from its narration (plan 16 §16.5; ADR 0115, 16 and 41): the narration starts
+// 300 ms into the scene, so line `n` is heard at 300 ms plus its start, and the recording lasts at least the
+// narration with 300 ms before and after it.
+export const narrationLeadMs = 300;
+export function cuesOf(narration) {
+    return { lineStartsMs: narration.captions.map((caption) => narrationLeadMs + caption.startMs), leastLengthMs: narrationLeadMs + narration.durationMs + narrationLeadMs };
+}
+/** How long to wait, `nowMs` into the recording, until `atMs`; nothing once it has passed. */
+export function waitUntilMs(atMs, nowMs) {
+    return Math.max(0, Math.round(atMs - nowMs));
+}
+//# sourceMappingURL=narration-cues.js.map

package/dist/record/narration-cues.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"narration-cues.js","sourceRoot":"","sources":["../../src/record/narration-cues.ts"],"names":[],"mappings":"AAAA,gHAAgH;AAChH,6GAA6G;AAC7G,6CAA6C;AAE7C,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,CAAC;AAInC,MAAM,UAAU,MAAM,CAAC,SAA2E;IAChG,OAAO,EAAE,YAAY,EAAE,SAAS,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,eAAe,GAAG,OAAO,CAAC,OAAO,CAAC,EAAE,aAAa,EAAE,eAAe,GAAG,SAAS,CAAC,UAAU,GAAG,eAAe,EAAE,CAAC;AAC3K,CAAC;AAED,8FAA8F;AAC9F,MAAM,UAAU,WAAW,CAAC,IAAY,EAAE,KAAa;IACrD,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC;AAC/C,CAAC"}

package/dist/record/own-port.d.ts

@@ -0,0 +1,2 @@
+export declare function ownPortOf(home: string | undefined): number | null;
+//# sourceMappingURL=own-port.d.ts.map

package/dist/record/own-port.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"own-port.d.ts","sourceRoot":"","sources":["../../src/record/own-port.ts"],"names":[],"mappings":"AAUA,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,MAAM,GAAG,IAAI,CAWjE"}

package/dist/record/own-port.js

@@ -0,0 +1,23 @@
+import { readFileSync } from 'node:fs';
+import path from 'node:path';
+import { z } from '@kvman/sdk';
+// kvman's own port, so a recording never reaches kvman's API as the person (ADR 0107, 18). kvman sets `KVMAN_HOME`
+// in its environment and keeps its port in `<home>/kvman.lock` (plan 01 §1.2, §1.3). With no home, no lock, or a lock
+// without a port, no port is kvman's.
+const lockSchema = z.object({ pid: z.number(), port: z.number().int().positive().optional() });
+export function ownPortOf(home) {
+    if (home === undefined || home === '')
+        return null;
+    let text;
+    try {
+        text = readFileSync(path.join(home, 'kvman.lock'), 'utf8');
+    }
+    catch (error) {
+        if (error instanceof Error && 'code' in error && error.code === 'ENOENT')
+            return null;
+        throw error;
+    }
+    const lock = lockSchema.safeParse(JSON.parse(text));
+    return lock.success && lock.data.port !== undefined ? lock.data.port : null;
+}
+//# sourceMappingURL=own-port.js.map

package/dist/record/own-port.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"own-port.js","sourceRoot":"","sources":["../../src/record/own-port.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,EAAE,CAAC,EAAE,MAAM,YAAY,CAAC;AAE/B,mHAAmH;AACnH,sHAAsH;AACtH,sCAAsC;AAEtC,MAAM,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;AAE/F,MAAM,UAAU,SAAS,CAAC,IAAwB;IAChD,IAAI,IAAI,KAAK,SAAS,IAAI,IAAI,KAAK,EAAE;QAAE,OAAO,IAAI,CAAC;IACnD,IAAI,IAAY,CAAC;IACjB,IAAI,CAAC;QACH,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,YAAY,CAAC,EAAE,MAAM,CAAC,CAAC;IAC7D,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACf,IAAI,KAAK,YAAY,KAAK,IAAI,MAAM,IAAI,KAAK,IAAI,KAAK,CAAC,IAAI,KAAK,QAAQ;YAAE,OAAO,IAAI,CAAC;QACtF,MAAM,KAAK,CAAC;IACd,CAAC;IACD,MAAM,IAAI,GAAG,UAAU,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;IACpD,OAAO,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;AAC9E,CAAC"}

package/dist/record/page-ready.d.ts

@@ -0,0 +1,4 @@
+import type { Page } from 'playwright-core';
+export type ReadyPage = Pick<Page, 'waitForLoadState' | 'evaluate'>;
+export declare function waitUntilReady(page: ReadyPage): Promise<void>;
+//# sourceMappingURL=page-ready.d.ts.map

package/dist/record/page-ready.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-ready.d.ts","sourceRoot":"","sources":["../../src/record/page-ready.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAO5C,MAAM,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,EAAE,kBAAkB,GAAG,UAAU,CAAC,CAAC;AAIpE,wBAAsB,cAAc,CAAC,IAAI,EAAE,SAAS,GAAG,OAAO,CAAC,IAAI,CAAC,CAOnE"}

package/dist/record/page-ready.js

@@ -0,0 +1,15 @@
+// A page is ready to record once its network has been idle for 500 ms, waited for at most 10 s, and all its fonts
+// have loaded (plan 16 §16.5). A network that never goes idle doesn't stop the recording; any other failure does.
+const idleTimeoutMs = 10_000;
+const isTimeout = (error) => error instanceof Error && error.name === 'TimeoutError';
+export async function waitUntilReady(page) {
+    try {
+        await page.waitForLoadState('networkidle', { timeout: idleTimeoutMs });
+    }
+    catch (error) {
+        if (!isTimeout(error))
+            throw error;
+    }
+    await page.evaluate('document.fonts.ready.then(() => true)');
+}
+//# sourceMappingURL=page-ready.js.map

package/dist/record/page-ready.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-ready.js","sourceRoot":"","sources":["../../src/record/page-ready.ts"],"names":[],"mappings":"AAEA,kHAAkH;AAClH,kHAAkH;AAElH,MAAM,aAAa,GAAG,MAAM,CAAC;AAI7B,MAAM,SAAS,GAAG,CAAC,KAAc,EAAW,EAAE,CAAC,KAAK,YAAY,KAAK,IAAI,KAAK,CAAC,IAAI,KAAK,cAAc,CAAC;AAEvG,MAAM,CAAC,KAAK,UAAU,cAAc,CAAC,IAAe;IAClD,IAAI,CAAC;QACH,MAAM,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,EAAE,OAAO,EAAE,aAAa,EAAE,CAAC,CAAC;IACzE,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACf,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC;YAAE,MAAM,KAAK,CAAC;IACrC,CAAC;IACD,MAAM,IAAI,CAAC,QAAQ,CAAC,uCAAuC,CAAC,CAAC;AAC/D,CAAC"}

package/dist/record/page-route.d.ts

@@ -0,0 +1,13 @@
+export declare const pageOrigin = "http://page.kvvideo.invalid";
+export type PageAnswer = {
+    status: 200;
+    file: string;
+    contentType: string;
+} | {
+    status: 404;
+};
+/** The address a page file is opened at. */
+export declare function pageAddress(page: string): string;
+/** What a request of the page's origin is answered with, from the page's folder. */
+export declare function answerPageRequest(folder: string, address: string): PageAnswer;
+//# sourceMappingURL=page-route.d.ts.map

package/dist/record/page-route.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-route.d.ts","sourceRoot":"","sources":["../../src/record/page-route.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,UAAU,gCAAgC,CAAC;AA6BxD,MAAM,MAAM,UAAU,GAAG;IAAE,MAAM,EAAE,GAAG,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,MAAM,EAAE,GAAG,CAAA;CAAE,CAAC;AAE9F,4CAA4C;AAC5C,wBAAgB,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAEhD;AAiBD,oFAAoF;AACpF,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,UAAU,CAO7E"}

package/dist/record/page-route.js

@@ -0,0 +1,64 @@
+import { existsSync, realpathSync, statSync } from 'node:fs';
+import path from 'node:path';
+// An HTML page of the workspace, recorded without a server (plan 16 §16.5; ADR 0115, 32): it is opened on an origin
+// that never resolves, and each request to that origin is answered with the file at its path under the page's folder.
+// A path that leaves the folder, through `..` or a symlink, or a file that doesn't exist, is answered 404.
+export const pageOrigin = 'http://page.kvvideo.invalid';
+const contentTypes = {
+    '.html': 'text/html; charset=utf-8',
+    '.htm': 'text/html; charset=utf-8',
+    '.css': 'text/css; charset=utf-8',
+    '.js': 'text/javascript; charset=utf-8',
+    '.mjs': 'text/javascript; charset=utf-8',
+    '.json': 'application/json',
+    '.txt': 'text/plain; charset=utf-8',
+    '.svg': 'image/svg+xml',
+    '.png': 'image/png',
+    '.jpg': 'image/jpeg',
+    '.jpeg': 'image/jpeg',
+    '.gif': 'image/gif',
+    '.webp': 'image/webp',
+    '.avif': 'image/avif',
+    '.ico': 'image/x-icon',
+    '.woff': 'font/woff',
+    '.woff2': 'font/woff2',
+    '.ttf': 'font/ttf',
+    '.otf': 'font/otf',
+    '.mp4': 'video/mp4',
+    '.webm': 'video/webm',
+    '.mp3': 'audio/mpeg',
+    '.wav': 'audio/wav',
+    '.ogg': 'audio/ogg',
+};
+/** The address a page file is opened at. */
+export function pageAddress(page) {
+    return `${pageOrigin}/${encodeURIComponent(path.basename(page))}`;
+}
+function inside(folder, candidate) {
+    const relative = path.relative(folder, candidate);
+    return relative !== '' && !relative.startsWith('..') && !path.isAbsolute(relative);
+}
+function decodedPath(address) {
+    const { pathname } = new URL(address);
+    try {
+        return decodeURIComponent(pathname).replace(/^\/+/, '');
+    }
+    catch (error) {
+        if (error instanceof URIError)
+            return undefined;
+        throw error;
+    }
+}
+/** What a request of the page's origin is answered with, from the page's folder. */
+export function answerPageRequest(folder, address) {
+    const relative = decodedPath(address);
+    if (relative === undefined)
+        return { status: 404 };
+    const file = path.resolve(folder, relative);
+    if (!inside(folder, file) || !existsSync(file))
+        return { status: 404 };
+    if (!inside(realpathSync(folder), realpathSync(file)) || !statSync(file).isFile())
+        return { status: 404 };
+    return { status: 200, file, contentType: contentTypes[path.extname(file).toLowerCase()] ?? 'application/octet-stream' };
+}
+//# sourceMappingURL=page-route.js.map

package/dist/record/page-route.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-route.js","sourceRoot":"","sources":["../../src/record/page-route.ts"],"names":[],"mappings":"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"}

package/dist/record/pointer.d.ts

@@ -0,0 +1,8 @@
+import type { Page } from 'playwright-core';
+import { type Point } from './motion.ts';
+import type { Box } from './steps.ts';
+export declare function glideTo(page: Page, from: Point, to: Point): Promise<Point>;
+/** The box of the first visible match of a target, scrolled into view, in whole CSS pixels of the viewport. */
+export declare function targetBox(page: Page, target: string): Promise<Box>;
+export declare function centerOf(box: Box): Point;
+//# sourceMappingURL=pointer.d.ts.map

package/dist/record/pointer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pointer.d.ts","sourceRoot":"","sources":["../../src/record/pointer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAsB,KAAK,KAAK,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,YAAY,CAAC;AAKtC,wBAAsB,OAAO,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,CAMhF;AAED,+GAA+G;AAC/G,wBAAsB,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC,CAOxE;AAED,wBAAgB,QAAQ,CAAC,GAAG,EAAE,GAAG,GAAG,KAAK,CAExC"}

package/dist/record/pointer.js

@@ -0,0 +1,24 @@
+import { frameMs, glidePath } from "./motion.js";
+// The mouse as the viewer sees it (plan 16 §16.5; ADR 0115, 9): it glides to each target along an eased, gently
+// curved path, one move a frame, so the drawn pointer travels instead of jumping.
+export async function glideTo(page, from, to) {
+    for (const point of glidePath(from, to)) {
+        await page.mouse.move(point.x, point.y);
+        await page.waitForTimeout(frameMs);
+    }
+    return to;
+}
+/** The box of the first visible match of a target, scrolled into view, in whole CSS pixels of the viewport. */
+export async function targetBox(page, target) {
+    const element = page.locator(target).first();
+    await element.waitFor({ state: 'visible', timeout: 10_000 });
+    await element.scrollIntoViewIfNeeded({ timeout: 10_000 });
+    const box = await element.boundingBox({ timeout: 10_000 });
+    if (box === null)
+        throw new Error(`${target} has no box on the page`);
+    return { x: Math.round(box.x), y: Math.round(box.y), width: Math.round(box.width), height: Math.round(box.height) };
+}
+export function centerOf(box) {
+    return { x: box.x + box.width / 2, y: box.y + box.height / 2 };
+}
+//# sourceMappingURL=pointer.js.map

package/dist/record/pointer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pointer.js","sourceRoot":"","sources":["../../src/record/pointer.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,SAAS,EAAc,MAAM,aAAa,CAAC;AAG7D,gHAAgH;AAChH,kFAAkF;AAElF,MAAM,CAAC,KAAK,UAAU,OAAO,CAAC,IAAU,EAAE,IAAW,EAAE,EAAS;IAC9D,KAAK,MAAM,KAAK,IAAI,SAAS,CAAC,IAAI,EAAE,EAAE,CAAC,EAAE,CAAC;QACxC,MAAM,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC;QACxC,MAAM,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;IACrC,CAAC;IACD,OAAO,EAAE,CAAC;AACZ,CAAC;AAED,+GAA+G;AAC/G,MAAM,CAAC,KAAK,UAAU,SAAS,CAAC,IAAU,EAAE,MAAc;IACxD,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,CAAC;IAC7C,MAAM,OAAO,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC;IAC7D,MAAM,OAAO,CAAC,sBAAsB,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC;IAC1D,MAAM,GAAG,GAAG,MAAM,OAAO,CAAC,WAAW,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC;IAC3D,IAAI,GAAG,KAAK,IAAI;QAAE,MAAM,IAAI,KAAK,CAAC,GAAG,MAAM,yBAAyB,CAAC,CAAC;IACtE,OAAO,EAAE,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;AACtH,CAAC;AAED,MAAM,UAAU,QAAQ,CAAC,GAAQ;IAC/B,OAAO,EAAE,CAAC,EAAE,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;AACjE,CAAC"}

package/dist/record/recorder.d.ts

@@ -0,0 +1,34 @@
+import type { Browser, BrowserContext } from 'playwright-core';
+import { type Program } from '../programs/run-program.ts';
+import { type Cues } from './narration-cues.ts';
+import type { Action, Step } from './steps.ts';
+export type RecordSource = {
+    kind: 'site';
+    url: string;
+} | {
+    kind: 'page';
+    file: string;
+};
+export type RecordPlan = {
+    source: RecordSource;
+    steps: readonly Step[];
+    width: number;
+    height: number;
+    device: 'desktop' | 'phone';
+    cues: Cues | undefined;
+    folder: string;
+    ownPort: number | null;
+    ffmpeg: Program;
+    signal: AbortSignal;
+    now(): number;
+    stepStarted(number: number, of: number): void;
+};
+export type Recording = {
+    video: string;
+    durationMs: number;
+    actions: Action[];
+};
+/** A fresh browser context for a recording: its size and device, kvman's port aborted, a page's files, the pointer. */
+export declare function recordingContext(browser: Browser, plan: Pick<RecordPlan, 'source' | 'width' | 'height' | 'device' | 'ownPort'>): Promise<BrowserContext>;
+export declare function record(browser: Browser, plan: RecordPlan): Promise<Recording>;
+//# sourceMappingURL=recorder.d.ts.map

package/dist/record/recorder.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"recorder.d.ts","sourceRoot":"","sources":["../../src/record/recorder.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAQ,MAAM,iBAAiB,CAAC;AAErE,OAAO,EAAa,KAAK,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAMrE,OAAO,EAAe,KAAK,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAK7D,OAAO,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAO/C,MAAM,MAAM,YAAY,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAE1F,MAAM,MAAM,UAAU,GAAG;IACvB,MAAM,EAAE,YAAY,CAAC;IACrB,KAAK,EAAE,SAAS,IAAI,EAAE,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,SAAS,GAAG,OAAO,CAAC;IAC5B,IAAI,EAAE,IAAI,GAAG,SAAS,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,MAAM,EAAE,OAAO,CAAC;IAChB,MAAM,EAAE,WAAW,CAAC;IACpB,GAAG,IAAI,MAAM,CAAC;IACd,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,GAAG,IAAI,CAAC;CAC/C,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,UAAU,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,EAAE,CAAA;CAAE,CAAC;AAMjF,uHAAuH;AACvH,wBAAsB,gBAAgB,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,CAAC,UAAU,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,CAAC,GAAG,OAAO,CAAC,cAAc,CAAC,CAa9J;AA0CD,wBAAsB,MAAM,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,GAAG,OAAO,CAAC,SAAS,CAAC,CAsBnF"}

package/dist/record/recorder.js

@@ -0,0 +1,99 @@
+import path from 'node:path';
+import { startPiped } from "../programs/piped-program.js";
+import { lastLines } from "../programs/run-program.js";
+import { kvvideoProblem } from "../problems.js";
+import { isOwnAddress } from "./address.js";
+import { cursorScript } from "./cursor-script.js";
+import { recordEncoderArgs } from "./encoder-args.js";
+import { frameWriter } from "./frame-writer.js";
+import { waitUntilMs } from "./narration-cues.js";
+import { answerPageRequest, pageAddress, pageOrigin } from "./page-route.js";
+import { waitUntilReady } from "./page-ready.js";
+import { pausesAfter, runStep } from "./run-step.js";
+import { startScreencast } from "./screencast.js";
+const scale = 2;
+const firstLine = (error) => (error instanceof Error ? (error.message.split('\n').find((line) => line.trim() !== '') ?? error.name) : String(error)).trim();
+/** A fresh browser context for a recording: its size and device, kvman's port aborted, a page's files, the pointer. */
+export async function recordingContext(browser, plan) {
+    const phone = plan.device === 'phone';
+    const context = await browser.newContext({ viewport: { width: plan.width, height: plan.height }, deviceScaleFactor: scale, isMobile: phone, hasTouch: phone });
+    await context.route((url) => isOwnAddress(url, plan.ownPort), (route) => route.abort('blockedbyclient'));
+    const { source } = plan;
+    if (source.kind === 'page') {
+        await context.route(`${pageOrigin}/**`, async (route) => {
+            const answer = answerPageRequest(path.dirname(source.file), route.request().url());
+            await (answer.status === 404 ? route.fulfill({ status: 404, body: '' }) : route.fulfill({ status: 200, path: answer.file, contentType: answer.contentType }));
+        });
+    }
+    await context.addInitScript(cursorScript(plan.device));
+    return context;
+}
+async function open(page, source) {
+    const address = source.kind === 'site' ? source.url : pageAddress(source.file);
+    try {
+        await page.goto(address, { waitUntil: 'load', timeout: 30_000 });
+        await waitUntilReady(page);
+    }
+    catch (error) {
+        throw kvvideoProblem('STEP_FAILED', `The page ${address} didn't load: ${firstLine(error)}`, { step: 0, reason: firstLine(error) });
+    }
+}
+async function waitForCue(page, plan, step, elapsed) {
+    if (step.do === 'wait' || step.atLine === undefined || plan.cues === undefined)
+        return;
+    const wait = waitUntilMs(plan.cues.lineStartsMs[step.atLine - 1] ?? 0, elapsed());
+    if (wait > 0)
+        await page.waitForTimeout(wait);
+}
+async function play(page, plan, startedAt) {
+    const elapsed = () => Math.round(plan.now() - startedAt);
+    await page.waitForTimeout(500);
+    const state = { page, device: plan.device, pointer: { x: plan.width / 2, y: plan.height / 2 }, elapsed };
+    const actions = [];
+    for (const [index, step] of plan.steps.entries()) {
+        plan.stepStarted(index + 1, plan.steps.length);
+        await waitForCue(page, plan, step, elapsed);
+        const atMs = elapsed();
+        try {
+            const result = await runStep(state, step);
+            state.pointer = result.pointer;
+            actions.push({ do: step.do, atMs, endMs: elapsed(), ...(result.act === undefined ? {} : { actMs: result.act.atMs, box: result.act.box }) });
+        }
+        catch (error) {
+            throw kvvideoProblem('STEP_FAILED', `Step ${String(index + 1)} (${step.do}) failed: ${firstLine(error)}`, { step: index + 1, reason: firstLine(error) });
+        }
+        if (pausesAfter(step))
+            await page.waitForTimeout(400);
+    }
+    await page.waitForTimeout(1000);
+    const rest = plan.cues === undefined ? 0 : waitUntilMs(plan.cues.leastLengthMs, elapsed());
+    if (rest > 0)
+        await page.waitForTimeout(rest);
+    return actions;
+}
+export async function record(browser, plan) {
+    const context = await recordingContext(browser, plan);
+    const page = await context.newPage();
+    await open(page, plan.source);
+    const size = { width: plan.width * scale, height: plan.height * scale };
+    const video = path.join(plan.folder, 'recording.mp4');
+    const stopEncoder = new AbortController();
+    const encoder = await startPiped(plan.ffmpeg, recordEncoderArgs(size.width, size.height, video), AbortSignal.any([plan.signal, stopEncoder.signal]));
+    try {
+        const startedAt = plan.now();
+        const writer = frameWriter((frame) => encoder.write(frame), startedAt);
+        const screencast = await startScreencast(page, size, (frame, atMs) => writer.frame(frame, atMs), plan.now);
+        const actions = await play(page, plan, startedAt).finally(() => screencast.stop());
+        const endedAt = plan.now();
+        await writer.finish(endedAt);
+        const run = await encoder.end();
+        if (run.exitCode !== 0)
+            throw kvvideoProblem('RENDER_FAILED', `ffmpeg couldn't encode the recording (exit ${String(run.exitCode)}).`, { reason: lastLines(run.output) });
+        return { video, durationMs: Math.round(endedAt - startedAt), actions };
+    }
+    finally {
+        stopEncoder.abort();
+        await context.close();
+    }
+}
+//# sourceMappingURL=recorder.js.map