diff --git a/.github/workflows/threejs-pages.yml b/.github/workflows/threejs-pages.yml new file mode 100644 index 00000000..a542e88f --- /dev/null +++ b/.github/workflows/threejs-pages.yml @@ -0,0 +1,70 @@ +name: three.js demos → GitHub Pages + +# Publishes the ADR-097 three.js demos under gh-pages/three.js/. +# Uses keep_files: true so the existing observatory/, pose-fusion/, +# pointcloud/, nvsim/, and root index.html demos are preserved. +# +# Demos 04 and 05 require a Mixamo "X Bot.fbx" placed in assets/. +# That file is intentionally gitignored (license boundary), so this +# workflow does NOT ship it. Demos 01-03 work standalone; the index +# page documents the FBX requirement honestly. + +on: + push: + branches: [main] + paths: + - 'examples/three.js/**' + - '.github/workflows/threejs-pages.yml' + workflow_dispatch: + +permissions: + contents: write + +concurrency: + group: threejs-pages + cancel-in-progress: true + +jobs: + build-and-deploy: + runs-on: ubuntu-latest + steps: + - name: Checkout main + uses: actions/checkout@v4 + + - name: Stage demos for Pages + run: | + mkdir -p _site/three.js + # Copy everything except the local Python server (CI doesn't need it) + # and any stray scratch screenshots. + cp -r examples/three.js/demos _site/three.js/demos + cp -r examples/three.js/screenshots _site/three.js/screenshots + cp examples/three.js/README.md _site/three.js/README.md + # An index.html that lists the 5 demos with the FBX caveat. + cp examples/three.js/index.html _site/three.js/index.html + # Mixamo FBX is gitignored — assets dir won't exist in CI. + # Drop an empty placeholder so the relative path 'assets/' resolves + # to a directory listing (404 on missing file) instead of an opaque + # network error. Browsers showing the 404 path makes the failure + # visible to anyone trying demos 04/05 without their own FBX. + mkdir -p _site/three.js/assets + cat > _site/three.js/assets/README.txt <<'EOF' + The Mixamo "X Bot.fbx" required by demos 04-skinned-fbx.html and + 05-skinned-realtime.html is intentionally not redistributed here. + + Download your own from https://mixamo.com (FBX Binary, T-Pose, + Without Skin) and place it here as "X Bot.fbx" if you want to + run those demos locally. See examples/three.js/README.md in the + repo for context. + EOF + echo "Staged contents:" + ls -R _site/three.js/ | head -30 + + - name: Deploy to GitHub Pages + uses: peaceiris/actions-gh-pages@v3 + with: + github_token: ${{ secrets.GITHUB_TOKEN }} + publish_dir: _site + # Critical: preserve observatory/, pose-fusion/, pointcloud/, nvsim/ + # and the root index.html already on gh-pages. + keep_files: true + commit_message: 'three.js demos: ${{ github.event.head_commit.message }}' diff --git a/README.md b/README.md index 4e4fa5ac..2b65edc8 100644 --- a/README.md +++ b/README.md @@ -117,10 +117,14 @@ node scripts/mincut-person-counter.js --port 5006 # Correct person counting ▶ Dual-Modal Pose Fusion Demo  |  ▶ Live 3D Point Cloud +  |  + ▶ three.js Demos (5) > The [server](#-quick-start) is optional for visualization and aggregation — the ESP32 [runs independently](#esp32-s3-hardware-pipeline) for presence detection, vital signs, and fall alerts. > > **Live ESP32 pipeline**: Connect an ESP32-S3 node → run the [sensing server](#sensing-server) → open the [pose fusion demo](https://ruvnet.github.io/RuView/pose-fusion.html) for real-time dual-modal pose estimation (webcam + WiFi CSI). See [ADR-059](docs/adr/ADR-059-live-esp32-csi-pipeline.md). +> +> **three.js scene gallery** at [`/three.js/`](https://ruvnet.github.io/RuView/three.js/) — five progressively richer ADR-097 demos: helpers, cinematic, GLTF skinned, FBX skinned, and a live MediaPipe→Mixamo retargeting feed driven by ESP32 CSI. Demos 04 and 05 require a local Mixamo `X Bot.fbx` (license boundary — not redistributed). ## 🤗 Pretrained model on Hugging Face diff --git a/examples/three.js/index.html b/examples/three.js/index.html new file mode 100644 index 00000000..31567377 --- /dev/null +++ b/examples/three.js/index.html @@ -0,0 +1,168 @@ + + + + + + +RuView · three.js demos · ADR-097 sensing-helpers scene + + + +
+ +

RuView · three.js demos

+

+ Five progressively richer browser demos of the ADR-097 + sensing-helpers scene, ending with a live MediaPipe-Pose → Mixamo X Bot retargeting pipeline driven + by a real ESP32 CSI feed. +

+ +
+ + +

01 · Helpers standalone

+
Plain ADR-097 helpers in the point-cloud viewer. No external assets.
+ 01 screenshot + + + +

02 · Cinematic standalone

+
Cinematic camera + pseudo-CSI visualization on top of #01.
+ 02 screenshot + + + +

03 · Skinned (GLTF) standalone

+
GLTF skinned mesh + additive animation blending in the ADR-097 scene.
+ 03 screenshot + + + +

04 · Skinned FBX needs FBX

+
Mixamo X Bot via FBXLoader. Requires a local assets/X Bot.fbx.
+ 04 screenshot + + + +

05 · Realtime (Pose + CSI) needs FBX

+
Webcam → MediaPipe Pose Heavy → Mixamo IK retarget, live ESP32 CSI overlay.
+ 05 screenshot + + +
+ +
+ Demos 04 and 05 need a Mixamo asset. The Mixamo + X Bot.fbx file is intentionally not redistributed in + this deployment — it's licensed for end-users to download from + mixamo.com directly. + To run these locally: clone the repo, download X Bot.fbx + (FBX Binary, T-Pose, Without Skin) into + examples/three.js/assets/, then run + python examples/three.js/server/serve-demo.py. +
+ +
+ Source: github.com/ruvnet/RuView/tree/main/examples/three.js +  ·  ADR-097 · three.js r128 +
+ +
+ +