137 lines
No EOL
4.8 KiB
Markdown
137 lines
No EOL
4.8 KiB
Markdown
# Grid Battle Game - Project Plan
|
|
|
|
## Game Overview
|
|
A 2-player turn-based tactical shooter played on a grid. Players spawn in different locations, submit moves simultaneously, then watch them execute together. Victory comes from hitting your opponent with a bullet.
|
|
|
|
## Core Gameplay
|
|
|
|
### Grid World
|
|
- **Grid Size**: 20x20 cells (configurable)
|
|
- **Player Spawning**: Each player spawns in a different grid cell location
|
|
- **Visual**: HTML/CSS grid with distinct player representations
|
|
|
|
### Turn-Based Combat System
|
|
- **Simultaneous Moves**: Both players submit their actions privately
|
|
- **Turn Execution**: Once both players submit, all actions execute together
|
|
- **Actions Per Turn**: Multiple moves allowed per turn (configurable)
|
|
- **Action Types**:
|
|
- **Move**: Navigate in cardinal directions (North/South/East/West)
|
|
- **Shoot**: Fire bullets in cardinal directions that travel in straight lines
|
|
|
|
### Win Condition
|
|
- **Bullet Hit**: If a bullet intersects with the opponent, that player loses instantly
|
|
- **Game Over**: Winner declared, game ends immediately
|
|
|
|
## Multiplayer System
|
|
|
|
### Session Flow
|
|
1. **Player 1**: Picks a name and starts a game session
|
|
2. **Invite Link**: System generates unique game URL
|
|
3. **Player 2**: Clicks link, picks name, joins game
|
|
4. **Game Start**: Both players connected, game begins
|
|
|
|
### Technical Requirements
|
|
- Real-time bidirectional communication between players
|
|
- Session management with unique game IDs
|
|
- Name validation and conflict handling
|
|
- Connection state management (reconnection, disconnection)
|
|
|
|
## Configuration System
|
|
|
|
### Game Settings (game-config.js)
|
|
```javascript
|
|
const GAME_CONFIG = {
|
|
GRID_WIDTH: 20,
|
|
GRID_HEIGHT: 20,
|
|
MAX_PLAYERS: 2,
|
|
MOVES_PER_TURN: 3, // How many actions each player gets
|
|
BULLET_SPEED: 1, // Cells per turn bullets travel
|
|
TURN_TIMEOUT_MS: 30000, // Max time to submit moves
|
|
CELL_SIZE_PX: 30, // Visual size of each grid cell
|
|
SPAWN_BUFFER: 3, // Minimum cells between player spawns
|
|
GAME_NAME: "Grid Battle"
|
|
}
|
|
```
|
|
|
|
### Server Settings (server-config.js)
|
|
```javascript
|
|
const SERVER_CONFIG = {
|
|
PORT: 8050,
|
|
HOST: 'localhost',
|
|
STATIC_PATH: './public',
|
|
WEBSOCKET_PATH: '/ws'
|
|
}
|
|
```
|
|
|
|
## Technical Architecture
|
|
|
|
### Project Structure
|
|
```
|
|
/
|
|
├── server.js # Main server entry point
|
|
├── server-config.js # Webserver settings
|
|
├── game-config.js # Game mechanics settings
|
|
├── package.json # NPM scripts and dependencies
|
|
├── public/ # Static HTML/CSS/JS files
|
|
│ ├── index.html # Game interface
|
|
│ ├── style.css # Grid and UI styling
|
|
│ └── game.js # Client-side game logic
|
|
└── game-logic/ # Server-side game logic
|
|
├── game-session.js # Session management
|
|
├── turn-manager.js # Turn execution
|
|
└── collision.js # Bullet collision detection
|
|
```
|
|
|
|
### Startup
|
|
- **Simple Launch**: `npm start` starts everything
|
|
- **Port**: Server runs on http://localhost:8050
|
|
- **Ready to Play**: Game immediately accessible in browser
|
|
|
|
## Game States
|
|
|
|
### Connection States
|
|
- **Waiting for Players**: Lobby state, waiting for Player 2
|
|
- **Both Connected**: Game ready to start
|
|
- **In Game**: Active gameplay, turn submission/execution
|
|
- **Game Over**: Victory screen, option to play again
|
|
|
|
### Turn Phases
|
|
1. **Move Submission**: Players privately choose actions
|
|
2. **Validation**: Server validates all moves
|
|
3. **Simultaneous Execution**: All actions happen together
|
|
4. **Result Calculation**: Check for bullets hits, update positions
|
|
5. **Next Turn**: Return to submission phase or declare winner
|
|
|
|
## Key Technical Components
|
|
|
|
### Server-Side
|
|
- WebSocket server for real-time communication
|
|
- Game session management
|
|
- Turn-based logic with simultaneous execution
|
|
- Bullet trajectory and collision detection
|
|
- Player spawn positioning
|
|
- Move validation and conflict resolution
|
|
|
|
### Client-Side
|
|
- Grid rendering and visual updates
|
|
- Move input interface (directional controls)
|
|
- Real-time game state synchronization
|
|
- Player feedback (turn status, game results)
|
|
- Connection handling (reconnection, errors)
|
|
|
|
## Design Principles
|
|
Following clear code principles:
|
|
- **No Clever Tricks**: Straightforward, readable implementations
|
|
- **Descriptive Naming**: Functions like `calculateBulletPath()` not `cbp()`
|
|
- **Single Responsibility**: Each function does ONE thing
|
|
- **Explicit Error Handling**: No silent failures
|
|
- **Configurable Settings**: All magic numbers in config files
|
|
- **Easy Maintenance**: Code written for violent psychopaths who know where you live
|
|
|
|
## Development Approach
|
|
- Start with basic grid and player positioning
|
|
- Add turn-based move submission
|
|
- Implement bullet firing and collision detection
|
|
- Add multiplayer session management
|
|
- Polish UI and game experience
|
|
- Test edge cases and error handling |