@bitmagic/cli 0.1.60-dev.1 → 0.1.60-dev.3

package/dist/editor/motion-panel.d.ts

@@ -11,10 +11,10 @@
  * Same template-literal rules as the host: **no backticks**, no regex literals starting with a
  * dot-escape, every colour a `--bm-*` token — `shell-page.test.ts` enforces all three.
  */
-export declare const MOTION_PANEL_CSS = "\n  /* Level with the other dialogs: each opens from its own control and they never stack. */\n  #motion-overlay { z-index: 10; }\n  #motion-dialog { width: min(520px, 94vw); padding: 20px; }\n  #motion-dialog .bm-label { display: block; margin: 14px 0 6px; }\n  #motion-stage { position: relative; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden;\n                  background: var(--bm-surface-alt); border: 1px solid var(--bm-border-muted); }\n  #motion-preview { width: 100%; height: 100%; object-fit: contain; background: #000000; display: block; }\n  #motion-preview.mirror { transform: scaleX(-1); }\n  #motion-timer { position: absolute; top: 10px; left: 10px; display: none; padding: 3px 10px;\n                  border-radius: 999px; background: var(--bm-pink); color: #ffffff; font-size: 12px;\n                  font-family: var(--bm-font-mono); }\n  #motion-timer.show { display: inline-block; }\n  #motion-countdown { position: absolute; inset: 0; display: none; flex-direction: column; align-items: center;\n                      justify-content: center; gap: 6px; background: var(--bm-scrim); pointer-events: none; }\n  #motion-countdown.show { display: flex; }\n  #motion-countdown-number { font-size: 96px; font-weight: 700; line-height: 1; color: #ffffff; }\n  #motion-countdown-hint { font-size: 13px; color: #ffffff; opacity: 0.85; }\n  #motion-hint { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;\n                 text-align: center; padding: 20px; font-size: 13px; color: var(--bm-text-muted); }\n  #motion-hint.hidden { display: none; }\n  #motion-trim { display: none; margin-top: 10px; }\n  #motion-trim.show { display: block; }\n  #motion-trimbar { position: relative; height: 14px; border-radius: 7px; background: var(--bm-surface-alt);\n                    touch-action: none; }\n  #motion-trim-kept { position: absolute; top: 0; bottom: 0; border-radius: 7px; background: var(--bm-aqua); }\n  #motion-trim-playhead { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--bm-pink);\n                          pointer-events: none; }\n  .motion-trim-handle { position: absolute; top: 50%; width: 14px; height: 22px;\n                        transform: translate(-50%, -50%); border-radius: 5px; background: var(--bm-text);\n                        cursor: ew-resize; touch-action: none; }\n  #motion-trim-row { display: flex; align-items: center; justify-content: space-between; gap: 8px;\n                     margin-top: 6px; min-height: 24px; }\n  #motion-trim-note { font-size: 11px; color: var(--bm-text-muted); }\n  #motion-sources { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }\n  #motion-file { display: none; }\n  #motion-guidance { margin: 10px 0 0; font-size: 12px; color: var(--bm-text-muted); }\n  #motion-options { display: grid; grid-template-columns: 1fr auto; gap: 10px 12px; align-items: end; }\n  #motion-name, #motion-slot { width: 100%; }\n  .motion-check { display: flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 13px; cursor: pointer; }\n  .motion-check input { accent-color: var(--bm-aqua); }\n  #motion-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }\n  #motion-note { display: none; margin-top: 12px; padding: 12px; border-radius: 6px; font-size: 12px;\n                 background: var(--bm-surface-alt); border: 1px solid var(--bm-border-muted);\n                 color: var(--bm-text-muted); }\n  #motion-note.show { display: block; }\n  #motion-note code { display: block; margin-top: 6px; color: var(--bm-aqua);\n                      font-family: var(--bm-font-mono); word-break: break-all; }\n";
-export declare const MOTION_PANEL_HTML = "  <div id=\"motion-overlay\" class=\"bm-overlay\">\n    <div id=\"motion-dialog\" class=\"bm-dialog\">\n      <h2>Record a motion</h2>\n      <p>Perform the move on camera, or pick a video. Uthana turns it into an animation clip for\n         this game's characters. Costs sparks.</p>\n      <div id=\"motion-stage\">\n        <video id=\"motion-preview\" playsinline muted></video>\n        <span id=\"motion-timer\">0:00</span>\n        <div id=\"motion-countdown\"><span id=\"motion-countdown-number\">3</span><span id=\"motion-countdown-hint\">Get in frame</span></div>\n        <div id=\"motion-hint\">Whole body in frame, one person, plain background, good light.\n          2&ndash;60 seconds.</div>\n      </div>\n      <div id=\"motion-trim\">\n        <div id=\"motion-trimbar\" title=\"Drag the handles to choose what the animation is made from\">\n          <div id=\"motion-trim-kept\"></div>\n          <div id=\"motion-trim-playhead\"></div>\n          <div id=\"motion-trim-start\" class=\"motion-trim-handle\"></div>\n          <div id=\"motion-trim-end\" class=\"motion-trim-handle\"></div>\n        </div>\n        <div id=\"motion-trim-row\">\n          <span id=\"motion-trim-note\"></span>\n          <button id=\"motion-trim-full\" class=\"bm-pill bm-pill--ghost\" type=\"button\" hidden>Use full clip</button>\n        </div>\n      </div>\n      <div id=\"motion-sources\">\n        <button id=\"motion-record\" class=\"bm-pill bm-pill--primary\" type=\"button\">Record with webcam</button>\n        <button id=\"motion-stop\" class=\"bm-pill\" type=\"button\" hidden>Stop</button>\n        <button id=\"motion-pick\" class=\"bm-pill\" type=\"button\">Choose a video&hellip;</button>\n        <button id=\"motion-retake\" class=\"bm-pill bm-pill--ghost\" type=\"button\" hidden>Start over</button>\n        <input id=\"motion-file\" type=\"file\" accept=\".mp4,.mov,.avi,.webm,video/mp4,video/quicktime,video/webm\">\n      </div>\n      <p id=\"motion-guidance\"></p>\n      <div id=\"motion-options\">\n        <div>\n          <label class=\"bm-label\" for=\"motion-name\">Name</label>\n          <input id=\"motion-name\" class=\"bm-input\" type=\"text\" placeholder=\"e.g. Victory dance\" maxlength=\"80\">\n        </div>\n        <div>\n          <label class=\"bm-label\" for=\"motion-slot\">Use as</label>\n          <select id=\"motion-slot\" class=\"bm-input\">\n            <option value=\"\">One-shot clip</option>\n            <option value=\"idle\">Idle</option>\n            <option value=\"walk\">Walk</option>\n            <option value=\"run\">Run</option>\n          </select>\n        </div>\n      </div>\n      <label class=\"motion-check\"><input id=\"motion-loop\" type=\"checkbox\"> Loops</label>\n      <div id=\"motion-actions\">\n        <button id=\"motion-close\" class=\"bm-pill bm-pill--ghost\" type=\"button\">Close</button>\n        <button id=\"motion-submit\" class=\"bm-pill bm-pill--primary\" type=\"button\" disabled>Make the animation</button>\n      </div>\n      <div id=\"motion-note\">\n        <span id=\"motion-note-text\"></span>\n        <code id=\"motion-command\"></code>\n      </div>\n    </div>\n  </div>\n";
+export declare const MOTION_PANEL_CSS = "\n  /* Level with the other dialogs: each opens from its own control and they never stack. */\n  #motion-overlay { z-index: 10; }\n  #motion-dialog { width: min(520px, 94vw); padding: 20px; }\n  #motion-dialog .bm-label { display: block; margin: 14px 0 6px; }\n  #motion-stage { position: relative; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden;\n                  background: var(--bm-surface-alt); border: 1px solid var(--bm-border-muted); }\n  #motion-preview { width: 100%; height: 100%; object-fit: contain; background: #000000; display: block; }\n  #motion-preview.mirror { transform: scaleX(-1); }\n  #motion-timer { position: absolute; top: 10px; left: 10px; display: none; padding: 3px 10px;\n                  border-radius: 999px; background: var(--bm-pink); color: #ffffff; font-size: 12px;\n                  font-family: var(--bm-font-mono); }\n  #motion-timer.show { display: inline-block; }\n  #motion-countdown { position: absolute; inset: 0; display: none; flex-direction: column; align-items: center;\n                      justify-content: center; gap: 6px; background: var(--bm-scrim); pointer-events: none; }\n  #motion-countdown.show { display: flex; }\n  #motion-countdown-number { font-size: 96px; font-weight: 700; line-height: 1; color: #ffffff; }\n  #motion-countdown-hint { font-size: 13px; color: #ffffff; opacity: 0.85; }\n  #motion-hint { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;\n                 text-align: center; padding: 20px; font-size: 13px; color: var(--bm-text-muted); }\n  #motion-hint.hidden { display: none; }\n  #motion-trim { display: none; margin-top: 10px; }\n  #motion-trim.show { display: block; }\n  #motion-trimbar { position: relative; height: 14px; border-radius: 7px; background: var(--bm-surface-alt);\n                    touch-action: none; }\n  #motion-trim-kept { position: absolute; top: 0; bottom: 0; border-radius: 7px; background: var(--bm-aqua); }\n  #motion-trim-playhead { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--bm-pink);\n                          pointer-events: none; }\n  .motion-trim-handle { position: absolute; top: 50%; width: 14px; height: 22px;\n                        transform: translate(-50%, -50%); border-radius: 5px; background: var(--bm-text);\n                        cursor: ew-resize; touch-action: none; }\n  #motion-trim-row { display: flex; align-items: center; justify-content: space-between; gap: 8px;\n                     margin-top: 6px; min-height: 24px; }\n  #motion-trim-note { font-size: 11px; color: var(--bm-text-muted); }\n  #motion-trim-actions { display: flex; gap: 6px; }\n  #motion-sources { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }\n  #motion-file { display: none; }\n  #motion-guidance { margin: 10px 0 0; font-size: 12px; color: var(--bm-text-muted); }\n  #motion-options { display: grid; grid-template-columns: 1fr auto; gap: 10px 12px; align-items: end; }\n  #motion-name, #motion-slot { width: 100%; }\n  .motion-check { display: flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 13px; cursor: pointer; }\n  .motion-check input { accent-color: var(--bm-aqua); }\n  #motion-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }\n  #motion-note { display: none; margin-top: 12px; padding: 12px; border-radius: 6px; font-size: 12px;\n                 background: var(--bm-surface-alt); border: 1px solid var(--bm-border-muted);\n                 color: var(--bm-text-muted); }\n  #motion-note.show { display: block; }\n  #motion-note code { display: block; margin-top: 6px; color: var(--bm-aqua);\n                      font-family: var(--bm-font-mono); word-break: break-all; }\n";
+export declare const MOTION_PANEL_HTML = "  <div id=\"motion-overlay\" class=\"bm-overlay\">\n    <div id=\"motion-dialog\" class=\"bm-dialog\">\n      <h2>Record a motion</h2>\n      <p>Perform the move on camera, or pick a video. Uthana turns it into an animation clip for\n         this game's characters. Costs sparks.</p>\n      <div id=\"motion-stage\">\n        <video id=\"motion-preview\" playsinline muted></video>\n        <span id=\"motion-timer\">0:00</span>\n        <div id=\"motion-countdown\"><span id=\"motion-countdown-number\">3</span><span id=\"motion-countdown-hint\">Get in frame</span></div>\n        <div id=\"motion-hint\">Whole body in frame, one person, plain background, good light.\n          2&ndash;60 seconds.</div>\n      </div>\n      <div id=\"motion-trim\">\n        <div id=\"motion-trimbar\" title=\"Drag the handles to choose what the animation is made from\">\n          <div id=\"motion-trim-kept\"></div>\n          <div id=\"motion-trim-playhead\"></div>\n          <div id=\"motion-trim-start\" class=\"motion-trim-handle\"></div>\n          <div id=\"motion-trim-end\" class=\"motion-trim-handle\"></div>\n        </div>\n        <div id=\"motion-trim-row\">\n          <span id=\"motion-trim-note\"></span>\n          <span id=\"motion-trim-actions\">\n            <button id=\"motion-trim-preview\" class=\"bm-pill\" type=\"button\">&#9654; Play</button>\n            <button id=\"motion-trim-full\" class=\"bm-pill bm-pill--ghost\" type=\"button\" hidden>Use full clip</button>\n          </span>\n        </div>\n      </div>\n      <div id=\"motion-sources\">\n        <button id=\"motion-record\" class=\"bm-pill bm-pill--primary\" type=\"button\">Record with webcam</button>\n        <button id=\"motion-stop\" class=\"bm-pill\" type=\"button\" hidden>Stop</button>\n        <button id=\"motion-pick\" class=\"bm-pill\" type=\"button\">Choose a video&hellip;</button>\n        <button id=\"motion-retake\" class=\"bm-pill bm-pill--ghost\" type=\"button\" hidden>Start over</button>\n        <input id=\"motion-file\" type=\"file\" accept=\".mp4,.mov,.avi,.webm,video/mp4,video/quicktime,video/webm\">\n      </div>\n      <p id=\"motion-guidance\"></p>\n      <div id=\"motion-options\">\n        <div>\n          <label class=\"bm-label\" for=\"motion-name\">Name</label>\n          <input id=\"motion-name\" class=\"bm-input\" type=\"text\" placeholder=\"e.g. Victory dance\" maxlength=\"80\">\n        </div>\n        <div>\n          <label class=\"bm-label\" for=\"motion-slot\">Use as</label>\n          <select id=\"motion-slot\" class=\"bm-input\">\n            <option value=\"\">One-shot clip</option>\n            <option value=\"idle\">Idle</option>\n            <option value=\"walk\">Walk</option>\n            <option value=\"run\">Run</option>\n          </select>\n        </div>\n      </div>\n      <label class=\"motion-check\"><input id=\"motion-loop\" type=\"checkbox\"> Loops</label>\n      <div id=\"motion-actions\">\n        <button id=\"motion-close\" class=\"bm-pill bm-pill--ghost\" type=\"button\">Close</button>\n        <button id=\"motion-submit\" class=\"bm-pill bm-pill--primary\" type=\"button\" disabled>Make the animation</button>\n      </div>\n      <div id=\"motion-note\">\n        <span id=\"motion-note-text\"></span>\n        <code id=\"motion-command\"></code>\n      </div>\n    </div>\n  </div>\n";
 /**
  * Behaviour, spliced into the shell's IIFE. Runs after the shell's own helpers are defined, so
  * `setStatus`, `start`, `autoReload`, `banner` and `frame` are in scope.
  */
-export declare const MOTION_PANEL_JS = "\n  // ---- Record motion: webcam or file -> Uthana video-to-motion -> assets[] ----------------------\n  var motionToggle = document.getElementById('motion');\n  var motionOverlay = document.getElementById('motion-overlay');\n  var motionPreview = document.getElementById('motion-preview');\n  var motionTimer = document.getElementById('motion-timer');\n  var motionCountdown = document.getElementById('motion-countdown');\n  var motionCountdownNumber = document.getElementById('motion-countdown-number');\n  /** Seconds shown on the live preview before the recorder starts, so the first frames are the pose. */\n  var MOTION_COUNTDOWN_S = 3;\n  var motionCountdownToken = 0;\n  var motionHint = document.getElementById('motion-hint');\n  var motionRecordBtn = document.getElementById('motion-record');\n  var motionStopBtn = document.getElementById('motion-stop');\n  var motionPickBtn = document.getElementById('motion-pick');\n  var motionRetakeBtn = document.getElementById('motion-retake');\n  var motionFile = document.getElementById('motion-file');\n  var motionGuidance = document.getElementById('motion-guidance');\n  var motionName = document.getElementById('motion-name');\n  var motionSlot = document.getElementById('motion-slot');\n  var motionLoop = document.getElementById('motion-loop');\n  var motionSubmit = document.getElementById('motion-submit');\n  var motionNote = document.getElementById('motion-note');\n  var MOTION_MIN_S = 2;\n  var MOTION_MAX_S = 60;\n  var MOTION_MAX_BYTES = 200 * 1024 * 1024;\n  var motionBlob = null;\n  // Whether motionBlob came from the webcam recorder (auto-trim applies) or a picked file (it does not).\n  var motionFromRecording = false;\n  var motionSeconds = 0;\n  var motionStream = null;\n  var motionRecorder = null;\n  var motionChunks = [];\n  var motionTickTimer = null;\n  var motionStartedAt = 0;\n  var motionObjectUrl = null;\n  // ---- Trim window: seeded by the sidecar's trim analysis, adjusted on the handles ------------\n  var motionTrimWrap = document.getElementById('motion-trim');\n  var motionTrimBar = document.getElementById('motion-trimbar');\n  var motionTrimKept = document.getElementById('motion-trim-kept');\n  var motionTrimPlayhead = document.getElementById('motion-trim-playhead');\n  var motionTrimStartHandle = document.getElementById('motion-trim-start');\n  var motionTrimEndHandle = document.getElementById('motion-trim-end');\n  var motionTrimNote = document.getElementById('motion-trim-note');\n  var motionTrimFullBtn = document.getElementById('motion-trim-full');\n  var MOTION_TRIM_MIN_KEPT_S = 2;\n  var motionTrimDuration = 0;\n  var motionTrimStart = 0;\n  var motionTrimEnd = 0;\n  var motionPendingId = null;\n  var motionAnalysisState = 'idle';\n  var motionAnalysisToken = 0;\n  var motionAnalyzePollTimer = null;\n\n  function motionHasTrim() {\n    return motionTrimDuration > 0 && motionTrimEnd > motionTrimStart\n      && (motionTrimStart >= 0.1 || motionTrimDuration - motionTrimEnd >= 0.1);\n  }\n\n  function renderMotionTrim() {\n    if (motionTrimDuration <= 0) { motionTrimWrap.classList.remove('show'); return; }\n    motionTrimWrap.classList.add('show');\n    var pct = function (seconds) {\n      return Math.min(Math.max(seconds / motionTrimDuration, 0), 1) * 100 + '%';\n    };\n    motionTrimKept.style.left = pct(motionTrimStart);\n    motionTrimKept.style.width = Math.max(0, (motionTrimEnd - motionTrimStart) / motionTrimDuration) * 100 + '%';\n    motionTrimStartHandle.style.left = pct(motionTrimStart);\n    motionTrimEndHandle.style.left = pct(motionTrimEnd);\n    motionTrimFullBtn.hidden = !motionHasTrim();\n    var note;\n    if (motionAnalysisState === 'running') {\n      note = 'Analyzing the clip for a good trim\u2026';\n    } else if (!motionHasTrim()) {\n      note = 'Using the full clip.';\n    } else {\n      var parts = [];\n      if (motionTrimStart >= 0.1) parts.push(motionTrimStart.toFixed(1) + 's from the start');\n      if (motionTrimDuration - motionTrimEnd >= 0.1) parts.push((motionTrimDuration - motionTrimEnd).toFixed(1) + 's from the end');\n      note = 'Trimming ' + parts.join(' and ') + '.';\n    }\n    motionTrimNote.textContent = note;\n  }\n\n  function resetMotionTrim() {\n    motionAnalysisToken++;\n    if (motionAnalyzePollTimer) { clearTimeout(motionAnalyzePollTimer); motionAnalyzePollTimer = null; }\n    motionPendingId = null;\n    motionAnalysisState = 'idle';\n    motionTrimDuration = 0;\n    motionTrimStart = 0;\n    motionTrimEnd = 0;\n    motionTrimWrap.classList.remove('show');\n  }\n\n  function seedMotionTrim(durationSeconds) {\n    if (!(durationSeconds > 0)) return;\n    motionTrimDuration = durationSeconds;\n    motionTrimStart = 0;\n    motionTrimEnd = durationSeconds;\n    renderMotionTrim();\n  }\n\n  function applyMotionSuggestion(suggestion) {\n    if (!suggestion) { renderMotionTrim(); return; }\n    if (suggestion.durationSeconds > 0) {\n      motionTrimDuration = suggestion.durationSeconds;\n      motionTrimStart = 0;\n      motionTrimEnd = suggestion.durationSeconds;\n    }\n    if (suggestion.confidence === 'high'\n        && typeof suggestion.suggestedStartSeconds === 'number'\n        && typeof suggestion.suggestedEndSeconds === 'number'\n        && suggestion.suggestedEndSeconds > suggestion.suggestedStartSeconds) {\n      motionTrimStart = suggestion.suggestedStartSeconds;\n      motionTrimEnd = Math.min(suggestion.suggestedEndSeconds, motionTrimDuration || suggestion.suggestedEndSeconds);\n    }\n    renderMotionTrim();\n  }\n\n  function beginMotionTrimDrag(which, event) {\n    if (motionTrimDuration <= 0) return;\n    var handle = event.currentTarget;\n    handle.setPointerCapture(event.pointerId);\n    var move = function (e) {\n      var rect = motionTrimBar.getBoundingClientRect();\n      if (rect.width === 0) return;\n      var at = Math.min(Math.max((e.clientX - rect.left) / rect.width, 0), 1) * motionTrimDuration;\n      if (which === 'start') motionTrimStart = Math.min(at, motionTrimEnd - MOTION_TRIM_MIN_KEPT_S);\n      else motionTrimEnd = Math.max(at, motionTrimStart + MOTION_TRIM_MIN_KEPT_S);\n      renderMotionTrim();\n    };\n    var up = function () {\n      handle.removeEventListener('pointermove', move);\n      handle.removeEventListener('pointerup', up);\n      handle.removeEventListener('pointercancel', up);\n    };\n    handle.addEventListener('pointermove', move);\n    handle.addEventListener('pointerup', up);\n    handle.addEventListener('pointercancel', up);\n    event.preventDefault();\n  }\n\n  function pollMotionAnalysis(token) {\n    var tick = async function () {\n      if (token !== motionAnalysisToken) return;\n      var payload;\n      try {\n        payload = await (await fetch('/api/editor/motion-analyze-status')).json();\n      } catch (error) {\n        motionAnalyzePollTimer = setTimeout(tick, 2000);\n        return;\n      }\n      if (token !== motionAnalysisToken) return;\n      if (payload && payload.status === 'done') {\n        motionAnalysisState = 'done';\n        applyMotionSuggestion(payload.suggestion);\n        return;\n      }\n      if (payload && payload.status === 'running') {\n        motionAnalyzePollTimer = setTimeout(tick, 2000);\n        return;\n      }\n      // failed / unavailable / none: no suggestion, the full-range handles stand.\n      motionAnalysisState = 'failed';\n      renderMotionTrim();\n    };\n    motionAnalyzePollTimer = setTimeout(tick, 2000);\n  }\n\n  /**\n   * Hand the clip to the sidecar ahead of submission: it uploads once and runs the unbilled trim\n   * analysis while the creator reviews. Degraded, never blocking \u2014 any failure just leaves the\n   * handles at full range, and Submit works throughout.\n   */\n  async function startMotionAnalysis(blob) {\n    var token = ++motionAnalysisToken;\n    motionPendingId = null;\n    motionAnalysisState = 'running';\n    renderMotionTrim();\n    var result = null;\n    try {\n      var response = await fetch('/api/editor/motion-analyze', {\n        method: 'POST',\n        headers: { 'Content-Type': blob.type || 'video/webm' },\n        body: blob\n      });\n      result = await response.json();\n    } catch (error) { /* the sidecar said nothing; treat as unavailable */ }\n    if (token !== motionAnalysisToken) return;\n    if (!result || result.ok !== true || result.analysing !== true) {\n      motionAnalysisState = 'idle';\n      renderMotionTrim();\n      return;\n    }\n    motionPendingId = result.pendingId || null;\n    pollMotionAnalysis(token);\n  }\n\n  function motionSupported() {\n    return !!(window.isSecureContext && navigator.mediaDevices && navigator.mediaDevices.getUserMedia\n      && typeof MediaRecorder !== 'undefined');\n  }\n\n  /** mp4 first (Safari), then the WebM the rest produce; asset-forger re-encodes either. */\n  function pickMotionMime() {\n    var candidates = ['video/mp4', 'video/webm;codecs=vp9', 'video/webm'];\n    for (var i = 0; i < candidates.length; i++) {\n      if (MediaRecorder.isTypeSupported(candidates[i])) return candidates[i];\n    }\n    return '';\n  }\n\n  function motionCameraError(error) {\n    var name = error && error.name;\n    if (name === 'NotAllowedError' || name === 'SecurityError') return 'Camera access was refused. Allow it in the address bar, or choose a video file.';\n    if (name === 'NotFoundError' || name === 'OverconstrainedError') return 'No camera found. Choose a video file instead.';\n    if (name === 'NotReadableError') return 'The camera is in use by another app. Close it, or choose a video file.';\n    return 'Could not start the camera: ' + ((error && error.message) || 'unknown error');\n  }\n\n  function formatMotionClock(seconds) {\n    var s = Math.max(0, Math.floor(seconds));\n    var rest = s % 60;\n    return Math.floor(s / 60) + ':' + (rest < 10 ? '0' : '') + rest;\n  }\n\n  function showMotionNote(text, command) {\n    document.getElementById('motion-note-text').textContent = text;\n    document.getElementById('motion-command').textContent = command || '';\n    motionNote.classList.add('show');\n  }\n\n  function releaseMotionObjectUrl() {\n    if (motionObjectUrl) { URL.revokeObjectURL(motionObjectUrl); motionObjectUrl = null; }\n  }\n\n  /** Stop the recorder if one is still live \u2014 it may already have stopped itself. */\n  function discardMotionRecorder() {\n    if (motionRecorder && motionRecorder.state !== 'inactive') {\n      try { motionRecorder.stop(); } catch (error) { /* already stopped */ }\n    }\n  }\n\n  function stopMotionStream() {\n    if (motionStream) {\n      motionStream.getTracks().forEach(function (track) { track.stop(); });\n      motionStream = null;\n    }\n    if (motionTickTimer) { clearInterval(motionTickTimer); motionTickTimer = null; }\n    motionCountdownToken++;\n    motionCountdown.classList.remove('show');\n    motionTimer.classList.remove('show');\n    motionPreview.classList.remove('mirror');\n  }\n\n  function setMotionButtons(state) {\n    motionRecordBtn.hidden = state !== 'idle';\n    motionPickBtn.hidden = state !== 'idle';\n    motionStopBtn.hidden = state !== 'recording';\n    motionRetakeBtn.hidden = state !== 'ready';\n    motionSubmit.disabled = state !== 'ready';\n  }\n\n  function resetMotionPanel() {\n    resetMotionTrim();\n    stopMotionStream();\n    discardMotionRecorder();\n    motionRecorder = null;\n    motionChunks = [];\n    motionBlob = null;\n    motionFromRecording = false;\n    motionSeconds = 0;\n    releaseMotionObjectUrl();\n    motionPreview.srcObject = null;\n    motionPreview.removeAttribute('src');\n    motionPreview.controls = false;\n    motionPreview.muted = true;\n    motionHint.classList.remove('hidden');\n    var supported = motionSupported();\n    motionGuidance.textContent = supported ? '' : 'Webcam recording needs a secure page with a camera; choose a video file instead.';\n    motionRecordBtn.disabled = !supported;\n    motionNote.classList.remove('show');\n    setMotionButtons('idle');\n  }\n\n  function openMotionPanel() {\n    resetMotionPanel();\n    motionOverlay.classList.add('show');\n    motionName.focus();\n  }\n\n  /** Returns whether it was open \u2014 the Escape handler's contract, like closeAssetDetail. */\n  function closeMotionPanel() {\n    if (!motionOverlay.classList.contains('show')) return false;\n    stopMotionStream();\n    discardMotionRecorder();\n    motionOverlay.classList.remove('show');\n    frame.focus();\n    return true;\n  }\n\n  /** The clip is in hand: show it back, and say whether it is within Uthana's 2-60 s window. */\n  function acceptMotionClip(blob, seconds) {\n    motionBlob = blob;\n    motionSeconds = seconds;\n    releaseMotionObjectUrl();\n    motionObjectUrl = URL.createObjectURL(blob);\n    motionPreview.srcObject = null;\n    motionPreview.src = motionObjectUrl;\n    motionPreview.controls = true;\n    motionPreview.muted = true;\n    motionHint.classList.add('hidden');\n    var note;\n    if (blob.size > MOTION_MAX_BYTES) note = 'That video is over 200 MB. Trim it to the seconds that matter.';\n    else if (seconds > 0 && seconds < MOTION_MIN_S) note = 'Too short: Uthana needs at least ' + MOTION_MIN_S + ' seconds.';\n    else if (seconds > MOTION_MAX_S) note = 'Too long: Uthana takes at most ' + MOTION_MAX_S + ' seconds. Trim it, or record again.';\n    var ok = !note;\n    motionGuidance.textContent = ok\n      ? (seconds > 0 ? formatMotionClock(seconds) + ' of video ready.' : 'Video ready.')\n      : note;\n    setMotionButtons('ready');\n    motionSubmit.disabled = !ok;\n    resetMotionTrim();\n    if (ok) {\n      seedMotionTrim(seconds);\n      // A fresh WebM often reports no duration; the preview's metadata is the fallback scale.\n      motionPreview.onloadedmetadata = function () {\n        if (motionTrimDuration === 0 && isFinite(motionPreview.duration) && motionPreview.duration > 0) {\n          seedMotionTrim(motionPreview.duration);\n        }\n      };\n      void startMotionAnalysis(blob);\n    }\n  }\n\n  async function startMotionRecording() {\n    if (!motionSupported()) return;\n    motionNote.classList.remove('show');\n    try {\n      motionStream = await navigator.mediaDevices.getUserMedia({\n        video: { width: { ideal: 1280 }, height: { ideal: 720 }, facingMode: 'user' }, audio: false\n      });\n    } catch (error) {\n      motionGuidance.textContent = motionCameraError(error);\n      return;\n    }\n    releaseMotionObjectUrl();\n    motionPreview.removeAttribute('src');\n    motionPreview.controls = false;\n    motionPreview.srcObject = motionStream;\n    motionPreview.classList.add('mirror');\n    motionHint.classList.add('hidden');\n    try { await motionPreview.play(); } catch (error) { /* autoplay refused; the stream still shows on interaction */ }\n    var mime = pickMotionMime();\n    try {\n      motionRecorder = mime ? new MediaRecorder(motionStream, { mimeType: mime }) : new MediaRecorder(motionStream);\n    } catch (error) {\n      stopMotionStream();\n      motionGuidance.textContent = 'This browser cannot record video. Choose a video file instead.';\n      return;\n    }\n    // Count down on the live preview; Stop during the count aborts without recording.\n    var token = ++motionCountdownToken;\n    setMotionButtons('recording');\n    motionGuidance.textContent = 'Get in frame \u2014 recording starts after the count.';\n    motionCountdown.classList.add('show');\n    for (var left = MOTION_COUNTDOWN_S; left > 0; left--) {\n      motionCountdownNumber.textContent = String(left);\n      await new Promise(function (resolve) { setTimeout(resolve, 1000); });\n      if (token !== motionCountdownToken) return;\n    }\n    motionCountdown.classList.remove('show');\n    motionChunks = [];\n    motionRecorder.ondataavailable = function (event) { if (event.data && event.data.size > 0) motionChunks.push(event.data); };\n    motionRecorder.onstop = function () {\n      var seconds = (Date.now() - motionStartedAt) / 1000;\n      var type = motionRecorder.mimeType || mime || 'video/webm';\n      stopMotionStream();\n      motionFromRecording = true;\n      acceptMotionClip(new Blob(motionChunks, { type: type }), seconds);\n    };\n    motionStartedAt = Date.now();\n    motionRecorder.start(1000);\n    motionTimer.textContent = '0:00';\n    motionTimer.classList.add('show');\n    motionGuidance.textContent = 'Recording. Stop when the move is done (auto-stops at ' + MOTION_MAX_S + ' s).';\n    motionTickTimer = setInterval(function () {\n      var elapsed = (Date.now() - motionStartedAt) / 1000;\n      motionTimer.textContent = formatMotionClock(elapsed);\n      if (elapsed >= MOTION_MAX_S) stopMotionRecording();\n    }, 250);\n  }\n\n  function stopMotionRecording() {\n    if (motionRecorder && motionRecorder.state === 'recording') { motionRecorder.stop(); return; }\n    // Stop pressed during the countdown: nothing was recorded, back to the start.\n    if (motionCountdown.classList.contains('show')) resetMotionPanel();\n  }\n\n  function pickMotionFile(file) {\n    if (!file) return;\n    // Read the duration off the file itself; a picked video knows its length, a fresh WebM often\n    // does not (Infinity), so 0 means \"unknown\" and the server's ffprobe is the judge.\n    var probe = document.createElement('video');\n    probe.preload = 'metadata';\n    var url = URL.createObjectURL(file);\n    var settled = false;\n    var finish = function (seconds) {\n      if (settled) return;\n      settled = true;\n      URL.revokeObjectURL(url);\n      motionFromRecording = false;\n      acceptMotionClip(file, seconds);\n    };\n    probe.onloadedmetadata = function () { finish(isFinite(probe.duration) ? probe.duration : 0); };\n    probe.onerror = function () { finish(0); };\n    probe.src = url;\n    setTimeout(function () { finish(0); }, 3000);\n  }\n\n  var motionPollTimer = null;\n  function pollMotionJob() {\n    if (motionPollTimer) clearTimeout(motionPollTimer);\n    var tick = async function () {\n      var job;\n      try {\n        job = (await (await fetch('/api/editor/motion-status')).json()).job;\n      } catch (error) {\n        motionPollTimer = setTimeout(tick, 3000);\n        return;\n      }\n      if (!job) return;\n      if (job.status === 'running') {\n        showMotionNote(job.message, '');\n        setStatus('saving', 'Making the animation\u2026');\n        motionPollTimer = setTimeout(tick, 3000);\n        return;\n      }\n      if (job.status === 'failed') {\n        showMotionNote('Could not make the animation: ' + job.message, '');\n        setStatus('error', 'Animation failed');\n        setMotionButtons('ready');\n        return;\n      }\n      showMotionNote(job.message + ' Reloading to show it.', '');\n      setStatus('saved', 'Animation added');\n      setMotionButtons('ready');\n      if (autoReload && !voxelSessionActive && !voxelSessionPending) start();\n      else banner.classList.add('show');\n    };\n    void tick();\n  }\n\n  async function submitMotion() {\n    if (!motionBlob) return;\n    var name = motionName.value.trim();\n    if (name === '') { motionName.focus(); return; }\n    // Whatever the handles show is what gets made; a still-running analysis must not move them.\n    motionAnalysisToken++;\n    if (motionAnalyzePollTimer) { clearTimeout(motionAnalyzePollTimer); motionAnalyzePollTimer = null; }\n    var query = '?name=' + encodeURIComponent(name)\n      + '&slot=' + encodeURIComponent(motionSlot.value)\n      + '&loop=' + (motionLoop.checked ? '1' : '0');\n    if (motionHasTrim()) {\n      query += '&trimStart=' + encodeURIComponent(String(Math.round(motionTrimStart * 100) / 100))\n        + '&trimEnd=' + encodeURIComponent(String(Math.round(motionTrimEnd * 100) / 100));\n    }\n    if (motionPendingId) {\n      query += '&pendingId=' + encodeURIComponent(motionPendingId);\n    }\n    motionSubmit.disabled = true;\n    showMotionNote('Uploading the video\u2026', '');\n    var response, result;\n    try {\n      response = await fetch('/api/editor/motion-video' + query, {\n        method: 'POST',\n        headers: { 'Content-Type': motionBlob.type || 'video/webm' },\n        body: motionBlob\n      });\n      result = await response.json();\n    } catch (error) {\n      showMotionNote('Could not send the video to the sidecar.', '');\n      motionSubmit.disabled = false;\n      return;\n    }\n    if (!response.ok || result.ok !== true) {\n      showMotionNote(result.error || 'The sidecar refused the video.', '');\n      motionSubmit.disabled = false;\n      return;\n    }\n    if (result.running !== true) {\n      // The one case the sidecar cannot run itself: nobody is logged in.\n      showMotionNote(result.reason || '', result.command || '');\n      setStatus('saved', 'Video saved');\n      return;\n    }\n    showMotionNote(result.note || 'Making the animation \u2014 this takes a few minutes. You can keep editing.', '');\n    setStatus('saving', 'Making the animation\u2026');\n    pollMotionJob();\n  }\n\n  motionToggle.addEventListener('click', openMotionPanel);\n  document.getElementById('motion-close').addEventListener('click', function () { closeMotionPanel(); });\n  motionOverlay.addEventListener('click', function (event) {\n    if (event.target === motionOverlay) closeMotionPanel();\n  });\n  motionRecordBtn.addEventListener('click', function () { void startMotionRecording(); });\n  motionStopBtn.addEventListener('click', stopMotionRecording);\n  motionRetakeBtn.addEventListener('click', resetMotionPanel);\n  motionPickBtn.addEventListener('click', function () { motionFile.value = ''; motionFile.click(); });\n  motionFile.addEventListener('change', function () { pickMotionFile(motionFile.files && motionFile.files[0]); });\n  motionSubmit.addEventListener('click', function () { void submitMotion(); });\n  motionTrimStartHandle.addEventListener('pointerdown', function (event) { beginMotionTrimDrag('start', event); });\n  motionTrimEndHandle.addEventListener('pointerdown', function (event) { beginMotionTrimDrag('end', event); });\n  motionTrimFullBtn.addEventListener('click', function () {\n    motionTrimStart = 0;\n    motionTrimEnd = motionTrimDuration;\n    renderMotionTrim();\n  });\n  // Review playback stays inside the kept range, so the creator sees what gets made.\n  motionPreview.addEventListener('timeupdate', function () {\n    if (motionTrimDuration > 0) {\n      motionTrimPlayhead.style.left = Math.min(Math.max(motionPreview.currentTime / motionTrimDuration, 0), 1) * 100 + '%';\n    }\n    if (!motionBlob || !motionHasTrim()) return;\n    if (motionPreview.currentTime >= motionTrimEnd || motionPreview.currentTime < motionTrimStart - 0.25) {\n      motionPreview.currentTime = motionTrimStart;\n    }\n  });\n";
+export declare const MOTION_PANEL_JS = "\n  // ---- Record motion: webcam or file -> Uthana video-to-motion -> assets[] ----------------------\n  var motionToggle = document.getElementById('motion');\n  var motionOverlay = document.getElementById('motion-overlay');\n  var motionPreview = document.getElementById('motion-preview');\n  var motionTimer = document.getElementById('motion-timer');\n  var motionCountdown = document.getElementById('motion-countdown');\n  var motionCountdownNumber = document.getElementById('motion-countdown-number');\n  /** Seconds shown on the live preview before the recorder starts, so the first frames are the pose. */\n  var MOTION_COUNTDOWN_S = 3;\n  var motionCountdownToken = 0;\n  var motionHint = document.getElementById('motion-hint');\n  var motionRecordBtn = document.getElementById('motion-record');\n  var motionStopBtn = document.getElementById('motion-stop');\n  var motionPickBtn = document.getElementById('motion-pick');\n  var motionRetakeBtn = document.getElementById('motion-retake');\n  var motionFile = document.getElementById('motion-file');\n  var motionGuidance = document.getElementById('motion-guidance');\n  var motionName = document.getElementById('motion-name');\n  var motionSlot = document.getElementById('motion-slot');\n  var motionLoop = document.getElementById('motion-loop');\n  var motionSubmit = document.getElementById('motion-submit');\n  var motionNote = document.getElementById('motion-note');\n  var MOTION_MIN_S = 2;\n  var MOTION_MAX_S = 60;\n  var MOTION_MAX_BYTES = 200 * 1024 * 1024;\n  var motionBlob = null;\n  // Whether motionBlob came from the webcam recorder (auto-trim applies) or a picked file (it does not).\n  var motionFromRecording = false;\n  var motionSeconds = 0;\n  var motionStream = null;\n  var motionRecorder = null;\n  var motionChunks = [];\n  var motionTickTimer = null;\n  var motionStartedAt = 0;\n  var motionObjectUrl = null;\n  // ---- Trim window: seeded by the sidecar's trim analysis, adjusted on the handles ------------\n  var motionTrimWrap = document.getElementById('motion-trim');\n  var motionTrimBar = document.getElementById('motion-trimbar');\n  var motionTrimKept = document.getElementById('motion-trim-kept');\n  var motionTrimPlayhead = document.getElementById('motion-trim-playhead');\n  var motionTrimStartHandle = document.getElementById('motion-trim-start');\n  var motionTrimEndHandle = document.getElementById('motion-trim-end');\n  var motionTrimNote = document.getElementById('motion-trim-note');\n  var motionTrimFullBtn = document.getElementById('motion-trim-full');\n  var motionTrimPreviewBtn = document.getElementById('motion-trim-preview');\n  // True while \"Preview the kept range\" is playing trimStart -> trimEnd.\n  var motionPreviewingTrim = false;\n  var MOTION_TRIM_MIN_KEPT_S = 2;\n  var motionTrimDuration = 0;\n  var motionTrimStart = 0;\n  var motionTrimEnd = 0;\n  var motionPendingId = null;\n  var motionAnalysisState = 'idle';\n  var motionAnalysisToken = 0;\n  var motionAnalyzePollTimer = null;\n\n  function motionHasTrim() {\n    return motionTrimDuration > 0 && motionTrimEnd > motionTrimStart\n      && (motionTrimStart >= 0.1 || motionTrimDuration - motionTrimEnd >= 0.1);\n  }\n\n  function renderMotionTrim() {\n    if (motionTrimDuration <= 0) { motionTrimWrap.classList.remove('show'); return; }\n    motionTrimWrap.classList.add('show');\n    var pct = function (seconds) {\n      return Math.min(Math.max(seconds / motionTrimDuration, 0), 1) * 100 + '%';\n    };\n    motionTrimKept.style.left = pct(motionTrimStart);\n    motionTrimKept.style.width = Math.max(0, (motionTrimEnd - motionTrimStart) / motionTrimDuration) * 100 + '%';\n    motionTrimStartHandle.style.left = pct(motionTrimStart);\n    motionTrimEndHandle.style.left = pct(motionTrimEnd);\n    motionTrimFullBtn.hidden = !motionHasTrim();\n    motionTrimPreviewBtn.textContent = motionPreviewingTrim\n      ? '\u23F9 Stop'\n      : (motionHasTrim() ? '\u25B6 Preview the kept range' : '\u25B6 Play');\n    var note;\n    if (motionAnalysisState === 'running') {\n      note = 'Analyzing the clip for a good trim\u2026';\n    } else if (!motionHasTrim()) {\n      note = 'Using the full clip.';\n    } else {\n      var parts = [];\n      if (motionTrimStart >= 0.1) parts.push(motionTrimStart.toFixed(1) + 's from the start');\n      if (motionTrimDuration - motionTrimEnd >= 0.1) parts.push((motionTrimDuration - motionTrimEnd).toFixed(1) + 's from the end');\n      note = 'Trimming ' + parts.join(' and ') + '.';\n    }\n    motionTrimNote.textContent = note;\n  }\n\n  function resetMotionTrim() {\n    motionPreviewingTrim = false;\n    motionAnalysisToken++;\n    if (motionAnalyzePollTimer) { clearTimeout(motionAnalyzePollTimer); motionAnalyzePollTimer = null; }\n    motionPendingId = null;\n    motionAnalysisState = 'idle';\n    motionTrimDuration = 0;\n    motionTrimStart = 0;\n    motionTrimEnd = 0;\n    motionTrimWrap.classList.remove('show');\n  }\n\n  function seedMotionTrim(durationSeconds) {\n    if (!(durationSeconds > 0)) return;\n    motionTrimDuration = durationSeconds;\n    motionTrimStart = 0;\n    motionTrimEnd = durationSeconds;\n    // Review playback is the trim: the Play/Preview button below drives the\n    // video, and a native full-clip scrubber under a trim bar read as \"it\n    // plays the whole video anyway\". Controls stay native only while the\n    // duration is unknown and the bar cannot render.\n    motionPreview.controls = false;\n    renderMotionTrim();\n  }\n\n  function applyMotionSuggestion(suggestion) {\n    if (!suggestion) { renderMotionTrim(); return; }\n    if (suggestion.durationSeconds > 0) {\n      motionTrimDuration = suggestion.durationSeconds;\n      motionTrimStart = 0;\n      motionTrimEnd = suggestion.durationSeconds;\n    }\n    if (suggestion.confidence === 'high'\n        && typeof suggestion.suggestedStartSeconds === 'number'\n        && typeof suggestion.suggestedEndSeconds === 'number'\n        && suggestion.suggestedEndSeconds > suggestion.suggestedStartSeconds) {\n      motionTrimStart = suggestion.suggestedStartSeconds;\n      motionTrimEnd = Math.min(suggestion.suggestedEndSeconds, motionTrimDuration || suggestion.suggestedEndSeconds);\n    }\n    renderMotionTrim();\n  }\n\n  function beginMotionTrimDrag(which, event) {\n    if (motionTrimDuration <= 0) return;\n    var handle = event.currentTarget;\n    handle.setPointerCapture(event.pointerId);\n    var move = function (e) {\n      var rect = motionTrimBar.getBoundingClientRect();\n      if (rect.width === 0) return;\n      var at = Math.min(Math.max((e.clientX - rect.left) / rect.width, 0), 1) * motionTrimDuration;\n      if (which === 'start') motionTrimStart = Math.min(at, motionTrimEnd - MOTION_TRIM_MIN_KEPT_S);\n      else motionTrimEnd = Math.max(at, motionTrimStart + MOTION_TRIM_MIN_KEPT_S);\n      // Show the exact frame the cut lands on while the handle moves.\n      motionPreview.pause();\n      motionPreviewingTrim = false;\n      motionPreview.currentTime = which === 'start' ? motionTrimStart : motionTrimEnd;\n      renderMotionTrim();\n    };\n    var up = function () {\n      handle.removeEventListener('pointermove', move);\n      handle.removeEventListener('pointerup', up);\n      handle.removeEventListener('pointercancel', up);\n    };\n    handle.addEventListener('pointermove', move);\n    handle.addEventListener('pointerup', up);\n    handle.addEventListener('pointercancel', up);\n    event.preventDefault();\n  }\n\n  function pollMotionAnalysis(token) {\n    var tick = async function () {\n      if (token !== motionAnalysisToken) return;\n      var payload;\n      try {\n        payload = await (await fetch('/api/editor/motion-analyze-status')).json();\n      } catch (error) {\n        motionAnalyzePollTimer = setTimeout(tick, 2000);\n        return;\n      }\n      if (token !== motionAnalysisToken) return;\n      if (payload && payload.status === 'done') {\n        motionAnalysisState = 'done';\n        applyMotionSuggestion(payload.suggestion);\n        return;\n      }\n      if (payload && payload.status === 'running') {\n        motionAnalyzePollTimer = setTimeout(tick, 2000);\n        return;\n      }\n      // failed / unavailable / none: no suggestion, the full-range handles stand.\n      motionAnalysisState = 'failed';\n      renderMotionTrim();\n    };\n    motionAnalyzePollTimer = setTimeout(tick, 2000);\n  }\n\n  /**\n   * Hand the clip to the sidecar ahead of submission: it uploads once and runs the unbilled trim\n   * analysis while the creator reviews. Degraded, never blocking \u2014 any failure just leaves the\n   * handles at full range, and Submit works throughout.\n   */\n  async function startMotionAnalysis(blob) {\n    var token = ++motionAnalysisToken;\n    motionPendingId = null;\n    motionAnalysisState = 'running';\n    renderMotionTrim();\n    var result = null;\n    try {\n      var response = await fetch('/api/editor/motion-analyze', {\n        method: 'POST',\n        headers: { 'Content-Type': blob.type || 'video/webm' },\n        body: blob\n      });\n      result = await response.json();\n    } catch (error) { /* the sidecar said nothing; treat as unavailable */ }\n    if (token !== motionAnalysisToken) return;\n    if (!result || result.ok !== true || result.analysing !== true) {\n      motionAnalysisState = 'idle';\n      renderMotionTrim();\n      return;\n    }\n    motionPendingId = result.pendingId || null;\n    pollMotionAnalysis(token);\n  }\n\n  function motionSupported() {\n    return !!(window.isSecureContext && navigator.mediaDevices && navigator.mediaDevices.getUserMedia\n      && typeof MediaRecorder !== 'undefined');\n  }\n\n  /** mp4 first (Safari), then the WebM the rest produce; asset-forger re-encodes either. */\n  function pickMotionMime() {\n    var candidates = ['video/mp4', 'video/webm;codecs=vp9', 'video/webm'];\n    for (var i = 0; i < candidates.length; i++) {\n      if (MediaRecorder.isTypeSupported(candidates[i])) return candidates[i];\n    }\n    return '';\n  }\n\n  function motionCameraError(error) {\n    var name = error && error.name;\n    if (name === 'NotAllowedError' || name === 'SecurityError') return 'Camera access was refused. Allow it in the address bar, or choose a video file.';\n    if (name === 'NotFoundError' || name === 'OverconstrainedError') return 'No camera found. Choose a video file instead.';\n    if (name === 'NotReadableError') return 'The camera is in use by another app. Close it, or choose a video file.';\n    return 'Could not start the camera: ' + ((error && error.message) || 'unknown error');\n  }\n\n  function formatMotionClock(seconds) {\n    var s = Math.max(0, Math.floor(seconds));\n    var rest = s % 60;\n    return Math.floor(s / 60) + ':' + (rest < 10 ? '0' : '') + rest;\n  }\n\n  function showMotionNote(text, command) {\n    document.getElementById('motion-note-text').textContent = text;\n    document.getElementById('motion-command').textContent = command || '';\n    motionNote.classList.add('show');\n  }\n\n  function releaseMotionObjectUrl() {\n    if (motionObjectUrl) { URL.revokeObjectURL(motionObjectUrl); motionObjectUrl = null; }\n  }\n\n  /** Stop the recorder if one is still live \u2014 it may already have stopped itself. */\n  function discardMotionRecorder() {\n    if (motionRecorder && motionRecorder.state !== 'inactive') {\n      try { motionRecorder.stop(); } catch (error) { /* already stopped */ }\n    }\n  }\n\n  function stopMotionStream() {\n    if (motionStream) {\n      motionStream.getTracks().forEach(function (track) { track.stop(); });\n      motionStream = null;\n    }\n    if (motionTickTimer) { clearInterval(motionTickTimer); motionTickTimer = null; }\n    motionCountdownToken++;\n    motionCountdown.classList.remove('show');\n    motionTimer.classList.remove('show');\n    motionPreview.classList.remove('mirror');\n  }\n\n  function setMotionButtons(state) {\n    motionRecordBtn.hidden = state !== 'idle';\n    motionPickBtn.hidden = state !== 'idle';\n    motionStopBtn.hidden = state !== 'recording';\n    motionRetakeBtn.hidden = state !== 'ready';\n    motionSubmit.disabled = state !== 'ready';\n  }\n\n  function resetMotionPanel() {\n    resetMotionTrim();\n    stopMotionStream();\n    discardMotionRecorder();\n    motionRecorder = null;\n    motionChunks = [];\n    motionBlob = null;\n    motionFromRecording = false;\n    motionSeconds = 0;\n    releaseMotionObjectUrl();\n    motionPreview.srcObject = null;\n    motionPreview.removeAttribute('src');\n    motionPreview.controls = false;\n    motionPreview.muted = true;\n    motionHint.classList.remove('hidden');\n    var supported = motionSupported();\n    motionGuidance.textContent = supported ? '' : 'Webcam recording needs a secure page with a camera; choose a video file instead.';\n    motionRecordBtn.disabled = !supported;\n    motionNote.classList.remove('show');\n    setMotionButtons('idle');\n  }\n\n  function openMotionPanel() {\n    resetMotionPanel();\n    motionOverlay.classList.add('show');\n    motionName.focus();\n  }\n\n  /** Returns whether it was open \u2014 the Escape handler's contract, like closeAssetDetail. */\n  function closeMotionPanel() {\n    if (!motionOverlay.classList.contains('show')) return false;\n    stopMotionStream();\n    discardMotionRecorder();\n    motionOverlay.classList.remove('show');\n    frame.focus();\n    return true;\n  }\n\n  /** The clip is in hand: show it back, and say whether it is within Uthana's 2-60 s window. */\n  function acceptMotionClip(blob, seconds) {\n    motionBlob = blob;\n    motionSeconds = seconds;\n    releaseMotionObjectUrl();\n    motionObjectUrl = URL.createObjectURL(blob);\n    motionPreview.srcObject = null;\n    motionPreview.src = motionObjectUrl;\n    motionPreview.controls = true;\n    motionPreview.muted = true;\n    motionHint.classList.add('hidden');\n    var note;\n    if (blob.size > MOTION_MAX_BYTES) note = 'That video is over 200 MB. Trim it to the seconds that matter.';\n    else if (seconds > 0 && seconds < MOTION_MIN_S) note = 'Too short: Uthana needs at least ' + MOTION_MIN_S + ' seconds.';\n    else if (seconds > MOTION_MAX_S) note = 'Too long: Uthana takes at most ' + MOTION_MAX_S + ' seconds. Trim it, or record again.';\n    var ok = !note;\n    motionGuidance.textContent = ok\n      ? (seconds > 0 ? formatMotionClock(seconds) + ' of video ready.' : 'Video ready.')\n      : note;\n    setMotionButtons('ready');\n    motionSubmit.disabled = !ok;\n    resetMotionTrim();\n    if (ok) {\n      seedMotionTrim(seconds);\n      // A fresh WebM often reports no duration; the preview's metadata is the fallback scale.\n      motionPreview.onloadedmetadata = function () {\n        if (motionTrimDuration === 0 && isFinite(motionPreview.duration) && motionPreview.duration > 0) {\n          seedMotionTrim(motionPreview.duration);\n        }\n      };\n      void startMotionAnalysis(blob);\n    }\n  }\n\n  async function startMotionRecording() {\n    if (!motionSupported()) return;\n    motionNote.classList.remove('show');\n    try {\n      motionStream = await navigator.mediaDevices.getUserMedia({\n        video: { width: { ideal: 1280 }, height: { ideal: 720 }, facingMode: 'user' }, audio: false\n      });\n    } catch (error) {\n      motionGuidance.textContent = motionCameraError(error);\n      return;\n    }\n    releaseMotionObjectUrl();\n    motionPreview.removeAttribute('src');\n    motionPreview.controls = false;\n    motionPreview.srcObject = motionStream;\n    motionPreview.classList.add('mirror');\n    motionHint.classList.add('hidden');\n    try { await motionPreview.play(); } catch (error) { /* autoplay refused; the stream still shows on interaction */ }\n    var mime = pickMotionMime();\n    try {\n      motionRecorder = mime ? new MediaRecorder(motionStream, { mimeType: mime }) : new MediaRecorder(motionStream);\n    } catch (error) {\n      stopMotionStream();\n      motionGuidance.textContent = 'This browser cannot record video. Choose a video file instead.';\n      return;\n    }\n    // Count down on the live preview; Stop during the count aborts without recording.\n    var token = ++motionCountdownToken;\n    setMotionButtons('recording');\n    motionGuidance.textContent = 'Get in frame \u2014 recording starts after the count.';\n    motionCountdown.classList.add('show');\n    for (var left = MOTION_COUNTDOWN_S; left > 0; left--) {\n      motionCountdownNumber.textContent = String(left);\n      await new Promise(function (resolve) { setTimeout(resolve, 1000); });\n      if (token !== motionCountdownToken) return;\n    }\n    motionCountdown.classList.remove('show');\n    motionChunks = [];\n    motionRecorder.ondataavailable = function (event) { if (event.data && event.data.size > 0) motionChunks.push(event.data); };\n    motionRecorder.onstop = function () {\n      var seconds = (Date.now() - motionStartedAt) / 1000;\n      var type = motionRecorder.mimeType || mime || 'video/webm';\n      stopMotionStream();\n      motionFromRecording = true;\n      acceptMotionClip(new Blob(motionChunks, { type: type }), seconds);\n    };\n    motionStartedAt = Date.now();\n    motionRecorder.start(1000);\n    motionTimer.textContent = '0:00';\n    motionTimer.classList.add('show');\n    motionGuidance.textContent = 'Recording. Stop when the move is done (auto-stops at ' + MOTION_MAX_S + ' s).';\n    motionTickTimer = setInterval(function () {\n      var elapsed = (Date.now() - motionStartedAt) / 1000;\n      motionTimer.textContent = formatMotionClock(elapsed);\n      if (elapsed >= MOTION_MAX_S) stopMotionRecording();\n    }, 250);\n  }\n\n  function stopMotionRecording() {\n    if (motionRecorder && motionRecorder.state === 'recording') { motionRecorder.stop(); return; }\n    // Stop pressed during the countdown: nothing was recorded, back to the start.\n    if (motionCountdown.classList.contains('show')) resetMotionPanel();\n  }\n\n  function pickMotionFile(file) {\n    if (!file) return;\n    // Read the duration off the file itself; a picked video knows its length, a fresh WebM often\n    // does not (Infinity), so 0 means \"unknown\" and the server's ffprobe is the judge.\n    var probe = document.createElement('video');\n    probe.preload = 'metadata';\n    var url = URL.createObjectURL(file);\n    var settled = false;\n    var finish = function (seconds) {\n      if (settled) return;\n      settled = true;\n      URL.revokeObjectURL(url);\n      motionFromRecording = false;\n      acceptMotionClip(file, seconds);\n    };\n    probe.onloadedmetadata = function () { finish(isFinite(probe.duration) ? probe.duration : 0); };\n    probe.onerror = function () { finish(0); };\n    probe.src = url;\n    setTimeout(function () { finish(0); }, 3000);\n  }\n\n  var motionPollTimer = null;\n  function pollMotionJob() {\n    if (motionPollTimer) clearTimeout(motionPollTimer);\n    var tick = async function () {\n      var job;\n      try {\n        job = (await (await fetch('/api/editor/motion-status')).json()).job;\n      } catch (error) {\n        motionPollTimer = setTimeout(tick, 3000);\n        return;\n      }\n      if (!job) return;\n      if (job.status === 'running') {\n        showMotionNote(job.message, '');\n        setStatus('saving', 'Making the animation\u2026');\n        motionPollTimer = setTimeout(tick, 3000);\n        return;\n      }\n      if (job.status === 'failed') {\n        showMotionNote('Could not make the animation: ' + job.message, '');\n        setStatus('error', 'Animation failed');\n        setMotionButtons('ready');\n        return;\n      }\n      showMotionNote(job.message + ' Reloading to show it.', '');\n      setStatus('saved', 'Animation added');\n      setMotionButtons('ready');\n      if (autoReload && !voxelSessionActive && !voxelSessionPending) start();\n      else banner.classList.add('show');\n    };\n    void tick();\n  }\n\n  async function submitMotion() {\n    if (!motionBlob) return;\n    var name = motionName.value.trim();\n    if (name === '') { motionName.focus(); return; }\n    // Whatever the handles show is what gets made; a still-running analysis must not move them.\n    motionAnalysisToken++;\n    if (motionAnalyzePollTimer) { clearTimeout(motionAnalyzePollTimer); motionAnalyzePollTimer = null; }\n    var query = '?name=' + encodeURIComponent(name)\n      + '&slot=' + encodeURIComponent(motionSlot.value)\n      + '&loop=' + (motionLoop.checked ? '1' : '0');\n    if (motionHasTrim()) {\n      query += '&trimStart=' + encodeURIComponent(String(Math.round(motionTrimStart * 100) / 100))\n        + '&trimEnd=' + encodeURIComponent(String(Math.round(motionTrimEnd * 100) / 100));\n    }\n    if (motionPendingId) {\n      query += '&pendingId=' + encodeURIComponent(motionPendingId);\n    }\n    motionSubmit.disabled = true;\n    showMotionNote('Uploading the video\u2026', '');\n    var response, result;\n    try {\n      response = await fetch('/api/editor/motion-video' + query, {\n        method: 'POST',\n        headers: { 'Content-Type': motionBlob.type || 'video/webm' },\n        body: motionBlob\n      });\n      result = await response.json();\n    } catch (error) {\n      showMotionNote('Could not send the video to the sidecar.', '');\n      motionSubmit.disabled = false;\n      return;\n    }\n    if (!response.ok || result.ok !== true) {\n      showMotionNote(result.error || 'The sidecar refused the video.', '');\n      motionSubmit.disabled = false;\n      return;\n    }\n    if (result.running !== true) {\n      // The one case the sidecar cannot run itself: nobody is logged in.\n      showMotionNote(result.reason || '', result.command || '');\n      setStatus('saved', 'Video saved');\n      return;\n    }\n    showMotionNote(result.note || 'Making the animation \u2014 this takes a few minutes. You can keep editing.', '');\n    setStatus('saving', 'Making the animation\u2026');\n    pollMotionJob();\n  }\n\n  motionToggle.addEventListener('click', openMotionPanel);\n  document.getElementById('motion-close').addEventListener('click', function () { closeMotionPanel(); });\n  motionOverlay.addEventListener('click', function (event) {\n    if (event.target === motionOverlay) closeMotionPanel();\n  });\n  motionRecordBtn.addEventListener('click', function () { void startMotionRecording(); });\n  motionStopBtn.addEventListener('click', stopMotionRecording);\n  motionRetakeBtn.addEventListener('click', resetMotionPanel);\n  motionPickBtn.addEventListener('click', function () { motionFile.value = ''; motionFile.click(); });\n  motionFile.addEventListener('change', function () { pickMotionFile(motionFile.files && motionFile.files[0]); });\n  motionSubmit.addEventListener('click', function () { void submitMotion(); });\n  motionTrimStartHandle.addEventListener('pointerdown', function (event) { beginMotionTrimDrag('start', event); });\n  motionTrimEndHandle.addEventListener('pointerdown', function (event) { beginMotionTrimDrag('end', event); });\n  motionTrimFullBtn.addEventListener('click', function () {\n    motionTrimStart = 0;\n    motionTrimEnd = motionTrimDuration;\n    renderMotionTrim();\n  });\n  // \"Preview the kept range\" plays exactly trimStart -> trimEnd once and stops\n  // on the last kept frame: what was just watched IS what the animation is\n  // made from.\n  motionTrimPreviewBtn.addEventListener('click', function () {\n    if (motionPreviewingTrim) {\n      motionPreview.pause();\n      motionPreviewingTrim = false;\n      renderMotionTrim();\n      return;\n    }\n    motionPreview.currentTime = motionTrimStart;\n    motionPreviewingTrim = true;\n    renderMotionTrim();\n    var played = motionPreview.play();\n    if (played && played.catch) {\n      played.catch(function () { motionPreviewingTrim = false; renderMotionTrim(); });\n    }\n  });\n  motionPreview.addEventListener('pause', function () {\n    if (motionPreviewingTrim) { motionPreviewingTrim = false; renderMotionTrim(); }\n  });\n  motionPreview.addEventListener('ended', function () {\n    if (motionPreviewingTrim) { motionPreviewingTrim = false; renderMotionTrim(); }\n  });\n  motionPreview.addEventListener('timeupdate', function () {\n    if (motionTrimDuration > 0) {\n      motionTrimPlayhead.style.left = Math.min(Math.max(motionPreview.currentTime / motionTrimDuration, 0), 1) * 100 + '%';\n    }\n    if (motionPreviewingTrim && motionPreview.currentTime >= motionTrimEnd) {\n      motionPreview.pause();\n      motionPreview.currentTime = motionTrimEnd;\n      motionPreviewingTrim = false;\n      renderMotionTrim();\n    }\n  });\n";

package/dist/editor/motion-panel.js

@@ -45,6 +45,7 @@ export const MOTION_PANEL_CSS = `
   #motion-trim-row { display: flex; align-items: center; justify-content: space-between; gap: 8px;
                      margin-top: 6px; min-height: 24px; }
   #motion-trim-note { font-size: 11px; color: var(--bm-text-muted); }
+  #motion-trim-actions { display: flex; gap: 6px; }
   #motion-sources { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
   #motion-file { display: none; }
   #motion-guidance { margin: 10px 0 0; font-size: 12px; color: var(--bm-text-muted); }
@@ -81,7 +82,10 @@ export const MOTION_PANEL_HTML = `  <div id="motion-overlay" class="bm-overlay">
         </div>
         <div id="motion-trim-row">
           <span id="motion-trim-note"></span>
-          <button id="motion-trim-full" class="bm-pill bm-pill--ghost" type="button" hidden>Use full clip</button>
+          <span id="motion-trim-actions">
+            <button id="motion-trim-preview" class="bm-pill" type="button">&#9654; Play</button>
+            <button id="motion-trim-full" class="bm-pill bm-pill--ghost" type="button" hidden>Use full clip</button>
+          </span>
         </div>
       </div>
       <div id="motion-sources">
@@ -168,6 +172,9 @@ export const MOTION_PANEL_JS = `
   var motionTrimEndHandle = document.getElementById('motion-trim-end');
   var motionTrimNote = document.getElementById('motion-trim-note');
   var motionTrimFullBtn = document.getElementById('motion-trim-full');
+  var motionTrimPreviewBtn = document.getElementById('motion-trim-preview');
+  // True while "Preview the kept range" is playing trimStart -> trimEnd.
+  var motionPreviewingTrim = false;
   var MOTION_TRIM_MIN_KEPT_S = 2;
   var motionTrimDuration = 0;
   var motionTrimStart = 0;
@@ -193,6 +200,9 @@ export const MOTION_PANEL_JS = `
     motionTrimStartHandle.style.left = pct(motionTrimStart);
     motionTrimEndHandle.style.left = pct(motionTrimEnd);
     motionTrimFullBtn.hidden = !motionHasTrim();
+    motionTrimPreviewBtn.textContent = motionPreviewingTrim
+      ? '\u23F9 Stop'
+      : (motionHasTrim() ? '\u25B6 Preview the kept range' : '\u25B6 Play');
     var note;
     if (motionAnalysisState === 'running') {
       note = 'Analyzing the clip for a good trim\u2026';
@@ -208,6 +218,7 @@ export const MOTION_PANEL_JS = `
   }
 
   function resetMotionTrim() {
+    motionPreviewingTrim = false;
     motionAnalysisToken++;
     if (motionAnalyzePollTimer) { clearTimeout(motionAnalyzePollTimer); motionAnalyzePollTimer = null; }
     motionPendingId = null;
@@ -223,6 +234,11 @@ export const MOTION_PANEL_JS = `
     motionTrimDuration = durationSeconds;
     motionTrimStart = 0;
     motionTrimEnd = durationSeconds;
+    // Review playback is the trim: the Play/Preview button below drives the
+    // video, and a native full-clip scrubber under a trim bar read as "it
+    // plays the whole video anyway". Controls stay native only while the
+    // duration is unknown and the bar cannot render.
+    motionPreview.controls = false;
     renderMotionTrim();
   }
 
@@ -253,6 +269,10 @@ export const MOTION_PANEL_JS = `
       var at = Math.min(Math.max((e.clientX - rect.left) / rect.width, 0), 1) * motionTrimDuration;
       if (which === 'start') motionTrimStart = Math.min(at, motionTrimEnd - MOTION_TRIM_MIN_KEPT_S);
       else motionTrimEnd = Math.max(at, motionTrimStart + MOTION_TRIM_MIN_KEPT_S);
+      // Show the exact frame the cut lands on while the handle moves.
+      motionPreview.pause();
+      motionPreviewingTrim = false;
+      motionPreview.currentTime = which === 'start' ? motionTrimStart : motionTrimEnd;
       renderMotionTrim();
     };
     var up = function () {
@@ -643,14 +663,39 @@ export const MOTION_PANEL_JS = `
     motionTrimEnd = motionTrimDuration;
     renderMotionTrim();
   });
-  // Review playback stays inside the kept range, so the creator sees what gets made.
+  // "Preview the kept range" plays exactly trimStart -> trimEnd once and stops
+  // on the last kept frame: what was just watched IS what the animation is
+  // made from.
+  motionTrimPreviewBtn.addEventListener('click', function () {
+    if (motionPreviewingTrim) {
+      motionPreview.pause();
+      motionPreviewingTrim = false;
+      renderMotionTrim();
+      return;
+    }
+    motionPreview.currentTime = motionTrimStart;
+    motionPreviewingTrim = true;
+    renderMotionTrim();
+    var played = motionPreview.play();
+    if (played && played.catch) {
+      played.catch(function () { motionPreviewingTrim = false; renderMotionTrim(); });
+    }
+  });
+  motionPreview.addEventListener('pause', function () {
+    if (motionPreviewingTrim) { motionPreviewingTrim = false; renderMotionTrim(); }
+  });
+  motionPreview.addEventListener('ended', function () {
+    if (motionPreviewingTrim) { motionPreviewingTrim = false; renderMotionTrim(); }
+  });
   motionPreview.addEventListener('timeupdate', function () {
     if (motionTrimDuration > 0) {
       motionTrimPlayhead.style.left = Math.min(Math.max(motionPreview.currentTime / motionTrimDuration, 0), 1) * 100 + '%';
     }
-    if (!motionBlob || !motionHasTrim()) return;
-    if (motionPreview.currentTime >= motionTrimEnd || motionPreview.currentTime < motionTrimStart - 0.25) {
-      motionPreview.currentTime = motionTrimStart;
+    if (motionPreviewingTrim && motionPreview.currentTime >= motionTrimEnd) {
+      motionPreview.pause();
+      motionPreview.currentTime = motionTrimEnd;
+      motionPreviewingTrim = false;
+      renderMotionTrim();
     }
   });
 `;

package/dist/editor/motion-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"motion-panel.js","sourceRoot":"","sources":["../../src/editor/motion-panel.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,MAAM,CAAC,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgD/B,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0DhC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkhB9B,CAAC"}
+{"version":3,"file":"motion-panel.js","sourceRoot":"","sources":["../../src/editor/motion-panel.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,MAAM,CAAC,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiD/B,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6DhC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2jB9B,CAAC"}

package/dist/local-port.d.ts

@@ -1,4 +1,4 @@
-import type { PortLane } from './port-lane.js';
+import { type PortLane } from './port-lane.js';
 /**
  * The port window the platform's bucket CORS policy allowlists as an origin.
  *
@@ -38,6 +38,18 @@ export declare const CORS_ALLOWED_PORT_MAX = 3199;
  * line nominally owns that half would make the flag a suggestion for no benefit.
  */
 export declare function parseLocalPort(value: string | undefined, fallback: number, flag: string): number;
+/**
+ * Whether this exact port is free right now. Same TOCTOU caveat as `reservePortInLane` below.
+ *
+ * A port counts as free only when BOTH loopback families are free. Vite binds `localhost`, which
+ * Node resolves to `::1` on modern systems — so a running `bitmagic dev` holds only the IPv6 side
+ * of its port. Probing 127.0.0.1 alone once called such a port "free": `verify` then bound its own
+ * vite to the IPv4 side, `http://localhost:<port>/` resolved to `::1`, and the run drove — and
+ * graded — whichever OTHER project's dev server was already there, printing "Verification passed"
+ * for a game it never loaded. A machine without IPv6 reports the family as unavailable rather
+ * than the port as busy, and that must not mark every port taken.
+ */
+export declare function isPortFree(port: number): Promise<boolean>;
 /**
  * A free port in this install's lane, or `null` when every port in the lane is taken.
  *
@@ -51,7 +63,7 @@ export declare function parseLocalPort(value: string | undefined, fallback: numb
  * quietly. A hundred held ports is a machine with a problem to report, not a lane to abandon.
  *
  * The scan starts at a pseudo-random offset so two concurrent runs do not both take the lane's
- * first port and race; `tryListen` closing before the caller binds leaves a window either way,
+ * first port and race; `isPortFree` closing before the caller binds leaves a window either way,
  * which is why callers must handle a bind failure rather than trusting this.
  */
 export declare function reservePortInLane(lane: PortLane, exclude?: ReadonlySet<number>): Promise<number | null>;
@@ -63,8 +75,15 @@ export declare function reservePortInLane(lane: PortLane, exclude?: ReadonlySet<
  * ports and has just been told a hundred of them are the limit.
  */
 export declare function laneExhaustedMessage(lane: PortLane, remedy: string): string;
-/** Whether this exact port is free right now. Same TOCTOU caveat as above. */
-export declare function isPortFree(port: number): Promise<boolean>;
+/**
+ * A free port in THIS install's lane, or a `CliError` carrying `remedy` when the lane is full.
+ *
+ * What every command that serves the project for a real browser to load actually wants: `verify`
+ * and `forge` alike need a port inside the CDN's CORS window (see the file header) and have
+ * nothing useful to do with a `null`. Bundling the lane lookup, the scan and the refusal here
+ * keeps the three from drifting apart — a caller varies only what it tells the creator to do.
+ */
+export declare function reserveLanePort(remedy: string, exclude?: ReadonlySet<number>): Promise<number>;
 /**
  * The port to actually bind: `preferred` when it is free, otherwise another one in the window.
  *

package/dist/local-port.js

@@ -1,5 +1,6 @@
 import * as net from 'net';
 import { CliError } from './errors.js';
+import { currentPortLane } from './port-lane.js';
 /**
  * The port window the platform's bucket CORS policy allowlists as an origin.
  *
@@ -51,17 +52,37 @@ export function parseLocalPort(value, fallback, flag) {
     }
     return port;
 }
-function tryListen(port) {
+/** `null` when the port bound cleanly on this host, otherwise the OS error code that refused it. */
+function tryBind(port, host) {
     return new Promise((resolve) => {
         const server = net.createServer();
-        server.once('error', () => resolve(null));
-        server.listen(port, '127.0.0.1', () => {
-            const address = server.address();
-            const bound = address !== null && typeof address !== 'string' ? address.port : null;
-            server.close(() => resolve(bound));
+        server.once('error', (error) => resolve(error.code ?? 'UNKNOWN'));
+        server.listen(port, host, () => {
+            server.close(() => resolve(null));
         });
     });
 }
+/** Codes that mean "this machine has no such loopback family", not "this port is taken". */
+const FAMILY_UNAVAILABLE_CODES = new Set(['EADDRNOTAVAIL', 'EAFNOSUPPORT']);
+/**
+ * Whether this exact port is free right now. Same TOCTOU caveat as `reservePortInLane` below.
+ *
+ * A port counts as free only when BOTH loopback families are free. Vite binds `localhost`, which
+ * Node resolves to `::1` on modern systems — so a running `bitmagic dev` holds only the IPv6 side
+ * of its port. Probing 127.0.0.1 alone once called such a port "free": `verify` then bound its own
+ * vite to the IPv4 side, `http://localhost:<port>/` resolved to `::1`, and the run drove — and
+ * graded — whichever OTHER project's dev server was already there, printing "Verification passed"
+ * for a game it never loaded. A machine without IPv6 reports the family as unavailable rather
+ * than the port as busy, and that must not mark every port taken.
+ */
+export async function isPortFree(port) {
+    for (const host of ['127.0.0.1', '::1']) {
+        const code = await tryBind(port, host);
+        if (code !== null && !FAMILY_UNAVAILABLE_CODES.has(code))
+            return false;
+    }
+    return true;
+}
 /**
  * A free port in this install's lane, or `null` when every port in the lane is taken.
  *
@@ -75,7 +96,7 @@ function tryListen(port) {
  * quietly. A hundred held ports is a machine with a problem to report, not a lane to abandon.
  *
  * The scan starts at a pseudo-random offset so two concurrent runs do not both take the lane's
- * first port and race; `tryListen` closing before the caller binds leaves a window either way,
+ * first port and race; `isPortFree` closing before the caller binds leaves a window either way,
  * which is why callers must handle a bind failure rather than trusting this.
  */
 export async function reservePortInLane(lane, exclude = new Set()) {
@@ -85,9 +106,8 @@ export async function reservePortInLane(lane, exclude = new Set()) {
         const port = lane.min + ((start + i) % span);
         if (exclude.has(port))
             continue;
-        const bound = await tryListen(port);
-        if (bound !== null)
-            return bound;
+        if (await isPortFree(port))
+            return port;
     }
     return null;
 }
@@ -104,9 +124,20 @@ export function laneExhaustedMessage(lane, remedy) {
         + 'the other half is left free so a bitmagic from the other release line can run beside this '
         + `one. ${remedy}`);
 }
-/** Whether this exact port is free right now. Same TOCTOU caveat as above. */
-export async function isPortFree(port) {
-    return (await tryListen(port)) !== null;
+/**
+ * A free port in THIS install's lane, or a `CliError` carrying `remedy` when the lane is full.
+ *
+ * What every command that serves the project for a real browser to load actually wants: `verify`
+ * and `forge` alike need a port inside the CDN's CORS window (see the file header) and have
+ * nothing useful to do with a `null`. Bundling the lane lookup, the scan and the refusal here
+ * keeps the three from drifting apart — a caller varies only what it tells the creator to do.
+ */
+export async function reserveLanePort(remedy, exclude = new Set()) {
+    const lane = currentPortLane();
+    const port = await reservePortInLane(lane, exclude);
+    if (port === null)
+        throw new CliError(laneExhaustedMessage(lane, remedy));
+    return port;
 }
 /**
  * The port to actually bind: `preferred` when it is free, otherwise another one in the window.

package/dist/local-port.js.map

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

package/dist/scaffold/export-zip.d.ts

@@ -0,0 +1,48 @@
+/** One file from the export's `source/`, keyed by its path RELATIVE to that directory. */
+export interface ExportSourceFile {
+    /** Forward-slash separated, e.g. `Game.ts` or `levels/level-2.json`. */
+    path: string;
+    contents: Uint8Array;
+}
+export interface CreatorExport {
+    /** The game's id on the Creator's api-server — the row a CLI project can adopt. */
+    gameId: string;
+    genre: string;
+    /** The engine the game was last edited against, or null when the export predates the field. */
+    engineVersion: string | null;
+    /** The Creator template the game began from (`metadata.importedFrom`), or null. */
+    template: string | null;
+    /** `game.json`'s `gameName`, for the summary. Null when absent or unreadable. */
+    gameName: string | null;
+    /** Every file under `<gameId>/source/`, with `.git` already dropped. */
+    sourceFiles: ExportSourceFile[];
+}
+/**
+ * Read and validate the export at `zipPath`.
+ *
+ * Every failure is a CliError naming the file, because all of them mean the same thing to a
+ * creator: this is not an export the CLI can convert, and nothing has been written yet.
+ */
+export declare function readCreatorExport(zipPath: string): CreatorExport;
+/**
+ * The hosts serving assets that belong to THIS game — http(s) URLs in `world.json` and
+ * `game.json` whose path carries the game's own id.
+ *
+ * Read for one reason: a game's assets are minted under `worlds/v3/<gameId>/` by the api-server
+ * that hosts the Creator, and so is the game row a CLI project adopts by id. Importing a dev game
+ * into a project pinned to prod produces something that builds, runs and then fails every server
+ * command with a flat "not found or is not owned by the caller" — the one failure this conversion
+ * can see coming and the creator cannot. The caller compares these against the environment it
+ * resolved; nothing here decides anything.
+ *
+ * **The gameId filter is the whole point, not a refinement.** Every game — on every environment —
+ * references shared defaults that live on prod: `mini.bitmagic.ai/worlds/v3/BaseCharacter.glb` is
+ * in the game.json of a dev game and a prod game alike. Classifying on "any bitmagic host" reads
+ * that one line and calls every dev export a prod game, which is precisely the mistake this check
+ * exists to prevent. Only a URL carrying the game's own id was minted for this game, by the
+ * api-server that owns it.
+ *
+ * Named for what it returns rather than `assetHosts`, which is `mobile/asset-hosts.ts` — a
+ * different question (which hosts the LAN bridge proxies for a phone) about the same URLs.
+ */
+export declare function gameAssetHosts(source: CreatorExport): string[];