This commit is contained in:
legop3
2025-12-01 23:45:44 -05:00
parent 2b2b6cbb60
commit 1d664cbe4c
3 changed files with 15 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-D7nzoVy2.js"></script> <script type="module" crossorigin src="/assets/index-BnSgZj98.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-B1UrCI1T.css"> <link rel="stylesheet" crossorigin href="/assets/index-B1UrCI1T.css">
</head> </head>
<body> <body>
+7 -6
View File
@@ -5,16 +5,17 @@ export function useRoomCameraSnapshots(sourceList = []) {
const socket = useSocket(); const socket = useSocket();
const [feeds, setFeeds] = useState({}); const [feeds, setFeeds] = useState({});
const objectUrls = useRef(new Map()); const objectUrls = useRef(new Map());
const entriesKey = useMemo(() => sourceList.map((e) => (typeof e === 'string' ? e : e.id)).join('|'), [sourceList]); const ids = useMemo(() => sourceList.map((e) => (typeof e === 'string' ? e : e.id)), [sourceList]);
const idsKey = useMemo(() => ids.join('|'), [ids]);
useEffect(() => { useEffect(() => {
objectUrls.current.forEach((url) => URL.revokeObjectURL(url)); objectUrls.current.forEach((url) => URL.revokeObjectURL(url));
objectUrls.current.clear(); objectUrls.current.clear();
setFeeds({}); setFeeds({});
}, [entriesKey]); }, [idsKey]);
useEffect(() => { useEffect(() => {
if (!sourceList.length || !socket) { if (!ids.length || !socket) {
return undefined; return undefined;
} }
let cancelled = false; let cancelled = false;
@@ -58,17 +59,17 @@ export function useRoomCameraSnapshots(sourceList = []) {
socket.on('roomCamera:frame', handleFrame); socket.on('roomCamera:frame', handleFrame);
socket.on('roomCamera:status', handleStatus); socket.on('roomCamera:status', handleStatus);
socket.emit('roomCamera:subscribe', { ids: sourceList.map((e) => (typeof e === 'string' ? e : e.id)) }); socket.emit('roomCamera:subscribe', { ids });
return () => { return () => {
cancelled = true; cancelled = true;
socket.emit('roomCamera:unsubscribe', { ids: sourceList.map((e) => (typeof e === 'string' ? e : e.id)) }); socket.emit('roomCamera:unsubscribe', { ids });
socket.off('roomCamera:frame', handleFrame); socket.off('roomCamera:frame', handleFrame);
socket.off('roomCamera:status', handleStatus); socket.off('roomCamera:status', handleStatus);
objectUrls.current.forEach((url) => URL.revokeObjectURL(url)); objectUrls.current.forEach((url) => URL.revokeObjectURL(url));
objectUrls.current.clear(); objectUrls.current.clear();
}; };
}, [socket, sourceList, entriesKey]); }, [socket, idsKey, ids]);
return feeds; return feeds;
} }