<%- include("../../../src/web/views/partials/layout-top", { title }) %>

<%- include("../../../src/web/views/partials/page-header", { eyebrow: "Streaming media", pageTitle: "Song Overlay", description: "Send event-driven song information from Lumi Companion to chat and a customizable Lumi Overlay source.", actions: '' }) %>

Companion<%= current.stale ? 'Waiting for updates' : 'Connected recently' %>

Playback<%= current.playback?.status || 'Unavailable' %>

Current song<%= current.track?.name || 'Nothing reported' %>

Overlay source<%= moduleStatus.exists ? `${moduleStatus.overlayName} / ${moduleStatus.sceneName}` : 'Not installed' %>

Connection

Companion authentication

Song Overlay automatically uses the same paired-device authentication as Lumi Companion. There is no plugin-specific key to generate or maintain.

Shared Companion trust

Pair the Companion once. Revoking that device in Lumi immediately removes access for transcription, Song Overlay, and other Companion plugins.

Overlay

Song card

These settings update the rendered source. Position and source bounds remain editable in Lumi Overlays.

/>Enabled

Visibility after song change Temporary display time (seconds) Card scale Corner radius Entry animation Exit animation Animation duration (ms) Transparency Transparency affects Background Custom primary color Custom secondary color

Chat

Song announcements

Announcements are sent only when a different song starts. Pause, resume, seek, and heartbeat events never announce again.

/>Enabled

/> Twitch /> YouTube /> Only when the platform is live

Announcement text Duplicate cooldown (seconds)

Available placeholders

<% placeholders.forEach((placeholder) => { %>{{<%= placeholder %>}}<% }) %>

Reliability

Connection health

Mark Companion stale after (seconds)

Lumi Overlays

Install the source

The plugin creates a normal Lumi website source and keeps its URL synchronized. You can move and resize it in the existing overlay editor.

<% if (moduleStatus.exists) { %>

Installed

<%= moduleStatus.overlayName %> → <%= moduleStatus.sceneName %> → <%= moduleStatus.moduleName %>

<% } else { %> <% if (!overlayTargets.length) { %>

Create a Lumi Overlay and scene first.

<% } %> <% } %>

<%- include("../../../src/web/views/partials/layout-bottom") %>