@real-music-packages/web-core 0.10.0 → 0.12.0

package/README.md

@@ -36,6 +36,31 @@ peers; OSMD is only loaded via a dynamic import). Pure helpers (`parseMidi`,
 - **`renderNotation(xml, opts?)`** — renders a MusicXML string via OSMD to a detached canvas; returns per-staff measure boxes (RSR geometry), per-measure column union boxes (RMT geometry), system rows, and content bounds. Parameterisable via `RenderNotationOpts` (paper, inkSumThreshold, hostWidth, bars).
 - **`createPromoSampler(opts?)`** — creates a Tone.js Salamander sampler wired to a `MediaStreamDestination`. `keepAlive` option feeds a silent ConstantSource so the recorder never drops silent intro scenes (default false; RMT passes true).
 
+### `./scene`
+Render-components: the Score model (`scoreFromMusicXML`), the Layer contract +
+SceneSpec runner, and the built-in layers (notation, scroll-cursor, keyboard,
+falling-notes, promo cards, spectrum, branding, and the S5 extended catalog).
+
+This barrel is **browser-safe** — it pulls in no Node-only dependencies, so
+Vite/rolldown consumers need **no aliases**. `scoreFromMusicXML` runs unchanged in
+the browser (native canvas handles OSMD's lyric layout).
+
+### `./scene/headless` (Node-only)
+`setupHeadlessDom()` — installs `jsdom` globals + a fake 2D canvas context so OSMD
+can `load()` a score outside a browser (CI, batch, audio-only paths). Import it
+**only in Node**, and call it once before `scoreFromMusicXML` (or pass
+`opts.osmdFactory`):
+
+```ts
+import { setupHeadlessDom } from '@real-music-packages/web-core/scene/headless'; // Node only
+import { scoreFromMusicXML } from '@real-music-packages/web-core/scene';
+await setupHeadlessDom();
+const score = scoreFromMusicXML(xml);
+```
+
+This subpath references `jsdom` and must never be imported from browser code. It
+lives here (not in `./scene`) precisely so the `./scene` barrel stays bundler-safe.
+
 ## ⚠️ Octave-base gotcha (`scales.getMidiNote` / `getScaleDegree`)
 These are ported verbatim from RealEarTrainer and use **RET's non-standard octave
 base**: `getMidiNote(1, 'C', 4) === 48`, i.e. one octave below the General-MIDI

package/dist/chunk-HXTRNE74.js

@@ -0,0 +1,325 @@
+// src/video.ts
+var SAFE_ZONE = { top: 0.15, bottom: 0.28, left: 0.06, right: 0.12 };
+function safeBox(W, H) {
+  const left = W * SAFE_ZONE.left;
+  const right = W * (1 - SAFE_ZONE.right);
+  const top = H * SAFE_ZONE.top;
+  const bottom = H * (1 - SAFE_ZONE.bottom);
+  return {
+    left,
+    right,
+    top,
+    bottom,
+    w: right - left,
+    h: bottom - top,
+    cx: (left + right) / 2,
+    cy: (top + bottom) / 2,
+    centeredW: 2 * Math.min(W / 2 - left, right - W / 2)
+  };
+}
+function safeTitleBaseline(size, H) {
+  return H * SAFE_ZONE.top + size * 0.8 + 4;
+}
+function drawSafeGuides(ctx) {
+  const W = ctx.canvas.width, H = ctx.canvas.height;
+  const b = safeBox(W, H);
+  ctx.save();
+  ctx.globalAlpha = 1;
+  ctx.fillStyle = "rgba(220,40,40,0.35)";
+  ctx.fillRect(0, 0, W, b.top);
+  ctx.fillRect(0, b.bottom, W, H - b.bottom);
+  ctx.fillRect(0, b.top, b.left, b.h);
+  ctx.fillRect(b.right, b.top, W - b.right, b.h);
+  ctx.strokeStyle = "rgba(40,200,90,1)";
+  ctx.lineWidth = 6;
+  ctx.strokeRect(b.left, b.top, b.w, b.h);
+  ctx.restore();
+}
+function pickMimeType() {
+  const candidates = [
+    "video/webm;codecs=vp9,opus",
+    "video/webm;codecs=vp8,opus",
+    "video/webm"
+  ];
+  for (const t of candidates) {
+    if (typeof MediaRecorder !== "undefined" && MediaRecorder.isTypeSupported(t)) return t;
+  }
+  return "video/webm";
+}
+async function recordScenes(scenes, opts) {
+  const { audioStream, width, height, fps = 30, background = "#000000", onProgress } = opts;
+  const canvas = document.createElement("canvas");
+  canvas.width = width;
+  canvas.height = height;
+  const maybeCtx = canvas.getContext("2d");
+  if (!maybeCtx) throw new Error("Failed to get 2D context");
+  const ctx = maybeCtx;
+  const videoStream = canvas.captureStream(fps);
+  const combined = new MediaStream([
+    ...videoStream.getVideoTracks(),
+    ...audioStream.getAudioTracks()
+  ]);
+  const mimeType = pickMimeType();
+  const recorder = new MediaRecorder(combined, {
+    mimeType,
+    videoBitsPerSecond: 4e6,
+    audioBitsPerSecond: 128e3
+  });
+  const chunks = [];
+  recorder.ondataavailable = (e) => {
+    if (e.data.size > 0) chunks.push(e.data);
+  };
+  const stopped = new Promise((res) => {
+    recorder.onstop = () => res();
+  });
+  recorder.start();
+  const totalMs = scenes.reduce((s, sc) => s + sc.durationMs, 0);
+  const t0 = performance.now();
+  onProgress?.({ phase: "capturing", progress01: 0 });
+  let sceneStart = 0;
+  let sceneIdx = 0;
+  let enteredScene = -1;
+  ctx.fillStyle = background;
+  ctx.fillRect(0, 0, width, height);
+  scenes[0].draw(ctx, 0);
+  await new Promise((resolve) => {
+    function tick() {
+      const now = performance.now() - t0;
+      if (now >= totalMs) {
+        setTimeout(resolve, 100);
+        return;
+      }
+      while (sceneIdx < scenes.length - 1 && now - sceneStart >= scenes[sceneIdx].durationMs) {
+        sceneStart += scenes[sceneIdx].durationMs;
+        sceneIdx += 1;
+      }
+      const scene = scenes[sceneIdx];
+      if (enteredScene !== sceneIdx) {
+        enteredScene = sceneIdx;
+        scene.onEnter?.();
+      }
+      const tInScene = (now - sceneStart) / scene.durationMs;
+      ctx.fillStyle = background;
+      ctx.fillRect(0, 0, width, height);
+      scene.draw(ctx, Math.min(1, Math.max(0, tInScene)));
+      onProgress?.({
+        phase: "capturing",
+        progress01: Math.min(0.95, now / totalMs)
+      });
+      requestAnimationFrame(tick);
+    }
+    requestAnimationFrame(tick);
+  });
+  onProgress?.({ phase: "finalizing", progress01: 0.96 });
+  recorder.stop();
+  await stopped;
+  return new Blob(chunks, { type: mimeType });
+}
+function truncate(s, max) {
+  return s.length > max ? s.slice(0, max - 1).trimEnd() + "\u2026" : s;
+}
+function initials(name) {
+  return name.split(/\s+/).filter(Boolean).slice(0, 3).map((w) => w[0]).join("").toUpperCase();
+}
+function drawBottomGradient(ctx, opts = {}) {
+  const W = ctx.canvas.width, H = ctx.canvas.height;
+  const heightFrac = opts.heightFrac ?? 0.3;
+  const maxAlpha = opts.maxAlpha ?? 0.45;
+  const top = H * (1 - heightFrac);
+  const g = ctx.createLinearGradient(0, top, 0, H);
+  g.addColorStop(0, "rgba(0,0,0,0)");
+  g.addColorStop(1, `rgba(0,0,0,${maxAlpha})`);
+  ctx.save();
+  ctx.fillStyle = g;
+  ctx.fillRect(0, top, W, H - top);
+  ctx.restore();
+}
+function hookScene(theme, opts) {
+  return {
+    durationMs: 2e3,
+    draw(ctx, _t01) {
+      const W = ctx.canvas.width;
+      const H = ctx.canvas.height;
+      drawBottomGradient(ctx);
+      ctx.textAlign = "center";
+      ctx.fillStyle = theme.ink;
+      ctx.font = `bold 88px ${theme.fontDisplay}`;
+      opts.lines.forEach((line, i) => {
+        ctx.fillText(line, W / 2, H * 0.42 + i * 104);
+      });
+      const brand = opts.brand ?? theme.brand;
+      ctx.font = `italic 38px ${theme.fontBody}`;
+      ctx.fillStyle = theme.sepia;
+      ctx.fillText(brand, W / 2, H * 0.42 + opts.lines.length * 104 + 12);
+    }
+  };
+}
+var _portraitCache = /* @__PURE__ */ new Map();
+function loadPortrait(url) {
+  if (!url) return Promise.resolve(null);
+  const cached = _portraitCache.get(url);
+  if (cached) return cached;
+  const p = new Promise((resolve) => {
+    if (typeof Image === "undefined") {
+      resolve(null);
+      return;
+    }
+    const img = new Image();
+    img.crossOrigin = "anonymous";
+    img.onload = () => resolve(img);
+    img.onerror = () => resolve(null);
+    img.src = url;
+  });
+  _portraitCache.set(url, p);
+  return p;
+}
+function wrapLines(ctx, text, maxW, maxLines) {
+  const words = text.split(/\s+/).filter(Boolean);
+  const lines = [];
+  let cur = "";
+  for (const w of words) {
+    const next = cur ? `${cur} ${w}` : w;
+    if (ctx.measureText(next).width > maxW && cur) {
+      lines.push(cur);
+      cur = w;
+      if (lines.length === maxLines - 1) break;
+    } else {
+      cur = next;
+    }
+  }
+  if (cur && lines.length < maxLines) lines.push(cur);
+  const used = lines.join(" ");
+  if (used.length < text.length && lines.length) {
+    lines[lines.length - 1] = truncate(lines[lines.length - 1] + "\u2026", 999);
+  }
+  return lines;
+}
+function revealScene(theme, opts) {
+  return {
+    durationMs: 2200,
+    draw(ctx, t01) {
+      const W = ctx.canvas.width;
+      const H = ctx.canvas.height;
+      const b = safeBox(W, H);
+      const cx = W / 2;
+      const cy = b.top + b.h * 0.4286;
+      const r = 92;
+      const k = Math.min(1, t01 * 1.4);
+      ctx.globalAlpha = k;
+      ctx.textAlign = "center";
+      ctx.beginPath();
+      ctx.arc(cx, cy, r, 0, Math.PI * 2);
+      ctx.fillStyle = theme.paper;
+      ctx.fill();
+      if (opts.portrait) {
+        ctx.save();
+        ctx.beginPath();
+        ctx.arc(cx, cy, r - 3, 0, Math.PI * 2);
+        ctx.clip();
+        const img = opts.portrait;
+        const iw = img.naturalWidth || img.width || 1;
+        const ih = img.naturalHeight || img.height || 1;
+        const scale = Math.max(2 * (r - 3) / iw, 2 * (r - 3) / ih);
+        const dw = iw * scale;
+        const dh = ih * scale;
+        ctx.drawImage(img, cx - dw / 2, cy - dh / 2, dw, dh);
+        ctx.restore();
+      } else {
+        ctx.fillStyle = theme.ink;
+        ctx.font = `bold 76px ${theme.fontDisplay}`;
+        const badge = opts.initials ?? initials(opts.title);
+        ctx.fillText(badge, cx, cy + 27);
+      }
+      ctx.lineWidth = 5;
+      ctx.strokeStyle = theme.gold;
+      ctx.stroke();
+      const truncated = truncate(opts.title, 24);
+      let fontSize = 80;
+      ctx.font = `bold ${fontSize}px ${theme.fontDisplay}`;
+      if (ctx.measureText(truncated).width > W * 0.86) {
+        fontSize = 68;
+        ctx.font = `bold ${fontSize}px ${theme.fontDisplay}`;
+      }
+      ctx.fillStyle = theme.ink;
+      ctx.fillText(truncated, cx, cy + r + 110);
+      ctx.font = `italic 50px ${theme.fontBody}`;
+      ctx.fillStyle = theme.sepia;
+      ctx.fillText(opts.subtitle, cx, cy + r + 176);
+      if (opts.funFact) {
+        ctx.font = `34px ${theme.fontBody}`;
+        ctx.fillStyle = theme.sepia;
+        const lines = wrapLines(ctx, opts.funFact, b.w * 0.92, 2);
+        lines.forEach((line, i) => {
+          ctx.fillText(line, cx, cy + r + 246 + i * 44);
+        });
+      }
+      ctx.globalAlpha = 1;
+    }
+  };
+}
+function ctaScene(theme, opts) {
+  return {
+    durationMs: 2500,
+    draw(ctx, _t01) {
+      const W = ctx.canvas.width;
+      const H = ctx.canvas.height;
+      const b = safeBox(W, H);
+      const baseY = b.cy - 40;
+      ctx.textAlign = "center";
+      if (opts.lines.length > 0) {
+        ctx.fillStyle = theme.ink;
+        ctx.font = `bold 66px ${theme.fontDisplay}`;
+        ctx.fillText(opts.lines[0], W / 2, baseY);
+      }
+      opts.lines.slice(1).forEach((line, i) => {
+        ctx.fillStyle = theme.accent;
+        ctx.font = `bold 72px ${theme.fontDisplay}`;
+        ctx.fillText(line, W / 2, baseY + 100 * (i + 1));
+      });
+    }
+  };
+}
+async function runPromoCapture(opts, record = recordScenes) {
+  const w = window;
+  w.__promoMeta = opts.meta;
+  try {
+    const blob = await record(opts.buildScenes(), {
+      audioStream: opts.audioStream,
+      width: opts.width ?? 1080,
+      height: opts.height ?? 1920,
+      fps: opts.fps,
+      background: opts.background
+    });
+    const url = URL.createObjectURL(blob);
+    w.__promoBlobUrl = url;
+    if (opts.download !== false) {
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = `promo-${opts.meta.id ?? "clip"}.webm`;
+      document.body.appendChild(a);
+      a.click();
+    }
+    w.__promoReady = true;
+  } catch (e) {
+    w.__promoError = String(e);
+    throw e;
+  }
+}
+
+export {
+  SAFE_ZONE,
+  safeBox,
+  safeTitleBaseline,
+  drawSafeGuides,
+  pickMimeType,
+  recordScenes,
+  truncate,
+  initials,
+  drawBottomGradient,
+  hookScene,
+  loadPortrait,
+  revealScene,
+  ctaScene,
+  runPromoCapture
+};
+//# sourceMappingURL=chunk-HXTRNE74.js.map

package/dist/chunk-HXTRNE74.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/video.ts"],"sourcesContent":["/**\n * Framework-agnostic promo video module.\n *\n * Provides:\n *  - PromoTheme — colour/font/brand tokens\n *  - Scene — {durationMs, draw, onEnter?}\n *  - recordScenes — rAF-based canvas capture → Blob (browser only)\n *  - hookScene / revealScene / ctaScene — scene builders (pure, unit-testable)\n *  - runPromoCapture — orchestrator with dependency-injected recorder\n *\n * Visual style ported from whozart/src/lib/promo.ts + video.ts.\n */\n\n// ─── Types ───────────────────────────────────────────────────────────────────\n\nexport interface PromoTheme {\n  paper: string;\n  ink: string;\n  accent: string;\n  sepia: string;\n  gold: string;\n  fontDisplay: string;\n  fontBody: string;\n  brand: string;\n}\n\nexport interface Scene {\n  durationMs: number;\n  draw: (ctx: CanvasRenderingContext2D, t01: number) => void;\n  onEnter?: () => void;\n}\n\nexport interface RecordOpts {\n  audioStream: MediaStream;\n  width: number;\n  height: number;\n  fps?: number;\n  background?: string;\n  onProgress?: (p: { phase: string; progress01: number }) => void;\n}\n\nexport interface PromoMeta {\n  id?: string;\n  title?: string;\n  composer?: string;\n  [k: string]: unknown;\n}\n\nexport interface PromoCaptureOpts {\n  buildScenes: () => Scene[];\n  audioStream: MediaStream;\n  meta: PromoMeta;\n  width?: number;\n  height?: number;\n  fps?: number;\n  background?: string;\n  download?: boolean;\n}\n\n// ─── Safe zone (phone short-form UI) ─────────────────────────────────────────\n\n/**\n * Insets (fractions of frame) kept clear of TikTok/Reels/Shorts UI overlays.\n * `bottom: 0.28` puts the safe-box bottom at 0.72·H — TikTok's caption + right\n * action rail reach ~25–28% up, tighter than the old 0.20, and a posted RET clip\n * had its keyboard clipped at 0.20. `top: 0.15` clears TikTok's top tabs/search\n * row — measured from a real screenshot, the \"Find related content\" search bar\n * bottom sits at ~0.114·H, so 0.10 clashed and 0.13 cleared by only ~31px; 0.15\n * gives a comfortable ~73px. This is the SINGLE source of truth for both safe lines:\n * consumers anchor bottom content to `safeBox().bottom` and top titles to\n * `safeTitleBaseline()` instead of hardcoding. Verify any layout with `?safe=1`.\n */\nexport const SAFE_ZONE = { top: 0.15, bottom: 0.28, left: 0.06, right: 0.12 } as const;\n\nexport interface SafeBox {\n  left: number; right: number; top: number; bottom: number;\n  w: number; h: number; cx: number; cy: number;\n  /** Widest block centered at frame W/2 that still fits inside the box. */\n  centeredW: number;\n}\n\n/** The usable content rectangle for a W×H frame, in pixels. */\nexport function safeBox(W: number, H: number): SafeBox {\n  const left = W * SAFE_ZONE.left;\n  const right = W * (1 - SAFE_ZONE.right);\n  const top = H * SAFE_ZONE.top;\n  const bottom = H * (1 - SAFE_ZONE.bottom);\n  return {\n    left, right, top, bottom,\n    w: right - left, h: bottom - top,\n    cx: (left + right) / 2, cy: (top + bottom) / 2,\n    centeredW: 2 * Math.min(W / 2 - left, right - W / 2),\n  };\n}\n\n/**\n * Lowest first-line baseline (for an ALPHABETIC-baseline title of `size` px) that\n * keeps the title's cap-top inside the safe box top. Phone top chrome (TikTok/Reels\n * \"For You\" tabs + search) sits above `safeBox().top`, and an alphabetic baseline\n * draws glyphs ~0.8*size ABOVE the baseline — so a small `topY` silently breaches\n * the top. Apps clamp their top titles: `y = Math.max(topY, safeTitleBaseline(size, H))`.\n * Single source of truth for the top-safe line, mirroring `safeBox().bottom`.\n */\nexport function safeTitleBaseline(size: number, H: number): number {\n  return H * SAFE_ZONE.top + size * 0.8 + 4;\n}\n\n/** Debug overlay: dim the four unsafe margins + outline the safe box. */\nexport function drawSafeGuides(ctx: CanvasRenderingContext2D): void {\n  const W = ctx.canvas.width, H = ctx.canvas.height;\n  const b = safeBox(W, H);\n  ctx.save();\n  ctx.globalAlpha = 1;\n  ctx.fillStyle = 'rgba(220,40,40,0.35)';\n  ctx.fillRect(0, 0, W, b.top);                  // top\n  ctx.fillRect(0, b.bottom, W, H - b.bottom);    // bottom\n  ctx.fillRect(0, b.top, b.left, b.h);           // left\n  ctx.fillRect(b.right, b.top, W - b.right, b.h); // right (action rail)\n  ctx.strokeStyle = 'rgba(40,200,90,1)';\n  ctx.lineWidth = 6;\n  ctx.strokeRect(b.left, b.top, b.w, b.h);\n  ctx.restore();\n}\n\n// ─── MIME type picker ─────────────────────────────────────────────────────────\n\nexport function pickMimeType(): string {\n  const candidates = [\n    'video/webm;codecs=vp9,opus',\n    'video/webm;codecs=vp8,opus',\n    'video/webm',\n  ];\n  for (const t of candidates) {\n    if (typeof MediaRecorder !== 'undefined' && MediaRecorder.isTypeSupported(t)) return t;\n  }\n  return 'video/webm';\n}\n\n// ─── recordScenes ─────────────────────────────────────────────────────────────\n\nexport async function recordScenes(scenes: Scene[], opts: RecordOpts): Promise<Blob> {\n  const { audioStream, width, height, fps = 30, background = '#000000', onProgress } = opts;\n\n  const canvas = document.createElement('canvas');\n  canvas.width = width;\n  canvas.height = height;\n\n  const maybeCtx = canvas.getContext('2d');\n  if (!maybeCtx) throw new Error('Failed to get 2D context');\n  const ctx: CanvasRenderingContext2D = maybeCtx;\n\n  const videoStream = canvas.captureStream(fps);\n  const combined = new MediaStream([\n    ...videoStream.getVideoTracks(),\n    ...audioStream.getAudioTracks(),\n  ]);\n\n  const mimeType = pickMimeType();\n  const recorder = new MediaRecorder(combined, {\n    mimeType,\n    videoBitsPerSecond: 4_000_000,\n    audioBitsPerSecond: 128_000,\n  });\n\n  const chunks: Blob[] = [];\n  recorder.ondataavailable = (e) => {\n    if (e.data.size > 0) chunks.push(e.data);\n  };\n  const stopped = new Promise<void>((res) => {\n    recorder.onstop = () => res();\n  });\n\n  recorder.start();\n\n  const totalMs = scenes.reduce((s, sc) => s + sc.durationMs, 0);\n  const t0 = performance.now();\n\n  onProgress?.({ phase: 'capturing', progress01: 0 });\n\n  let sceneStart = 0;\n  let sceneIdx = 0;\n  let enteredScene = -1;\n\n  // Draw first frame immediately\n  ctx.fillStyle = background;\n  ctx.fillRect(0, 0, width, height);\n  scenes[0].draw(ctx, 0);\n\n  await new Promise<void>((resolve) => {\n    function tick() {\n      const now = performance.now() - t0;\n      if (now >= totalMs) {\n        setTimeout(resolve, 100);\n        return;\n      }\n\n      // Advance scene index\n      while (\n        sceneIdx < scenes.length - 1 &&\n        now - sceneStart >= scenes[sceneIdx].durationMs\n      ) {\n        sceneStart += scenes[sceneIdx].durationMs;\n        sceneIdx += 1;\n      }\n\n      const scene = scenes[sceneIdx];\n\n      // Fire onEnter once per scene\n      if (enteredScene !== sceneIdx) {\n        enteredScene = sceneIdx;\n        scene.onEnter?.();\n      }\n\n      const tInScene = (now - sceneStart) / scene.durationMs;\n\n      // Clear to background\n      ctx.fillStyle = background;\n      ctx.fillRect(0, 0, width, height);\n\n      scene.draw(ctx, Math.min(1, Math.max(0, tInScene)));\n\n      onProgress?.({\n        phase: 'capturing',\n        progress01: Math.min(0.95, now / totalMs),\n      });\n\n      requestAnimationFrame(tick);\n    }\n\n    requestAnimationFrame(tick);\n  });\n\n  onProgress?.({ phase: 'finalizing', progress01: 0.96 });\n  recorder.stop();\n  await stopped;\n\n  return new Blob(chunks, { type: mimeType });\n}\n\n// ─── Helpers ─────────────────────────────────────────────────────────────────\n\nexport function truncate(s: string, max: number): string {\n  return s.length > max ? s.slice(0, max - 1).trimEnd() + '…' : s;\n}\n\nexport function initials(name: string): string {\n  return name\n    .split(/\\s+/)\n    .filter(Boolean)\n    .slice(0, 3)\n    .map((w) => w[0])\n    .join('')\n    .toUpperCase();\n}\n\n// ─── Scene builders ───────────────────────────────────────────────────────────\n\n/**\n * Dark gradient rising from the frame bottom (opaque-ish at the very bottom,\n * fading out by `heightFrac` up). TikTok overlays the view count bottom-left of\n * every profile-grid thumbnail in WHITE — on our light start screens it was\n * unreadable. Draw this after the background, before content.\n */\nexport function drawBottomGradient(\n  ctx: CanvasRenderingContext2D,\n  opts: { heightFrac?: number; maxAlpha?: number } = {},\n): void {\n  const W = ctx.canvas.width, H = ctx.canvas.height;\n  const heightFrac = opts.heightFrac ?? 0.30;\n  const maxAlpha = opts.maxAlpha ?? 0.45;\n  const top = H * (1 - heightFrac);\n  const g = ctx.createLinearGradient(0, top, 0, H);\n  g.addColorStop(0, \"rgba(0,0,0,0)\");\n  g.addColorStop(1, `rgba(0,0,0,${maxAlpha})`);\n  ctx.save();\n  ctx.fillStyle = g;\n  ctx.fillRect(0, top, W, H - top);\n  ctx.restore();\n}\n\nexport interface HookSceneOpts {\n  lines: string[];\n  brand?: string;\n}\n\nexport function hookScene(theme: PromoTheme, opts: HookSceneOpts): Scene {\n  return {\n    durationMs: 2000,\n    draw(ctx, _t01) {\n      const W = ctx.canvas.width;\n      const H = ctx.canvas.height;\n      // The hook is the profile-grid thumbnail; the bottom gradient keeps\n      // TikTok's white view-count overlay readable on light backdrops.\n      drawBottomGradient(ctx);\n      ctx.textAlign = 'center';\n      ctx.fillStyle = theme.ink;\n      ctx.font = `bold 88px ${theme.fontDisplay}`;\n      opts.lines.forEach((line, i) => {\n        ctx.fillText(line, W / 2, H * 0.42 + i * 104);\n      });\n      const brand = opts.brand ?? theme.brand;\n      ctx.font = `italic 38px ${theme.fontBody}`;\n      ctx.fillStyle = theme.sepia;\n      ctx.fillText(brand, W / 2, H * 0.42 + opts.lines.length * 104 + 12);\n    },\n  };\n}\n\nexport interface RevealSceneOpts {\n  title: string;\n  subtitle: string;\n  initials?: string;\n  /** Composer portrait (already decoded) drawn clipped into the medallion. If\n   *  omitted/null, falls back to the initials badge. Load it with `loadPortrait`\n   *  so a cross-origin image (e.g. Wikimedia) doesn't taint the capture canvas. */\n  portrait?: HTMLImageElement | null;\n  /** Optional one-line fun fact wrapped below the subtitle (e.g. corpus\n   *  `fun_fact`). Trimmed to two lines. */\n  funFact?: string;\n}\n\n/** Load an image for canvas capture: `crossOrigin='anonymous'` so a CORS-enabled\n *  cross-origin source (Wikimedia portraits send `Access-Control-Allow-Origin: *`)\n *  can be drawn onto a captured canvas WITHOUT tainting it. Fail-soft: resolves\n *  null on error/missing url (callers fall back to initials). Cached per-url. */\nconst _portraitCache = new Map<string, Promise<HTMLImageElement | null>>();\nexport function loadPortrait(url?: string | null): Promise<HTMLImageElement | null> {\n  if (!url) return Promise.resolve(null);\n  const cached = _portraitCache.get(url);\n  if (cached) return cached;\n  const p = new Promise<HTMLImageElement | null>((resolve) => {\n    if (typeof Image === 'undefined') { resolve(null); return; }\n    const img = new Image();\n    img.crossOrigin = 'anonymous';\n    img.onload = () => resolve(img);\n    img.onerror = () => resolve(null);\n    img.src = url;\n  });\n  _portraitCache.set(url, p);\n  return p;\n}\n\n/** Greedy word-wrap for the current ctx.font into at most `maxLines` lines. */\nfunction wrapLines(ctx: CanvasRenderingContext2D, text: string, maxW: number, maxLines: number): string[] {\n  const words = text.split(/\\s+/).filter(Boolean);\n  const lines: string[] = [];\n  let cur = '';\n  for (const w of words) {\n    const next = cur ? `${cur} ${w}` : w;\n    if (ctx.measureText(next).width > maxW && cur) {\n      lines.push(cur);\n      cur = w;\n      if (lines.length === maxLines - 1) break;\n    } else {\n      cur = next;\n    }\n  }\n  if (cur && lines.length < maxLines) lines.push(cur);\n  // If we ran out of line budget mid-text, ellipsize the last line.\n  const used = lines.join(' ');\n  if (used.length < text.length && lines.length) {\n    lines[lines.length - 1] = truncate(lines[lines.length - 1] + '…', 999);\n  }\n  return lines;\n}\n\nexport function revealScene(theme: PromoTheme, opts: RevealSceneOpts): Scene {\n  return {\n    durationMs: 2200,\n    draw(ctx, t01) {\n      const W = ctx.canvas.width;\n      const H = ctx.canvas.height;\n      const b = safeBox(W, H);\n      const cx = W / 2;\n      // Anchor through the safe box; ~0.4286 of box height ≈ original H*0.40 (no visible shift at 1080×1920).\n      const cy = b.top + b.h * 0.4286;\n      const r = 92;\n      const k = Math.min(1, t01 * 1.4);\n      ctx.globalAlpha = k;\n      ctx.textAlign = 'center';\n\n      // Medallion circle (faint surface) + gold ring.\n      ctx.beginPath();\n      ctx.arc(cx, cy, r, 0, Math.PI * 2);\n      ctx.fillStyle = theme.paper;\n      ctx.fill();\n\n      if (opts.portrait) {\n        // Portrait clipped into the medallion, cover-fit (centred crop).\n        ctx.save();\n        ctx.beginPath();\n        ctx.arc(cx, cy, r - 3, 0, Math.PI * 2);\n        ctx.clip();\n        const img = opts.portrait;\n        const iw = img.naturalWidth || img.width || 1;\n        const ih = img.naturalHeight || img.height || 1;\n        const scale = Math.max((2 * (r - 3)) / iw, (2 * (r - 3)) / ih);\n        const dw = iw * scale;\n        const dh = ih * scale;\n        ctx.drawImage(img, cx - dw / 2, cy - dh / 2, dw, dh);\n        ctx.restore();\n      } else {\n        // Initials inside medallion (fallback).\n        ctx.fillStyle = theme.ink;\n        ctx.font = `bold 76px ${theme.fontDisplay}`;\n        const badge = opts.initials ?? initials(opts.title);\n        ctx.fillText(badge, cx, cy + 27);\n      }\n\n      ctx.lineWidth = 5;\n      ctx.strokeStyle = theme.gold;\n      ctx.stroke();\n\n      // Title (with font-size fallback if too wide)\n      const truncated = truncate(opts.title, 24);\n      let fontSize = 80;\n      ctx.font = `bold ${fontSize}px ${theme.fontDisplay}`;\n      if (ctx.measureText(truncated).width > W * 0.86) {\n        fontSize = 68;\n        ctx.font = `bold ${fontSize}px ${theme.fontDisplay}`;\n      }\n      ctx.fillStyle = theme.ink;\n      ctx.fillText(truncated, cx, cy + r + 110);\n\n      // Subtitle\n      ctx.font = `italic 50px ${theme.fontBody}`;\n      ctx.fillStyle = theme.sepia;\n      ctx.fillText(opts.subtitle, cx, cy + r + 176);\n\n      // Optional fun fact, wrapped to two lines below the subtitle.\n      if (opts.funFact) {\n        ctx.font = `34px ${theme.fontBody}`;\n        ctx.fillStyle = theme.sepia;\n        const lines = wrapLines(ctx, opts.funFact, b.w * 0.92, 2);\n        lines.forEach((line, i) => {\n          ctx.fillText(line, cx, cy + r + 246 + i * 44);\n        });\n      }\n\n      ctx.globalAlpha = 1;\n    },\n  };\n}\n\nexport interface CtaSceneOpts {\n  lines: string[];\n}\n\nexport function ctaScene(theme: PromoTheme, opts: CtaSceneOpts): Scene {\n  return {\n    durationMs: 2500,\n    draw(ctx, _t01) {\n      const W = ctx.canvas.width;\n      const H = ctx.canvas.height;\n      const b = safeBox(W, H);\n      // Safe-box-relative base ≈ original H*0.42 (no visible shift at 1080×1920).\n      const baseY = b.cy - 40;\n      ctx.textAlign = 'center';\n      if (opts.lines.length > 0) {\n        ctx.fillStyle = theme.ink;\n        ctx.font = `bold 66px ${theme.fontDisplay}`;\n        ctx.fillText(opts.lines[0], W / 2, baseY);\n      }\n      opts.lines.slice(1).forEach((line, i) => {\n        ctx.fillStyle = theme.accent;\n        ctx.font = `bold 72px ${theme.fontDisplay}`;\n        ctx.fillText(line, W / 2, baseY + 100 * (i + 1));\n      });\n    },\n  };\n}\n\n// ─── runPromoCapture ──────────────────────────────────────────────────────────\n\nexport async function runPromoCapture(\n  opts: PromoCaptureOpts,\n  record: (scenes: Scene[], o: RecordOpts) => Promise<Blob> = recordScenes,\n): Promise<void> {\n  const w = window as unknown as Record<string, unknown>;\n  w.__promoMeta = opts.meta;\n  try {\n    const blob = await record(opts.buildScenes(), {\n      audioStream: opts.audioStream,\n      width: opts.width ?? 1080,\n      height: opts.height ?? 1920,\n      fps: opts.fps,\n      background: opts.background,\n    });\n    const url = URL.createObjectURL(blob);\n    w.__promoBlobUrl = url;\n    if (opts.download !== false) {\n      const a = document.createElement('a');\n      a.href = url;\n      a.download = `promo-${opts.meta.id ?? 'clip'}.webm`;\n      document.body.appendChild(a);\n      a.click();\n    }\n    w.__promoReady = true;\n  } catch (e) {\n    w.__promoError = String(e);\n    throw e;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/scene/headless.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Install jsdom globals + a fake 2D canvas context so OSMD can `load()` a score
+ * headlessly. Idempotent. Call once before constructing an OSMD instance in Node.
+ *
+ * No-ops if `window`/`document` already exist (e.g. a real browser, or a vitest
+ * jsdom environment), so it is safe to call unconditionally.
+ */
+declare function setupHeadlessDom(): Promise<void>;
+
+export { setupHeadlessDom };

package/dist/scene/headless.js

@@ -0,0 +1,108 @@
+// src/scene/headless.ts
+var installed = false;
+async function setupHeadlessDom() {
+  if (installed) return;
+  const g = globalThis;
+  if (typeof g.document !== "undefined" && typeof g.window !== "undefined") {
+    ensureFakeContext(g.window);
+    installed = true;
+    return;
+  }
+  const { JSDOM } = await import("jsdom");
+  const dom = new JSDOM("<!DOCTYPE html><html><body></body></html>", {
+    pretendToBeVisual: true
+  });
+  const { window } = dom;
+  ensureFakeContext(window);
+  g.window = window;
+  g.document = window.document;
+  try {
+    g.navigator = window.navigator;
+  } catch {
+  }
+  g.HTMLElement = window.HTMLElement;
+  g.Node = window.Node;
+  g.DOMParser = window.DOMParser;
+  g.XMLSerializer = window.XMLSerializer;
+  g.requestAnimationFrame = (cb) => setTimeout(() => cb(Date.now()), 0);
+  g.cancelAnimationFrame = () => {
+  };
+  installed = true;
+}
+function ensureFakeContext(window) {
+  const proto = window.HTMLCanvasElement?.prototype;
+  if (!proto) return;
+  const fakeCtx = makeFakeContext();
+  proto.getContext = function() {
+    return fakeCtx;
+  };
+}
+function makeFakeContext() {
+  return {
+    font: "10px Arial",
+    fillStyle: "#000",
+    strokeStyle: "#000",
+    lineWidth: 1,
+    textAlign: "left",
+    textBaseline: "alphabetic",
+    globalAlpha: 1,
+    measureText: (s) => ({
+      width: (s ? s.length : 0) * 6,
+      actualBoundingBoxAscent: 8,
+      actualBoundingBoxDescent: 2
+    }),
+    save() {
+    },
+    restore() {
+    },
+    beginPath() {
+    },
+    closePath() {
+    },
+    moveTo() {
+    },
+    lineTo() {
+    },
+    bezierCurveTo() {
+    },
+    quadraticCurveTo() {
+    },
+    arc() {
+    },
+    rect() {
+    },
+    fill() {
+    },
+    stroke() {
+    },
+    fillRect() {
+    },
+    clearRect() {
+    },
+    fillText() {
+    },
+    strokeText() {
+    },
+    translate() {
+    },
+    rotate() {
+    },
+    scale() {
+    },
+    setTransform() {
+    },
+    transform() {
+    },
+    drawImage() {
+    },
+    clip() {
+    },
+    createLinearGradient: () => ({ addColorStop() {
+    } }),
+    getImageData: () => ({ data: new Uint8ClampedArray(4) })
+  };
+}
+export {
+  setupHeadlessDom
+};
+//# sourceMappingURL=headless.js.map

package/dist/scene/headless.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/scene/headless.ts"],"sourcesContent":["// Headless DOM setup for running OSMD outside a browser (Node — CI, batch,\n// whozart's notation-less audio path).\n//\n// OSMD's load() runs graphical layout, which calls canvas 2D text metrics.\n// Bare jsdom returns null for getContext('2d'), so layout throws on scores\n// with lyrics. We install a minimal fake 2D context so layout completes; we\n// never read the pixels — only osmd.sheet (the source model) is consumed by\n// scoreFromMusicXML, so a no-op context is sufficient.\n//\n// The SAME extraction code (scoreFromMusicXML) runs unchanged in a real\n// browser: there the native 2D context handles lyric layout and this helper is\n// never called. This module is the only Node-specific seam.\n//\n// jsdom is a devDependency (used by tests + headless callers); it is imported\n// dynamically so bundling for the browser never pulls it in.\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nlet installed = false;\n\n/**\n * Install jsdom globals + a fake 2D canvas context so OSMD can `load()` a score\n * headlessly. Idempotent. Call once before constructing an OSMD instance in Node.\n *\n * No-ops if `window`/`document` already exist (e.g. a real browser, or a vitest\n * jsdom environment), so it is safe to call unconditionally.\n */\nexport async function setupHeadlessDom(): Promise<void> {\n  if (installed) return;\n  const g = globalThis as any;\n  if (typeof g.document !== 'undefined' && typeof g.window !== 'undefined') {\n    // A DOM is already present (browser or test env). Still ensure a usable 2D\n    // context for OSMD's lyric layout if jsdom didn't provide one.\n    ensureFakeContext(g.window);\n    installed = true;\n    return;\n  }\n\n  // Literal specifier so bundlers can tree-shake it out of browser builds.\n  const { JSDOM } = await import('jsdom');\n  const dom = new JSDOM('<!DOCTYPE html><html><body></body></html>', {\n    pretendToBeVisual: true,\n  });\n  const { window } = dom;\n\n  ensureFakeContext(window);\n\n  g.window = window;\n  g.document = window.document;\n  // Node 26: globalThis.navigator is read-only — tolerate the failure.\n  try {\n    g.navigator = window.navigator;\n  } catch {\n    /* read-only on some Node versions; OSMD doesn't require it */\n  }\n  g.HTMLElement = window.HTMLElement;\n  g.Node = window.Node;\n  g.DOMParser = window.DOMParser;\n  g.XMLSerializer = window.XMLSerializer;\n  g.requestAnimationFrame = (cb: (t: number) => void) => setTimeout(() => cb(Date.now()), 0);\n  g.cancelAnimationFrame = () => {};\n\n  installed = true;\n}\n\n/** Patch HTMLCanvasElement.getContext to return a no-op 2D context. */\nfunction ensureFakeContext(window: any): void {\n  const proto = window.HTMLCanvasElement?.prototype;\n  if (!proto) return;\n  const fakeCtx = makeFakeContext();\n  proto.getContext = function () {\n    return fakeCtx;\n  };\n}\n\n/** A minimal 2D context: text metrics return a rough width; everything else is a no-op. */\nfunction makeFakeContext(): any {\n  return {\n    font: '10px Arial',\n    fillStyle: '#000',\n    strokeStyle: '#000',\n    lineWidth: 1,\n    textAlign: 'left',\n    textBaseline: 'alphabetic',\n    globalAlpha: 1,\n    measureText: (s: string) => ({\n      width: (s ? s.length : 0) * 6,\n      actualBoundingBoxAscent: 8,\n      actualBoundingBoxDescent: 2,\n    }),\n    save() {},\n    restore() {},\n    beginPath() {},\n    closePath() {},\n    moveTo() {},\n    lineTo() {},\n    bezierCurveTo() {},\n    quadraticCurveTo() {},\n    arc() {},\n    rect() {},\n    fill() {},\n    stroke() {},\n    fillRect() {},\n    clearRect() {},\n    fillText() {},\n    strokeText() {},\n    translate() {},\n    rotate() {},\n    scale() {},\n    setTransform() {},\n    transform() {},\n    drawImage() {},\n    clip() {},\n    createLinearGradient: () => ({ addColorStop() {} }),\n    getImageData: () => ({ data: new Uint8ClampedArray(4) }),\n  };\n}\n"],"mappings":";AAkBA,IAAI,YAAY;AAShB,eAAsB,mBAAkC;AACtD,MAAI,UAAW;AACf,QAAM,IAAI;AACV,MAAI,OAAO,EAAE,aAAa,eAAe,OAAO,EAAE,WAAW,aAAa;AAGxE,sBAAkB,EAAE,MAAM;AAC1B,gBAAY;AACZ;AAAA,EACF;AAGA,QAAM,EAAE,MAAM,IAAI,MAAM,OAAO,OAAO;AACtC,QAAM,MAAM,IAAI,MAAM,6CAA6C;AAAA,IACjE,mBAAmB;AAAA,EACrB,CAAC;AACD,QAAM,EAAE,OAAO,IAAI;AAEnB,oBAAkB,MAAM;AAExB,IAAE,SAAS;AACX,IAAE,WAAW,OAAO;AAEpB,MAAI;AACF,MAAE,YAAY,OAAO;AAAA,EACvB,QAAQ;AAAA,EAER;AACA,IAAE,cAAc,OAAO;AACvB,IAAE,OAAO,OAAO;AAChB,IAAE,YAAY,OAAO;AACrB,IAAE,gBAAgB,OAAO;AACzB,IAAE,wBAAwB,CAAC,OAA4B,WAAW,MAAM,GAAG,KAAK,IAAI,CAAC,GAAG,CAAC;AACzF,IAAE,uBAAuB,MAAM;AAAA,EAAC;AAEhC,cAAY;AACd;AAGA,SAAS,kBAAkB,QAAmB;AAC5C,QAAM,QAAQ,OAAO,mBAAmB;AACxC,MAAI,CAAC,MAAO;AACZ,QAAM,UAAU,gBAAgB;AAChC,QAAM,aAAa,WAAY;AAC7B,WAAO;AAAA,EACT;AACF;AAGA,SAAS,kBAAuB;AAC9B,SAAO;AAAA,IACL,MAAM;AAAA,IACN,WAAW;AAAA,IACX,aAAa;AAAA,IACb,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,IACd,aAAa;AAAA,IACb,aAAa,CAAC,OAAe;AAAA,MAC3B,QAAQ,IAAI,EAAE,SAAS,KAAK;AAAA,MAC5B,yBAAyB;AAAA,MACzB,0BAA0B;AAAA,IAC5B;AAAA,IACA,OAAO;AAAA,IAAC;AAAA,IACR,UAAU;AAAA,IAAC;AAAA,IACX,YAAY;AAAA,IAAC;AAAA,IACb,YAAY;AAAA,IAAC;AAAA,IACb,SAAS;AAAA,IAAC;AAAA,IACV,SAAS;AAAA,IAAC;AAAA,IACV,gBAAgB;AAAA,IAAC;AAAA,IACjB,mBAAmB;AAAA,IAAC;AAAA,IACpB,MAAM;AAAA,IAAC;AAAA,IACP,OAAO;AAAA,IAAC;AAAA,IACR,OAAO;AAAA,IAAC;AAAA,IACR,SAAS;AAAA,IAAC;AAAA,IACV,WAAW;AAAA,IAAC;AAAA,IACZ,YAAY;AAAA,IAAC;AAAA,IACb,WAAW;AAAA,IAAC;AAAA,IACZ,aAAa;AAAA,IAAC;AAAA,IACd,YAAY;AAAA,IAAC;AAAA,IACb,SAAS;AAAA,IAAC;AAAA,IACV,QAAQ;AAAA,IAAC;AAAA,IACT,eAAe;AAAA,IAAC;AAAA,IAChB,YAAY;AAAA,IAAC;AAAA,IACb,YAAY;AAAA,IAAC;AAAA,IACb,OAAO;AAAA,IAAC;AAAA,IACR,sBAAsB,OAAO,EAAE,eAAe;AAAA,IAAC,EAAE;AAAA,IACjD,cAAc,OAAO,EAAE,MAAM,IAAI,kBAAkB,CAAC,EAAE;AAAA,EACxD;AACF;","names":[]}