create-aura3d 1.0.9 → 1.0.10

package/templates/cartoon-studio/src/studio.ts

@@ -0,0 +1,101 @@
+import { episode, publicCartoonAssetInstructions, typedCartoonAssetSummary } from "./episode";
+import { publishReadiness, renderPlan } from "./render-plan";
+
+export const cartoonStudioSupport = {
+  template: "cartoon-studio",
+  panels: ["timeline", "assets", "performance", "render"] as const,
+  timelineTracks: [
+    {
+      id: "shots",
+      label: "Shots",
+      clips: episode.shotTimeline.shots.map((shot) => ({
+        id: shot.shotId,
+        startTime: shot.startTime,
+        endTime: shot.endTime,
+        cameraMove: shot.camera.move,
+        transitionOut: shot.transitionOut ?? "cut"
+      }))
+    },
+    {
+      id: "dialogue",
+      label: "Dialogue",
+      clips: episode.dialogueTrack.lines.map((line) => ({
+        id: line.lineId,
+        speakerId: line.speakerId,
+        startTime: line.startTime,
+        endTime: line.endTime,
+        text: line.text
+      }))
+    },
+    {
+      id: "render",
+      label: "Render",
+      clips: renderPlan.items.map((item) => ({
+        id: item.id,
+        time: item.time,
+        outputIds: item.outputIds,
+        width: item.viewport.width,
+        height: item.viewport.height
+      }))
+    }
+  ],
+  assetLibrary: {
+    requiredCharacters: typedCartoonAssetSummary.requiredCharacterAssets,
+    optionalProps: typedCartoonAssetSummary.optionalPropAssets,
+    missingCharacters: typedCartoonAssetSummary.missingCharacterAssets,
+    commands: publicCartoonAssetInstructions
+  },
+  renderPipeline: {
+    outputs: renderPlan.outputs.map((output) => output.kind),
+    itemCount: renderPlan.items.length,
+    publishReadyFromCurrentEvidence: publishReadiness.ready,
+    issueCount: publishReadiness.issues.length
+  }
+} as const;
+
+export function installCartoonStudioPanel(target: HTMLElement): void {
+  const panel = document.createElement("section");
+  panel.id = "cartoon-studio-panel";
+  panel.style.cssText = [
+    "position:fixed",
+    "left:18px",
+    "top:18px",
+    "width:min(360px,calc(100vw - 36px))",
+    "display:grid",
+    "grid-template-columns:repeat(4,1fr)",
+    "gap:6px",
+    "padding:10px",
+    "border:1px solid rgba(248,255,242,0.22)",
+    "border-radius:8px",
+    "background:rgba(3,12,20,0.78)",
+    "color:#f8fff2",
+    "font:600 12px/1.2 system-ui,sans-serif",
+    "z-index:9"
+  ].join(";");
+
+  for (const name of cartoonStudioSupport.panels) {
+    const button = document.createElement("button");
+    button.type = "button";
+    button.textContent = name;
+    button.dataset.panel = name;
+    button.style.cssText = [
+      "min-width:0",
+      "height:30px",
+      "border:1px solid rgba(125,226,255,0.42)",
+      "border-radius:6px",
+      "background:rgba(24,45,63,0.84)",
+      "color:#f8fff2",
+      "font:inherit",
+      "text-transform:capitalize"
+    ].join(";");
+    panel.appendChild(button);
+  }
+
+  const status = document.createElement("div");
+  status.id = "cartoon-studio-status";
+  status.textContent = `${episode.shotTimeline.shots.length} shots | ${episode.dialogueTrack.lines.length} lines | ${renderPlan.items.length} render cues`;
+  status.style.cssText = "grid-column:1 / -1;color:#7de2ff;white-space:normal";
+  panel.appendChild(status);
+
+  target.appendChild(panel);
+}

package/templates/cartoon-studio/tests/route-health.spec.ts

@@ -0,0 +1,7 @@
+import { expect, test } from "@playwright/test";
+
+test("cartoon studio route loads", async ({ page }) => {
+  await page.goto("/");
+  await expect(page.locator("#app")).toBeVisible();
+});
+

package/templates/cartoon-studio/tests/storyboard-playback.spec.ts

@@ -0,0 +1,91 @@
+import { expect, test } from "@playwright/test";
+
+test("cartoon studio storyboard caption renders", async ({ page }) => {
+  await page.goto("/");
+  await expect(page.getByText(/Aura3D cartoon studio|moon|robot/i)).toBeVisible();
+});
+
+test("storyboard playback, character performance, caption timing, cuts, and nonblank cartoon frames are sourced", async ({
+  page
+}) => {
+  await page.goto("/");
+
+  const routeProof = (await page.evaluate(() => {
+    const template = (window as unknown as {
+      __AURA3D_CARTOON_TEMPLATE__?: {
+        shotIds: readonly string[];
+        captionIds: readonly string[];
+        storyBible?: unknown;
+        studio?: unknown;
+        playbackProbeSamples: readonly unknown[];
+        sampleAt(time: number): unknown;
+      };
+    }).__AURA3D_CARTOON_TEMPLATE__;
+    return {
+      shotIds: template?.shotIds ?? [],
+      captionIds: template?.captionIds ?? [],
+      storyBible: template?.storyBible,
+      studio: template?.studio,
+      samples: [1, 21, 43].map((time) => template?.sampleAt(time)),
+      playbackProbeSamples: template?.playbackProbeSamples ?? [],
+      bodyShotCount: document.body.dataset.cartoonShotCount,
+      bodyCaptionCount: document.body.dataset.cartoonCaptionCount,
+      bodyPanels: document.body.dataset.cartoonStudioPanels
+    };
+  })) as {
+    shotIds: string[];
+    captionIds: string[];
+    storyBible?: {
+      props?: unknown[];
+      styleGuide?: { visualStyle?: string };
+      shotList?: unknown[];
+    };
+    studio?: {
+      panels?: readonly string[];
+      timelineTracks?: readonly { id: string; clips: readonly unknown[] }[];
+      assetLibrary?: { commands?: readonly string[] };
+      renderPipeline?: { itemCount?: number };
+    };
+    samples: Array<{
+      shotId?: string;
+      captionId?: string;
+      captionText?: string;
+      cameraMove?: string;
+      transitionOut?: string;
+      nodeUpdates?: Array<{ characterId?: string; action?: string; emotion?: string }>;
+    }>;
+    playbackProbeSamples: unknown[];
+    bodyShotCount?: string;
+    bodyCaptionCount?: string;
+    bodyPanels?: string;
+  };
+
+  expect(routeProof.shotIds).toEqual([
+    "shot-moon-garden-open",
+    "shot-glow-stone-teamwork",
+    "shot-moon-garden-finish"
+  ]);
+  expect(new Set(routeProof.samples.map((sample) => sample.shotId)).size).toBe(3);
+  expect(routeProof.captionIds).toHaveLength(6);
+  expect(routeProof.samples.every((sample) => sample.captionId && sample.captionText)).toBe(true);
+  expect(routeProof.samples.some((sample) => sample.cameraMove === "push-in" || sample.transitionOut === "cut")).toBe(true);
+  expect(routeProof.samples.flatMap((sample) => sample.nodeUpdates ?? []).some((update) => update.action === "speak")).toBe(true);
+  expect(routeProof.samples.flatMap((sample) => sample.nodeUpdates ?? []).some((update) => update.characterId === "miko")).toBe(true);
+  expect(routeProof.samples.flatMap((sample) => sample.nodeUpdates ?? []).some((update) => update.characterId === "luma")).toBe(true);
+  expect(routeProof.storyBible?.props?.length).toBeGreaterThanOrEqual(3);
+  expect(routeProof.storyBible?.styleGuide?.visualStyle).toMatch(/cartoon/i);
+  expect(routeProof.storyBible?.shotList).toHaveLength(3);
+  expect(routeProof.playbackProbeSamples).toHaveLength(3);
+  expect(routeProof.bodyShotCount).toBe("3");
+  expect(routeProof.bodyCaptionCount).toBe("6");
+  expect(routeProof.studio?.panels).toEqual(["timeline", "assets", "performance", "render"]);
+  expect(routeProof.studio?.timelineTracks?.map((track) => track.id)).toEqual(["shots", "dialogue", "render"]);
+  expect(routeProof.studio?.timelineTracks?.every((track) => track.clips.length > 0)).toBe(true);
+  expect(routeProof.studio?.assetLibrary?.commands?.some((command) => command.includes("assets validate-cartoon"))).toBe(true);
+  expect(routeProof.studio?.renderPipeline?.itemCount).toBeGreaterThan(0);
+  expect(routeProof.bodyPanels).toBe("timeline,assets,performance,render");
+  await expect(page.locator("#cartoon-studio-panel")).toBeVisible();
+
+  const screenshot = await page.screenshot();
+  expect(screenshot.byteLength).toBeGreaterThan(2048);
+});

package/templates/cartoon-studio/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "strict": true,
+    "jsx": "react-jsx",
+    "types": ["vite/client"]
+  },
+  "include": ["src"]
+}
+

package/templates/cinematic-scene/package.json

@@ -11,7 +11,7 @@
     "test": "playwright test tests/route-health.spec.ts tests/screenshot.spec.ts --workers=1"
   },
   "dependencies": {
-    "@aura3d/engine": "1.0.9"
+    "@aura3d/engine": "1.0.10"
   },
   "devDependencies": {
     "@playwright/test": "^1.52.0",

package/templates/episode-builder/README.md

@@ -0,0 +1,46 @@
+# Aura3D Episode Builder Template
+
+This template demonstrates a guided prompt-to-episode builder on top of the
+AuraVoice-to-Aura3D prompt-animation contract.
+
+It uses:
+
+- `compilePromptEpisodePlan(...)` for prompt-to-episode planning.
+- Optional typed GLB characters from `./src/aura-assets` with primitive runtime fallbacks until assets are added.
+- `createShotPlaybackPlan(...)` plus `installShotPlayback(...)` so `app.onFrame` updates nodes without recreating the app.
+- `createAuraVoiceBridgePackage(...)`, `validateAuraVoiceBridgePackage(...)`, `collectPromptAnimationEvidence(...)`, and `evaluatePromptAnimationPublishReadiness(...)` for source-level AuraVoice/Aura3D handoff declarations.
+- Caption HUD and caption timing proof metadata.
+- Render queue metadata and three deterministic screenshot fixture records.
+- Child-safe, reduced-motion, and high-contrast accessibility proof defaults.
+- Primitive-mouth and typed-GLB viseme examples.
+- Phoneme/viseme/dub source proof metadata for stable shot, storyboard, caption, line, and word timing ids.
+- Episode format choices for short-form, standard, pilot, educational, and music-video structures.
+- Wizard state that points at the compiled episode plan, beats, characters, and publish-evidence status.
+- A compact builder panel for route tests and agent inspection.
+
+Replace primitive characters with typed GLB assets by running:
+
+```bash
+npx @aura3d/cli@latest assets add ./assets/miko.glb --name miko
+npx @aura3d/cli@latest assets add ./assets/luma.glb --name luma
+npx @aura3d/cli@latest assets validate-cartoon
+```
+
+Then import `assets.miko` and `assets.luma` from `src/aura-assets.ts` and pass them to `model(assets.miko)` and `model(assets.luma)`.
+
+The GLB path must keep typed assets:
+
+```ts
+import { model } from "@aura3d/engine";
+import { assets } from "./aura-assets";
+
+model(assets.miko);
+```
+
+Do not replace this with a string asset id or a raw loader.
+
+This scaffold intentionally does not claim publish readiness from source alone.
+Before closing build, route, asset, screenshot, render, or visual-quality gates,
+archive the matching `npm run build`, `assets validate-cartoon`, browser
+evidence, screenshot hashes, render outputs, and human or automated review
+artifacts.

package/templates/episode-builder/index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Aura3D Episode Builder</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
+

package/templates/episode-builder/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "aura3d-episode-builder",
+  "version": "0.1.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vite --host 0.0.0.0",
+    "typecheck": "tsc --noEmit",
+    "build": "npm run typecheck && vite build",
+    "preview": "vite preview --host 0.0.0.0",
+    "test": "playwright test tests/route-health.spec.ts tests/storyboard-playback.spec.ts --workers=1"
+  },
+  "dependencies": {
+    "@aura3d/engine": "1.0.10"
+  },
+  "devDependencies": {
+    "@playwright/test": "^1.52.0",
+    "typescript": "^5.9.3",
+    "vite": "^7.2.4"
+  }
+}

package/templates/episode-builder/playwright.config.ts

@@ -0,0 +1,13 @@
+import { defineConfig } from "@playwright/test";
+
+export default defineConfig({
+  webServer: {
+    command: "npm run dev -- --port 4181",
+    url: "http://127.0.0.1:4181",
+    reuseExistingServer: !process.env.CI
+  },
+  use: {
+    baseURL: "http://127.0.0.1:4181"
+  }
+});
+

package/templates/episode-builder/src/aura-assets.ts

@@ -0,0 +1,14 @@
+import { defineAuraAssets } from "@aura3d/engine";
+import { AURAVOICE_AURA3D_PROMPT_ANIMATION_CONTRACT_ID } from "./contract";
+
+export const assetContractId = AURAVOICE_AURA3D_PROMPT_ANIMATION_CONTRACT_ID;
+
+export const assets = defineAuraAssets({
+  /*
+   * Add character GLBs with the Aura3D CLI, then keep these generated keys:
+   *
+   * npx @aura3d/cli@latest assets add ./assets/miko.glb --name miko
+   * npx @aura3d/cli@latest assets add ./assets/luma.glb --name luma
+   * npx @aura3d/cli@latest assets validate-cartoon
+   */
+});

package/templates/episode-builder/src/builder.ts

@@ -0,0 +1,78 @@
+import { episode, publicCartoonAssetInstructions, typedCartoonAssetSummary } from "./episode";
+import { publishReadiness } from "./render-plan";
+
+export const episodeBuilderSupport = {
+  template: "episode-builder",
+  formats: [
+    { id: "short-form", label: "Short-form", targetMinutes: "1-3", beats: "3-5", locations: "single" },
+    { id: "standard", label: "Standard", targetMinutes: "5-7", beats: "8-12", locations: "multi" },
+    { id: "series-pilot", label: "Series pilot", targetMinutes: "10-15", beats: "12-20", locations: "multi" },
+    { id: "educational", label: "Educational", targetMinutes: "3-5", beats: "topic segments", locations: "guided" },
+    { id: "music-video", label: "Music video", targetMinutes: "2-4", beats: "song sections", locations: "choreographed" }
+  ] as const,
+  wizardSteps: [
+    { id: "prompt", label: "Prompt", complete: true },
+    { id: "format", label: "Format", complete: true },
+    { id: "characters", label: "Characters", complete: episode.episodePlan.characters.length >= 2 },
+    { id: "beats", label: "Beats", complete: episode.shotTimeline.shots.length >= 3 },
+    { id: "publish", label: "Publish", complete: publishReadiness.ready }
+  ] as const,
+  compiledEpisode: {
+    episodeId: episode.episodePlan.episodeId,
+    title: episode.episodePlan.title,
+    sourcePrompt: episode.episodePlan.production.sourcePrompt,
+    shotCount: episode.shotTimeline.shots.length,
+    captionCount: episode.captionTrack.cues.length,
+    renderQueueItems: episode.renderQueue.items.length
+  },
+  typedAssets: {
+    requiredCharacters: typedCartoonAssetSummary.requiredCharacterAssets,
+    missingCharacters: typedCartoonAssetSummary.missingCharacterAssets,
+    commands: publicCartoonAssetInstructions
+  }
+} as const;
+
+export function installEpisodeBuilderPanel(target: HTMLElement): void {
+  const panel = document.createElement("section");
+  panel.id = "episode-builder-panel";
+  panel.style.cssText = [
+    "position:fixed",
+    "left:18px",
+    "top:18px",
+    "width:min(390px,calc(100vw - 36px))",
+    "display:grid",
+    "gap:8px",
+    "padding:12px",
+    "border:1px solid rgba(248,255,242,0.22)",
+    "border-radius:8px",
+    "background:rgba(3,12,20,0.78)",
+    "color:#f8fff2",
+    "font:600 12px/1.25 system-ui,sans-serif",
+    "z-index:9"
+  ].join(";");
+
+  const format = document.createElement("select");
+  format.id = "episode-format";
+  format.style.cssText = "height:32px;border-radius:6px;background:#182d3f;color:#f8fff2;border:1px solid rgba(125,226,255,0.42)";
+  for (const option of episodeBuilderSupport.formats) {
+    const element = document.createElement("option");
+    element.value = option.id;
+    element.textContent = option.label;
+    format.appendChild(element);
+  }
+  panel.appendChild(format);
+
+  const steps = document.createElement("div");
+  steps.id = "episode-builder-steps";
+  steps.textContent = episodeBuilderSupport.wizardSteps.map((step) => `${step.label}:${step.complete ? "ready" : "needs evidence"}`).join(" | ");
+  steps.style.cssText = "color:#7de2ff;white-space:normal";
+  panel.appendChild(steps);
+
+  const compiled = document.createElement("div");
+  compiled.id = "episode-builder-compiled-plan";
+  compiled.textContent = `${episodeBuilderSupport.compiledEpisode.shotCount} shots | ${episodeBuilderSupport.compiledEpisode.captionCount} captions`;
+  compiled.style.cssText = "color:#f8fff2;white-space:normal";
+  panel.appendChild(compiled);
+
+  target.appendChild(panel);
+}

package/templates/episode-builder/src/characters.ts

@@ -0,0 +1,28 @@
+import { AURAVOICE_AURA3D_PROMPT_ANIMATION_CONTRACT_ID } from "./contract";
+
+export const characterContractId = AURAVOICE_AURA3D_PROMPT_ANIMATION_CONTRACT_ID;
+
+export const characters = [
+  {
+    id: "miko",
+    name: "Miko",
+    palette: ["#7de2ff", "#f7ffe8"],
+    primitiveFallback: "round robot with antenna",
+    typedAssetKey: "miko",
+    runtimeNodeId: "miko",
+    primitiveMouthNodeId: "miko:mouth",
+    performanceChannels: ["body", "facial", "gesture", "blocking", "gaze"],
+    glbUpgrade: "After assets add, use model(assets.miko) and keep viseme blendshape metadata."
+  },
+  {
+    id: "luma",
+    name: "Luma",
+    palette: ["#ffe18e", "#40ffbf"],
+    primitiveFallback: "small moon-garden helper",
+    typedAssetKey: "luma",
+    runtimeNodeId: "luma",
+    primitiveMouthNodeId: "luma:mouth",
+    performanceChannels: ["body", "facial", "gesture", "blocking", "gaze"],
+    glbUpgrade: "After assets add, use model(assets.luma) and keep viseme blendshape metadata."
+  }
+];

package/templates/episode-builder/src/contract.ts

@@ -0,0 +1 @@
+export const AURAVOICE_AURA3D_PROMPT_ANIMATION_CONTRACT_ID = "auravoice-aura3d-prompt-animation/v1" as const;