Skip to content

Add Piano Hero rhythm game with song library and scoring#1

Open
mrfeixiang wants to merge 5 commits intomainfrom
claude/interactive-piano-game-zHL9o
Open

Add Piano Hero rhythm game with song library and scoring#1
mrfeixiang wants to merge 5 commits intomainfrom
claude/interactive-piano-game-zHL9o

Conversation

@mrfeixiang
Copy link
Copy Markdown
Owner

Summary

This PR introduces a complete rhythm game implementation called "Piano Hero" with a full-featured web application including gameplay mechanics, audio synthesis, song library, and scoring system.

Key Changes

  • Game Engine (GameEngine class): Core game loop with state management (menu, songs, playing, paused, results), song progression, note spawning with lookahead, and hit detection with timing windows
  • Audio System (AudioEngine class): Web Audio API integration with synthesized piano sounds using dual oscillators, envelope shaping, and low-pass filtering
  • Input Handling (InputManager class): Keyboard and touch/mouse input support for both physical piano keys and on-screen keyboard, with proper event debouncing
  • Note Rendering (NoteRenderer class): Falling note animation system with position calculation based on fall speed and hit timing, hit/miss visual feedback
  • Scoring System (ScoreTracker class): Hit detection with perfect/good/miss judgments, combo tracking with multipliers, and letter grade calculation
  • Song Library (SongLibrary class): Pre-loaded song collection (Twinkle Twinkle, Mary Had a Little Lamb, Hot Cross Buns, Happy Birthday, Ode to Joy) with BPM and difficulty metadata
  • UI/UX: Multi-screen interface with main menu, song selection, gameplay HUD, pause overlay, countdown sequence, and results screen with best score tracking
  • Styling: Comprehensive CSS with dark theme, gradient effects, responsive layout, color-coded note lanes, and smooth animations

Notable Implementation Details

  • Hit detection uses configurable timing windows (PERFECT_WIN: 55ms, GOOD_WIN: 130ms) for skill-based gameplay
  • Notes spawn with 2.2-second lookahead to allow smooth visual presentation
  • Score multiplier increases with combo (1x → 4x at 30+ combo)
  • Piano keyboard visual feedback with color mixing based on note being played
  • Local storage integration for tracking best scores per song
  • Countdown sequence with visual animation before song starts
  • Free Play mode for unrestricted practice without falling notes

https://claude.ai/code/session_011YpsvHY5f8LZtroDhY8Yvn

Three-file vanilla JS implementation (piano.html + piano.css + piano.js):
- 5 beginner songs (Twinkle Twinkle, Mary Had a Little Lamb, Hot Cross Buns,
  Happy Birthday, Ode to Joy) with beat-based timing data
- Falling-note highway with per-note neon lane colors and GPU-composited animation
- Web Audio API synthesized piano tones (no samples needed)
- Keyboard input (A-K white keys, W/E/T/Y/U black keys) + mouse/touch on keyboard
- PERFECT/GOOD/MISS hit detection with ±55ms / ±130ms windows
- Combo multiplier (1×–4×), grade system (S/A/B/C/D), localStorage high scores
- 3-2-1-GO countdown, pause/resume, and results screen

https://claude.ai/code/session_011YpsvHY5f8LZtroDhY8Yvn
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants