# subhayan06/unofficialfc architecture

> Architecture diagram of the GitHub repository subhayan06/unofficialfc, 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/subhayan06/unofficialfc
- Repository: https://github.com/subhayan06/unofficialfc

## Overview

UnofficialFC is a static football experience with two user-facing paths: the platform hub, where visitors explore tactical and visual interactions and can submit feedback, and the 2006 Champions League final museum, where visitors scroll through the story and explore match simulations and visualizations. The README documents the major capabilities; sampled JavaScript confirms key runtime behavior, but the excerpts do not expose all initialization wiring, so uncertain internal links are omitted.

Main entry points: [`script.js`](https://github.com/subhayan06/unofficialfc/blob/main/script.js) (Hub interactions), [`ucl1.js`](https://github.com/subhayan06/unofficialfc/blob/main/ucl1.js) (Museum interactions), [`index.html`](https://github.com/subhayan06/unofficialfc/blob/main/index.html) (Hub page), [`ucl1.html`](https://github.com/subhayan06/unofficialfc/blob/main/ucl1.html) (Museum page)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_hub["Platform hub"]
  node_hub_page["Hub page<br/>[index.html]"]
  node_hub_runtime["Hub interactions<br/>[script.js]"]
  node_tactics["Tactic switcher<br/>[script.js]"]
  node_matrix["3D matrix<br/>[script.js]"]
  node_feedback["Feedback form<br/>[script.js]"]
end

subgraph group_museum["Final museum"]
  node_museum_page["Museum page<br/>[ucl1.html]"]
  node_museum_runtime["Museum interactions<br/>[ucl1.js]"]
  node_story["Scroll story<br/>[ucl1.js]"]
  node_match_sim["Match simulation<br/>[ucl1.js]"]
  node_heatmap["Player heatmap<br/>[ucl1.js]"]
  node_atmosphere["Rain effects<br/>[ucl1.js]"]
end

subgraph group_visuals["Shared presentation"]
  node_hub_styles["Hub styling<br/>[style.css]"]
  node_museum_styles["Museum styling<br/>[ucl1.css]"]
end

subgraph group_integrations["External integrations"]
  node_gsap["GSAP"]
  node_three["Three.js"]
  node_web3forms["Web3Forms"]
end

node_visitor(("Visitor"))

node_visitor -->|"opens"| node_hub_page
node_visitor -->|"opens"| node_museum_page
node_hub_page -->|"loads"| node_hub_runtime
node_hub_runtime -->|"updates"| node_tactics
node_hub_runtime -->|"renders"| node_matrix
node_hub_runtime -->|"handles"| node_feedback
node_hub_runtime -.->|"animates with"| node_gsap
node_hub_runtime -.->|"renders with"| node_three
node_feedback -.->|"submits to"| node_web3forms
node_hub_page -->|"uses"| node_hub_styles
node_museum_page -->|"loads"| node_museum_runtime
node_museum_runtime -->|"animates"| node_story
node_museum_runtime -->|"updates"| node_match_sim
node_museum_runtime -->|"renders"| node_heatmap
node_museum_runtime -->|"animates"| node_atmosphere
node_museum_runtime -.->|"animates with"| node_gsap
node_museum_page -->|"uses"| node_museum_styles

click node_hub_page "https://github.com/subhayan06/unofficialfc/blob/main/index.html"
click node_hub_runtime "https://github.com/subhayan06/unofficialfc/blob/main/script.js"
click node_tactics "https://github.com/subhayan06/unofficialfc/blob/main/script.js"
click node_matrix "https://github.com/subhayan06/unofficialfc/blob/main/script.js"
click node_feedback "https://github.com/subhayan06/unofficialfc/blob/main/script.js"
click node_museum_page "https://github.com/subhayan06/unofficialfc/blob/main/ucl1.html"
click node_museum_runtime "https://github.com/subhayan06/unofficialfc/blob/main/ucl1.js"
click node_story "https://github.com/subhayan06/unofficialfc/blob/main/ucl1.js"
click node_match_sim "https://github.com/subhayan06/unofficialfc/blob/main/ucl1.js"
click node_heatmap "https://github.com/subhayan06/unofficialfc/blob/main/ucl1.js"
click node_atmosphere "https://github.com/subhayan06/unofficialfc/blob/main/ucl1.js"
click node_hub_styles "https://github.com/subhayan06/unofficialfc/blob/main/style.css"
click node_museum_styles "https://github.com/subhayan06/unofficialfc/blob/main/ucl1.css"

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_hub_page,node_hub_runtime,node_tactics,node_matrix,node_feedback toneBlue
class node_museum_page,node_museum_runtime,node_story,node_match_sim,node_heatmap,node_atmosphere toneAmber
class node_hub_styles,node_museum_styles toneMint
class node_gsap,node_three,node_web3forms toneRose
class node_visitor toneIndigo
```

## Components

### Platform hub

- [Hub page](https://github.com/subhayan06/unofficialfc/blob/main/index.html): `index.html`
- [Hub interactions](https://github.com/subhayan06/unofficialfc/blob/main/script.js): `script.js`
- [Tactic switcher](https://github.com/subhayan06/unofficialfc/blob/main/script.js): `script.js`
- [3D matrix](https://github.com/subhayan06/unofficialfc/blob/main/script.js): `script.js`
- [Feedback form](https://github.com/subhayan06/unofficialfc/blob/main/script.js): `script.js`

### Final museum

- [Museum page](https://github.com/subhayan06/unofficialfc/blob/main/ucl1.html): `ucl1.html`
- [Museum interactions](https://github.com/subhayan06/unofficialfc/blob/main/ucl1.js): `ucl1.js`
- [Scroll story](https://github.com/subhayan06/unofficialfc/blob/main/ucl1.js): `ucl1.js`
- [Match simulation](https://github.com/subhayan06/unofficialfc/blob/main/ucl1.js): `ucl1.js`
- [Player heatmap](https://github.com/subhayan06/unofficialfc/blob/main/ucl1.js): `ucl1.js`
- [Rain effects](https://github.com/subhayan06/unofficialfc/blob/main/ucl1.js): `ucl1.js`

### Shared presentation

- [Hub styling](https://github.com/subhayan06/unofficialfc/blob/main/style.css): `style.css`
- [Museum styling](https://github.com/subhayan06/unofficialfc/blob/main/ucl1.css): `ucl1.css`

### External integrations

- **GSAP**
- **Three.js**
- **Web3Forms**

### Other components

- **Visitor**

## Connections

- Visitor → Hub page: opens
- Visitor → Museum page: opens
- Hub page → Hub interactions: loads
- Hub interactions → Tactic switcher: updates
- Hub interactions → 3D matrix: renders
- Hub interactions → Feedback form: handles
- Hub interactions → GSAP: animates with
- Hub interactions → Three.js: renders with
- Feedback form → Web3Forms: submits to
- Hub page → Hub styling: uses
- Museum page → Museum interactions: loads
- Museum interactions → Scroll story: animates
- Museum interactions → Match simulation: updates
- Museum interactions → Player heatmap: renders
- Museum interactions → Rain effects: animates
- Museum interactions → GSAP: animates with
- Museum page → Museum styling: uses