---
phase: 01-foundation
plan: 01
type: execute
wave: 1
depends_on: []
files_modified: [index.html]
autonomous: true
requirements: [VFX-05, CORE-07]
must_haves:
truths:
- "Canvas fills the entire browser window with no scrollbars or white space"
- "Canvas resizes immediately when the window is resized, maintaining minimum 4:3 aspect ratio"
- "Graphics render sharply on HiDPI/Retina displays (no blurry ball or paddle edges)"
- "Pressing W moves Player 1 paddle up; pressing S moves it down — responsively with no OS key-repeat lag"
- "Game loop runs continuously at device refresh rate; GameLoop, Renderer, Input objects exist in global scope"
artifacts:
- path: "index.html"
provides: "Complete HTML scaffold with embedded CSS, canvas element, and all four module objects"
contains: "GameLoop, Physics, Renderer, Input"
- path: "index.html"
provides: "HiDPI canvas setup — devicePixelRatio scaling applied on init and resize"
contains: "devicePixelRatio"
- path: "index.html"
provides: "Full-window canvas with aspect ratio enforcement and resize handler"
contains: "window.addEventListener('resize'"
- path: "index.html"
provides: "Keyboard input state tracking for W/S keys"
contains: "KeyW, KeyS"
key_links:
- from: "GameLoop.main()"
to: "requestAnimationFrame"
via: "window.requestAnimationFrame(this.main.bind(this))"
pattern: "requestAnimationFrame"
- from: "Renderer.init()"
to: "devicePixelRatio"
via: "canvas bitmap scale + ctx.scale(dpr, dpr)"
pattern: "devicePixelRatio"
- from: "Input.getVerticalInput()"
to: "GameLoop update cycle"
via: "Physics.update() queries Input.getVerticalInput() each frame"
pattern: "getVerticalInput"
---
Create the complete HTML scaffold for Super Pong Next Gen: a single index.html with embedded CSS, a full-window HiDPI-aware canvas, and the four core module objects (GameLoop, Renderer, Input, Physics skeleton). After this plan, the canvas renders sharply on Retina displays, fills the window with correct aspect ratio on resize, the game loop is running, and Player 1 can move a visible paddle with W/S keys.
Purpose: Every subsequent phase builds on this foundation. The module structure established here is the architecture all later phases extend.
Output: index.html — runnable directly in a browser with no build step.
@/home/dabit/.claude/get-shit-done/workflows/execute-plan.md
@/home/dabit/.claude/get-shit-done/templates/summary.md
@.planning/PROJECT.md
@.planning/ROADMAP.md
@.planning/STATE.md
@.planning/phases/01-foundation/01-CONTEXT.md
@.planning/phases/01-foundation/01-RESEARCH.md
Task 1: HTML scaffold, HiDPI canvas, and full-window Renderer
index.html
Create index.html from scratch. It must contain exactly:
**HTML structure:**
```html
Super Pong Next Gen
```
**CSS (inside `