# waifwu/kagetstream architecture

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

- Interactive diagram: https://gitdiagram.com/waifwu/kagetstream
- Repository: https://github.com/waifwu/kagetstream

## Overview

Kagetsu Tohya is a browser port of the original NScripter game: the player opens the page, which loads extracted scripts and assets, runs the selected story, and presents it through a canvas and interface. The runtime also adds saves, settings, galleries, a flowchart, and an optional walkthrough; a small Electron app wraps the same game and can update itself. Edges follow README statements and source-index imports. Some runtime wiring and the updater implementation were not excerpted, so those details are not inferred.

Main entry points: [`js/main.js`](https://github.com/waifwu/kagetstream/blob/main/js/main.js) (Browser entry), [`js/ui.js`](https://github.com/waifwu/kagetstream/blob/main/js/ui.js) (Game UI), [`js/input.js`](https://github.com/waifwu/kagetstream/blob/main/js/input.js) (Story input), [`js/engine.js`](https://github.com/waifwu/kagetstream/blob/main/js/engine.js) (Script interpreter)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_runtime["Game runtime"]
  node_web_entry["Browser entry<br/>[main.js]"]
  node_interpreter["Script interpreter<br/>[engine.js]"]
  node_graphics["Canvas graphics<br/>[gfx.js]"]
  node_text_layer["Story text<br/>[text.js]"]
  node_audio["Game audio<br/>[audio.js]"]
  node_input["Story input<br/>[input.js]"]
  node_key_bindings["Key bindings<br/>[keys.js]"]
  node_save_storage[("Saves and settings<br/>[storage.js]")]
end

subgraph group_interface["Reader interface"]
  node_interface_shell["Menus and pages<br/>[shell.js]"]
  node_interface_ui["Game UI<br/>[ui.js]"]
  node_menu_skins["Menu redraws<br/>[skins.js]"]
  node_translations["Interface translations<br/>[i18n.js]"]
  node_flow_model["Story flowchart<br/>[flowchart-model.js]"]
  node_walkthrough["Optional walkthrough<br/>[guide.js]"]
end

subgraph group_game_data["Game data"]
  node_game_files["Scripts and assets"]
end

subgraph group_desktop["Desktop app"]
  node_desktop_shell["Electron wrapper<br/>[main.js]"]
  node_updater["Desktop updater<br/>[updater.js]"]
end

node_player(("Player"))
node_release_service(("Release service"))

node_player -->|"opens game"| node_web_entry
node_web_entry -->|"starts runtime"| node_interpreter
node_web_entry -->|"creates renderer"| node_graphics
node_web_entry -->|"creates text layer"| node_text_layer
node_web_entry -->|"creates audio"| node_audio
node_web_entry -->|"loads input"| node_input
node_web_entry -->|"loads storage"| node_save_storage
node_web_entry -->|"loads UI"| node_interface_ui
node_web_entry -->|"loads shell"| node_interface_shell
node_web_entry -->|"loads skins"| node_menu_skins
node_web_entry -->|"creates guide"| node_walkthrough
node_web_entry -->|"loads translations"| node_translations
node_web_entry -->|"loads key bindings"| node_key_bindings
node_game_files -->|"provides game script"| node_interpreter
node_game_files -->|"provides assets"| node_graphics
node_input -->|"uses bindings"| node_key_bindings
node_input -->|"uses renderer"| node_graphics
node_interface_ui -->|"reads story state"| node_interpreter
node_interface_ui -->|"cleans labels"| node_text_layer
node_interface_ui -->|"builds flowchart"| node_flow_model
node_interface_ui -->|"uses similarity"| node_walkthrough
node_interface_shell -->|"parses conditions"| node_flow_model
node_desktop_shell -->|"serves same game"| node_web_entry
node_desktop_shell -->|"loads updater"| node_updater
node_updater -->|"checks releases"| node_release_service

click node_web_entry "https://github.com/waifwu/kagetstream/blob/main/js/main.js"
click node_interpreter "https://github.com/waifwu/kagetstream/blob/main/js/engine.js"
click node_graphics "https://github.com/waifwu/kagetstream/blob/main/js/gfx.js"
click node_text_layer "https://github.com/waifwu/kagetstream/blob/main/js/text.js"
click node_audio "https://github.com/waifwu/kagetstream/blob/main/js/audio.js"
click node_input "https://github.com/waifwu/kagetstream/blob/main/js/input.js"
click node_key_bindings "https://github.com/waifwu/kagetstream/blob/main/js/keys.js"
click node_save_storage "https://github.com/waifwu/kagetstream/blob/main/js/storage.js"
click node_game_files "https://github.com/waifwu/kagetstream/tree/main/data"
click node_interface_shell "https://github.com/waifwu/kagetstream/blob/main/js/shell.js"
click node_interface_ui "https://github.com/waifwu/kagetstream/blob/main/js/ui.js"
click node_menu_skins "https://github.com/waifwu/kagetstream/blob/main/js/skins.js"
click node_translations "https://github.com/waifwu/kagetstream/blob/main/js/i18n.js"
click node_flow_model "https://github.com/waifwu/kagetstream/blob/main/js/flowchart-model.js"
click node_walkthrough "https://github.com/waifwu/kagetstream/blob/main/js/guide.js"
click node_desktop_shell "https://github.com/waifwu/kagetstream/blob/main/desktop/main.js"
click node_updater "https://github.com/waifwu/kagetstream/blob/main/desktop/updater.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_web_entry,node_interpreter,node_graphics,node_text_layer,node_audio,node_input,node_key_bindings,node_save_storage toneBlue
class node_interface_shell,node_interface_ui,node_menu_skins,node_translations,node_flow_model,node_walkthrough toneAmber
class node_game_files toneMint
class node_desktop_shell,node_updater toneRose
class node_player,node_release_service toneIndigo
```

## Components

### Game runtime

- [Browser entry](https://github.com/waifwu/kagetstream/blob/main/js/main.js): `js/main.js`
- [Script interpreter](https://github.com/waifwu/kagetstream/blob/main/js/engine.js): `js/engine.js`
- [Canvas graphics](https://github.com/waifwu/kagetstream/blob/main/js/gfx.js): `js/gfx.js`
- [Story text](https://github.com/waifwu/kagetstream/blob/main/js/text.js): `js/text.js`
- [Game audio](https://github.com/waifwu/kagetstream/blob/main/js/audio.js): `js/audio.js`
- [Story input](https://github.com/waifwu/kagetstream/blob/main/js/input.js): `js/input.js`
- [Key bindings](https://github.com/waifwu/kagetstream/blob/main/js/keys.js): `js/keys.js`
- [Saves and settings](https://github.com/waifwu/kagetstream/blob/main/js/storage.js): `js/storage.js`

### Reader interface

- [Menus and pages](https://github.com/waifwu/kagetstream/blob/main/js/shell.js): `js/shell.js`
- [Game UI](https://github.com/waifwu/kagetstream/blob/main/js/ui.js): `js/ui.js`
- [Menu redraws](https://github.com/waifwu/kagetstream/blob/main/js/skins.js): `js/skins.js`
- [Interface translations](https://github.com/waifwu/kagetstream/blob/main/js/i18n.js): `js/i18n.js`
- [Story flowchart](https://github.com/waifwu/kagetstream/blob/main/js/flowchart-model.js): `js/flowchart-model.js`
- [Optional walkthrough](https://github.com/waifwu/kagetstream/blob/main/js/guide.js): `js/guide.js`

### Game data

- [Scripts and assets](https://github.com/waifwu/kagetstream/tree/main/data): `data`

### Desktop app

- [Electron wrapper](https://github.com/waifwu/kagetstream/blob/main/desktop/main.js): `desktop/main.js`
- [Desktop updater](https://github.com/waifwu/kagetstream/blob/main/desktop/updater.js): `desktop/updater.js`

### Other components

- **Player**
- **Release service**

## Connections

- Player → Browser entry: opens game (evidence: `README.md`)
- Browser entry → Script interpreter: starts runtime (evidence: `js/main.js`)
- Browser entry → Canvas graphics: creates renderer (evidence: `js/main.js`)
- Browser entry → Story text: creates text layer (evidence: `js/main.js`)
- Browser entry → Game audio: creates audio (evidence: `js/main.js`)
- Browser entry → Story input: loads input (evidence: `js/main.js`)
- Browser entry → Saves and settings: loads storage (evidence: `js/main.js`)
- Browser entry → Game UI: loads UI (evidence: `js/main.js`)
- Browser entry → Menus and pages: loads shell (evidence: `js/main.js`)
- Browser entry → Menu redraws: loads skins (evidence: `js/main.js`)
- Browser entry → Optional walkthrough: creates guide (evidence: `js/main.js`)
- Browser entry → Interface translations: loads translations (evidence: `js/main.js`)
- Browser entry → Key bindings: loads key bindings (evidence: `js/main.js`)
- Scripts and assets → Script interpreter: provides game script (evidence: `README.md`)
- Scripts and assets → Canvas graphics: provides assets (evidence: `README.md`)
- Story input → Key bindings: uses bindings (evidence: `js/input.js`)
- Story input → Canvas graphics: uses renderer (evidence: `js/input.js`)
- Game UI → Script interpreter: reads story state (evidence: `js/ui.js`)
- Game UI → Story text: cleans labels (evidence: `js/ui.js`)
- Game UI → Story flowchart: builds flowchart (evidence: `js/ui.js`)
- Game UI → Optional walkthrough: uses similarity (evidence: `js/ui.js`)
- Menus and pages → Story flowchart: parses conditions (evidence: `js/shell.js`)
- Electron wrapper → Browser entry: serves same game (evidence: `README.md`)
- Electron wrapper → Desktop updater: loads updater (evidence: `desktop/main.js`)
- Desktop updater → Release service: checks releases (evidence: `README.md`)