Twungeon · Devlog
Twungeon controls move into the Twitch video overlay
Twungeon replaced its component-style viewer popup with a transparent, responsive Twitch video overlay that reuses the authenticated controller while leaving the streamed dungeon visible.
Twungeon's viewer controls now sit directly over the control area reserved in
the stream instead of opening as a large Twitch Video Component popup. The
production viewer uses Twitch's Video - Fullscreen placement with extension
as its relative viewer path. The broadcast continues to provide the dungeon,
players, Goblin, exit, status frame, and action log underneath the Extension.
The change deliberately reuses the existing controller and authoritative
backend flow. Twitch identity sharing, short-lived Twungeon sessions, character
ownership, movement, attack, self-heal, pass, action points, phase checks, and
dead-character checks still use the same APIs and server-side rules. The root
page remains the complete local and broadcast view, while /extension receives
an overlay class before first paint and hides every noninteractive game surface.
Overlay placement is expressed through centralized percentage-based CSS variables for the control region rather than resolution-specific coordinates. Container-relative sizing keeps the directional pad and action buttons usable across normal, theater, fullscreen, narrow, and 4:3 players. The transparent document and empty overlay canvas reject pointer events; only the actual buttons restore them, so the rest of the video is not presented as a large clickable surface.
Development remains practical without Twitch. The loopback-only
/extension?dev=1&debug=1 mode exposes the existing synthetic viewer login and
draws control-region boundaries. The flags are ignored on the deployed host.
Operator documentation now identifies the Twitch dashboard setting as
Video - Fullscreen, records the extension viewer path, and separates the
manual dashboard change from repository deployment.
Live testing exposed a subtle transparency failure after the correct viewer
path was saved. Although the document, body, and control region all computed to
transparent backgrounds, the root color-scheme: dark declaration caused
Chrome to paint the iframe canvas black. Dark color scheme now applies only to
the full game page; overlay mode explicitly uses the normal transparent canvas.
The stylesheet fix was deployed without restarting the Twungeon service, so the
active in-memory run was preserved.
Validation covered linting, strict type checking, 24 domain tests, 10 integration and multi-viewer tests, and a production build. Browser checks at 1920×1080, 1280×720, and 1024×768 confirmed normalized placement, hidden noninteractive surfaces, button-only pointer handling, and transparent computed backgrounds. The deployed public stylesheet and viewer endpoint were verified after the final transparency correction.
The Twitch video-overlay implementation is recorded in
commit a8a86852c0e06e518d816ea35400ef9878a365f3.