Rubik's Cube · kat-coder-pro-v2
Output generated Cost / run $0.0111 Runtime 65.1s
Prompt for this run
Using the pre-provided three.min.js (global THREE), render an interactive 3D Rubik's Cube with clickable face rotations, orbit-drag camera, and a scramble button.
TAKE IT TO CODE
A single self-contained HTML file — copy it and open in any browser, or reuse the prompt with your own pi-agent run.
RUN
METRICS
Transcript · 6 messages
Using the pre-provided three.min.js (global THREE), render an interactive 3D Rubik's Cube with clickable face rotations, orbit-drag camera, and a scramble button.
I'll create an interactive 3D Rubik's Cube with clickable face rotations, orbit camera controls, and a scramble button. Let me build this step by step.
/workspace/index.html (25186 bytes)Successfully wrote 25186 bytes to /workspace/index.html
{"command":"ls -la /workspace/index.html"}-rw-r--r-- 1 node node 25202 Jul 31 08:52 /workspace/index.html
Done! I've created a complete interactive 3D Rubik's Cube in `/workspace/index.html`. **Features:** - **3D rendering** with Three.js using the provided three.min.js - **Orbit camera** - click and drag to rotate around the cube, scroll to zoom - **Clickable face rotations** - click on any face to rotate that layer 90° - **Scramble button** - randomizes the cube with 20 random moves - **Solve button** - resets the cube to solved state - **Reset button** - returns to original position - **Visual polish** - gradient background, smooth animations, color-coded faces (red, orange, white, yellow, green, blue) - **Status indicator** - shows current state (ready, scrambling, solved) - **Mobile support** - touch gestures for camera control The cube renders with black edges for better visibility, and each face has the standard Rubik's Cube colors. The animation smoothly rotates layers when clicked, and the entire cube slowly rotates when idle for a nice visual effect. Just open `index.html` in a browser to start playing!