every-channel/every.channel
1
0
Fork 0
Code Releases Activity Actions 2

Stabilize hosted live video playback
Some checks are pending
ci-gates / checks (push) Waiting to run
Details
deploy-cloudflare / checks (push) Waiting to run
Details
deploy-cloudflare / deploy (push) Blocked by required conditions
Details

Browse source
This commit is contained in:
every.channel 2026-05-03 22:38:39 -07:00
parent 6739b424ab
commit bd5d9857ed
No known key found for this signature in database
4 changed files with 83 additions and 67 deletions
Download patch file Download diff file Expand all files Collapse all files

30
apps/web/app.js
View file

@ -172,16 +172,11 @@ function mountPlayer(relayUrl, name) {
watch.connection.websocket = { enabled: false };
}
// Prefer a video element for native controls/audio routing.
// Start muted to satisfy autoplay policy, then unlock audio on user gesture.
const video = document.createElement("video");
video.className = "archiveVideo";
video.controls = true;
video.autoplay = true;
video.muted = true;
video.volume = 1;
video.playsInline = true;
watch.appendChild(video);
const canvas = document.createElement("canvas");
canvas.className = "canvas";
canvas.width = 1280;
canvas.height = 720;
watch.appendChild(canvas);
mount.appendChild(watch);
const cleanup = [];
let audioUnlocked = false;
@ -196,30 +191,21 @@ function mountPlayer(relayUrl, name) {
}
watch.removeAttribute("muted");
watch.muted = false;
video.muted = false;
video.volume = 1;
};
const keepAudioUnlocked = () => {
if (audioUnlocked) forceAudioOn();
};
const unlockAudio = () => {
audioUnlocked = true;
forceAudioOn();
watch.backend?.paused?.set?.(true);
watch.backend?.paused?.set?.(false);
void video.play().catch(() => {});
setHint(`Live: subscribed to ${name} (audio unlocked)`, "ok");
};
document.addEventListener("pointerdown", unlockAudio, { once: true });
video.addEventListener("pointerdown", unlockAudio, { once: true });
video.addEventListener("volumechange", keepAudioUnlocked);
canvas.addEventListener("pointerdown", unlockAudio, { once: true });
cleanup.push(() => {
document.removeEventListener("pointerdown", unlockAudio);
video.removeEventListener("pointerdown", unlockAudio);
video.removeEventListener("volumechange", keepAudioUnlocked);
canvas.removeEventListener("pointerdown", unlockAudio);
});
setHint(`Live: subscribed to ${name} (tap video to unmute)`, "warn");
void video.play().catch(() => {});
setHint(`Live: subscribed to ${name} (tap player to unmute)`, "warn");
bindPlayerSignals(watch, name, cleanup);
}