e7917a338e67046ec817ec2190e3b06fce208f9a
Changes: - Removed room-based architecture, now using single global lobby - Players only need to enter their name to join - Game starts when all players in lobby are ready (min 2, max 8) - Simplified UI - no room name field, shows "Global Lobby" header - Updated all server events to use io.emit instead of io.to(roomName) Files modified: - server/index.js: Replaced rooms Map with single lobby object - public/index.html: Removed room name input, updated button text - public/js/network.js: Renamed joinRoom/leaveRoom to joinLobby/leaveLobby - public/js/ui.js: Simplified join flow, removed room name validation - public/js/app.js: Updated game header to show "GLOBAL LOBBY" - PLAN.md: Marked all phases as complete
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
-
Install dependencies:
cd server npm install -
Start the server:
node index.js -
Open
http://localhost:3000in 2-8 browser tabs -
Enter a room name and your name, then join
-
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
- Lobby: Players join a room and wait
- Ready: All players click READY to start
- Game: Play Tetris, clear rows to attack opponents
- Elimination: Players are eliminated when pieces stack to the top
- 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
Description
Languages
JavaScript
90.1%
CSS
8%
HTML
1.9%