web: keep moq-watch muted until user gesture
This commit is contained in:
parent
ad81b9791a
commit
5a28a24294
2 changed files with 4 additions and 19 deletions
|
|
@ -162,6 +162,7 @@ function mountPlayer(relayUrl, name) {
|
||||||
watch.setAttribute("name", name);
|
watch.setAttribute("name", name);
|
||||||
watch.setAttribute("path", name);
|
watch.setAttribute("path", name);
|
||||||
watch.setAttribute("volume", "1");
|
watch.setAttribute("volume", "1");
|
||||||
|
watch.setAttribute("muted", "");
|
||||||
|
|
||||||
// Force WebTransport in-browser; websocket fallback has shown degraded
|
// Force WebTransport in-browser; websocket fallback has shown degraded
|
||||||
// media behavior (especially audio) against public relay paths.
|
// media behavior (especially audio) against public relay paths.
|
||||||
|
|
@ -199,22 +200,8 @@ function mountPlayer(relayUrl, name) {
|
||||||
};
|
};
|
||||||
document.addEventListener("pointerdown", unlockAudio, { once: true });
|
document.addEventListener("pointerdown", unlockAudio, { once: true });
|
||||||
video.addEventListener("pointerdown", unlockAudio, { once: true });
|
video.addEventListener("pointerdown", unlockAudio, { once: true });
|
||||||
|
setHint(`Live: subscribed to ${name} (tap video to unmute)`, "warn");
|
||||||
void video.play().catch(() => {});
|
void video.play().catch(() => {});
|
||||||
|
|
||||||
// If video-element rendering stalls, fall back to canvas rendering.
|
|
||||||
window.setTimeout(() => {
|
|
||||||
const stalled = video.readyState < 2 || (video.currentTime === 0 && !video.paused);
|
|
||||||
if (!stalled) return;
|
|
||||||
const canvas = document.createElement("canvas");
|
|
||||||
canvas.className = "canvas";
|
|
||||||
try {
|
|
||||||
video.remove();
|
|
||||||
watch.appendChild(canvas);
|
|
||||||
setHint(`Live: subscribed to ${name} (canvas fallback)`, "warn");
|
|
||||||
} catch (_) {
|
|
||||||
// Ignore fallback errors.
|
|
||||||
}
|
|
||||||
}, 9000);
|
|
||||||
bindPlayerSignals(watch, name);
|
bindPlayerSignals(watch, name);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -9,18 +9,16 @@ Live browser playback currently prioritizes canvas rendering. Audio can fail on
|
||||||
In the web watcher mount path:
|
In the web watcher mount path:
|
||||||
|
|
||||||
1. Render live playback with a `<video>` child in `<moq-watch>` first.
|
1. Render live playback with a `<video>` child in `<moq-watch>` first.
|
||||||
2. Start muted for autoplay compatibility, then unlock audio on first user gesture by:
|
2. Start muted at the watcher signal layer for autoplay compatibility, then unlock audio on first user gesture by:
|
||||||
- forcing backend `muted=false`, `volume=1`,
|
- forcing backend `muted=false`, `volume=1`,
|
||||||
- toggling paused state to trigger resume,
|
- toggling paused state to trigger resume,
|
||||||
- unmuting the `<video>` element.
|
- unmuting the `<video>` element.
|
||||||
3. If `<video>` playback stalls during startup, automatically fall back to canvas rendering.
|
|
||||||
|
|
||||||
## Rationale
|
## Rationale
|
||||||
|
|
||||||
- Preserves the `<video>` UX target while handling browser autoplay constraints explicitly.
|
- Preserves the `<video>` UX target while handling browser autoplay constraints explicitly.
|
||||||
- Avoids total playback failure by retaining a tested canvas fallback path.
|
|
||||||
- Keeps changes local to app wiring without forking upstream MoQ player internals.
|
- Keeps changes local to app wiring without forking upstream MoQ player internals.
|
||||||
|
|
||||||
## Reversibility
|
## Reversibility
|
||||||
|
|
||||||
- Remove the fallback timer and unlock wiring to return to a fixed rendering mode.
|
- Remove the unlock wiring (or return to canvas renderer) to restore prior behavior.
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue