Skip to content

A rhythm-based game inspired by Friday Night Funkin', built with JavaScript and HTML5 Canvas. Test your reflexes and rhythm as you press arrow keys in time with the music!

License

Notifications You must be signed in to change notification settings

jackccrawford/rhythm-battle

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Rhythm Battle 🎮 🎵

License: MIT Made with JavaScript HTML5 CSS3 Built with Windsurf.ai

A rhythm-based game inspired by Friday Night Funkin', built with JavaScript and HTML5 Canvas. Test your reflexes and rhythm as you press arrow keys in time with the music!

Rhythm Battle Gameplay

🎯 Features

  • Four-lane rhythm gameplay similar to Friday Night Funkin'
  • Arrow key controls for intuitive gameplay
  • Timing-based scoring system (Perfect, Good, Okay, Miss)
  • Combo system that increases your score multiplier
  • Complete audio experience with sound effects and background music
  • Vertical scrolling notes that travel from bottom to top
  • Visual feedback for hits and misses
  • Responsive design that works on various screen sizes

🎮 How to Play

  1. Press the START GAME button to begin
  2. Press the corresponding arrow keys when notes reach the target zone
  3. Try to hit notes with perfect timing for maximum points
  4. Build combos to increase your score multiplier

Controls

  • ← Left Arrow: Left lane
  • ↓ Down Arrow: Left-center lane
  • ↑ Up Arrow: Right-center lane
  • → Right Arrow: Right lane

🚀 Quick Start

# Clone the repository
git clone https://github.com/mVara/rhythm-battle.git

# Navigate to the project directory
cd rhythm-battle

# Open the game in your browser
open index.html

Alternatively, you can serve the game using a local server:

# Using Python
python -m http.server 8000

# Using Node.js (with http-server)
npx http-server

Then open your browser and navigate to http://localhost:8000 or http://localhost:8080.

🛠️ Technologies

  • HTML5 Canvas for rendering the game
  • Vanilla JavaScript for game logic
  • CSS3 for styling
  • Web Audio API for sound management

🎵 Sound Credits

Sound effects from Freesound.org:

  • 8-Bit Sound Effects Library by LittleRobotSoundFactory (CC BY 3.0)
  • 8bit-harmony by electrobuz (CC BY 3.0)

🧠 Implementation Details

The game is built using a simple yet effective architecture:

  • Game Loop: Manages the update and render cycles
  • Note System: Controls the spawning and movement of notes
  • Input Handler: Processes keyboard inputs and timing
  • Scoring System: Calculates score based on timing accuracy
  • Audio Manager: Handles sound effects and background music

🔮 Future Enhancements

  • Add character animations
  • Implement multiple songs and difficulty levels
  • Add custom beatmap creation
  • Improve visual effects and feedback
  • Add multiplayer functionality

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

👤 Author

Jack C Crawford - Initial work

🙏 Acknowledgments

About

A rhythm-based game inspired by Friday Night Funkin', built with JavaScript and HTML5 Canvas. Test your reflexes and rhythm as you press arrow keys in time with the music!

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •