https://github.com/abdealijaroli/abdeali_gigaml
Submission for take-home
https://github.com/abdealijaroli/abdeali_gigaml
Last synced: 3 months ago
JSON representation
Submission for take-home
- Host: GitHub
- URL: https://github.com/abdealijaroli/abdeali_gigaml
- Owner: abdealijaroli
- Created: 2025-01-05T09:43:56.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2025-01-05T10:24:58.000Z (5 months ago)
- Last Synced: 2025-01-05T11:25:54.664Z (5 months ago)
- Language: Python
- Size: 5.86 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Hi there! Here is my submission for GigaML take home assignment.
# Multiplayer Ping Pong with Dynamic Obstacles
A real-time multiplayer ping pong game featuring dynamic obstacles, implemented using Python (FastAPI) for the backend and JavaScript for the frontend.
## Features
- Real-time multiplayer gameplay with WebSocket communication
- Dynamic obstacles that affect ball trajectory
- Automatic player assignment system with spectator queue
- Score tracking and display
- Responsive paddle controls
- Clean, minimalist visual design
## Tech Stack
- Backend: Python with FastAPI
- Frontend: Vanilla JavaScript with HTML5 Canvas
- Communication: WebSocket protocol
- No external game engines or libraries required
## Prerequisites
- Python 3.7+
- pip (Python package manager)
## Installation
1. Clone the repository:
```bash
git clone https://github.com/abdealijaroli/abdeali_gigaml.git
cd abdeali_gigaml
```
2. Install Python dependencies:
```bash
pip install fastapi uvicorn websockets
```
3. Project structure:
```
abdeali_gigaml/
├── main.py # Backend server
├── static/
│ ├── index.html # Frontend HTML
│ └── game.js # Game logic
└── README.md
```
## Running the Game
1. Start the server:
```bash
uvicorn main:app --reload --port 8000
```
2. Open the game:
- Navigate to `http://localhost:8000` in your browser
- Open in two different browser tabs for multiplayer
- Additional tabs will enter spectator mode automatically
3. Controls:
- Use W/S keys or Up/Down arrows to move paddle
- First two players get paddle control
- Additional players enter spectator queue
## Technical Implementation
### Core Components
1. Backend (FastAPI)
- Centralized game state management
- WebSocket server for real-time communication
- Player assignment and role management
- Physics calculations and collision detection
2. Frontend (JavaScript)
- HTML5 Canvas for rendering
- WebSocket client for real-time updates
- Keyboard input handling
- Dynamic game state visualization
3. Multiplayer Features
- Automatic player assignment
- Spectator queue system
- Seamless player transitions
- Real-time state synchronization
### Architecture Decisions
1. Centralized State
- Server maintains authoritative game state
- Prevents cheating and ensures consistency
- Handles collision detection and scoring
2. WebSocket Communication
- Real-time bidirectional data flow
- Minimal latency for gameplay
- Efficient state updates
3. Canvas Rendering
- Smooth, efficient graphics
- Low overhead for simple shapes
- Easy obstacle implementation
## Known Limitations
1. Game Mechanics
- Basic collision detection
- Simple physics implementation
- No advanced ball spin effects
2. Networking
- No latency compensation
- Basic error recovery
- Single game instance only
3. Browser Support
- Tested on modern browsers only
- No mobile support
- Limited error handling
## AI Assistance Note
This project was developed with AI assistance in specific areas:
1. Critical Problem Resolution
- Player assignment logic bug: Fixed issue where both tabs controlled the right paddle
- Spectator system implementation: Added proper queue and role reassignment
2. Implementation Support
- WebSocket communication setup
- Basic physics calculations
- Documentation structure
Independent development included:
- Core logic for canvas
- Basic game mechanics
- Score tracking
## Contact
If you liked this, get in touch: [email protected] 🚀