plinko-game

🎮 Plinko Game

A modern, interactive Plinko game simulator built with vanilla JavaScript and Matter.js physics engine. Experience the thrill of the classic Plinko game with smooth physics, customizable settings, and an intuitive interface.

🎯 Features

🚀 Demo

Visit the live demo: Play Plinko Game

🎲 How to Play

  1. Set Your Bet: Enter the amount you want to wager (default: $100)
  2. Choose Difficulty: Select 8, 12, or 16 rows to adjust the challenge level
  3. Adjust Settings:
    • Use the Auto Speed slider to control how fast balls drop in auto-play mode
    • Adjust Ball Size to change the ball diameter
  4. Drop Balls:
    • Click once to drop a single ball
    • Hold the button to enable auto-play mode
  5. Watch and Win: Watch your ball bounce through the pegs and land in a multiplier bucket!

💰 Multipliers

Different row configurations offer unique multiplier distributions:

Higher risk = higher potential rewards!

🛠️ Technologies Used

📦 Installation

No build process required! Simply:

  1. Clone this repository: 
    git clone https://github.com/sebichin/plinko-game.git
  2. Open index.html in your web browser: 
    cd plinko-game
open index.html

Or use a local web server:

# Using Python
python -m http.server 8000

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

Then navigate to http://localhost:8000 in your browser.

🌐 Hosting on GitHub Pages

This project is configured to deploy automatically to GitHub Pages using GitHub Actions. The workflow:

  1. Triggers on pushes to the main branch
  2. Deploys the index.html file to GitHub Pages
  3. Makes the game accessible at https://sebichin.github.io/plinko-game/

Manual GitHub Pages Setup

If you want to set up GitHub Pages manually:

  1. Go to your repository settings
  2. Navigate to “Pages” in the sidebar
  3. Under “Source”, select “GitHub Actions”
  4. The game will be automatically deployed on the next push

🎨 Customization

The game is highly customizable. Here are some areas you can modify:

Physics Engine

The game uses a custom-built physics engine implementing advanced computational dynamics. For detailed information about the implementation, see PHYSICS_IMPLEMENTATION.md.

Key features:

Adjust Physics

Edit the physics constants in the JavaScript:

// In physics-engine.js
engine = new PhysicsEngine({ gravity: 980 });  // Gravity in pixels/second²

// In RigidBody constructor
restitution: 0.7,  // Bounciness (0-1)
friction: 0.08,    // Surface friction

Change Multipliers

Modify the MULTIPLIERS object:

const MULTIPLIERS = {
    8:  [29, 4, 2, 0.3, 2, 4, 29],
    12: [170, 24, 8.1, 2, 1, 0.5, 1, 2, 8.1, 24, 170],
    16: [1000, 26, 9, 4, 2, 0.2, 0.2, 0.2, 0.2, 0.2, 2, 4, 9, 26, 1000]
};

Customize Colors

Update the color scheme in the CSS or JavaScript render options:

render: { 
    fillStyle: '#ff0055',      // Ball color
    strokeStyle: '#ff88aa',    // Ball outline
    lineWidth: 2
}

🤝 Contributing

Contributions are welcome! Feel free to:

  1. Fork the repository
  2. Create a feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

📝 License

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

🙏 Acknowledgments

📞 Contact

Sebastian - @sebichin

Project Link: https://github.com/sebichin/plinko-game

Made with ❤️ by Sebastian

This site is open source. Improve this page.