2 Commits

Author SHA1 Message Date
Vladyslav Doloman
4dbbf44638 Implement client-side prediction with input broadcasting
Reduces perceived lag over internet by broadcasting player inputs immediately
and predicting next positions on all clients before server update arrives.

Protocol changes:
- Added PLAYER_INPUT message type for broadcasting inputs
- Server broadcasts player inputs to all clients on every MOVE message
- Includes player_id, current direction, and full input_buffer (max 3)

Desktop client (Python):
- Tracks input buffers and predicted head positions for all players
- On PLAYER_INPUT: predicts next head position using buffered input
- On STATE_UPDATE: clears predictions, uses authoritative state
- Renderer draws predicted positions with darker color (60% brightness)

Web client (JavaScript):
- Same prediction logic as desktop client
- Added darkenColor() helper for visual differentiation
- Predicted heads shown at 60% brightness

Benefits:
- Instant visual feedback for own movements (no round-trip wait)
- See other players' inputs before server tick (better collision avoidance)
- Smooth experience bridging input-to-update gap
- Low bandwidth (only direction tuples, not full state)
- Backward compatible (server authoritative, old clients work)

All 39 tests passing.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-04 21:21:49 +03:00
Vladyslav Doloman
ec8e9cd5fb Add web client with WebSocket support
Implemented browser-based web client alongside existing pygame desktop client
with dual-protocol server architecture supporting both TCP and WebSocket.

Backend Changes:
- Refactored GameServer for dual-protocol support (TCP + WebSocket)
- Added WebSocketHandler for handling WebSocket connections
- Added HTTPServer using aiohttp for serving web client files
- Updated protocol handling to work with both connection types
- Server tracks clients with protocol metadata (TCP/WebSocket)
- Protocol-agnostic message sending and broadcasting
- Added WebSocket port (8889) and HTTP port (8000) configuration

Web Client:
- Complete HTML5/CSS/JavaScript implementation
- Responsive dark-themed UI
- HTML5 Canvas rendering matching pygame visual style
- WebSocket connection with auto-detected server URL
- Real-time multiplayer gameplay in browser
- Player list with scores and status
- Mobile-friendly responsive design

Deployment Options:
- Development: Built-in HTTP server for local testing
- Production: Disable HTTP server, use nginx/Apache for static files
- Flexible server configuration (--no-http, --no-websocket flags)
- Comprehensive nginx/Apache deployment documentation

New Files:
- src/server/websocket_handler.py - WebSocket connection handler
- src/server/http_server.py - Static file server
- web/index.html - Web client interface
- web/style.css - Responsive styling
- web/protocol.js - Protocol implementation
- web/game.js - Game client with Canvas rendering
- web/README.md - Deployment documentation

Updated Files:
- requirements.txt - Added websockets and aiohttp dependencies
- src/server/game_server.py - Dual-protocol support
- src/shared/constants.py - WebSocket and HTTP port constants
- run_server.py - Server options for web support
- README.md - Web client documentation
- CLAUDE.md - Architecture documentation

Features:
- Web and desktop clients can play together simultaneously
- Same JSON protocol for both client types
- Independent server components (disable what you don't need)
- Production-ready with reverse proxy support

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-04 14:39:13 +03:00