Tetris · gpt-6.1-sol
Output generated Cost / run $0.1719 Runtime 188.9s
Prompt for this run
Build a playable Tetris on a canvas with all seven tetrominoes, rotation, line clears, increasing speed, a next-piece preview, and score.
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 · 23 messages
Build a playable Tetris on a canvas with all seven tetrominoes, rotation, line clears, increasing speed, a next-piece preview, and score.
thinking
**Designing Tetris UI** I'm thinking about implementing a polished UI for a Tetris-style game. I want it to have a distinctive dark navy layout with orange neon coral accents. The main game canvas will be 300x600, surrounded by a left sidebar for controls and a right sidebar for score and stats. I’ll need to set up an initial overlay for the game, including a play button and a preview of the active piece. Keyboard controls will include arrows for movement and specific keys for actions like dropping and rotating tetrominoes.**Enhancing Game Mechanics** I’m working on the scoring system for the game, where clearing lines will give points based on levels and multipliers. I need to implement a natural key repeat functionality for controls, along with a pause overlay for game-over situations. The sidebar will include instructions, a preview for holds, and a scoreboard for tracking scores. I want to keep everything uncluttered, and I’ll ensure there’s a sound toggle and a visual status indicator that shows readiness for play. I'll also consider localStorage for better data management.
I’ll build a polished, keyboard-playable Tetris with all seven pieces, a next-piece preview, scoring, and progressively faster levels.
index.html (22090 bytes)Successfully wrote to index.html
{"action":"reload","x":0,"y":0,"toX":0,"toY":0,"text":"","delta":0}Frame 1, +0ms
[Browser image supplied to model]
{"console":["warning: An iframe which has both allow-scripts and allow-same-origin for its sandbox attribute can escape its sandboxing."],"dom":"block\nshift\nA LITTLE FOCUS. A LOT OF BLOCKS.\nFind your flow.\n\nMake space. Clear lines. Keep going.\n\nNew game\nHOLD\nC\nHOW TO PLAY\nMove\n←\n→\nRotate\n↑\nX\nRotate back\nZ\nSoft drop\n↓\nHard drop\nSpace\nHold piece\nC\nPause\nP\n✦A little tip\nClear four lines at once for a Tetris — and a big score boost.\nReady to stack?\n\nA familiar game. A fresh start.\nHow far can you go?\n\nLet's play\nor press Enter to start\nReady when you are\nSCORE\n000000\nPersonal best\n0\nLEVEL\n01\nLINES\n00\nUP NEXT\n3 PIECES\nNext level\n0 / 10 lines\nBuilt for the in-between moments.\nKeyboard recommended\n·\nNo distractions. Just blocks.","images":"attached"}
thinking
{"action":"click","x":600,"y":555,"toX":0,"toY":0,"text":"","delta":0}Frame 1, +0ms
[Browser image supplied to model]
{"console":["warning: An iframe which has both allow-scripts and allow-same-origin for its sandbox attribute can escape its sandboxing."],"dom":"block\nshift\nA LITTLE FOCUS. A LOT OF BLOCKS.\nFind your flow.\n\nMake space. Clear lines. Keep going.\n\nNew game\nHOLD\nC\nHOW TO PLAY\nMove\n←\n→\nRotate\n↑\nX\nRotate back\nZ\nSoft drop\n↓\nHard drop\nSpace\nHold piece\nC\nPause\nP\n✦A little tip\nClear four lines at once for a Tetris — and a big score boost.\nIn the flow\nSCORE\n000000\nPersonal best\n0\nLEVEL\n01\nLINES\n00\nUP NEXT\n3 PIECES\nNext level\n0 / 10 lines\nBuilt for the in-between moments.\nKeyboard recommended\n·\nNo distractions. Just blocks.","images":"attached"}
thinking
{"action":"key","x":0,"y":0,"toX":0,"toY":0,"text":"ArrowUp","delta":0}Frame 1, +0ms
[Browser image supplied to model]
{"console":["warning: An iframe which has both allow-scripts and allow-same-origin for its sandbox attribute can escape its sandboxing."],"dom":"block\nshift\nA LITTLE FOCUS. A LOT OF BLOCKS.\nFind your flow.\n\nMake space. Clear lines. Keep going.\n\nNew game\nHOLD\nC\nHOW TO PLAY\nMove\n←\n→\nRotate\n↑\nX\nRotate back\nZ\nSoft drop\n↓\nHard drop\nSpace\nHold piece\nC\nPause\nP\n✦A little tip\nClear four lines at once for a Tetris — and a big score boost.\nIn the flow\nSCORE\n000000\nPersonal best\n0\nLEVEL\n01\nLINES\n00\nUP NEXT\n3 PIECES\nNext level\n0 / 10 lines\nBuilt for the in-between moments.\nKeyboard recommended\n·\nNo distractions. Just blocks.","images":"attached"}
{"action":"key","x":0,"y":0,"toX":0,"toY":0,"text":"Space","delta":0}Frame 1, +0ms
[Browser image supplied to model]
{"console":["warning: An iframe which has both allow-scripts and allow-same-origin for its sandbox attribute can escape its sandboxing."],"dom":"block\nshift\nA LITTLE FOCUS. A LOT OF BLOCKS.\nFind your flow.\n\nMake space. Clear lines. Keep going.\n\nNew game\nHOLD\nC\nHOW TO PLAY\nMove\n←\n→\nRotate\n↑\nX\nRotate back\nZ\nSoft drop\n↓\nHard drop\nSpace\nHold piece\nC\nPause\nP\n✦A little tip\nClear four lines at once for a Tetris — and a big score boost.\nIn the flow\nSCORE\n000030\nPersonal best\n30\nLEVEL\n01\nLINES\n00\nUP NEXT\n3 PIECES\nNext level\n0 / 10 lines\nBuilt for the in-between moments.\nKeyboard recommended\n·\nNo distractions. Just blocks.","images":"attached"}
thinking
{"action":"key","x":0,"y":0,"toX":0,"toY":0,"text":"c","delta":0}Frame 1, +0ms
[Browser image supplied to model]
{"console":["warning: An iframe which has both allow-scripts and allow-same-origin for its sandbox attribute can escape its sandboxing."],"dom":"block\nshift\nA LITTLE FOCUS. A LOT OF BLOCKS.\nFind your flow.\n\nMake space. Clear lines. Keep going.\n\nNew game\nHOLD\nC\nHOW TO PLAY\nMove\n←\n→\nRotate\n↑\nX\nRotate back\nZ\nSoft drop\n↓\nHard drop\nSpace\nHold piece\nC\nPause\nP\n✦A little tip\nClear four lines at once for a Tetris — and a big score boost.\nIn the flow\nSCORE\n000030\nPersonal best\n30\nLEVEL\n01\nLINES\n00\nUP NEXT\n3 PIECES\nNext level\n0 / 10 lines\nBuilt for the in-between moments.\nKeyboard recommended\n·\nNo distractions. Just blocks.","images":"attached"}
{"action":"key","x":0,"y":0,"toX":0,"toY":0,"text":"p","delta":0}Frame 1, +0ms
[Browser image supplied to model]
{"console":["warning: An iframe which has both allow-scripts and allow-same-origin for its sandbox attribute can escape its sandboxing."],"dom":"block\nshift\nA LITTLE FOCUS. A LOT OF BLOCKS.\nFind your flow.\n\nMake space. Clear lines. Keep going.\n\nNew game\nHOLD\nC\nHOW TO PLAY\nMove\n←\n→\nRotate\n↑\nX\nRotate back\nZ\nSoft drop\n↓\nHard drop\nSpace\nHold piece\nC\nPause\nP\n✦A little tip\nClear four lines at once for a Tetris — and a big score boost.\nTake a breather.\n\nYour blocks will be right here.\n\nKeep going\npress P or Enter to resume\nOn a little break\nSCORE\n000030\nPersonal best\n30\nLEVEL\n01\nLINES\n00\nUP NEXT\n3 PIECES\nNext level\n0 / 10 lines\nBuilt for the in-between moments.\nKeyboard recommended\n·\nNo distractions. Just blocks.","images":"attached"}
thinking
**Addressing patch focus and locking issues** I need to focus on the patch details and possibly narrow it down. The actual speed cap for dt100 means that low FPS might become a problem. There’s a lock resetting issue where the DX resets even if not grounded, which leads to incorrect reset behavior. To improve resetLock, I might only call it when grounded to avoid unnecessary resets. Currently, rotation gets 20, then the lock resets, but I need to set it to check if grounded first.
{"path":"index.html","edits":[{"oldText":"function resetLock(){if(lockResets<15){lockTime=0;lockResets++}}","newText":"function resetLock(){Successfully replaced 5 block(s) in index.html.
thinking
The game is built, and movement, rotation, hard drop, hold, and pause work in the browser. I’m checking line-clear scoring and level progression next.
{"command":"node <<'NODE'\nconst fs=require('fs'),vm=require('vm'),assert=require('assert');\nlet source=fs.readFileSync('index.html','utf8'PASS: seven-piece bag, all rotations, hold restrictions, hard drop, pause, 1/2/3/4-line scores, level progression, game over, and restart.
thinking
{"action":"reload","x":0,"y":0,"toX":0,"toY":0,"text":"","delta":0}Frame 1, +0ms
[Browser image supplied to model]
{"console":["warning: An iframe which has both allow-scripts and allow-same-origin for its sandbox attribute can escape its sandboxing."],"dom":"block\nshift\nA LITTLE FOCUS. A LOT OF BLOCKS.\nFind your flow.\n\nMake space. Clear lines. Keep going.\n\nNew game\nHOLD\nC\nHOW TO PLAY\nMove\n←\n→\nRotate\n↑\nX\nRotate back\nZ\nSoft drop\n↓\nHard drop\nSpace\nHold piece\nC\nPause\nP\n✦A little tip\nClear four lines at once for a Tetris — and a big score boost.\nReady to stack?\n\nA familiar game. A fresh start.\nHow far can you go?\n\nLet's play\nor press Enter to start\nReady when you are\nSCORE\n000000\nPersonal best\n0\nLEVEL\n01\nLINES\n00\nUP NEXT\n3 PIECES\nNext level\n0 / 10 lines\nBuilt for the in-between moments.\nKeyboard recommended\n·\nNo distractions. Just blocks.","images":"attached"}
Created **index.html** — a self-contained, playable Tetris with: - All seven tetrominoes and wall-kick rotation - Line clears, scoring, and increasing speed - Next-three-piece preview, hold, and ghost piece - Pause, restart, optional sound, and saved best score **Controls:** ←/→ move, ↑ rotate, ↓ soft drop, Space hard drop, C hold, P pause. Browser-tested and verified scoring, level progression, and game-over behavior.