# icecat14159/ai-game-project architecture

> Architecture diagram of the GitHub repository icecat14159/ai-game-project, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-13). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/icecat14159/ai-game-project
- Repository: https://github.com/icecat14159/ai-game-project

## Overview

這是以原生 HTML Canvas 運行的 2D 冒險遊戲，並提供 Supabase 帳號認證及雲端進度／偏好同步。玩家由首頁進入主畫面後，可操作角色、登入並設定自動存檔；README 描述認證狀態會觸發存檔模組，存檔模組則與資料庫雙向同步。README 也列出手動及登出前存檔、密碼變更與錯誤提示等能力。由於沒有可讀取的來源節錄，關係僅依 README 架構圖與文字說明；部分模組僅能以樹中存在的 tests/ 目錄定位。

Main entry points: [`tests`](https://github.com/icecat14159/ai-game-project/tree/main/tests) (進度與偏好同步), [`tests/MainScreen.html`](https://github.com/icecat14159/ai-game-project/blob/main/tests/MainScreen.html) (遊戲主畫面), [`index.html`](https://github.com/icecat14159/ai-game-project/blob/main/index.html) (首頁入口), [`docs/database_schema.sql`](https://github.com/icecat14159/ai-game-project/blob/main/docs/database_schema.sql) (玩家存檔資料表)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_interface["遊戲介面"]
  node_entry["首頁入口<br/>[index.html]"]
  node_screen["遊戲主畫面<br/>[MainScreen.html]"]
  node_authmodal["登入註冊介面<br/>[MainScreen.html]"]
  node_settings["設定介面<br/>[MainScreen.html]"]
  node_toast["存檔提示<br/>[MainScreen.html]"]
end

subgraph group_runtime["遊戲與帳號"]
  node_game["畫布與角色控制"]
  node_auth["帳號認證"]
  node_save["進度與偏好同步"]
end

subgraph group_cloud["雲端服務"]
  node_supaauth["Supabase Auth"]
  node_playerdata[("玩家存檔資料表")]
  node_supabase["Supabase"]
end

node_player(("玩家"))

node_player -->|"開啟"| node_entry
node_entry -->|"導向"| node_screen
node_player -->|"操作"| node_screen
node_screen -->|"畫布互動"| node_game
node_player -->|"登入註冊"| node_authmodal
node_authmodal -->|"提交認證"| node_auth
node_auth -->|"認證請求"| node_supaauth
node_auth -->|"觸發同步"| node_save
node_player -->|"調整偏好"| node_settings
node_settings -->|"設定存檔"| node_save
node_save -->|"讀寫進度"| node_playerdata
node_save -->|"顯示狀態"| node_toast
node_supabase -->|"提供服務"| node_supaauth
node_supabase -->|"託管資料"| node_playerdata

click node_entry "https://github.com/icecat14159/ai-game-project/blob/main/index.html"
click node_screen "https://github.com/icecat14159/ai-game-project/blob/main/tests/MainScreen.html"
click node_game "https://github.com/icecat14159/ai-game-project/tree/main/tests"
click node_auth "https://github.com/icecat14159/ai-game-project/tree/main/tests"
click node_save "https://github.com/icecat14159/ai-game-project/tree/main/tests"
click node_authmodal "https://github.com/icecat14159/ai-game-project/blob/main/tests/MainScreen.html"
click node_settings "https://github.com/icecat14159/ai-game-project/blob/main/tests/MainScreen.html"
click node_toast "https://github.com/icecat14159/ai-game-project/blob/main/tests/MainScreen.html"
click node_playerdata "https://github.com/icecat14159/ai-game-project/blob/main/docs/database_schema.sql"

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_entry,node_screen,node_authmodal,node_settings,node_toast toneBlue
class node_game,node_auth,node_save toneAmber
class node_supaauth,node_playerdata,node_supabase toneMint
class node_player toneIndigo
```

## Components

### 遊戲介面

- [首頁入口](https://github.com/icecat14159/ai-game-project/blob/main/index.html): `index.html`
- [遊戲主畫面](https://github.com/icecat14159/ai-game-project/blob/main/tests/MainScreen.html): `tests/MainScreen.html`
- [登入註冊介面](https://github.com/icecat14159/ai-game-project/blob/main/tests/MainScreen.html): `tests/MainScreen.html`
- [設定介面](https://github.com/icecat14159/ai-game-project/blob/main/tests/MainScreen.html): `tests/MainScreen.html`
- [存檔提示](https://github.com/icecat14159/ai-game-project/blob/main/tests/MainScreen.html): `tests/MainScreen.html`

### 遊戲與帳號

- [畫布與角色控制](https://github.com/icecat14159/ai-game-project/tree/main/tests): `tests`
- [帳號認證](https://github.com/icecat14159/ai-game-project/tree/main/tests): `tests`
- [進度與偏好同步](https://github.com/icecat14159/ai-game-project/tree/main/tests): `tests`

### 雲端服務

- **Supabase Auth**
- [玩家存檔資料表](https://github.com/icecat14159/ai-game-project/blob/main/docs/database_schema.sql): `docs/database_schema.sql`
- **Supabase**

### Other components

- **玩家**

## Connections

- 玩家 → 首頁入口: 開啟 (evidence: `README.md`)
- 首頁入口 → 遊戲主畫面: 導向 (evidence: `README.md`)
- 玩家 → 遊戲主畫面: 操作 (evidence: `README.md`)
- 遊戲主畫面 → 畫布與角色控制: 畫布互動 (evidence: `README.md`)
- 玩家 → 登入註冊介面: 登入註冊 (evidence: `README.md`)
- 登入註冊介面 → 帳號認證: 提交認證 (evidence: `README.md`)
- 帳號認證 → Supabase Auth: 認證請求 (evidence: `README.md`)
- 帳號認證 → 進度與偏好同步: 觸發同步 (evidence: `README.md`)
- 玩家 → 設定介面: 調整偏好 (evidence: `README.md`)
- 設定介面 → 進度與偏好同步: 設定存檔 (evidence: `README.md`)
- 進度與偏好同步 → 玩家存檔資料表: 讀寫進度 (evidence: `README.md`)
- 進度與偏好同步 → 存檔提示: 顯示狀態 (evidence: `README.md`)
- Supabase → Supabase Auth: 提供服務 (evidence: `README.md`)
- Supabase → 玩家存檔資料表: 託管資料 (evidence: `README.md`)