# lichiahaomc/study-omni architecture

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

## Overview

StudyOmni is a browser-based multimodal tutoring app. A learner uploads or pastes material, optionally crops images, and the frontend extracts PDF text or renders scanned pages before calling the parse endpoint. Parsed material appears in the study pane and can be used as context for streaming follow-up chat. README documents additional user-facing branches for favorites, BYOK, and appearance/accessibility settings. Backend call paths are supported by sampled handlers; several frontend details and other documented capabilities are represented at their known module paths without inferring unsampled wiring.

Main entry points: [`public/js/03-ai.js`](https://github.com/lichiahaomc/study-omni/blob/main/public/js/03-ai.js) (Streaming chat), [`functions/api/parse.js`](https://github.com/lichiahaomc/study-omni/blob/main/functions/api/parse.js) (Material parsing), [`functions/api/chat.js`](https://github.com/lichiahaomc/study-omni/blob/main/functions/api/chat.js) (Chat endpoint), [`public/index.html`](https://github.com/lichiahaomc/study-omni/blob/main/public/index.html) (Study interface)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_study["Study workflow"]
  node_app["Study interface<br/>[index.html]"]
  node_upload["Material upload<br/>[03-ai.js]"]
  node_crop["Image crop<br/>[05-crop.js]"]
  node_parseui["PDF preparation<br/>[05-crop.js]"]
  node_result["Parsed material<br/>[05-crop.js]"]
  node_chatui["Streaming chat<br/>[03-ai.js]"]
end

subgraph group_frontend["Frontend features"]
  node_settings["Settings and BYOK<br/>[09-settings.js]"]
  node_brand["Themes and background<br/>[10-brand-bg.js]"]
  node_favorites[("Favorites<br/>[06-toolbar.js]")]
  node_math["Formula rendering<br/>[02-math.js]"]
  node_tabs["Responsive navigation<br/>[07-tabs.js]"]
end

subgraph group_backend["API services"]
  node_parseapi["Material parsing<br/>[parse.js]"]
  node_chatapi["Chat endpoint<br/>[chat.js]"]
  node_prompts["Subject prompts<br/>[prompts.js]"]
  node_ratelimit["Origin and limits<br/>[ratelimit.js]"]
end

subgraph group_model["Model integration"]
  node_provider["Model gateway<br/>[providers.js]"]
end

node_learner(("Learner"))
node_deepseek["DeepSeek API"]

node_learner -->|"uses"| node_app
node_app -->|"selects material"| node_upload
node_upload -->|"offers cropping"| node_crop
node_upload -->|"prepares PDFs"| node_parseui
node_crop -->|"submits images"| node_parseapi
node_parseui -->|"submits content"| node_parseapi
node_parseapi -->|"checks origin and limits"| node_ratelimit
node_parseapi -->|"calls model gateway"| node_provider
node_provider -->|"sends parse request"| node_deepseek
node_parseapi -->|"returns parsed text"| node_result
node_result -->|"provides chat context"| node_chatui
node_learner -->|"asks follow-up"| node_chatui
node_chatui -->|"posts messages"| node_chatapi
node_chatapi -->|"checks origin and limits"| node_ratelimit
node_chatapi -->|"builds system prompt"| node_prompts
node_chatapi -->|"calls model gateway"| node_provider
node_provider -->|"streams completion"| node_deepseek
node_chatapi -->|"streams reply"| node_chatui
node_settings -->|"supplies BYOK settings"| node_chatui
node_settings -.->|"supplies BYOK headers"| node_parseapi
node_brand -->|"applies appearance"| node_app
node_learner -->|"saves and recalls"| node_favorites
node_chatui -->|"stores parsed result"| node_favorites
node_chatui -->|"renders formulas"| node_math
node_app -->|"supports pane navigation"| node_tabs

click node_app "https://github.com/lichiahaomc/study-omni/blob/main/public/index.html"
click node_upload "https://github.com/lichiahaomc/study-omni/blob/main/public/js/03-ai.js"
click node_crop "https://github.com/lichiahaomc/study-omni/blob/main/public/js/05-crop.js"
click node_parseui "https://github.com/lichiahaomc/study-omni/blob/main/public/js/05-crop.js"
click node_parseapi "https://github.com/lichiahaomc/study-omni/blob/main/functions/api/parse.js"
click node_result "https://github.com/lichiahaomc/study-omni/blob/main/public/js/05-crop.js"
click node_chatui "https://github.com/lichiahaomc/study-omni/blob/main/public/js/03-ai.js"
click node_chatapi "https://github.com/lichiahaomc/study-omni/blob/main/functions/api/chat.js"
click node_prompts "https://github.com/lichiahaomc/study-omni/blob/main/functions/_lib/prompts.js"
click node_provider "https://github.com/lichiahaomc/study-omni/blob/main/functions/_lib/providers.js"
click node_ratelimit "https://github.com/lichiahaomc/study-omni/blob/main/functions/_lib/ratelimit.js"
click node_settings "https://github.com/lichiahaomc/study-omni/blob/main/public/js/09-settings.js"
click node_brand "https://github.com/lichiahaomc/study-omni/blob/main/public/js/10-brand-bg.js"
click node_favorites "https://github.com/lichiahaomc/study-omni/blob/main/public/js/06-toolbar.js"
click node_math "https://github.com/lichiahaomc/study-omni/blob/main/public/js/02-math.js"
click node_tabs "https://github.com/lichiahaomc/study-omni/blob/main/public/js/07-tabs.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_app,node_upload,node_crop,node_parseui,node_result,node_chatui toneBlue
class node_settings,node_brand,node_favorites,node_math,node_tabs toneAmber
class node_parseapi,node_chatapi,node_prompts,node_ratelimit,node_deepseek toneMint
class node_provider toneRose
class node_learner toneIndigo
```

## Components

### Study workflow

- [Study interface](https://github.com/lichiahaomc/study-omni/blob/main/public/index.html): `public/index.html`
- [Material upload](https://github.com/lichiahaomc/study-omni/blob/main/public/js/03-ai.js): `public/js/03-ai.js`
- [Image crop](https://github.com/lichiahaomc/study-omni/blob/main/public/js/05-crop.js): `public/js/05-crop.js`
- [PDF preparation](https://github.com/lichiahaomc/study-omni/blob/main/public/js/05-crop.js): `public/js/05-crop.js`
- [Parsed material](https://github.com/lichiahaomc/study-omni/blob/main/public/js/05-crop.js): `public/js/05-crop.js`
- [Streaming chat](https://github.com/lichiahaomc/study-omni/blob/main/public/js/03-ai.js): `public/js/03-ai.js`

### Frontend features

- [Settings and BYOK](https://github.com/lichiahaomc/study-omni/blob/main/public/js/09-settings.js): `public/js/09-settings.js`
- [Themes and background](https://github.com/lichiahaomc/study-omni/blob/main/public/js/10-brand-bg.js): `public/js/10-brand-bg.js`
- [Favorites](https://github.com/lichiahaomc/study-omni/blob/main/public/js/06-toolbar.js): `public/js/06-toolbar.js`
- [Formula rendering](https://github.com/lichiahaomc/study-omni/blob/main/public/js/02-math.js): `public/js/02-math.js`
- [Responsive navigation](https://github.com/lichiahaomc/study-omni/blob/main/public/js/07-tabs.js): `public/js/07-tabs.js`

### API services

- [Material parsing](https://github.com/lichiahaomc/study-omni/blob/main/functions/api/parse.js): `functions/api/parse.js`
- [Chat endpoint](https://github.com/lichiahaomc/study-omni/blob/main/functions/api/chat.js): `functions/api/chat.js`
- [Subject prompts](https://github.com/lichiahaomc/study-omni/blob/main/functions/_lib/prompts.js): `functions/_lib/prompts.js`
- [Origin and limits](https://github.com/lichiahaomc/study-omni/blob/main/functions/_lib/ratelimit.js): `functions/_lib/ratelimit.js`

### Model integration

- [Model gateway](https://github.com/lichiahaomc/study-omni/blob/main/functions/_lib/providers.js): `functions/_lib/providers.js`

### Other components

- **Learner**
- **DeepSeek API**

## Connections

- Learner → Study interface: uses
- Study interface → Material upload: selects material
- Material upload → Image crop: offers cropping
- Material upload → PDF preparation: prepares PDFs
- Image crop → Material parsing: submits images
- PDF preparation → Material parsing: submits content
- Material parsing → Origin and limits: checks origin and limits
- Material parsing → Model gateway: calls model gateway
- Model gateway → DeepSeek API: sends parse request
- Material parsing → Parsed material: returns parsed text
- Parsed material → Streaming chat: provides chat context
- Learner → Streaming chat: asks follow-up
- Streaming chat → Chat endpoint: posts messages
- Chat endpoint → Origin and limits: checks origin and limits
- Chat endpoint → Subject prompts: builds system prompt
- Chat endpoint → Model gateway: calls model gateway
- Model gateway → DeepSeek API: streams completion
- Chat endpoint → Streaming chat: streams reply
- Settings and BYOK → Streaming chat: supplies BYOK settings
- Settings and BYOK → Material parsing: supplies BYOK headers
- Themes and background → Study interface: applies appearance
- Learner → Favorites: saves and recalls
- Streaming chat → Favorites: stores parsed result
- Streaming chat → Formula rendering: renders formulas
- Study interface → Responsive navigation: supports pane navigation