vocal_helper.gui module

Vocal Helper — transcript-viewer GUI (“who spoke when” bench).

This module holds nothing but the self-contained HTML document served by the FastAPI app at GET /gui (see vocal_helper.api). It is deliberately build-step-free: one string of HTML + Tailwind (via CDN) + vanilla ES-module JavaScript. There is no bundler, no framework, no npm — the whole page is a static asset the API returns verbatim.

Why a separate module

Keeping the (long) HTML out of vocal_helper.api keeps the route definitions readable and mirrors the AI Helpers suite convention (see audio_helper/gui.py): swap the operation for vocal-helper’s domain, keep the same “one HTML string returned by a /gui route” plumbing.

What the page does

  • Drop / pick a local audio file or paste a URL (YouTube / podcast RSS / direct media) — both stay local: the file never leaves the machine and the URL is fetched by the local server, not the browser.

  • Run the full offline pipeline (VAD + diarization + STT + optional rolling Gemma summary) by POSTing to the same /pipeline endpoint the CLI and MCP surfaces use — the GUI adds zero new server logic.

  • Render a speaker-labelled, colour-coded transcript — one stable colour per speaker (S0, S1, …) — with each utterance’s start time, plus the rolling summary in its own panel.

  • Utterances reveal progressively (motion-guarded) so a long transcript reads like it is streaming in, the honest testable subset of a live view.

Local-first

Sovereign by design: the page talks ONLY to the local vocal-helper server it is served from. No CDN audio, no analytics, no third party sees your voice.

Author

Warith Harchaoui, Ph.D. — https://linkedin.com/in/warith-harchaoui/