diff --git a/apps/web/app.js b/apps/web/app.js index be2e7e0..7c5dab5 100644 --- a/apps/web/app.js +++ b/apps/web/app.js @@ -169,12 +169,27 @@ function mountPlayer(relayUrl, name) { watch.connection.websocket = { enabled: false }; } - // A canvas enables video rendering. Without it, only audio is played. - const canvas = document.createElement("canvas"); - canvas.className = "canvas"; - watch.appendChild(canvas); + // Use a media element for live playback so browser audio controls/policies apply naturally. + const video = document.createElement("video"); + video.className = "archiveVideo"; + video.controls = true; + video.autoplay = true; + video.muted = false; + video.playsInline = true; + watch.appendChild(video); mount.appendChild(watch); + const forceAudioOn = () => { + try { + watch.backend?.audio?.muted?.set?.(false); + watch.backend?.audio?.volume?.set?.(1); + } catch (_) { + // Best effort only. + } + }; + forceAudioOn(); + window.setTimeout(forceAudioOn, 1000); + window.setTimeout(forceAudioOn, 4000); bindPlayerSignals(watch, name); } diff --git a/evolution/proposals/ECP-0076-webtransport-only-web-watcher.md b/evolution/proposals/ECP-0076-webtransport-only-web-watcher.md index baf9e9c..31e78bc 100644 --- a/evolution/proposals/ECP-0076-webtransport-only-web-watcher.md +++ b/evolution/proposals/ECP-0076-webtransport-only-web-watcher.md @@ -10,7 +10,7 @@ In `apps/web/app.js`, configure each `` instance to disable WebSocket - `watch.connection.websocket = { enabled: false }` -Also set default watcher volume to full (`volume="1"`) to avoid low-volume false negatives during validation. +Also set default watcher volume to full (`volume="1"`) and mount live playback on a `