# 852wa/jizura architecture

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

- Interactive diagram: https://gitdiagram.com/852wa/jizura
- Repository: https://github.com/852wa/jizura

## Overview

JIZURA turns lyric text and timing into randomized, editable lyric-motion cuts, then previews and exports them in the browser; it also offers an After Effects workflow. The README documents the user-facing stages and formats, while sampled source is limited, so edges below use documented relationships rather than presumed module calls. The browser expression packs and the AE generation engine are distinct implementations; localization is represented as a product capability, not as a build pipeline.

Main entry points: [`src/12_ui.js`](https://github.com/852wa/jizura/blob/main/src/12_ui.js) (Editor interface), [`src/08_planner.js`](https://github.com/852wa/jizura/blob/main/src/08_planner.js) (Cut planner), [`src/05b_registry.js`](https://github.com/852wa/jizura/blob/main/src/05b_registry.js) (Technique registry), [`src/09_render.js`](https://github.com/852wa/jizura/blob/main/src/09_render.js) (Cut renderer)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_browser["Browser editor"]
  node_editor["Editor interface<br/>[12_ui.js]"]
  node_lyrics["Lyrics and cuts<br/>[03_text.js]"]
  node_timing["Timing and audio<br/>[10_audio.js]"]
  node_fonts["Fonts and styles<br/>[02_fonts.js]"]
  node_randomizer["Omakase planner<br/>[08b_omakase.js]"]
  node_planner["Cut planner<br/>[08_planner.js]"]
  node_localization["Language editions<br/>[i18n.py]"]
end

subgraph group_parts["Motion composition"]
  node_registry["Technique registry<br/>[05b_registry.js]"]
  node_layouts["Layouts<br/>[11p_layoutsC.js]"]
  node_motionpacks["Motion and effects<br/>[11p_decor.js]"]
end

subgraph group_output["Playback and export"]
  node_renderer["Cut renderer<br/>[09_render.js]"]
  node_preview["Preview playback<br/>[12_ui.js]"]
  node_exporter["Media export<br/>[11_export.js]"]
end

subgraph group_aftereffects["After Effects"]
  node_aeui["AE panel<br/>[90_ui.jsx]"]
  node_aeengine["AE composition engine<br/>[50_build.jsx]"]
  node_aepacks["AE expression packs<br/>[p_layoutsD1.jsx]"]
  node_cepbridge["CEP bridge<br/>[cep.js]"]
  node_aehost["AE host interface<br/>[host.jsx]"]
end

node_user(("Creator"))

node_user -->|"edits lyrics"| node_editor
node_editor -->|"enters lyrics"| node_lyrics
node_editor -->|"sets timing"| node_timing
node_editor -->|"chooses style"| node_fonts
node_editor -->|"requests variations"| node_randomizer
node_randomizer -->|"selects composition"| node_planner
node_timing -->|"aligns cuts"| node_planner
node_planner -->|"selects techniques"| node_registry
node_registry -->|"provides layouts"| node_layouts
node_registry -->|"provides effects"| node_motionpacks
node_planner -->|"supplies cut plan"| node_renderer
node_renderer -->|"draws preview"| node_preview
node_renderer -->|"renders frames"| node_exporter
node_editor -->|"offers editions"| node_localization
node_editor -->|"exports project data"| node_exporter
node_user -->|"opens AE panel"| node_aeui
node_aeui -->|"builds composition"| node_aeengine
node_aeengine -.->|"uses expressions"| node_aepacks
node_cepbridge -->|"calls host"| node_aehost
node_cepbridge -->|"builds in AE"| node_aeengine

click node_editor "https://github.com/852wa/jizura/blob/main/src/12_ui.js"
click node_lyrics "https://github.com/852wa/jizura/blob/main/src/03_text.js"
click node_timing "https://github.com/852wa/jizura/blob/main/src/10_audio.js"
click node_fonts "https://github.com/852wa/jizura/blob/main/src/02_fonts.js"
click node_randomizer "https://github.com/852wa/jizura/blob/main/src/08b_omakase.js"
click node_planner "https://github.com/852wa/jizura/blob/main/src/08_planner.js"
click node_registry "https://github.com/852wa/jizura/blob/main/src/05b_registry.js"
click node_layouts "https://github.com/852wa/jizura/blob/main/src/11p_layoutsC.js"
click node_motionpacks "https://github.com/852wa/jizura/blob/main/src/11p_decor.js"
click node_renderer "https://github.com/852wa/jizura/blob/main/src/09_render.js"
click node_preview "https://github.com/852wa/jizura/blob/main/src/12_ui.js"
click node_exporter "https://github.com/852wa/jizura/blob/main/src/11_export.js"
click node_localization "https://github.com/852wa/jizura/blob/main/app/i18n.py"
click node_aeui "https://github.com/852wa/jizura/blob/main/ae/90_ui.jsx"
click node_aeengine "https://github.com/852wa/jizura/blob/main/ae/50_build.jsx"
click node_aepacks "https://github.com/852wa/jizura/blob/main/ae/p_layoutsD1.jsx"
click node_cepbridge "https://github.com/852wa/jizura/blob/main/cep/cep.js"
click node_aehost "https://github.com/852wa/jizura/blob/main/cep/host.jsx"

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_editor,node_lyrics,node_timing,node_fonts,node_randomizer,node_planner,node_localization toneBlue
class node_registry,node_layouts,node_motionpacks toneAmber
class node_renderer,node_preview,node_exporter toneMint
class node_aeui,node_aeengine,node_aepacks,node_cepbridge,node_aehost toneRose
class node_user toneIndigo
```

## Components

### Browser editor

- [Editor interface](https://github.com/852wa/jizura/blob/main/src/12_ui.js): `src/12_ui.js`
- [Lyrics and cuts](https://github.com/852wa/jizura/blob/main/src/03_text.js): `src/03_text.js`
- [Timing and audio](https://github.com/852wa/jizura/blob/main/src/10_audio.js): `src/10_audio.js`
- [Fonts and styles](https://github.com/852wa/jizura/blob/main/src/02_fonts.js): `src/02_fonts.js`
- [Omakase planner](https://github.com/852wa/jizura/blob/main/src/08b_omakase.js): `src/08b_omakase.js`
- [Cut planner](https://github.com/852wa/jizura/blob/main/src/08_planner.js): `src/08_planner.js`
- [Language editions](https://github.com/852wa/jizura/blob/main/app/i18n.py): `app/i18n.py`

### Motion composition

- [Technique registry](https://github.com/852wa/jizura/blob/main/src/05b_registry.js): `src/05b_registry.js`
- [Layouts](https://github.com/852wa/jizura/blob/main/src/11p_layoutsC.js): `src/11p_layoutsC.js`
- [Motion and effects](https://github.com/852wa/jizura/blob/main/src/11p_decor.js): `src/11p_decor.js`

### Playback and export

- [Cut renderer](https://github.com/852wa/jizura/blob/main/src/09_render.js): `src/09_render.js`
- [Preview playback](https://github.com/852wa/jizura/blob/main/src/12_ui.js): `src/12_ui.js`
- [Media export](https://github.com/852wa/jizura/blob/main/src/11_export.js): `src/11_export.js`

### After Effects

- [AE panel](https://github.com/852wa/jizura/blob/main/ae/90_ui.jsx): `ae/90_ui.jsx`
- [AE composition engine](https://github.com/852wa/jizura/blob/main/ae/50_build.jsx): `ae/50_build.jsx`
- [AE expression packs](https://github.com/852wa/jizura/blob/main/ae/p_layoutsD1.jsx): `ae/p_layoutsD1.jsx`
- [CEP bridge](https://github.com/852wa/jizura/blob/main/cep/cep.js): `cep/cep.js`
- [AE host interface](https://github.com/852wa/jizura/blob/main/cep/host.jsx): `cep/host.jsx`

### Other components

- **Creator**

## Connections

- Creator → Editor interface: edits lyrics (evidence: `README.md`)
- Editor interface → Lyrics and cuts: enters lyrics (evidence: `README.md`)
- Editor interface → Timing and audio: sets timing (evidence: `README.md`)
- Editor interface → Fonts and styles: chooses style (evidence: `README.md`)
- Editor interface → Omakase planner: requests variations (evidence: `README.md`)
- Omakase planner → Cut planner: selects composition (evidence: `README.md`)
- Timing and audio → Cut planner: aligns cuts (evidence: `README.md`)
- Cut planner → Technique registry: selects techniques (evidence: `README.md`)
- Technique registry → Layouts: provides layouts (evidence: `src/11p_layoutsC.js`)
- Technique registry → Motion and effects: provides effects (evidence: `README.md`)
- Cut planner → Cut renderer: supplies cut plan (evidence: `README.md`)
- Cut renderer → Preview playback: draws preview (evidence: `README.md`)
- Cut renderer → Media export: renders frames (evidence: `README.md`)
- Editor interface → Language editions: offers editions (evidence: `app/i18n.py`)
- Editor interface → Media export: exports project data (evidence: `README.md`)
- Creator → AE panel: opens AE panel (evidence: `README.md`)
- AE panel → AE composition engine: builds composition (evidence: `README.md`)
- AE composition engine → AE expression packs: uses expressions
- CEP bridge → AE host interface: calls host (evidence: `cep/cep.js`)
- CEP bridge → AE composition engine: builds in AE (evidence: `cep/cep.js`)