The showroom after Phase 7
Local imports cannot run in the preview, so this example has the code of every project file inline, each under a comment with its path. The files of Phases 3, 5 and 6 are shortened stand-ins. Press the three buttons; drag, scroll or pinch. The tread texture loads from /data/3d/textures.
The showroom gets orbit controls with limits, three preset views (side, front, rear wheel) on buttons that work with a keyboard, a camera that refits when the screen changes shape, and the bike's rear wheel.
Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.
Ready for more? This phase has 3 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Add a fourth preset, "top", that looks straight down at the bike from 2 m above. What limit gets in the way, and what do you change?
Make a key press, 1, 2 or 3, jump to a preset. Where does the listener go?
Explain it without notes
Why does the build compute viewFor when you click, instead of when the page loads?
What happens when the visitor drags the camera and then turns the phone?
Console
Nothing logged yet.Expected console output
bike parts: down-tube, top-tube, seat-tube, chain-stays, seat-stays, fork, front-wheel, rear-wheel
draw calls: 18 | triangles: 7968