feat: Implement initial multiplayer lobby and game room functionality with server-side room management.

This commit is contained in:
2025-12-14 21:42:13 +01:00
parent 1b8ae00da1
commit da643b787f
12 changed files with 713 additions and 26 deletions

View File

@@ -9,6 +9,7 @@ The project has successfully migrated from a .NET backend to a Node.js Modular M
- **[2025-12-14] Set Generation**: Implemented full set fetching and booster box generation (Completed). [Link](./devlog/2025-12-14-211000_set_based_generation.md)
- **[2025-12-14] Cleanup**: Removed Tournament Mode and simplified pack display as requested. [Link](./devlog/2025-12-14-211500_remove_tournament_mode.md)
- **[2025-12-14] UI Tweak**: Auto-configured generation mode based on source selection. [Link](./devlog/2025-12-14-212000_ui_simplification.md)
- **[2025-12-14] Multiplayer Game Plan**: Plan for Real Game & Online Multiplayer. [Link](./devlog/2025-12-14-212500_multiplayer_game_plan.md)
## Active Modules
1. **Cube Manager**: Fully functional (Parsing, Fetching, Pack Generation).

View File

@@ -0,0 +1,37 @@
# Work Plan: Real Game & Online Multiplayer
## User Epics
1. **Lobby System**: Create and join private rooms.
2. **Game Setup**: Use generated packs to start a game.
3. **Multiplayer Draft**: Real-time drafting with friends.
4. **Chat**: In-game communication.
## Tasks
### 1. Backend Implementation (Node.js + Socket.IO)
- [ ] Create `src/server/managers/RoomManager.ts` to handle room state.
- [ ] Implement `Room` and `Player` interfaces.
- [ ] Update `src/server/index.ts` to initialize `RoomManager` and handle socket events:
- `create_room`
- `join_room`
- `leave_room`
- `send_message`
- `start_game` (placeholder for next phase)
### 2. Frontend Implementation (React)
- [ ] Create `src/client/src/modules/lobby` directory.
- [ ] Create `LobbyManager.tsx` (The main view for finding/creating rooms).
- [ ] Create `GameRoom.tsx` (The specific room view with chat and player list).
- [ ] Create `socket.ts` service in `src/client/src/services` for client-side socket handling.
- [ ] Update `App.tsx` to include the "Lobby" tab.
- [ ] Update `CubeManager.tsx` to add "Create Online Room" button.
### 3. Integration
- [ ] Ensure created room receives the packs from `CubeManager`.
- [ ] Verify players can join via Room ID.
- [ ] Verify chat works.
## Technical Notes
- Use `socket.io-client` on frontend.
- Generate Room IDs (short random strings).
- Manage state synchronization for the room (players list updates).