Each stop's group faced world +Z regardless of the road's local
tangent, so IDENTITÉS and GREETINGS showed mirrored text and the
GREETINGS plane read as crossing the road. Compute yaw once per stop
via atan2 from the anchor to pointAt(stop.t) so the panel's +Z always
points at the road it belongs to. Lamp yaw is world-space absolute, so
subtract the group's new rotation to keep its facing unchanged.
Swap hand-built boxes/cylinders for Kenney Car Kit, City Kit Roads,
and Furniture Kit low-poly models across the bus, stops, and world,
keeping ride/camera logic and Html panels untouched.
Only the scroller text credited ride.mod; add CREDITS.md and a
semantic-fallback line so no-JS visitors also see the "11th-hour"
by TDK CC BY 4.0 attribution (The Mod Archive, unmodified).
Also record the two spec items descoped during implementation:
chunky-pixel retro look instead of ordered dithering, and a
single MOD track instead of per-stop ambience shifts.
Floating tags node:22-alpine and nginx:1.27-alpine let upstream
swap image contents without review. Pin both FROM lines to their
current digest per the supply-chain policy, keeping the tag as
a trailing comment for readability.
Un-hashed libopenmpt.worklet.js was inheriting the immutable
1-year cache from /assets/, risking stale audio on chiptune3
bumps. Add a dedicated short-cache location for it.
Also fail closeBundle loudly if the worklet source vanishes,
instead of silently shipping a build with hanging audio.
nginx add_header directives are not inherited when a location block
declares its own add_header. Duplicated X-Content-Type-Options and
Referrer-Policy headers in all three location blocks.
Dockerfile implements multi-stage build: node:22-alpine for build
stage, nginx:1.27-alpine for production runtime. nginx.conf provides
SPA routing with gzip compression and cache headers. docker-compose.yml
prepared for Tower Traefik integration with external network and Host
route. All files match specification verbatim.
Add playwright.config.ts with webServer configured to run build and
preview on port 4173. Add e2e/smoke.spec.ts with 4 smoke tests:
rel=me anchor presence, all identity links in HTML, canvas and HUD
visibility, and reduced motion fallback rendering.
Restructure App.tsx to render Scroller outside #demo div to fix
selector ambiguity in e2e tests. Add test.exclude to vite.config.ts
to prevent vitest from running playwright tests.
Implement createModPlayer with a TDD-first ModPlayer contract
(idle/loading/playing/paused/unavailable), wired into App and
TrackerPanel. Uses chiptune3@0.8.7, loaded lazily via a deep
import (the package ships no main/exports field). Adds two Vite
fixes needed for the nested worklet asset to actually load: copy
libopenmpt.worklet.js next to the built worklet chunk, and
exclude chiptune3 from dep pre-bundling so dev mode resolves the
same sibling file.
Ships public/music/ride.mod: "11th-hour" by TDK, CC BY 4.0, from
The Mod Archive (modarchive.org, module ID 67104). Credited in
the HUD scroller text.
Implement Task 10: HUD components for LE BUS demoscene page.
- Scroller.tsx: canvas-2D sine-wave text animation at bottom
- TrackerPanel.tsx: play/mute control panel (top-right)
- modPlayer.ts: interface stubs (ModState, ModPlayer)
- CSS styling for both components appended to style.css
Context: the ride passed 4 stops (boot, identities, electron
fou, greetings) but rendered no content at any of them.
Approach: shared StopPanel component places a pole, a yellow
sign with the stop title, and a drei Html transform panel
anchored beside the road via stopAnchor(); each stop composes
it with its own content module.
Changes:
- StopPanel.tsx: pole + sign + Html panel, panel--active class
driven by useRide selector on the active stop id
- StopBoot.tsx: avatar art, name, tagline, bio lines
- StopIdentities.tsx: identity links list
- StopElectronFou.tsx: music blurb + pulsing tube amp with VU
needles animated via useFrame
- StopGreetings.tsx: greetings list + ride-again reset button
- Stops.tsx: mounts the four stop components
- style.css: .panel styling, active glow, sign buttons/links
- App.tsx: mount <Stops /> in the Canvas, drop the placeholder
Impact: the ride now has readable, interactive content at every
stop; build (tsc -b + vite build) and full vitest suite (12/12)
pass.
Implement Bus component (low-poly orange van following the path with
engine judder) and Passengers component (glowing I2C frames with
labels that board the bus at stops). Mount both in App.tsx. All
tests pass (12).
Add busPath curve helpers (pointAt/tangentAt), CameraRig as the
sole consumer of useRide.frame(), and App.tsx wiring the R3F
Canvas at low dpr for chunky pixels. Replace the boot.ts stub
with the real React root mount and append fixed-canvas CSS.
Implement ride progression logic with pure functions
(clamp01, ease, activeStop), Zustand store for state
management, and React input hook for wheel/keyboard/touch.
Add a Vite plugin that renders bio, links and greetings from the
Task 2 content modules into the raw served index.html at build
time, so non-JS clients (Mastodon's rel=me verifier included) see
real content and the mastodon.saillant.cc/@clement rel=me anchor.
Hide the fallback for sighted users once the 3D demo boots, but
keep it in the accessibility tree. Add @types/node so tsc can
type-check the node:fs import in the new test.
Implement content modules (links, bio, greetings, music, stops) as a
single source of truth for the UI, HUD, and 3D scene. All content is
defined in TypeScript with interfaces for type safety.
The Bandcamp URL for L'Électron Fou is not available yet, so the music
module defaults to the Mastodon profile URL as a fallback (per spec).
Update this URL when the Bandcamp page is created.
Establish initial project structure for LE BUS (clement.saillant.cc),
a demoscene-style personal identity hub built with Vite, React, and
react-three-fiber.
Changes:
- Add package.json with dependencies (React 19, Three.js,
react-three/fiber, zustand, playwright for e2e)
- Add tsconfig.json with ES2022 target and react-jsx support
- Add vite.config.ts with React plugin
- Add minimal index.html, src/main.tsx, and src/style.css
- Add README.md with usage commands
- Add .gitignore (node_modules, dist, test artifacts, .DS_Store)
- Generate package-lock.json via npm install
Note: chiptune3 removed from dependencies (not on npm registry;
will be isolated behind src/audio/modPlayer.ts in Task 11 with mocks).
Build and test harness verified:
- npm run build succeeds → dist/index.html created
- npx vitest run --passWithNoTests exits 0
Demoscene-style personal identity hub: bus on a giant PCB,
4 content stops, MOD tracker audio, semantic DOM fallback
with rel=me Mastodon verification. Static build, deployed
on Tower behind Traefik + cloudflared tunnel.
L'électron rare