System Level Overview

Project Stack

• Front end (client): React (javascript)
• Back end (server): None
• Database: Firebase

Module Interaction

This project does not follow the standard client-server-database flow, because I have no idea what I'm doing.

Limitations

• Google AppEngine does not support Server-Sent Events or WebSockets (for free, anyway).
• GitHub Pages does not support any server side scripting.

Design

• Client connects directly to Firebase to listen for real-time updates.
• Client connects directly to Firebase to indicate presence.
• Client directly pushes data (drawings, settings, etc.) to Firebase.
• Client listens to presence to progress through stages.
• Firebase Cloud functions listen to presence to clean up unused resources.

There is no authentication anywhere in this process.

Game Flow

1. Users start at entry point, where they can enter room name and nickname.
2. User triggers entry to lobby via callback.
3. A user triggers entry for entire lobby to game via Firebase write.
4. At each game phase, users add to their current chain. In the first phase, users each create a chain.
5. Users indicate readiness at each game phase by removing themselves from a notReady Firebase node.
   Users progress through game phases when they notice the Firebase node disappear.
   Users progress through different chains defined by the order in the game settings
6. Users enter results when progression leads them back to their original chain.
7. Users triggers re-entry to lobby via callback.