Skip to content

Scribble game#90

Open
ShireenAzad wants to merge 10 commits into
everest-engineering:mainfrom
ShireenAzad:scribble-lab
Open

Scribble game#90
ShireenAzad wants to merge 10 commits into
everest-engineering:mainfrom
ShireenAzad:scribble-lab

Conversation

@ShireenAzad
Copy link
Copy Markdown

@ShireenAzad ShireenAzad commented Jun 4, 2026

Summary

This PR delivers a complete, playable multiplayer "Scribble" game. It covers all core scenarios including room management, secure role-based gameplay, interactive drawing, and scoring, plus an additional scenario for continuous multi-round play with turn rotation.

The implementation strictly follows the provided constitution, prioritizing minimal changes, architectural integrity (HTTP polling only), and robust validation.

Key Features & Changes

1. Room Management & Lobby (Scenario 1)

  • Host Tracking: Automatically assigns the room creator as the host.
  • Join Validation: Enhanced alphanumeric code and trimmed name validation via Zod.
  • Sync: Implemented 2s HTTP polling to keep the participant list updated in real-time.
  • Permissions: Restricted "Start Game" to the host and enforced a 2-player minimum.

2. Secure Gameplay & Roles (Scenario 2)

  • Role Assignment: Automatically assigns 'drawer' and 'guesser' roles.
  • Word Privacy: Implemented server-side masking to ensure the secret word is only visible to the current drawer.
  • Auto-Navigation: Polling-based redirection from lobby to game screen for all players.

3. Interactive Drawing & Guessing (Scenario 3)

  • Coordinate-Sync Canvas: Replaced placeholders with a functional HTML5 canvas.
  • Precision Drawing: Fixed coordinate scaling issues to ensure lines appear precisely under the cursor.
  • Synced Gameplay: Stroke data is JSON-encoded and synced across all clients via polling.
  • Scoring: Case-insensitive guess validation with immediate score updates (+100 per correct guess).

4. Results & Turn Rotation (Scenarios 4 & 5)

  • Result State: Displays the correct word and final round standings to all players.
  • Turn Rotation: Implemented automatic drawer rotation for subsequent rounds.
  • Word Randomization: Transitions from deterministic to random word selection to enhance replayability.
  • Continuous Flow: Added "Next Round" flow to preserve scores, alongside a "Back to Lobby" full reset option.

Technical Integrity

  • Tests: Added 22 comprehensive backend unit tests covering all 5 scenarios.
  • Builds: Verified successful production builds for both /frontend and /backend.
  • Standards: Granular commit history, detailed REFLECTION.md, and a manual speckit.checklist provided.

Verification Steps

  1. Open two browser tabs.
  2. Follow the steps in speckit.checklist to verify the end-to-end flow.
  3. Run npm run test in the /backend directory.

Contributor

- Track host ID on room creation and expose it via snapshots (Scenario 1).
- Implement 2s lobby polling on the frontend to sync player list.
- Restrict 'Start Game' button to the host and enforce 2-player minimum.
- Improve error handling for joining rooms with specific Zod validation messages.
- Fix API base URL and add unit tests for host assignment and isolation.
- Add 'playing' status and backend logic for starting games and assigning drawers (Scenario 2 foundation).
- Add 'playing' status and backend logic for starting games and assigning drawers.
- Implement 'startGame' method in frontend store and API service.
- Handle lobby-to-game transition via polling-based redirection.
- Display secret word and role-specific UI on the game screen.
- Add backend unit tests for game start logic and word visibility rules.
- Add 'canvasData', 'guesses', and 'scores' to Room model.
- Implement backend services and API routes for drawing and guessing.
- Update frontend store and components (Scoreboard, GuessForm, GamePage) to handle gameplay interactions.
- Add backend unit tests for drawing permissions, guess validation, and scoring.
- Add 'result' status and backend logic for ending rounds and restarting games.
- Implement 'endRound' and 'restartGame' methods in frontend store and API service.
- Update GamePage and ResultPanel to display final round results (scores, word, history).
- Reset room state and preserve participants on game restart.
- Add backend unit tests for end-round permissions and restart state reset.
- Add HTML5 canvas to GamePage for interactive drawing.
- Capture and JSON-encode strokes (coordinates) for backend synchronization.
- Implement real-time rendering for drawers and polling-based sync for guessers.
- Replace placeholder drawing simulation with a playable canvas mechanism.
- Factor in the ratio between CSS display size and internal canvas resolution in getMousePos.
- Ensures drawing appears precisely under the cursor regardless of screen scaling.
- Document implementation of all four scenarios.
- Reflect on AI-assisted workflow and architectural tradeoffs (polling, coordinate sync).
- Introduce 'drawerIndex' in Room model to track and rotate turns.
- Implement random word selection for each round.
- Add 'nextRound' backend service and API endpoint.
- Update frontend store and ResultPanel to support continuous multi-round gameplay.
- Add backend unit tests for turn rotation and randomization logic.
- Update REFLECTION.md with Scenario 5 details.
- Include speckit.checklist for manual verification steps.
- Include PULL_REQUEST.md for submission documentation.
- Move constitution to .specify/memory/constitution.md.
- Split feature specifications, plans, and tasks into specs/NNN-* folders.
- Ensure all artifacts meet the minimum character count requirements for validation.
- Remove legacy root-level speckit files.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant