# nortonmd/jeopardy architecture

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

- Interactive diagram: https://gitdiagram.com/nortonmd/jeopardy
- Repository: https://github.com/nortonmd/jeopardy
- Video tour (about a minute): https://gitdiagram.com/nortonmd/jeopardy/video

## Overview

Jeopardy! is a browser-only game: a player uploads a CSV, the browser parses and stores game data, and the game page builds an interactive board where clues and answers are revealed. The README also describes using a prompt in GENERATE.md with Claude to create game CSVs. Runtime links are based on the sampled JavaScript; page roles and CSV format follow the README, since HTML source was not sampled.

Main entry points: [`upload.js`](https://github.com/nortonmd/jeopardy/blob/main/upload.js) (CSV parsing and loading), [`game.html`](https://github.com/nortonmd/jeopardy/blob/main/game.html) (Game board page), [`style.css`](https://github.com/nortonmd/jeopardy/blob/main/style.css) (Shared game styles), [`index.html`](https://github.com/nortonmd/jeopardy/blob/main/index.html) (CSV file input)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_upload["Game upload"]
  node_upload_page["Upload screen<br/>[index.html]"]
  node_csv_input["CSV file input<br/>[index.html]"]
  node_csv_loader["CSV parsing and loading<br/>[upload.js]"]
  node_file_reader["Browser FileReader"]
  node_game_state[("Stored game data")]
end

subgraph group_play["Game play"]
  node_game_page["Game board page<br/>[game.html]"]
  node_board_builder["Board building<br/>[app.js]"]
  node_tile_interaction["Tile interaction<br/>[app.js]"]
  node_clue_modal["Clue and answer modal<br/>[app.js]"]
  node_fullscreen["Fullscreen control<br/>[app.js]"]
  node_shared_styles["Shared game styles<br/>[style.css]"]
end

subgraph group_generation["Game generation"]
  node_generation_prompt["Generation prompt<br/>[GENERATE.md]"]
  node_game_csv["Generated game CSV"]
end

node_player(("Player"))
node_claude(("Claude"))
node_browser["Browser"]

node_player -->|"opens"| node_upload_page
node_player -->|"selects file"| node_csv_input
node_csv_input -->|"change event"| node_csv_loader
node_csv_loader -->|"reads file"| node_file_reader
node_file_reader -->|"returns text"| node_csv_loader
node_csv_loader -->|"stores parsed data"| node_game_state
node_csv_loader -->|"redirects to"| node_game_page
node_game_page -->|"runs"| node_board_builder
node_board_builder -->|"reads data"| node_game_state
node_player -->|"clicks tile"| node_tile_interaction
node_tile_interaction -->|"opens modal"| node_clue_modal
node_player -->|"reveals answer"| node_clue_modal
node_player -->|"toggles"| node_fullscreen
node_fullscreen -->|"requests fullscreen"| node_browser
node_shared_styles -->|"styles"| node_upload_page
node_shared_styles -->|"styles"| node_game_page
node_player -.->|"uses prompt"| node_generation_prompt
node_generation_prompt -.->|"guides generation"| node_claude
node_claude -.->|"generates"| node_game_csv
node_player -.->|"uploads"| node_game_csv

click node_upload_page "https://github.com/nortonmd/jeopardy/blob/main/index.html"
click node_csv_input "https://github.com/nortonmd/jeopardy/blob/main/index.html"
click node_csv_loader "https://github.com/nortonmd/jeopardy/blob/main/upload.js"
click node_game_page "https://github.com/nortonmd/jeopardy/blob/main/game.html"
click node_board_builder "https://github.com/nortonmd/jeopardy/blob/main/app.js"
click node_tile_interaction "https://github.com/nortonmd/jeopardy/blob/main/app.js"
click node_clue_modal "https://github.com/nortonmd/jeopardy/blob/main/app.js"
click node_fullscreen "https://github.com/nortonmd/jeopardy/blob/main/app.js"
click node_shared_styles "https://github.com/nortonmd/jeopardy/blob/main/style.css"
click node_generation_prompt "https://github.com/nortonmd/jeopardy/blob/main/GENERATE.md"

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_upload_page,node_csv_input,node_csv_loader,node_file_reader,node_game_state,node_browser toneBlue
class node_game_page,node_board_builder,node_tile_interaction,node_clue_modal,node_fullscreen,node_shared_styles toneAmber
class node_generation_prompt,node_game_csv toneMint
class node_player,node_claude toneIndigo
```

## Components

### Game upload

- [Upload screen](https://github.com/nortonmd/jeopardy/blob/main/index.html): `index.html`
- [CSV file input](https://github.com/nortonmd/jeopardy/blob/main/index.html): `index.html`
- [CSV parsing and loading](https://github.com/nortonmd/jeopardy/blob/main/upload.js): `upload.js`
- **Browser FileReader**
- **Stored game data**

### Game play

- [Game board page](https://github.com/nortonmd/jeopardy/blob/main/game.html): `game.html`
- [Board building](https://github.com/nortonmd/jeopardy/blob/main/app.js): `app.js`
- [Tile interaction](https://github.com/nortonmd/jeopardy/blob/main/app.js): `app.js`
- [Clue and answer modal](https://github.com/nortonmd/jeopardy/blob/main/app.js): `app.js`
- [Fullscreen control](https://github.com/nortonmd/jeopardy/blob/main/app.js): `app.js`
- [Shared game styles](https://github.com/nortonmd/jeopardy/blob/main/style.css): `style.css`

### Game generation

- [Generation prompt](https://github.com/nortonmd/jeopardy/blob/main/GENERATE.md): `GENERATE.md`
- **Generated game CSV**

### Other components

- **Player**
- **Claude**
- **Browser**

## Connections

- Player → Upload screen: opens
- Player → CSV file input: selects file
- CSV file input → CSV parsing and loading: change event
- CSV parsing and loading → Browser FileReader: reads file
- Browser FileReader → CSV parsing and loading: returns text
- CSV parsing and loading → Stored game data: stores parsed data
- CSV parsing and loading → Game board page: redirects to
- Game board page → Board building: runs
- Board building → Stored game data: reads data
- Player → Tile interaction: clicks tile
- Tile interaction → Clue and answer modal: opens modal
- Player → Clue and answer modal: reveals answer
- Player → Fullscreen control: toggles
- Fullscreen control → Browser: requests fullscreen
- Shared game styles → Upload screen: styles
- Shared game styles → Game board page: styles
- Player → Generation prompt: uses prompt
- Generation prompt → Claude: guides generation
- Claude → Generated game CSV: generates
- Player → Generated game CSV: uploads