10 β€” OBS Subtitle Overlay

Source: src/vocal10n/obs/.

Purpose

Provide an HTML page that OBS Studio can load via the Browser Source plugin to render live subtitles produced by Vocal10n. Both source and target language are supported with independent styling.

Server

server.py spins up a small HTTP server on obs.host:obs.port (default 127.0.0.1:5124). It serves:

  • GET / β€” the overlay HTML page (overlay.html).
  • A WebSocket / SSE endpoint that pushes the current source and target text whenever SystemState text properties change.

The server is started by the OBS tab toggle and is independent of any file outputs.

Layout Rules

  • Source on top, target on bottom when both are enabled.
  • A single enabled language is centred vertically.
  • Each line uses its own font family, size, colour, stroke and shadow as configured under obs.* (chapter 05).

Styling Controls

The OBS tab exposes:

  • Per-language font family (any installed system font; Google Fonts loadable by URL).
  • Per-language font size.
  • Stroke width and colour (-webkit-text-stroke).
  • Drop shadow X/Y offset, blur radius, opacity (text-shadow).
  • Live preview pane that re-renders on every change so the user can dial the look in without alt-tabbing into OBS.

These were finalised in Phase 7 (c79f52c, 27f7da7).

Standalone Subtitle Timing

When STT runs without TTS, the overlay still reflects the same partial / confirmed split: live text appears in real time, while corrected text replaces it as confirmed segments arrive. This was tightened in commit 27f7da7 so that timing remains consistent even when no audio is being synthesised.