3D Rubik’s cube in a single HTML file
Three.js r128 with OrbitControls from CDN, plus a vendored cubejs Kociemba solver in lib/ (worker for Firefox same-origin rules).
Face turns via keyboard (U…S, Shift for prime) or by dragging a face; scramble, show scramble, watch reverse solve, and reset with camera snap.
Architecture
| Rendering | WebGL scene with cubies; face detection maps drags to quarter-turn moves. |
|---|---|
| Solver | Kociemba two-phase solver in a worker thread; notation stays standard WCA (U = white on +Y in the model). |
| View | HUD Top menu picks which face is “up”; camera distance rotates with choice; preference in localStorage. |
Design
The goal is a zero-build deploy: edit index.html, reload nginx-backed URL, instant feedback. No bundler required for the public demo on
hromp.com/charlie/.