← back to Flappy Clone
README.md
69 lines
# Flappy Clone
A polished, self-contained Flappy-Bird-style game in a single HTML file — no
external assets, no libraries, no build step. Space / click / tap to flap
through scrolling pipe gaps.

## Play
Open `index.html` in any modern browser:
```sh
open index.html # macOS
# or just double-click the file
```
That's it — the whole game is one file.
## Controls
| Action | Input |
|---------|-------------------------------|
| Flap | Space · Click · Tap |
| Pause | `P` · `Esc` · ⏸ button |
| Mute | `M` · 🔊 button |
| Restart | Space · Click (on Game Over) |
## Features
- Gravity + flap physics, scrolling pipes, score, increasing difficulty
(pipes speed up and gaps tighten as your score climbs)
- Parallax background — drifting clouds, sun, two layers of hills, and a
scrolling grass foreground
- Game-over panel with **medals** (Bronze 10 · Silver 20 · Gold 30 · Platinum 40)
- **Persistent best score** via `localStorage`
- Synthesized **sound effects** (Web Audio, no audio files) with mute toggle
- **Pause** support (auto-pauses when the tab loses focus)
- Screen-shake on crash, particle bursts on flap / score / death
- Fully responsive + retina-crisp (devicePixelRatio aware)
## Provenance & what changed
This started from Grok 4.5's Model Arena attempt at the "All-Models — Flappy
Clone" challenge. That artifact was a solid, good-looking base. This build
keeps its art and feel while fixing real defects and extending it:
**Defects fixed**
- **Framerate dependence** — the original tied physics to a 60 fps assumption
via `requestAnimationFrame`, so it ran ~2× too fast on 120 Hz displays.
Replaced with a fixed-timestep accumulator (physics is now identical at any
refresh rate).
- **Resize corruption** — the original scattered `*scale` through all logic and
never repositioned objects on resize, so resizing mid-game broke the world.
Rewrote to simulate in a fixed **480×720 virtual space** and scale only at
draw time — resizing is now seamless, and rendering is DPR-crisp.
- **Unfair instant ceiling death** — touching the top killed you instantly;
softened to a bonk/clamp (classic Flappy behavior).
**Extensions added**
- Persistent best score, sound effects + mute, pause, medals, screen-shake,
on-canvas touch buttons for mobile, and blur-to-pause.
## Tech
Plain Canvas 2D + Web Audio. ~500 lines, one file, zero dependencies.
Verified with headless Chrome (no runtime errors on the ready screen or during
live play).