Skip to content

Add shared-link multiplayer mode - #10

Open
Copilot wants to merge 1 commit into
mainfrom
copilot/multiplayer-shared-rooms
Open

Add shared-link multiplayer mode#10
Copilot wants to merge 1 commit into
mainfrom
copilot/multiplayer-shared-rooms

Conversation

Copilot AI commented Aug 7, 2026

Copy link
Copy Markdown

Summary

Adds a shared-link multiplayer mode: a player can start a game, share a room link, and friends who open it join the same room and play the same secret word together, with guesses syncing live for everyone.

Changes

  • server/: small Node + ws WebSocket server that owns room state (secret word, shared guess list, connected players) in-memory. Rooms are created lazily on first join and cleaned up 5 minutes after everyone leaves.
  • src/multiplayer/: socketClient.js (WebSocket connection helper) and useRoomConnection.js (React hook exposing room state + guess/reset actions).
  • src/components/Multiplayer/: Lobby (create room button), JoinPrompt (enter display name), MultiplayerGame (shared board + player list + share link, reuses existing GuessForm/GuessResults/ResultsBanner), PlayerList.
  • App.js: reads a ?room= query param to switch between the existing single-player view and the new multiplayer view (no routing library needed, avoids SPA-fallback concerns with the Parcel dev/build setup).
  • README: instructions for running the multiplayer server alongside the app.

Design notes

  • Scope was intentionally kept aligned with the existing app: GuessCells already computes results client-side from an answer prop that's already visible in React state/console (console.info({ answer }) in the original Game.js), so the server is the source of truth for keeping room state in sync across clients rather than a security boundary / anti-cheat layer.
  • Single-player mode at / is untouched; multiplayer lives behind ?room=<id>.

Testing

  • npx eslint src/ — no errors.
  • npx parcel build public/index.html — builds successfully.
  • Manual server test: two WebSocket clients joining the same room see the same answer/room id, and guesses broadcast correctly.
  • End-to-end Playwright test with two browser contexts: create room -> copy share link -> second browser joins via link -> both see the same player list -> guess submitted by one player appears live for both. All steps passed.

Co-authored-by: Copilot 223556219+Copilot@users.noreply.github.com

Players can now start a shared game and invite friends via a room link;
everyone in the room sees the same secret word and guesses update live.

- server/: small Node + ws WebSocket server that owns room state
  (secret word, shared guess list, connected players) in-memory
- src/multiplayer/: client WebSocket helper + React hook for room state
- src/components/Multiplayer/: Lobby (create room), JoinPrompt (enter name),
  MultiplayerGame (shared board + player list + share link), PlayerList
- App.js reads a ?room= query param to switch between single-player and
  multiplayer views
- README updated with instructions to run the multiplayer server

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
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