jozamudi f9cafe630c Fix game over condition and garbage row placement
- Remove premature elimination in addGarbageToPlayer (top rows check)
- Remove redundant y < 0 elimination check in lockPiece
- Players are only eliminated when spawnPiece fails (board full)
- Garbage rows now added to bottom of board, pushing blocks up
2026-03-20 07:53:08 -07:00
2026-03-20 07:09:51 -07:00

Tetris Battle Royale

A multiplayer Tetris Battle Royale game built with HTML, CSS, JavaScript, and Node.js.

Features

  • 2-8 Player Multiplayer: Real-time battles via WebSocket
  • Battle Royale Mechanics: Clear rows to send garbage to opponents
  • Classic Tetris Gameplay: All 7 tetrominoes with standard rotation
  • Retro Visuals: CRT scanlines, pixel art font, classic colors
  • Multiple Boards View: See all players' boards simultaneously

How It Works

When you clear rows, garbage rows are sent to random opponents:

  • 2 lines cleared → 1 garbage row sent
  • 3 lines cleared → 2 garbage rows sent
  • 4 lines (Tetris) → 4 garbage rows sent

The last player standing wins!

Setup

  1. Install dependencies:

    cd server
    npm install
    
  2. Start the server:

    node index.js
    
  3. Open http://localhost:3000 in 2-8 browser tabs

  4. Enter a room name and your name, then join

  5. Click "READY" when all players are ready

Controls

  • Arrow Left/Right: Move piece
  • Arrow Up: Rotate piece
  • Arrow Down: Soft drop
  • Space: Hard drop

Game Flow

  1. Lobby: Players join a room and wait
  2. Ready: All players click READY to start
  3. Game: Play Tetris, clear rows to attack opponents
  4. Elimination: Players are eliminated when pieces stack to the top
  5. Victory: Last player standing wins

File Structure

tetris-battle-royale/
├── server/
│   ├── index.js          # Node.js + Socket.io server
│   └── package.json
├── public/
│   ├── index.html        # Main HTML
│   ├── css/
│   │   └── style.css     # Retro styling with CRT effects
│   └── js/
│       ├── game.js       # Tetris game logic
│       ├── renderer.js   # Canvas rendering
│       ├── network.js    # Socket.io client
│       ├── ui.js         # UI management
│       └── app.js        # Main application
└── README.md

Technology Stack

  • Frontend: Vanilla JavaScript, HTML5 Canvas, CSS3
  • Backend: Node.js, Express, Socket.io
  • No frameworks - pure vanilla implementation

Troubleshooting

  • Port already in use: Change PORT in server/index.js
  • Can't connect: Make sure server is running on port 3000
  • Game not starting: Need at least 2 players ready
S
Description
vibe coded battle royal tetris game
Readme 54 MiB
Languages
JavaScript 90.1%
CSS 8%
HTML 1.9%