mirror of
https://github.com/legop3/MultiRoombaRover.git
synced 2026-09-15 17:12:59 -04:00
fix reconnectings
This commit is contained in:
File diff suppressed because one or more lines are too long
@@ -5,7 +5,7 @@
|
||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<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">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@@ -1,8 +1,7 @@
|
||||
import { useCallback, useEffect, useRef, useState } from 'react';
|
||||
import { WhepPlayer } from '../lib/whepPlayer.js';
|
||||
|
||||
const RESTART_DELAY_MS = 2500;
|
||||
const RETRYABLE_STATUSES = new Set(['error', 'failed', 'disconnected', 'closed', 'stopped']);
|
||||
const RESTART_DELAY_MS = 2000;
|
||||
|
||||
export default function RoomCameraFeed({ sessionInfo, label }) {
|
||||
const videoRef = useRef(null);
|
||||
@@ -13,7 +12,7 @@ export default function RoomCameraFeed({ sessionInfo, label }) {
|
||||
|
||||
const scheduleRestart = useCallback(() => {
|
||||
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 () => {
|
||||
@@ -23,21 +22,23 @@ export default function RoomCameraFeed({ sessionInfo, label }) {
|
||||
video.muted = true;
|
||||
await video.play();
|
||||
} catch {
|
||||
// Autoplay might fail; we'll retry after reconnect.
|
||||
// Autoplay might be blocked; retry later.
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
return () => {
|
||||
useEffect(
|
||||
() => () => {
|
||||
clearTimeout(restartTimer.current);
|
||||
};
|
||||
}, []);
|
||||
},
|
||||
[],
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
if (!sessionInfo?.url || !videoRef.current) {
|
||||
return undefined;
|
||||
}
|
||||
let active = true;
|
||||
let player;
|
||||
const handleStatus = (nextStatus, info) => {
|
||||
if (!active) return;
|
||||
setStatus(nextStatus);
|
||||
@@ -45,12 +46,12 @@ export default function RoomCameraFeed({ sessionInfo, label }) {
|
||||
if (nextStatus === 'playing') {
|
||||
ensurePlayback();
|
||||
}
|
||||
if (RETRYABLE_STATUSES.has(nextStatus)) {
|
||||
if (['error', 'failed', 'disconnected', 'closed'].includes(nextStatus)) {
|
||||
scheduleRestart();
|
||||
}
|
||||
};
|
||||
|
||||
const player = new WhepPlayer({
|
||||
player = new WhepPlayer({
|
||||
url: sessionInfo.url,
|
||||
token: sessionInfo.token,
|
||||
video: videoRef.current,
|
||||
@@ -70,6 +71,12 @@ export default function RoomCameraFeed({ sessionInfo, label }) {
|
||||
};
|
||||
}, [sessionInfo?.url, sessionInfo?.token, restartToken, scheduleRestart, ensurePlayback]);
|
||||
|
||||
useEffect(() => {
|
||||
if (status === 'stopped' && sessionInfo?.url) {
|
||||
scheduleRestart();
|
||||
}
|
||||
}, [status, sessionInfo?.url, scheduleRestart]);
|
||||
|
||||
const renderedStatus = !sessionInfo?.url
|
||||
? 'Waiting for stream session'
|
||||
: status === 'error'
|
||||
|
||||
Reference in New Issue
Block a user