just show em all, all the time

This commit is contained in:
legop3
2026-01-30 22:58:10 -05:00
parent fd06f23de4
commit 4f6530badf
4 changed files with 144 additions and 219 deletions
File diff suppressed because one or more lines are too long
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-MsCzfGxI.js"></script> <script type="module" crossorigin src="/assets/index-DJv47phz.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-C97A4E-6.css"> <link rel="stylesheet" crossorigin href="/assets/index-C97A4E-6.css">
</head> </head>
<body> <body>
+14 -89
View File
@@ -11,7 +11,6 @@ import AlertFeed from '../components/AlertFeed.jsx';
import useDefaultNickname from '../hooks/useDefaultNickname.js'; import useDefaultNickname from '../hooks/useDefaultNickname.js';
const ROTATE_MS = 20000; const ROTATE_MS = 20000;
const PREWARM_MS = 5000;
const HARD_REFRESH_MS = 3 * 60 * 60 * 1000; const HARD_REFRESH_MS = 3 * 60 * 60 * 1000;
function formatDriverLabel({ roverId, session }) { function formatDriverLabel({ roverId, session }) {
@@ -220,10 +219,6 @@ function MiniSummaryContent() {
const frames = useTelemetryFrames(); const frames = useTelemetryFrames();
const roster = session?.roster ?? []; const roster = session?.roster ?? [];
const [index, setIndex] = useState(0); const [index, setIndex] = useState(0);
const [primaryRoverId, setPrimaryRoverId] = useState(null);
const [secondaryRoverId, setSecondaryRoverId] = useState(null);
const [visibleSlot, setVisibleSlot] = useState('primary');
const prewarmTimer = useRef(null);
const activeDrivers = session?.activeDrivers || {}; const activeDrivers = session?.activeDrivers || {};
const driverRoster = useMemo( const driverRoster = useMemo(
() => roster.filter((rover) => activeDrivers[rover.id]), () => roster.filter((rover) => activeDrivers[rover.id]),
@@ -283,12 +278,6 @@ function MiniSummaryContent() {
setIndex(0); setIndex(0);
}, [rotationKey]); }, [rotationKey]);
useEffect(() => {
setPrimaryRoverId(rotationPool[0]?.rover?.id || null);
setSecondaryRoverId(null);
setVisibleSlot('primary');
}, [rotationKey, rotationPool]);
useEffect(() => { useEffect(() => {
if (!rotationPool.length) return undefined; if (!rotationPool.length) return undefined;
const timer = setInterval(() => { const timer = setInterval(() => {
@@ -297,63 +286,13 @@ function MiniSummaryContent() {
return () => clearInterval(timer); return () => clearInterval(timer);
}, [rotationPool.length, rotationKey]); }, [rotationPool.length, rotationKey]);
useEffect(() => {
clearTimeout(prewarmTimer.current);
if (!canSpectateVideo || rotationPool.length < 2) {
setSecondaryRoverId(null);
return undefined;
}
const nextIndex = (index + 1) % rotationPool.length;
const delay = Math.max(0, ROTATE_MS - PREWARM_MS);
prewarmTimer.current = setTimeout(() => {
const nextEntry = rotationPool[nextIndex];
const nextId = nextEntry?.rover?.id || null;
if (!nextId) {
setSecondaryRoverId(null);
return;
}
if (visibleSlot === 'primary') {
setSecondaryRoverId(nextId);
} else {
setPrimaryRoverId(nextId);
}
}, delay);
return () => clearTimeout(prewarmTimer.current);
}, [index, rotationPool, canSpectateVideo, visibleSlot]);
const activeEntry = rotationPool.length ? rotationPool[index % rotationPool.length] : null; const activeEntry = rotationPool.length ? rotationPool[index % rotationPool.length] : null;
const activeRover = activeEntry?.type === 'rover' ? activeEntry.rover : null; const activeRover = activeEntry?.type === 'rover' ? activeEntry.rover : null;
const activeRoverId = activeRover?.id || null;
useEffect(() => {
if (!activeRoverId) return;
if (activeRoverId === primaryRoverId) {
setVisibleSlot('primary');
return;
}
if (activeRoverId === secondaryRoverId) {
setVisibleSlot('secondary');
return;
}
setPrimaryRoverId(activeRoverId);
setVisibleSlot('primary');
}, [activeRoverId, primaryRoverId, secondaryRoverId]);
const primaryRover = primaryRoverId
? rotationPool.find((entry) => entry.rover?.id === primaryRoverId)?.rover || null
: null;
const secondaryRover = secondaryRoverId
? rotationPool.find((entry) => entry.rover?.id === secondaryRoverId)?.rover || null
: null;
const activeSnapshot = !canSpectateVideo && activeRover ? snapshotFeeds[activeRover.id] || null : null; const activeSnapshot = !canSpectateVideo && activeRover ? snapshotFeeds[activeRover.id] || null : null;
const activeVideo = canSpectateVideo && activeRover ? videoSources[activeRover.id] || null : null; const activeVideo = canSpectateVideo && activeRover ? videoSources[activeRover.id] || null : null;
const primaryVideo = canSpectateVideo && primaryRover ? videoSources[primaryRover.id] || null : null;
const secondaryVideo = canSpectateVideo && secondaryRover ? videoSources[secondaryRover.id] || null : null;
const activeAudio = activeRover ? audioSources[`${activeRover.id}-audio`] || null : null; const activeAudio = activeRover ? audioSources[`${activeRover.id}-audio`] || null : null;
const activeFrame = activeRover ? frames[activeRover.id] || null : null; const activeFrame = activeRover ? frames[activeRover.id] || null : null;
const primaryFrame = primaryRover ? frames[primaryRover.id] || null : null;
const secondaryFrame = secondaryRover ? frames[secondaryRover.id] || null : null;
const driverLabel = activeRover ? formatDriverLabel({ roverId: activeRover.id, session }) : null; const driverLabel = activeRover ? formatDriverLabel({ roverId: activeRover.id, session }) : null;
if (inLockdown) { if (inLockdown) {
@@ -409,44 +348,30 @@ function MiniSummaryContent() {
<FitViewportFrame> <FitViewportFrame>
{canSpectateVideo ? ( {canSpectateVideo ? (
<div className="relative h-full w-full"> <div className="relative h-full w-full">
{primaryRover ? ( {rotationPool.map((entry) => {
const rover = entry.rover;
const isActive = activeRover?.id === rover.id;
return (
<div <div
className={`absolute inset-0 ${visibleSlot === 'primary' ? 'opacity-100' : 'opacity-0 pointer-events-none'}`} key={rover.id}
className={`absolute inset-0 ${isActive ? 'opacity-100' : 'opacity-0 pointer-events-none'}`}
> >
<VideoTile <VideoTile
sessionInfo={primaryVideo} sessionInfo={videoSources[rover.id] || null}
videoMode="whep" videoMode="whep"
snapshotFeed={null} snapshotFeed={null}
audioSessionInfo={visibleSlot === 'primary' ? activeAudio : null} audioSessionInfo={isActive ? activeAudio : null}
forceMute={visibleSlot !== 'primary'} forceMute={!isActive}
label={primaryRover.name || primaryRover.id} label={rover.name || rover.id}
telemetryFrame={primaryFrame} telemetryFrame={frames[rover.id] || null}
batteryConfig={primaryRover.battery} batteryConfig={rover.battery}
layoutFormat="mobile" layoutFormat="mobile"
hudVariant="none" hudVariant="none"
fitParent fitParent
/> />
</div> </div>
) : null} );
{secondaryRover ? ( })}
<div
className={`absolute inset-0 ${visibleSlot === 'secondary' ? 'opacity-100' : 'opacity-0 pointer-events-none'}`}
>
<VideoTile
sessionInfo={secondaryVideo}
videoMode="whep"
snapshotFeed={null}
audioSessionInfo={visibleSlot === 'secondary' ? activeAudio : null}
forceMute={visibleSlot !== 'secondary'}
label={secondaryRover.name || secondaryRover.id}
telemetryFrame={secondaryFrame}
batteryConfig={secondaryRover.battery}
layoutFormat="mobile"
hudVariant="none"
fitParent
/>
</div>
) : null}
</div> </div>
) : ( ) : (
<VideoTile <VideoTile