chrome fix maybe?

This commit is contained in:
legop3
2026-02-21 13:14:27 -05:00
parent d5978c5e3e
commit 8313f5da66
3 changed files with 42 additions and 14 deletions
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -11,7 +11,7 @@
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="Multi Roomba Rover" /> <meta name="apple-mobile-web-app-title" content="Multi Roomba Rover" />
<title>Multi Roomba Rover</title> <title>Multi Roomba Rover</title>
<script type="module" crossorigin src="/assets/index-D5tnr02G.js"></script> <script type="module" crossorigin src="/assets/index-DkrikzyM.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-Bz1ixYh7.css"> <link rel="stylesheet" crossorigin href="/assets/index-Bz1ixYh7.css">
</head> </head>
<body> <body>
+32 -4
View File
@@ -158,12 +158,16 @@ export default function VideoTile({
const ensureAudioGraph = useCallback(() => { const ensureAudioGraph = useCallback(() => {
if (graphFailedRef.current) return false; if (graphFailedRef.current) return false;
const audioEl = audioRef.current; const audioEl = audioRef.current;
if (!audioEl || typeof window === 'undefined' || typeof window.AudioContext !== 'function') { if (!audioEl || typeof window === 'undefined') {
return false; return false;
} }
try { try {
const AudioContextCtor = window.AudioContext || window.webkitAudioContext;
if (typeof AudioContextCtor !== 'function') {
return false;
}
if (!audioContextRef.current) { if (!audioContextRef.current) {
audioContextRef.current = new window.AudioContext(); audioContextRef.current = new AudioContextCtor();
} }
const ctx = audioContextRef.current; const ctx = audioContextRef.current;
if (!audioSourceNodeRef.current) { if (!audioSourceNodeRef.current) {
@@ -200,6 +204,25 @@ export default function VideoTile({
await ctx.resume().catch(() => {}); await ctx.resume().catch(() => {});
}, []); }, []);
useEffect(() => {
if (!audioSessionInfo?.url || !autoLevelEnabled || autoLevelMode !== 'compressor') {
return undefined;
}
const unlock = () => {
resumeAudioContext();
const target = audioRef.current;
if (!target) return;
target.muted = false;
target.play().catch(() => {});
};
window.addEventListener('pointerdown', unlock, { passive: true });
window.addEventListener('keydown', unlock);
return () => {
window.removeEventListener('pointerdown', unlock);
window.removeEventListener('keydown', unlock);
};
}, [audioSessionInfo?.url, autoLevelEnabled, autoLevelMode, resumeAudioContext]);
const ensurePlayback = useCallback(async () => { const ensurePlayback = useCallback(async () => {
const video = videoRef.current; const video = videoRef.current;
if (!video) return; if (!video) return;
@@ -338,8 +361,9 @@ export default function VideoTile({
if (graphReady) { if (graphReady) {
const compressor = audioCompressorRef.current; const compressor = audioCompressorRef.current;
const gainNode = audioGainRef.current; const gainNode = audioGainRef.current;
// Keep element output at zero; audio should come only from WebAudio graph. const contextRunning = audioContextRef.current?.state === 'running';
audioEl.volume = 0; // If Chrome has not unlocked WebAudio yet, keep direct element volume so audio still works.
audioEl.volume = contextRunning ? 0 : effectiveRoverGain;
if (gainNode) { if (gainNode) {
gainNode.gain.value = effectiveRoverGain; gainNode.gain.value = effectiveRoverGain;
} }
@@ -352,6 +376,10 @@ export default function VideoTile({
} }
resumeAudioContext(); resumeAudioContext();
reductionPollRef.current = setInterval(() => { reductionPollRef.current = setInterval(() => {
if (audioContextRef.current?.state !== 'running') {
setLevelIndicator(null);
return;
}
const reduction = compressor?.reduction; const reduction = compressor?.reduction;
if (typeof reduction === 'number' && reduction <= COMPRESSOR_REDUCTION_ACTIVE_DB) { if (typeof reduction === 'number' && reduction <= COMPRESSOR_REDUCTION_ACTIVE_DB) {
const amount = Math.round(Math.abs(reduction) * 10) / 10; const amount = Math.round(Math.abs(reduction) * 10) / 10;