@vosjs/cli 0.13.0 → 0.14.0

package/dist/chunk-GCWE75OA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/render.ts"],"sourcesContent":["import { compileVosConfig } from '@vosjs/core'\nimport { generateRenderTemplate } from '@vosjs/core/runtime'\nimport { elementsBundleCode } from '@vosjs/elements/bundle'\nimport { tweenRuntimeCode } from '@vosjs/tween/bundle'\nimport type { Browser, Page } from 'playwright'\n\n/** Fake secure origin the render page is served from (WebCodecs needs one). */\nconst RENDER_ORIGIN = 'https://vos-cli.render'\n\nexport interface RenderCommonOptions {\n  config: Record<string, unknown>\n  width: number\n  height: number\n  /** Phase callback for progress reporting. */\n  onPhase?: (phase: string) => void\n}\n\nexport interface RenderVideoOptions extends RenderCommonOptions {\n  fps: number\n  /** Output duration in seconds. */\n  duration: number\n  format: 'webm' | 'mp4'\n}\n\nexport interface RenderStillOptions extends RenderCommonOptions {\n  /** Seek time for the captured frame, seconds. */\n  time: number\n}\n\nexport interface RenderResult {\n  bytes: Uint8Array\n  mimeType: string\n}\n\ninterface RenderComplete {\n  success: boolean\n  data?: string\n  error?: string\n}\n\nfunction compile(config: Record<string, unknown>): string {\n  return compileVosConfig(config as never, { tweenEngine: 'vos' })\n}\n\nasync function runCapturePage(\n  browser: Browser,\n  html: string,\n  opts: { width: number; height: number; timeoutMs: number },\n): Promise<RenderComplete> {\n  const context = await browser.newContext({\n    viewport: { width: opts.width, height: opts.height },\n  })\n  const page: Page = await context.newPage()\n  const errors: string[] = []\n  page.on('console', (m) => {\n    if (m.type() === 'error') errors.push(m.text())\n  })\n  try {\n    await page.route(`${RENDER_ORIGIN}/**`, (route) =>\n      route.fulfill({ status: 200, contentType: 'text/html', body: html }),\n    )\n    await page.goto(`${RENDER_ORIGIN}/render`, {\n      waitUntil: 'domcontentloaded',\n    })\n    const start = Date.now()\n    for (;;) {\n      const done = (await page.evaluate(\n        'window.__renderComplete ?? null',\n      )) as RenderComplete | null\n      if (done) return done\n      if (Date.now() - start > opts.timeoutMs) {\n        return {\n          success: false,\n          error: `render timed out after ${Math.round(opts.timeoutMs / 1000)}s${\n            errors.length\n              ? ` (page errors: ${errors.slice(0, 3).join(' | ')})`\n              : ''\n          }`,\n        }\n      }\n      await new Promise((r) => setTimeout(r, 400))\n    }\n  } finally {\n    await context.close()\n  }\n}\n\nfunction decodeDataUrl(dataUrl: string): RenderResult {\n  const m = /^data:([^;,]+);base64,(.*)$/s.exec(dataUrl)\n  if (!m) throw new Error('capture page returned an unexpected payload')\n  return { bytes: Uint8Array.from(Buffer.from(m[2], 'base64')), mimeType: m[1] }\n}\n\n/** Render a vos config to a video (WebM/MP4) in a headless browser. */\nexport async function renderVideo(\n  browser: Browser,\n  opts: RenderVideoOptions,\n): Promise<RenderResult> {\n  opts.onPhase?.('compile')\n  const code = compile(opts.config)\n  const html = generateRenderTemplate(code, {\n    mode: 'capture-video',\n    capture: {\n      width: opts.width,\n      height: opts.height,\n      duration: opts.duration,\n      fps: opts.fps,\n      format: opts.format,\n    },\n    elementsBundleCode,\n    tweenEngine: 'vos',\n    tweenBundleCode: tweenRuntimeCode,\n  })\n  opts.onPhase?.('render')\n  // Generous ceiling: startup + CDN module fetch + ~4× realtime per frame batch.\n  const timeoutMs = 90_000 + opts.duration * opts.fps * 400\n  const done = await runCapturePage(browser, html, {\n    width: opts.width,\n    height: opts.height,\n    timeoutMs,\n  })\n  if (!done.success || !done.data)\n    throw new Error(done.error ?? 'render failed')\n  return decodeDataUrl(done.data)\n}\n\n/** Render a single frame of a vos config to an image in a headless browser. */\nexport async function renderStill(\n  browser: Browser,\n  opts: RenderStillOptions,\n): Promise<RenderResult> {\n  opts.onPhase?.('compile')\n  const code = compile(opts.config)\n  const html = generateRenderTemplate(code, {\n    mode: 'capture-thumbnail',\n    capture: {\n      width: opts.width,\n      height: opts.height,\n      duration: Math.max(1, opts.time + 1),\n      fps: 30,\n      thumbnailTime: opts.time,\n    },\n    elementsBundleCode,\n    tweenEngine: 'vos',\n    tweenBundleCode: tweenRuntimeCode,\n  })\n  opts.onPhase?.('render')\n  const done = await runCapturePage(browser, html, {\n    width: opts.width,\n    height: opts.height,\n    timeoutMs: 120_000,\n  })\n  if (!done.success || !done.data)\n    throw new Error(done.error ?? 'still render failed')\n  return decodeDataUrl(done.data)\n}\n\nexport interface PreviewPages {\n  /** Host page: iframes the player and drives it over the bridge. */\n  hostHtml: string\n  /** The engine's playback-mode player (waits for a LOAD postMessage). */\n  playerHtml: string\n}\n\n/**\n * Pages for `vos preview`. The playback template is the iframe HALF of the\n * player bridge — it renders nothing until a host posts `LOAD`, so the CLI\n * serves a minimal host page that sends `LOAD { code, autoplay }` and shows\n * a transport line (time / duration, click to play-pause).\n */\nexport function previewPages(config: Record<string, unknown>): PreviewPages {\n  const code = compile(config)\n  const playerHtml = generateRenderTemplate(code, {\n    mode: 'playback',\n    elementsBundleCode,\n    tweenEngine: 'vos',\n    tweenBundleCode: tweenRuntimeCode,\n  })\n  const codeJson = JSON.stringify(code).replace(/<\\//g, '<\\\\/')\n  const hostHtml = `<!doctype html><html><head><meta charset=\"utf-8\"><title>vos preview</title>\n<style>\n  html,body{margin:0;height:100%;background:#000;overflow:hidden}\n  iframe{position:absolute;inset:0;width:100%;height:100%;border:0}\n  #cover{position:fixed;inset:0;cursor:pointer}\n  #hud{position:fixed;left:12px;bottom:10px;color:#fff;opacity:.75;font:12px/1.4 ui-monospace,monospace;\n       background:rgba(0,0,0,.45);padding:4px 8px;border-radius:6px;pointer-events:none}\n</style></head><body>\n<iframe id=\"p\" src=\"/player\" allow=\"autoplay\"></iframe>\n<div id=\"cover\"></div>\n<div id=\"hud\">loading…</div>\n<script>\n  const code = ${codeJson}\n  const frame = document.getElementById('p')\n  const hud = document.getElementById('hud')\n  let ready = false\n  let playing = true\n  const post = (msg) => frame.contentWindow && frame.contentWindow.postMessage(msg, '*')\n  const load = () => post({ type: 'LOAD', code, autoplay: true })\n  window.addEventListener('message', (e) => {\n    const msg = e.data || {}\n    if (msg.type === 'BRIDGE_READY') load()\n    if (msg.type === 'READY') { ready = true; hud.textContent = '0.0 / ' + msg.duration.toFixed(1) + 's — click to pause' }\n    if (msg.type === 'UPDATE') hud.textContent = msg.time.toFixed(1) + ' / ' + msg.duration.toFixed(1) + 's — click to ' + (playing ? 'pause' : 'play')\n    if (msg.type === 'ERROR') hud.textContent = 'error: ' + msg.error\n  })\n  // Belt and braces: if BRIDGE_READY raced the host, retry LOAD until READY.\n  let tries = 0\n  const iv = setInterval(() => {\n    if (ready || tries++ > 20) return clearInterval(iv)\n    load()\n  }, 400)\n  // The iframe swallows clicks — capture them on an overlay above it.\n  document.getElementById('cover').addEventListener('click', () => {\n    if (!ready) return\n    playing = !playing\n    post({ type: playing ? 'PLAY' : 'PAUSE' })\n    hud.textContent = hud.textContent.replace(/click to (pause|play)/, 'click to ' + (playing ? 'pause' : 'play'))\n  })\n</script></body></html>`\n  return { hostHtml, playerHtml }\n}\n"],"mappings":"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","names":[]}