diff --git a/README.md b/README.md index 6a08601..2dcc415 100644 --- a/README.md +++ b/README.md @@ -2,32 +2,138 @@ A browser-based drum rhythm game. Notes scroll down the screen and you hit the matching drum pad in time — like Rock Band, but it runs entirely in your browser with no server, no dependencies, no install. Just open `index.html`. -Works with **keyboard**, **Wii Rock Band drum kit via USB**, or any gamepad. +Works with **keyboard**, **Wii Rock Band drums**, **Xbox/PS Rock Band drums**, **Guitar Hero drums**, or any USB gamepad. Includes a **Remap Pads** button to configure any controller. ## How to Play 1. Open `index.html` in Chrome or Edge -2. Pick a genre and rhythm (or a classical piece) -3. Click **Start** -4. Hit the pads when notes reach the line: +2. Pick a genre and song +3. Adjust speed/volume sliders if desired +4. Click **Start** +5. Hit the pads when notes reach the line: - **F** = Red (Tom) - **G** = Yellow (Snare) - **H** = Blue (Hi-hat) - **J** = Green (Tom) - **Space** = Kick (Bass drum) + - **Escape** = Pause ## Features -- **9 Genres**: Rock, Metal, Jazz, Hip Hop, Funk, Latin, Electronic, Country, Classical -- **146 Rhythms**: 120 drum patterns + 26 classical orchestral pieces -- **Classical Mode**: Synthesized orchestra plays automatically while you hit the melody notes on the pads. Choose between drum sounds or orchestral hit sounds. -- **26 Classical Pieces**: Beethoven's 5th, Hall of the Mountain King, O Fortuna, Ride of the Valkyries, Toccata & Fugue, Bolero, Also Sprach Zarathustra (2001), The Blue Danube, Flight of the Bumblebee, Fur Elise, Canon in D, Ode to Joy, 1812 Overture, and more -- **MP3 Jam Mode**: Load your own music and drum along freely -- **Multiplayer**: Take turns on the same rhythm, scores compared at the end -- **Pad Toggles**: Turn pads on/off to adjust difficulty — start with kick+snare, add more as you improve -- **Leaderboard**: Scores saved locally with player name, accuracy, and streak -- **Preview**: Hear any rhythm before playing -- **Gamepad Support**: Wii Rock Band drums via USB, auto-detected +- **14 Genres** across two modes: synth orchestra songs + drum beat patterns +- **65 synth pieces** with full synthesized orchestra background (48 minutes) +- **120 drum patterns** across 8 genres +- **Drums or Orchestra mode** — choose whether pad hits play drum sounds or the actual melody note +- **Speed control** — slow down to 50% for practice or speed up to 150% +- **Volume control** — adjustable master volume +- **Pause/Resume** — press Escape or the pause button mid-song +- **Gamepad Remap** — configure any USB drum kit with the Remap Pads button +- **Multiplayer** — take turns, scores compared at the end +- **Pad Toggles** — turn pads on/off to adjust difficulty +- **Preview** — hear any song before playing +- **Leaderboard** — scores saved locally + +## Song List + +### Singalong (10 songs) +- Drunken Sailor (Sea Shanty) +- Molly Malone (Irish, 1880s) +- Whiskey in the Jar (Irish Traditional) +- The Parting Glass (Irish/Scots Traditional) +- Amazing Grace (1779) +- Auld Lang Syne (1788) +- When the Saints Go Marching In (Spiritual) +- Oh My Darling, Clementine (1884) +- Scarborough Fair (English Medieval) +- My Bonnie Lies Over the Ocean (Scottish, 1881) + +### Christmas (10 songs) +- Jingle Bells (1857) +- Silent Night (1818) +- Deck the Halls (1862) +- We Wish You a Merry Christmas (1500s) +- O Christmas Tree (1824) +- The First Noel (1823) +- Joy to the World (1719) +- Away in a Manger (1885) +- 12 Days of Christmas (1780) +- Hark the Herald Angels Sing (1840) + +### Folk (8 songs) +- Oh! Susanna (Stephen Foster, 1848) +- Greensleeves (English, 1580) +- Camptown Races (Stephen Foster, 1850) +- Red River Valley (American, 1870s) +- Home on the Range (American, 1870s) +- Yankee Doodle (American, 1770s) +- Turkey in the Straw (American, 1820s) +- Danny Boy (Irish, 1910s) + +### Classical (26 pieces) +- Beethoven's 5th (Opening) +- Hall of the Mountain King (Grieg) +- O Fortuna (Orff) +- Ride of the Valkyries (Wagner) +- Mars, Bringer of War (Holst) +- Toccata & Fugue in D Minor (Bach) +- William Tell Overture — Gallop (Rossini) +- Bolero (Ravel) +- Also Sprach Zarathustra (R. Strauss) — 2001: A Space Odyssey +- Barber of Seville Overture (Rossini) +- The Blue Danube (J. Strauss II) — 2001: A Space Odyssey +- Sabre Dance (Khachaturian) +- Night on Bald Mountain (Mussorgsky) — Fantasia +- Sorcerer's Apprentice (Dukas) — Fantasia +- Swan Lake Theme (Tchaikovsky) +- Morning Mood (Grieg) +- Flight of the Bumblebee (Rimsky-Korsakov) +- Dance of the Sugar Plum Fairy (Tchaikovsky) +- 1812 Overture Finale (Tchaikovsky) +- Habanera from Carmen (Bizet) +- Spring from Four Seasons (Vivaldi) +- Fur Elise (Beethoven) +- Canon in D (Pachelbel) +- Hungarian Dance No. 5 (Brahms) +- Ode to Joy (Beethoven) +- William Tell Overture — Storm (Rossini) + +### Video Games (5 pieces) +- Korobeiniki / Tetris Theme (Russian Folk, 1861) +- Turkish March (Mozart) +- Hungarian Rhapsody No. 2 (Liszt) +- Can-Can (Offenbach) +- Kalinka (Russian Folk, 1860) + +### Chiptune Originals (6 pieces, composed by Claude.ai) +- Pixel Quest (Platformer) +- Starfield (Space Shooter) +- Dragon's Keep (RPG Overworld) +- Turbo Dash (Racing) +- Dungeon Crawl (Dark Adventure) +- Victory Fanfare (Boss Defeated) + +### Drum Patterns (120 patterns) +- **Rock** (15): Basic Rock, Classic Rock, Punk Rock, Arena Rock, and more +- **Metal** (15): Double Bass, Thrash, Doom Metal, Blast Beat, and more +- **Jazz** (15): Jazz Ride, Bebop, Bossa Nova, Fusion, and more +- **Hip Hop** (15): Boom Bap, Trap, Lo-Fi, Drill, and more +- **Funk** (15): Classic Funk, Ghost Notes, P-Funk, Afrobeat, and more +- **Latin** (15): Samba, Salsa, Reggaeton, Cumbia, and more +- **Electronic** (15): Four on the Floor, Breakbeat, DnB, Dubstep, and more +- **Country** (15): Two-Step, Bluegrass, Rockabilly, Gospel, and more + +## USB Drum Kit Compatibility + +The Gamepad API works with any USB controller. Use the **Remap Pads** button to configure your kit. + +| Kit | Connection | +|-----|-----------| +| Wii Rock Band drums | USB dongle (default mapping) | +| Xbox 360 Rock Band drums | USB wired | +| PS3/PS4 Rock Band drums | USB | +| Guitar Hero drums | USB | +| Roland/Alesis/Donner | USB-MIDI adapter | +| Any USB gamepad | Remap to configure | ## Synthesizer @@ -39,12 +145,13 @@ All sounds are generated in real-time using the Web Audio API — no audio files | Snare | Highpass noise burst + 180Hz tone | | Hi-hat | Highpass noise burst, very short | | Toms | Sine oscillator pitch sweep | -| Strings | Sawtooth oscillator + lowpass filter | -| Brass | Square oscillator + lowpass filter | +| Strings | Sawtooth + lowpass filter | +| Brass | Square + lowpass filter | | Woodwind | Triangle oscillator | | Bass | Sine oscillator, low frequency | | Timpani | Sine frequency sweep | | Choir | Multiple detuned sine oscillators | +| Chiptune | Square wave with pulse bass | ## Tech @@ -53,7 +160,7 @@ All sounds are generated in real-time using the Web Audio API — no audio files - Web Audio API for all sound synthesis - Canvas 2D for the note highway - Gamepad API for drum kit input -- localStorage for score persistence +- localStorage for scores and gamepad mapping - Works on Windows, Linux, and Mac ## License diff --git a/index.html b/index.html index 2627e19..71d0ee3 100644 --- a/index.html +++ b/index.html @@ -45,6 +45,14 @@ canvas{display:block;} .stbl{width:100%;max-width:600px;border-collapse:collapse;} .stbl th{text-align:left;padding:7px 9px;border-bottom:1px solid #222;font-size:11px;opacity:.5;} .stbl td{padding:7px 9px;border-bottom:1px solid #111;font-size:12px;} +.sticky-start{position:sticky;bottom:0;padding:12px 0 4px;background:linear-gradient(transparent,#0a0a0f 35%);z-index:10;display:flex;gap:8px;justify-content:center;align-items:center;width:100%;max-width:700px;} +#pause-overlay{display:none;position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.8);z-index:20;flex-direction:column;align-items:center;justify-content:center;gap:16px;} +#pause-overlay.show{display:flex;} +#pause-overlay h2{font-size:28px;color:#fff;} +#remap-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.9);z-index:30;flex-direction:column;align-items:center;justify-content:center;gap:16px;} +#remap-overlay.show{display:flex;} +#remap-prompt{font-size:20px;font-weight:bold;text-align:center;} +#remap-status{font-size:13px;opacity:.5;text-align:center;}
@@ -103,13 +111,25 @@ canvas{display:block;} - +