# raishawnjones00/vert architecture

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

- Interactive diagram: https://gitdiagram.com/raishawnjones00/vert
- Repository: https://github.com/raishawnjones00/vert

## Overview

VERT is a browser-based file converter: users upload files, choose output formats, convert locally where supported, and download results. The README also documents broad image, audio, document, and video format support; the tree identifies ImageMagick, FFmpeg, Pandoc, and VERT daemon converter modules. The file store handles uploads and conversion coordination, while settings and the service worker support configuration and WASM caching. Source excerpts are partial, so uncertain worker and converter wiring is omitted.

Main entry points: [`src/lib/converters/converter.svelte.ts`](https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/converter.svelte.ts) (Converter interface), [`src/lib/store/index.svelte.ts`](https://github.com/raishawnjones00/vert/blob/main/src/lib/store/index.svelte.ts) (File and conversion state), [`src/lib/converters/ffmpeg.svelte.ts`](https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/ffmpeg.svelte.ts) (FFmpeg engine), [`src/lib/converters/vertd.svelte.ts`](https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/vertd.svelte.ts) (Video daemon engine)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_workflow["Conversion workflow"]
  node_upload["Upload page<br/>[+page.svelte]"]
  node_uploader["File uploader<br/>[Uploader.svelte]"]
  node_files["File and conversion state<br/>[index.svelte.ts]"]
  node_format["Format selector"]
  node_convertpage["Conversion page<br/>[+page.svelte]"]
  node_panel["Conversion controls"]
end

subgraph group_engines["Conversion engines"]
  node_converterbase["Converter interface"]
  node_ffmpeg["FFmpeg engine<br/>[ffmpeg.svelte.ts]"]
  node_magick["ImageMagick engine<br/>[magick.svelte.ts]"]
  node_pandoc["Pandoc engine<br/>[pandoc.svelte.ts]"]
  node_vertd["Video daemon engine<br/>[vertd.svelte.ts]"]
  node_pandocworker["Pandoc worker<br/>[pandoc.ts]"]
end

subgraph group_preferences["Settings and support"]
  node_settingsui["Settings pages<br/>[index.svelte.ts]"]
  node_settings[("Conversion preferences<br/>[index.svelte.ts]")]
  node_about["About content<br/>[+page.svelte]"]
end

subgraph group_runtime["Browser runtime"]
  node_serviceworker["WASM cache<br/>[sw.js]"]
end

node_user(("User"))
node_cdn["FFmpeg CDN"]
node_daemon["VERT daemon"]

node_user -->|"opens"| node_upload
node_upload -->|"presents"| node_uploader
node_uploader -->|"adds files"| node_files
node_user -->|"chooses format"| node_format
node_format -->|"updates selection"| node_files
node_user -->|"opens"| node_convertpage
node_convertpage -->|"renders"| node_panel
node_files -->|"provides file state"| node_convertpage
node_files -->|"selects converter"| node_converterbase
node_ffmpeg -->|"implements"| node_converterbase
node_magick -->|"implements"| node_converterbase
node_pandoc -->|"implements"| node_converterbase
node_vertd -->|"implements"| node_converterbase
node_settingsui -->|"edits"| node_settings
node_ffmpeg -->|"reads options"| node_settings
node_vertd -->|"reads options"| node_settings
node_pandocworker -->|"runs conversion"| node_pandoc
node_ffmpeg -.->|"loads WASM"| node_cdn
node_vertd -.->|"requests conversion"| node_daemon
node_serviceworker -.->|"caches assets"| node_cdn

click node_upload "https://github.com/raishawnjones00/vert/blob/main/src/routes/%2Bpage.svelte"
click node_uploader "https://github.com/raishawnjones00/vert/blob/main/src/lib/components/functional/Uploader.svelte"
click node_files "https://github.com/raishawnjones00/vert/blob/main/src/lib/store/index.svelte.ts"
click node_format "https://github.com/raishawnjones00/vert/blob/main/src/lib/components/functional/FormatDropdown.svelte"
click node_convertpage "https://github.com/raishawnjones00/vert/blob/main/src/routes/convert/%2Bpage.svelte"
click node_panel "https://github.com/raishawnjones00/vert/blob/main/src/lib/components/functional/ConversionPanel.svelte"
click node_converterbase "https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/converter.svelte.ts"
click node_ffmpeg "https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/ffmpeg.svelte.ts"
click node_magick "https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/magick.svelte.ts"
click node_pandoc "https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/pandoc.svelte.ts"
click node_vertd "https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/vertd.svelte.ts"
click node_pandocworker "https://github.com/raishawnjones00/vert/blob/main/src/lib/workers/pandoc.ts"
click node_settingsui "https://github.com/raishawnjones00/vert/blob/main/src/lib/sections/settings/index.svelte.ts"
click node_settings "https://github.com/raishawnjones00/vert/blob/main/src/lib/sections/settings/index.svelte.ts"
click node_about "https://github.com/raishawnjones00/vert/blob/main/src/routes/about/%2Bpage.svelte"
click node_serviceworker "https://github.com/raishawnjones00/vert/blob/main/static/sw.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_upload,node_uploader,node_files,node_format,node_convertpage,node_panel,node_user toneBlue
class node_converterbase,node_ffmpeg,node_magick,node_pandoc,node_vertd,node_pandocworker toneAmber
class node_settingsui,node_settings,node_about toneMint
class node_serviceworker toneRose
class node_cdn,node_daemon toneIndigo
```

## Components

### Conversion workflow

- [Upload page](https://github.com/raishawnjones00/vert/blob/main/src/routes/%2Bpage.svelte): `src/routes/+page.svelte`
- [File uploader](https://github.com/raishawnjones00/vert/blob/main/src/lib/components/functional/Uploader.svelte): `src/lib/components/functional/Uploader.svelte`
- [File and conversion state](https://github.com/raishawnjones00/vert/blob/main/src/lib/store/index.svelte.ts): `src/lib/store/index.svelte.ts`
- [Format selector](https://github.com/raishawnjones00/vert/blob/main/src/lib/components/functional/FormatDropdown.svelte): `src/lib/components/functional/FormatDropdown.svelte`
- [Conversion page](https://github.com/raishawnjones00/vert/blob/main/src/routes/convert/%2Bpage.svelte): `src/routes/convert/+page.svelte`
- [Conversion controls](https://github.com/raishawnjones00/vert/blob/main/src/lib/components/functional/ConversionPanel.svelte): `src/lib/components/functional/ConversionPanel.svelte`

### Conversion engines

- [Converter interface](https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/converter.svelte.ts): `src/lib/converters/converter.svelte.ts`
- [FFmpeg engine](https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/ffmpeg.svelte.ts): `src/lib/converters/ffmpeg.svelte.ts`
- [ImageMagick engine](https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/magick.svelte.ts): `src/lib/converters/magick.svelte.ts`
- [Pandoc engine](https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/pandoc.svelte.ts): `src/lib/converters/pandoc.svelte.ts`
- [Video daemon engine](https://github.com/raishawnjones00/vert/blob/main/src/lib/converters/vertd.svelte.ts): `src/lib/converters/vertd.svelte.ts`
- [Pandoc worker](https://github.com/raishawnjones00/vert/blob/main/src/lib/workers/pandoc.ts): `src/lib/workers/pandoc.ts`

### Settings and support

- [Settings pages](https://github.com/raishawnjones00/vert/blob/main/src/lib/sections/settings/index.svelte.ts): `src/lib/sections/settings/index.svelte.ts`
- [Conversion preferences](https://github.com/raishawnjones00/vert/blob/main/src/lib/sections/settings/index.svelte.ts): `src/lib/sections/settings/index.svelte.ts`
- [About content](https://github.com/raishawnjones00/vert/blob/main/src/routes/about/%2Bpage.svelte): `src/routes/about/+page.svelte`

### Browser runtime

- [WASM cache](https://github.com/raishawnjones00/vert/blob/main/static/sw.js): `static/sw.js`

### Other components

- **User**
- **FFmpeg CDN**
- **VERT daemon**

## Connections

- User → Upload page: opens
- Upload page → File uploader: presents
- File uploader → File and conversion state: adds files
- User → Format selector: chooses format
- Format selector → File and conversion state: updates selection
- User → Conversion page: opens
- Conversion page → Conversion controls: renders
- File and conversion state → Conversion page: provides file state
- File and conversion state → Converter interface: selects converter
- FFmpeg engine → Converter interface: implements
- ImageMagick engine → Converter interface: implements
- Pandoc engine → Converter interface: implements
- Video daemon engine → Converter interface: implements
- Settings pages → Conversion preferences: edits
- FFmpeg engine → Conversion preferences: reads options
- Video daemon engine → Conversion preferences: reads options
- Pandoc worker → Pandoc engine: runs conversion
- FFmpeg engine → FFmpeg CDN: loads WASM
- Video daemon engine → VERT daemon: requests conversion
- WASM cache → FFmpeg CDN: caches assets