# 2333599/flychess architecture

> Architecture diagram of the GitHub repository 2333599/flychess, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-29). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/2333599/flychess
- Repository: https://github.com/2333599/flychess

## Overview

Web 联机飞行棋 uses a browser client and a Node.js server that authoritatively manages rooms, setup, turns, and flight-chess rules. The main workflow is: players create or join a room, roll to determine color-pick order, choose colors, then take turns rolling and moving until a player wins. The client renders the board with Canvas and reflects server broadcasts. Server excerpts are partial, so the graph groups some server-side responsibilities by their shared source file and omits uncertain internal wiring.

Main entry points: [`server.js`](https://github.com/2333599/flychess/blob/main/server.js) (Room Message Handler), [`game.js`](https://github.com/2333599/flychess/blob/main/game.js) (Client Interaction), [`index.html`](https://github.com/2333599/flychess/blob/main/index.html) (Game Page), [`styles.css`](https://github.com/2333599/flychess/blob/main/styles.css) (Page Styling)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Browser Client"]
  node_page["Game Page<br/>[index.html]"]
  node_client["Client Interaction<br/>[game.js]"]
  node_board["Canvas Board<br/>[game.js]"]
  node_styles["Page Styling<br/>[styles.css]"]
end

subgraph group_server["Game Server"]
  node_http["HTTP Static Server<br/>[server.js]"]
  node_ws["WebSocket Server<br/>[server.js]"]
  node_roomflow["Room Message Handler<br/>[server.js]"]
end

subgraph group_state["Room State"]
  node_rooms[("Room Registry<br/>[server.js]")]
  node_publicstate["Public Room State<br/>[server.js]"]
end

subgraph group_rules["Game Rules"]
  node_draft["Order And Color Draft<br/>[server.js]"]
  node_movement["Movement Rules<br/>[server.js]"]
  node_effects["Landing And Capture<br/>[server.js]"]
end

node_players(("Players"))

node_players -->|"use"| node_page
node_http -->|"serves"| node_page
node_page -->|"loads"| node_client
node_page -->|"loads"| node_styles
node_client -->|"WebSocket actions"| node_ws
node_ws -->|"dispatches"| node_roomflow
node_roomflow -->|"reads and writes"| node_rooms
node_roomflow -->|"invokes"| node_draft
node_roomflow -->|"invokes"| node_movement
node_movement -->|"applies"| node_effects
node_roomflow -->|"builds"| node_publicstate
node_rooms -->|"supplies"| node_publicstate
node_ws -->|"broadcasts state"| node_client
node_client -->|"renders"| node_board
node_publicstate -->|"updates"| node_client

click node_page "https://github.com/2333599/flychess/blob/main/index.html"
click node_client "https://github.com/2333599/flychess/blob/main/game.js"
click node_board "https://github.com/2333599/flychess/blob/main/game.js"
click node_styles "https://github.com/2333599/flychess/blob/main/styles.css"
click node_http "https://github.com/2333599/flychess/blob/main/server.js"
click node_ws "https://github.com/2333599/flychess/blob/main/server.js"
click node_roomflow "https://github.com/2333599/flychess/blob/main/server.js"
click node_rooms "https://github.com/2333599/flychess/blob/main/server.js"
click node_publicstate "https://github.com/2333599/flychess/blob/main/server.js"
click node_draft "https://github.com/2333599/flychess/blob/main/server.js"
click node_movement "https://github.com/2333599/flychess/blob/main/server.js"
click node_effects "https://github.com/2333599/flychess/blob/main/server.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_page,node_client,node_board,node_styles toneBlue
class node_http,node_ws,node_roomflow toneAmber
class node_rooms,node_publicstate toneMint
class node_draft,node_movement,node_effects toneRose
class node_players toneIndigo
```

## Components

### Browser Client

- [Game Page](https://github.com/2333599/flychess/blob/main/index.html): `index.html`
- [Client Interaction](https://github.com/2333599/flychess/blob/main/game.js): `game.js`
- [Canvas Board](https://github.com/2333599/flychess/blob/main/game.js): `game.js`
- [Page Styling](https://github.com/2333599/flychess/blob/main/styles.css): `styles.css`

### Game Server

- [HTTP Static Server](https://github.com/2333599/flychess/blob/main/server.js): `server.js`
- [WebSocket Server](https://github.com/2333599/flychess/blob/main/server.js): `server.js`
- [Room Message Handler](https://github.com/2333599/flychess/blob/main/server.js): `server.js`

### Room State

- [Room Registry](https://github.com/2333599/flychess/blob/main/server.js): `server.js`
- [Public Room State](https://github.com/2333599/flychess/blob/main/server.js): `server.js`

### Game Rules

- [Order And Color Draft](https://github.com/2333599/flychess/blob/main/server.js): `server.js`
- [Movement Rules](https://github.com/2333599/flychess/blob/main/server.js): `server.js`
- [Landing And Capture](https://github.com/2333599/flychess/blob/main/server.js): `server.js`

### Other components

- **Players**

## Connections

- Players → Game Page: use
- HTTP Static Server → Game Page: serves
- Game Page → Client Interaction: loads
- Game Page → Page Styling: loads
- Client Interaction → WebSocket Server: WebSocket actions
- WebSocket Server → Room Message Handler: dispatches
- Room Message Handler → Room Registry: reads and writes
- Room Message Handler → Order And Color Draft: invokes
- Room Message Handler → Movement Rules: invokes
- Movement Rules → Landing And Capture: applies
- Room Message Handler → Public Room State: builds
- Room Registry → Public Room State: supplies
- WebSocket Server → Client Interaction: broadcasts state
- Client Interaction → Canvas Board: renders
- Public Room State → Client Interaction: updates