legop3/MultiRoombaRover
1
0
Fork 0
mirror of https://github.com/legop3/MultiRoombaRover.git synced 2026-09-16 01:21:20 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix reconnectings

Browse Source
This commit is contained in:
legop3
2025-11-20 15:59:08 -05:00
parent e05f258fb3
commit d816345560
3 changed files with 22 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
server/public/assets/index-B_IFrOiI.js → server/public/assets/index-BGeippT_.js
+4 -4
View File
File diff suppressed because one or more lines are too long
server/public/index.html
+1 -1
View File
@@ -5,7 +5,7 @@
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>webui</title> <title>webui</title>
<script type="module" crossorigin src="/assets/index-B_IFrOiI.js"></script> <script type="module" crossorigin src="/assets/index-BGeippT_.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-ZQklSSJR.css"> <link rel="stylesheet" crossorigin href="/assets/index-ZQklSSJR.css">
</head> </head>
<body> <body>
webui/src/components/RoomCameraFeed.jsx
+17 -10
View File
@@ -1,8 +1,7 @@
import { useCallback, useEffect, useRef, useState } from 'react'; import { useCallback, useEffect, useRef, useState } from 'react';
import { WhepPlayer } from '../lib/whepPlayer.js'; import { WhepPlayer } from '../lib/whepPlayer.js';
const RESTART_DELAY_MS = 2500; const RESTART_DELAY_MS = 2000;
const RETRYABLE_STATUSES = new Set(['error', 'failed', 'disconnected', 'closed', 'stopped']);
export default function RoomCameraFeed({ sessionInfo, label }) { export default function RoomCameraFeed({ sessionInfo, label }) {
const videoRef = useRef(null); const videoRef = useRef(null);
@@ -13,7 +12,7 @@ export default function RoomCameraFeed({ sessionInfo, label }) {
const scheduleRestart = useCallback(() => { const scheduleRestart = useCallback(() => {
clearTimeout(restartTimer.current); clearTimeout(restartTimer.current);
restartTimer.current = setTimeout(() => setRestartToken((token) => token + 1), RESTART_DELAY_MS); restartTimer.current = setTimeout(() => setRestartToken(Date.now()), RESTART_DELAY_MS);
}, []); }, []);
const ensurePlayback = useCallback(async () => { const ensurePlayback = useCallback(async () => {
@@ -23,21 +22,23 @@ export default function RoomCameraFeed({ sessionInfo, label }) {
video.muted = true; video.muted = true;
await video.play(); await video.play();
} catch { } catch {
// Autoplay might fail; we'll retry after reconnect. // Autoplay might be blocked; retry later.
} }
}, []); }, []);
useEffect(() => { useEffect(
return () => { () => () => {
clearTimeout(restartTimer.current); clearTimeout(restartTimer.current);
}; },
}, []); [],
);
useEffect(() => { useEffect(() => {
if (!sessionInfo?.url || !videoRef.current) { if (!sessionInfo?.url || !videoRef.current) {
return undefined; return undefined;
} }
let active = true; let active = true;
let player;
const handleStatus = (nextStatus, info) => { const handleStatus = (nextStatus, info) => {
if (!active) return; if (!active) return;
setStatus(nextStatus); setStatus(nextStatus);
@@ -45,12 +46,12 @@ export default function RoomCameraFeed({ sessionInfo, label }) {
if (nextStatus === 'playing') { if (nextStatus === 'playing') {
ensurePlayback(); ensurePlayback();
} }
if (RETRYABLE_STATUSES.has(nextStatus)) { if (['error', 'failed', 'disconnected', 'closed'].includes(nextStatus)) {
scheduleRestart(); scheduleRestart();
} }
}; };
const player = new WhepPlayer({ player = new WhepPlayer({
url: sessionInfo.url, url: sessionInfo.url,
token: sessionInfo.token, token: sessionInfo.token,
video: videoRef.current, video: videoRef.current,
@@ -70,6 +71,12 @@ export default function RoomCameraFeed({ sessionInfo, label }) {
}; };
}, [sessionInfo?.url, sessionInfo?.token, restartToken, scheduleRestart, ensurePlayback]); }, [sessionInfo?.url, sessionInfo?.token, restartToken, scheduleRestart, ensurePlayback]);
useEffect(() => {
if (status === 'stopped' && sessionInfo?.url) {
scheduleRestart();
}
}, [status, sessionInfo?.url, scheduleRestart]);
const renderedStatus = !sessionInfo?.url const renderedStatus = !sessionInfo?.url
? 'Waiting for stream session' ? 'Waiting for stream session'
: status === 'error' : status === 'error'