From 463450ced71893ef220c3dd14525d0783038a58d Mon Sep 17 00:00:00 2001 From: computer Date: Thu, 25 Jan 2024 19:59:12 +0100 Subject: [PATCH 1/4] I dont know what changed but let me push ahhhah --- .../video-recording-screen.tsx | 10 ++++++---- Frontend/src/containers/video-stream-container.tsx | 14 +++++++++----- 2 files changed, 15 insertions(+), 9 deletions(-) diff --git a/Frontend/src/components/video-recording-screen/video-recording-screen.tsx b/Frontend/src/components/video-recording-screen/video-recording-screen.tsx index 0a57519..851dd78 100644 --- a/Frontend/src/components/video-recording-screen/video-recording-screen.tsx +++ b/Frontend/src/components/video-recording-screen/video-recording-screen.tsx @@ -14,10 +14,12 @@ export const VideoRecordingScreen: FC = ({ camera, videoRef }) => { <> {camera && ( <> - {camera.isActive && ( + {/* {camera.isActive && ( - )} - {!camera.isActive && ( + )} */} + + + {/* {!camera.isActive && (

NO SIGNAL

@@ -25,7 +27,7 @@ export const VideoRecordingScreen: FC = ({ camera, videoRef }) => { {camera.name}

- )} + )} */} )} diff --git a/Frontend/src/containers/video-stream-container.tsx b/Frontend/src/containers/video-stream-container.tsx index 37f2b14..9c4d163 100644 --- a/Frontend/src/containers/video-stream-container.tsx +++ b/Frontend/src/containers/video-stream-container.tsx @@ -172,11 +172,15 @@ export const VideoStreamContainer: FC = ({ sizePerScreen = 9 }) => { }, []); useEffect(() => { - subscribers.forEach((subscriber) => - subscriber.addVideoElement( - videoRef.current?.[subscriber?.stream?.connection?.data] - ) - ); + subscribers.forEach((subscriber) => { + try { + subscriber.addVideoElement( + videoRef.current?.[subscriber?.stream?.connection?.data] + ); + } catch (err) { + console.log(err); + } + }); }, [subscribers]); return ( From b3c7df52567176dac781c042caf9a26b62cd0265 Mon Sep 17 00:00:00 2001 From: computer Date: Fri, 26 Jan 2024 05:31:30 +0100 Subject: [PATCH 2/4] Detect active camera --- Backend/.env-openvidu | 2 - .../app/mediaServer/mediaServer.controller.ts | 1 - .../src/cameraStream/cameraStream.gateway.ts | 31 ++++++++--- Backend/src/database/database.service.ts | 4 +- .../video-recording-screen/video-player.tsx | 4 +- .../video-recording-screen.tsx | 9 ++- Frontend/src/containers/layout-container.tsx | 4 +- .../src/containers/video-stream-container.tsx | 55 +++++++++++-------- Frontend/src/hooks/use-camera-slice.ts | 7 +++ Frontend/src/store/index.ts | 1 + Frontend/src/store/slices/camera-slice.ts | 19 ++++++- 11 files changed, 91 insertions(+), 46 deletions(-) diff --git a/Backend/.env-openvidu b/Backend/.env-openvidu index 0ffb3e2..5dc2cc2 100644 --- a/Backend/.env-openvidu +++ b/Backend/.env-openvidu @@ -1,3 +1 @@ OPENVIDU_SECRET=MY_SECRET -OPENVIDU_WEBHOOK=true -OPENVIDU_WEBHOOK_ENDPOINT=https://localhost:8080/media-server diff --git a/Backend/src/app/mediaServer/mediaServer.controller.ts b/Backend/src/app/mediaServer/mediaServer.controller.ts index 55fd822..e1f4ead 100644 --- a/Backend/src/app/mediaServer/mediaServer.controller.ts +++ b/Backend/src/app/mediaServer/mediaServer.controller.ts @@ -30,7 +30,6 @@ export class MediaServerController { @Header('Content-Type', 'application/json') @Post('/media-server') async getMediaServerEvents(@Body() event: any) { - console.log(event); this.cameraStreamGateway.broadcastEvent(event); return { message: 'OK' }; } diff --git a/Backend/src/cameraStream/cameraStream.gateway.ts b/Backend/src/cameraStream/cameraStream.gateway.ts index e4c4069..13161cd 100644 --- a/Backend/src/cameraStream/cameraStream.gateway.ts +++ b/Backend/src/cameraStream/cameraStream.gateway.ts @@ -56,18 +56,18 @@ export class CameraStreamGateway implements OnGatewayConnection { async afterInit() { try { - const session = await this.openvidu.instance.createSession({}); + const session = await this.openvidu.instance.createSession(); this.sessionId = session.sessionId; - const nvr = await this.database.getNVRData(); - nvr.channels.forEach((id: number) => { + + [{rtsp:"rtsp://192.168.129.244:554",id:"0"},{rtsp:"rtsp://192.168.129.234:554",id:"1"}].forEach((item) => { const connectionProperties: ConnectionProperties = { type: ConnectionType.IPCAM, - rtspUri: `${nvr.ip}/ch${id}_0.264`, + rtspUri: item.rtsp, adaptativeBitrate: true, - onlyPlayWithSubscribers: false, + onlyPlayWithSubscribers: true, networkCache: 1000, - data: id.toString(), + data: item.id, }; console.log(connectionProperties); @@ -76,8 +76,25 @@ export class CameraStreamGateway implements OnGatewayConnection { .then((connection: unknown) => console.log(connection)) .catch((error) => console.error(error)); }); + + // nvr.channels.forEach((id: number) => { + // const connectionProperties: ConnectionProperties = { + // type: ConnectionType.IPCAM, + // rtspUri: `${nvr.ip}/ch${id}_0.264`, + // adaptativeBitrate: true, + // onlyPlayWithSubscribers: true, + // networkCache: 1000, + // data: id.toString(), + // }; + // console.log(connectionProperties); + + // session + // .createConnection(connectionProperties) + // .then((connection: unknown) => console.log(connection)) + // .catch((error) => console.error(error)); + // }); } catch (error) { - console.error(`OpenVidu initialization Failed...`); + console.error(error); } } diff --git a/Backend/src/database/database.service.ts b/Backend/src/database/database.service.ts index 2416fec..dee2f54 100644 --- a/Backend/src/database/database.service.ts +++ b/Backend/src/database/database.service.ts @@ -257,10 +257,10 @@ export class DatabaseService { const array = await this.getRawDataArray('General', { name: 'NVR', }); - + return { ip: process.env.NVR_IP_ADDRESS, - channels: array[0].channels, + channels: cameraIds, }; } } diff --git a/Frontend/src/components/video-recording-screen/video-player.tsx b/Frontend/src/components/video-recording-screen/video-player.tsx index 0824deb..6061868 100644 --- a/Frontend/src/components/video-recording-screen/video-player.tsx +++ b/Frontend/src/components/video-recording-screen/video-player.tsx @@ -12,9 +12,8 @@ const VideoPlayer = ({ }) => { const [fullScreen, setFullScreen] = useState(false); const [videoControlHidden, setvideoControlHidden] = useState(false); - const [loading, setLoading] = useState(true); const intervalRef: any = useRef(null); - + /* event handlers */ const onScreenSizeToggle = () => { const elem = document.documentElement; @@ -60,7 +59,6 @@ const VideoPlayer = ({ return (
- {/* */}