From 58fce3f810e1c98eff71a7a9a0118f4d7ed1fe40 Mon Sep 17 00:00:00 2001 From: ruvnet Date: Tue, 19 May 2026 22:43:32 +0000 Subject: [PATCH] three.js demos: fix(three.js): graceful banner when X Bot.fbx 404s on gh-pages (#651) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Demos 04 and 05 work fine locally — operator has assets/X Bot.fbx present. On the gh-pages deploy the FBX is intentionally absent (Mixamo license boundary, .gitignored) and the previous onError handler just logged 'FBX load failed' to the console and left a stuck '⚠ Load failed — see console' message in the overlay. Replaces both onError handlers with an in-page card that: - Explains why the asset is missing (license boundary, not a bug) - Tells you exactly how to run it locally (Mixamo download path, where to drop the file, the serve-demo.py command) - Links to Mixamo + the repo source + back to the gallery - Lets the ADR-097 helpers scene keep rendering behind it - Logs at warn (not error) — no more uncaught console.error noise The success branch is untouched, so local development is identical to before. 6a2b2bdcbfc433379cdc2058a86e50a8ca898377 --- three.js/demos/04-skinned-fbx.html | 56 +++++++++++++++++++++++-- three.js/demos/05-skinned-realtime.html | 52 ++++++++++++++++++++++- 2 files changed, 103 insertions(+), 5 deletions(-) diff --git a/three.js/demos/04-skinned-fbx.html b/three.js/demos/04-skinned-fbx.html index 8353c015..8c186b97 100644 --- a/three.js/demos/04-skinned-fbx.html +++ b/three.js/demos/04-skinned-fbx.html @@ -572,9 +572,59 @@ const txt = document.querySelector('#loading .text'); if (txt) txt.textContent = `▸ Loading skinned subject · X Bot.fbx · ${pct} %`; }, (err) => { - console.error('FBX load failed', err); - const txt = document.querySelector('#loading .text'); - if (txt) txt.textContent = '⚠ Load failed — see console'; + // Graceful degradation: when the FBX 404s on gh-pages (Mixamo + // X Bot.fbx is gitignored — license boundary, not redistributed) + // we hide the spinner and show a friendly banner explaining how + // to run this demo locally with your own Mixamo download. + // Local development with assets/X Bot.fbx present hits the + // success branch above and never sees this UI. + console.warn('FBX load failed — showing fallback banner', err); + const loading = document.getElementById('loading'); + if (loading) { + loading.innerHTML = ` +
+
+ 🦴 Mixamo asset not bundled in this deployment +
+
+ This demo loads X Bot.fbx + from Mixamo, which is intentionally not redistributed here (license boundary). + The ADR-097 helpers scene (grid / axes / per-node CSI boxes) is rendering behind this card — + click outside to interact with it. +
+
+ To run this demo with the character, clone the repo, download + X Bot.fbx (FBX Binary · T-Pose · Without Skin) + from mixamo.com + into examples/three.js/assets/, then run + python examples/three.js/server/serve-demo.py. +
+
+ + 📂 Source on GitHub + + + 🦴 Get X Bot from Mixamo + + + ← Back to demo gallery + +
+
+ `; + loading.style.pointerEvents = 'auto'; + loading.style.cursor = 'default'; + } }); function playClip(name) { diff --git a/three.js/demos/05-skinned-realtime.html b/three.js/demos/05-skinned-realtime.html index a366096b..efdc88ad 100644 --- a/three.js/demos/05-skinned-realtime.html +++ b/three.js/demos/05-skinned-realtime.html @@ -721,8 +721,56 @@ const txt = document.querySelector('#loading .text'); if (txt) txt.textContent = `▸ Loading skinned subject · X Bot.fbx · ${pct} %`; }, (err) => { - console.error('FBX load failed', err); - document.querySelector('#loading .text').textContent = '⚠ Load failed — see console'; + // Graceful degradation when X Bot.fbx 404s on gh-pages (license + // boundary — not redistributed). Local runs with the FBX present + // hit the success branch above and never see this banner. + console.warn('FBX load failed — showing fallback banner', err); + const loading = document.getElementById('loading'); + if (loading) { + loading.innerHTML = ` +
+
+ 🦴 Mixamo asset not bundled in this deployment +
+
+ This realtime pose demo retargets webcam + MediaPipe onto + X Bot.fbx, + which Mixamo licenses for direct download by end users and is intentionally not + redistributed here. The ADR-097 helpers scene is still rendering behind this card. +
+
+ To run locally: clone the repo, get + X Bot.fbx (FBX Binary · T-Pose · Without Skin) + from mixamo.com, + drop it in examples/three.js/assets/, then + python examples/three.js/server/serve-demo.py. +
+
+ + 📂 Source on GitHub + + + 🦴 Get X Bot from Mixamo + + + ← Back to demo gallery + +
+
+ `; + loading.style.pointerEvents = 'auto'; + loading.style.cursor = 'default'; + } }); // ---------------------------------------------------------------------