# grenka22/timetable architecture

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

## Overview

312 is a browser-based school timetable app. Users can view lessons by day and odd/even week, see a current/next-lesson card, edit schedules manually, or import a timetable image through Russian OCR, parsing, and editor review before saving. Schedule data is persisted in browser local storage. The README is empty; the import and editing flows are supported by the sampled JavaScript, while the HTML and manifest were not inspected.

Main entry points: [`312/app.js`](https://github.com/grenka22/timetable/blob/main/312/app.js) (App navigation), [`312/editor.js`](https://github.com/grenka22/timetable/blob/main/312/editor.js) (Schedule editor), [`312/data.js`](https://github.com/grenka22/timetable/blob/main/312/data.js) (Schedule data), [`312/ocr.js`](https://github.com/grenka22/timetable/blob/main/312/ocr.js) (Image OCR)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["App flow"]
  node_browser["Browser UI<br/>[index.html]"]
  node_app_controller["App navigation<br/>[app.js]"]
end

subgraph group_schedule["Schedule experience"]
  node_schedule_view["Schedule display<br/>[render.js]"]
  node_editor["Schedule editor<br/>[editor.js]"]
end

subgraph group_import["Timetable import"]
  node_ocr["Image OCR<br/>[ocr.js]"]
  node_parser["Schedule parser<br/>[parser.js]"]
end

subgraph group_storage["Persistence"]
  node_data_manager["Schedule data<br/>[data.js]"]
end

node_user(("User"))
node_image["Schedule image"]
node_tesseract["Tesseract OCR"]
node_local_storage[("Browser storage")]

node_user -->|"uses"| node_browser
node_browser -->|"starts"| node_app_controller
node_app_controller -->|"renders"| node_schedule_view
node_user -->|"selects day/week"| node_schedule_view
node_schedule_view -->|"reads schedule"| node_data_manager
node_user -->|"edits schedule"| node_editor
node_app_controller -->|"opens editor"| node_editor
node_editor -->|"reads/writes schedule"| node_data_manager
node_editor -->|"returns home"| node_app_controller
node_user -->|"uploads"| node_image
node_image -->|"selected file"| node_app_controller
node_app_controller -->|"processes image"| node_ocr
node_ocr -->|"recognizes text"| node_tesseract
node_ocr -->|"returns text"| node_app_controller
node_app_controller -->|"parses text"| node_parser
node_app_controller -->|"saves parsed lessons"| node_data_manager
node_data_manager -->|"reads/writes"| node_local_storage

click node_browser "https://github.com/grenka22/timetable/blob/main/312/index.html"
click node_app_controller "https://github.com/grenka22/timetable/blob/main/312/app.js"
click node_schedule_view "https://github.com/grenka22/timetable/blob/main/312/render.js"
click node_editor "https://github.com/grenka22/timetable/blob/main/312/editor.js"
click node_ocr "https://github.com/grenka22/timetable/blob/main/312/ocr.js"
click node_parser "https://github.com/grenka22/timetable/blob/main/312/parser.js"
click node_data_manager "https://github.com/grenka22/timetable/blob/main/312/data.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_browser,node_app_controller,node_user toneBlue
class node_schedule_view,node_editor,node_local_storage toneAmber
class node_ocr,node_parser toneMint
class node_data_manager toneRose
class node_image,node_tesseract toneIndigo
```

## Components

### App flow

- [Browser UI](https://github.com/grenka22/timetable/blob/main/312/index.html): `312/index.html`
- [App navigation](https://github.com/grenka22/timetable/blob/main/312/app.js): `312/app.js`

### Schedule experience

- [Schedule display](https://github.com/grenka22/timetable/blob/main/312/render.js): `312/render.js`
- [Schedule editor](https://github.com/grenka22/timetable/blob/main/312/editor.js): `312/editor.js`

### Timetable import

- [Image OCR](https://github.com/grenka22/timetable/blob/main/312/ocr.js): `312/ocr.js`
- [Schedule parser](https://github.com/grenka22/timetable/blob/main/312/parser.js): `312/parser.js`

### Persistence

- [Schedule data](https://github.com/grenka22/timetable/blob/main/312/data.js): `312/data.js`

### Other components

- **User**
- **Schedule image**
- **Tesseract OCR**
- **Browser storage**

## Connections

- User → Browser UI: uses
- Browser UI → App navigation: starts
- App navigation → Schedule display: renders
- User → Schedule display: selects day/week
- Schedule display → Schedule data: reads schedule
- User → Schedule editor: edits schedule
- App navigation → Schedule editor: opens editor
- Schedule editor → Schedule data: reads/writes schedule
- Schedule editor → App navigation: returns home
- User → Schedule image: uploads
- Schedule image → App navigation: selected file
- App navigation → Image OCR: processes image
- Image OCR → Tesseract OCR: recognizes text
- Image OCR → App navigation: returns text
- App navigation → Schedule parser: parses text
- App navigation → Schedule data: saves parsed lessons
- Schedule data → Browser storage: reads/writes