@aura3d/engine 1.4.4 → 1.5.0

package/templates/production-product-configurator/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "a3d-production-product-configurator",
+  "version": "0.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "vite build",
+    "preview": "vite preview --host 127.0.0.1"
+  },
+  "dependencies": {
+    "@aura3d/engine": "0.1.0-alpha.0"
+  },
+  "devDependencies": {
+    "typescript": "^5.9.3",
+    "vite": "^7.3.2"
+  }
+}

package/templates/production-product-configurator/src/main.ts

@@ -0,0 +1,16 @@
+import { runProductionExample } from "@aura3d/engine/workflows/production";
+
+void runProductionExample({
+  appId: "production-runtime-template-product-configurator",
+  sceneId: "product-configurator",
+  title: "Production Product Configurator",
+  workflow: "starter product configurator using imported GLB assets, HDR IBL, and production renderer metrics",
+  assets: [
+    { id: "damaged-helmet", label: "Damaged Helmet", file: "damaged-helmet.glb", role: "primary" },
+    { id: "boom-box", label: "Boom Box", file: "boom-box.glb", role: "secondary" }
+  ],
+  environment: { id: "studio-small-08", label: "Studio Small 08", file: "studio_small_08_1k.hdr", exposure: 1, intensity: 1.15, rotation: 0.15 },
+  postprocess: true,
+  webgpuReport: false,
+  expectedPostprocessChain: ["tone-mapping", "color-grade", "bloom", "fxaa"]
+});

package/templates/production-product-viewer/README.md

@@ -0,0 +1,7 @@
+# A3D Product Viewer
+
+This starter uses the public `@aura3d/engine/production-runtime` SDK directly. It loads a real GLB, loads a real HDR environment, creates a product viewer, renders with the A3D WebGL2 backend, and exposes a small viewer UI.
+
+It does not use low-level renderer code for product rendering.
+
+Before running outside this monorepo, serve or copy the files listed in `asset-manifest.json` under `/fixtures/production-runtime`.

package/templates/production-product-viewer/asset-manifest.json

@@ -0,0 +1,8 @@
+{
+  "schema": "a3d-production-template-assets",
+  "fetchInstructions": "Serve the listed files at /fixtures/production-runtime before running the template, or copy them into the same public path.",
+  "assets": [
+    { "id": "damaged-helmet", "path": "fixtures/asset-corpus/damaged-helmet.glb", "sha256": "4028ccbce11eb924936dad9bfee2af2aecf4b72203feb8a6b9dfdc458093e656" },
+    { "id": "studio-small-08", "path": "fixtures/environment-corpus/hdri/studio_small_08_1k.hdr", "sha256": "f6a989f89432eb4eee3191364a9c1ceed195c4ec3544173a3c04fd96cb91d0ba" }
+  ]
+}

package/templates/production-product-viewer/index.html

@@ -0,0 +1,26 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width,initial-scale=1">
+    <title>A3D Product Viewer</title>
+    <style>
+      body{margin:0;background:#0a0d10;color:#eef2f6;font-family:Inter,system-ui,sans-serif}.shell{display:grid;grid-template-columns:minmax(640px,1fr) 360px;min-height:100vh}canvas{width:100%;height:100vh;display:block;background:#07090c}.panel{display:grid;align-content:start;gap:12px;padding:18px;background:#111820;border-left:1px solid #27313b}.panel h1{font-size:18px;margin:0}.panel p{margin:0;color:#aab5c4;font-size:13px;line-height:1.4}.panel label{display:grid;gap:6px;font-size:12px;color:#d8e0eb}.panel button{border:1px solid #41506a;border-radius:6px;background:#1f6feb;color:white;font:inherit;font-weight:700;padding:10px 12px}.metrics{display:grid;gap:8px}.metrics span{border:1px solid #27313b;border-radius:6px;padding:8px;color:#c9d4e2;font-size:12px}@media(max-width:860px){.shell{grid-template-columns:1fr}canvas{height:auto;aspect-ratio:1}.panel{border-left:0;border-top:1px solid #27313b}}
+    </style>
+  </head>
+  <body>
+    <main class="shell">
+      <canvas id="viewport" width="960" height="960"></canvas>
+      <section class="panel">
+        <h1>A3D Product Viewer</h1>
+        <p>Public SDK starter with GLB loading, HDR environment lighting, orbit controls, exposure, IBL, postprocess, diagnostics, and screenshot capture.</p>
+        <label>Exposure <input id="exposure" type="range" min="0" max="3" step="0.05" value="1.08"></label>
+        <label>IBL <input id="ibl" type="range" min="0" max="3" step="0.05" value="1.2"></label>
+        <button id="orbit" type="button">Orbit</button>
+        <button id="capture" type="button">Capture PNG</button>
+        <div class="metrics" id="metrics"><span>Loading A3D renderer</span></div>
+      </section>
+    </main>
+    <script type="module" src="./src/main.ts"></script>
+  </body>
+</html>

package/templates/production-product-viewer/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "a3d-production-product-viewer",
+  "version": "0.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "vite build",
+    "preview": "vite preview --host 127.0.0.1"
+  },
+  "dependencies": {
+    "@aura3d/engine": "0.1.0-alpha.0"
+  },
+  "devDependencies": {
+    "typescript": "^5.9.3",
+    "vite": "^7.3.2"
+  }
+}

package/templates/production-product-viewer/src/main.ts

@@ -0,0 +1,70 @@
+import { createProductViewer, loadGltfScene, loadHdrEnvironment } from "@aura3d/engine/production-runtime";
+
+const canvas = document.getElementById("viewport");
+const metrics = document.getElementById("metrics");
+if (!(canvas instanceof HTMLCanvasElement) || !(metrics instanceof HTMLElement)) {
+  throw new Error("A3D Product Viewer requires canvas#viewport and #metrics.");
+}
+
+const asset = await loadGltfScene({
+  url: "/fixtures/asset-corpus/damaged-helmet.glb",
+  assetId: "damaged-helmet",
+  assetName: "Damaged Helmet",
+  viewport: { width: canvas.width, height: canvas.height }
+});
+const environment = await loadHdrEnvironment({
+  url: "/fixtures/environment-corpus/hdri/studio_small_08_1k.hdr",
+  id: "studio-small-08",
+  label: "Studio Small 08",
+  intensity: 1.2,
+  toneMapping: { operator: "filmic", exposure: 1.08, whitePoint: 11.2 }
+});
+const viewer = await createProductViewer({
+  canvas,
+  asset,
+  environment,
+  backend: "webgl2",
+  width: canvas.width,
+  height: canvas.height,
+  camera: { preset: "product-hero", orbit: true },
+  lighting: { ibl: true, shadows: true },
+  postprocess: { toneMapping: "filmic", bloom: true, fxaa: true }
+});
+
+function render(label = "ready"): void {
+  const result = viewer.render();
+  const diagnostics = viewer.diagnostics();
+  metrics.innerHTML = `
+    <span>${label}</span>
+    <span>${result.proof.diagnostics.drawCalls} draw calls</span>
+    <span>${asset.metadata.materialCount} materials</span>
+    <span>${asset.metadata.textureCount} textures</span>
+    <span>${diagnostics.settings.exposure.toFixed(2)} exposure</span>
+    <span>${diagnostics.settings.iblIntensity.toFixed(2)} IBL</span>
+  `;
+}
+
+document.getElementById("exposure")?.addEventListener("input", (event) => {
+  viewer.setSettings({ exposure: Number((event.target as HTMLInputElement).value) });
+  render("exposure changed");
+});
+document.getElementById("ibl")?.addEventListener("input", (event) => {
+  viewer.setSettings({ iblIntensity: Number((event.target as HTMLInputElement).value) });
+  render("IBL changed");
+});
+document.getElementById("orbit")?.addEventListener("click", () => {
+  viewer.controls.rotate(0.2, 0);
+  render("orbit");
+});
+document.getElementById("capture")?.addEventListener("click", () => {
+  window.__a3dProductViewerCapture = viewer.captureScreenshot();
+  render("captured");
+});
+
+declare global {
+  interface Window {
+    __a3dProductViewerCapture?: string;
+  }
+}
+
+render();