Support added for multiple video feeds

Author: mohamedmujtabaraza

backend/src/libs/base_camera.py

@@ -1,5 +1,9 @@
-import time
+# -*- coding: utf-8 -*-
+# From https://github.com/miguelgrinberg/flask-video-streaming
+import logging
 import threading
+import time
+
 try:
     from greenlet import getcurrent as get_ident
 except ImportError:
@@ -8,6 +12,8 @@
     except ImportError:
         from _thread import get_ident
 
+logger = logging.getLogger(__name__)
+
 
 class CameraEvent(object):
     """An Event-like class that signals all active clients when a new frame is
@@ -52,64 +58,73 @@ def clear(self):
 
 
 class BaseCamera(object):
-    thread = None  # background thread that reads frames from camera
-    frame = None  # current frame is stored here by background thread
-    last_access = 0  # time of last client access to the camera
-    stopped = False
-    event = CameraEvent()
+    thread = {}  # background thread that reads frames from camera
+    frame = {}  # current frame is stored here by background thread
+    last_access = {}  # time of last client access to the camera
+    event = {}
+    running = {}
 
-    def __init__(self):
+    def __init__(self, unique_id=None):
         """Start the background camera thread if it isn't running yet."""
-        self.stopped = False
-        if BaseCamera.thread is None:
-            BaseCamera.last_access = time.time()
+        self.unique_id = unique_id
+        BaseCamera.event[self.unique_id] = CameraEvent()
+        BaseCamera.running[self.unique_id] = True
+
+        if self.unique_id not in BaseCamera.thread:
+            BaseCamera.thread[self.unique_id] = None
+
+        if BaseCamera.thread[self.unique_id] is None:
+            BaseCamera.last_access[self.unique_id] = time.time()
 
             # start background frame thread
-            BaseCamera.thread = threading.Thread(target=self._thread)
-            BaseCamera.thread.start()
+            BaseCamera.thread[self.unique_id] = threading.Thread(target=self._thread, args=(self.unique_id,))
+            BaseCamera.thread[self.unique_id].start()
 
             # wait until frames are available
             while self.get_frame() is None:
                 time.sleep(0)
 
     def get_frame(self):
         """Return the current camera frame."""
-        BaseCamera.last_access = time.time()
+        BaseCamera.last_access[self.unique_id] = time.time()
 
         # wait for a signal from the camera thread
-        BaseCamera.event.wait()
-        BaseCamera.event.clear()
+        BaseCamera.event[self.unique_id].wait()
+        BaseCamera.event[self.unique_id].clear()
 
-        return BaseCamera.frame
+        return BaseCamera.frame[self.unique_id]
 
     @staticmethod
     def frames():
         """"Generator that returns frames from the camera."""
-        raise RuntimeError('Must be implemented by subclasses.')
+        raise RuntimeError('Must be implemented by subclasses')
 
     @classmethod
-    def _thread(cls):
+    def _thread(cls, unique_id):
         """Camera background thread."""
-        print('Starting camera thread.')
-        # get new frames
+        print('Starting camera thread')
         frames_iterator = cls.frames()
         for frame in frames_iterator:
-            BaseCamera.frame = frame
-            BaseCamera.event.set()  # send signal to clients
+            BaseCamera.frame[unique_id] = frame
+            BaseCamera.event[unique_id].set()  # send signal to clients
             time.sleep(0)
-            # if there hasn't been any clients asking for frames in
+            # if there haven't been any clients asking for frames in
             # the last 10 seconds then stop the thread
-            if time.time() - BaseCamera.last_access > 10:
+            # if time.time() - BaseCamera.last_access[unique_id] > 10:
+            #     frames_iterator.close()
+            #     print(f"[{unique_id}] Stopping camera thread due to inactivity")
+            #     break
+            if not BaseCamera.running[unique_id]:
                 frames_iterator.close()
-                print('Stopping camera thread due to inactivity.')
+                print(f"[{unique_id}] Camera thread instructed to shut down")
                 break
-            # stop the video feed by changing VIDEO_FEED global variable to false
-            if cls.stopped:
-                frames_iterator.close()
-                print('Camera manually stopped.')
-                break
-        BaseCamera.thread = None
+        BaseCamera.thread[unique_id] = None
+        BaseCamera.running[unique_id] = False
 
-    @classmethod
-    def stop_feed(cls):
-        cls.stopped = True
+    @staticmethod
+    def stop(unique_id):
+        BaseCamera.running[unique_id] = False
+
+    @staticmethod
+    def is_running(unique_id):
+        return BaseCamera.running[unique_id]

backend/src/libs/web_utils.py

@@ -50,13 +50,10 @@ class RecognitionCamera(BaseCamera):
     # this class variable will help to process every other frame of video to save time
     process_this_frame = True
 
-    def __init__(self, video_feed: VideoFeedModel):
-        if VIDEO_SOURCE:
-            self.video_feed = video_feed
-            print(video_feed.id)
-            RecognitionCamera.set_video_source(VIDEO_SOURCE)
-            # RecognitionCamera.set_video_source(video_feed.url)
-        super(RecognitionCamera, self).__init__()
+    # def __init__(self, unique_id=None):
+    #     if VIDEO_SOURCE:
+    #         RecognitionCamera.set_video_source(VIDEO_SOURCE)
+    #     super(RecognitionCamera, self).__init__(unique_id)
 
     @classmethod
     def set_video_source(cls, source):
@@ -66,6 +63,7 @@ def set_video_source(cls, source):
     def frames(cls):
         print("[INFO] starting video stream...")
         camera = cv2.VideoCapture(cls.video_source)
+
         # store input video stream in camera variable
         if not camera.isOpened():
             raise RuntimeError('Could not start camera.')
@@ -91,7 +89,6 @@ def frames(cls):
     @classmethod
     def recognize_n_attendance(cls, frame: np.ndarray, attendance: AttendanceModel,
                                data: Dict, known_students: Dict) -> bytes:
-        print("playing...")
         # convert the input frame from BGR to RGB then resize it to have
         # a width of 750px (to speedup processing)
         rgb_frame = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)

backend/src/resources/video_feed.py

@@ -1,6 +1,6 @@
 from flask import Response, request
 from flask_restful import Resource
-from flask_jwt_extended import jwt_required
+from flask_jwt_extended import jwt_required, get_jwt_identity
 
 from src.db import Session
 from src.libs.strings import gettext
@@ -23,6 +23,7 @@ def get(cls):
 
 class VideoFeed(Resource):
     @classmethod
+    @jwt_required
     def get(cls, feed_id: str):
         """Video streaming route "/video_feed". Put this in the src attribute of an img tag."""
         video_feed = VideoFeedModel.find_by_id(feed_id)
@@ -33,18 +34,23 @@ def get(cls, feed_id: str):
         return {"message": gettext('video_feed_not_found')}, 404
 
 
-# TODO: make this get() to work with @jwt_required
+# TODO: make this get() to work with @jwt_required by sending response with Flask-RESTful instead of Response()
 class VideoFeedPreview(Resource):
     @classmethod
     def get(cls, feed_id: str):
         """Video streaming route. Put this route in the src attribute of an img tag."""
         video_feed = VideoFeedModel.find_by_id(feed_id)
-
+        feed_url = video_feed.url
+        camera_stream = RecognitionCamera
+        if feed_url == "0":
+            feed_url = 0
+        camera_stream.set_video_source(feed_url)
         if video_feed:
-            return Response(
-                cls.gen_frame(RecognitionCamera(video_feed)),
+            resp = Response(
+                cls.gen_frame(camera_stream(unique_id=feed_id)),
                 mimetype='multipart/x-mixed-replace; boundary=frame'
             )
+            return resp
 
         return {"message": gettext('video_feed_not_found')}, 404
 
@@ -83,7 +89,7 @@ class VideoFeedStop(Resource):
     def get(cls, feed_id: str):
         video_feed = VideoFeedModel.find_by_id(feed_id)
         if video_feed:
-            RecognitionCamera.stop_feed()
+            RecognitionCamera.stop(feed_id)
             try:
                 video_feed.is_active = False
                 video_feed.save_to_db()

frontend/src/app/components/video-feed-list/video-feed-list.component.html

@@ -52,8 +52,11 @@
     <tr *ngFor="let feed of feeds; index as i">
       <th scope="row">{{ feed.id }}</th>
       <td>
-        <div *ngIf="!feed.is_active">Inactive</div>
-        <div *ngIf="feed.is_active" style="color:red">
+        <div *ngIf="!feed.is_active">
+          <fa-icon [icon]="circleIcon" style="color:red" size="xs"></fa-icon>&nbsp;
+          Inactive
+        </div>
+        <div *ngIf="feed.is_active" style="color:green">
           <fa-icon [icon]="circleIcon" size="xs"></fa-icon>&nbsp;
           <a class="nav-link" style="padding:0rem;display:inline" [routerLink]="generatePreviewUrl(feed.id)">Live</a>
         </div>

frontend/src/app/components/video-feed-list/video-feed-list.component.ts

@@ -1,5 +1,6 @@
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { Router } from '@angular/router';
 
 import { faVideo, faCircle, faPlay, faStop } from '@fortawesome/free-solid-svg-icons';
 import { faTrashAlt } from '@fortawesome/free-regular-svg-icons';
@@ -27,7 +28,7 @@ export class VideoFeedListComponent implements OnInit {
   addResponseMsg = '';
   delResponseMsg = '';
 
-  constructor(private _videoFeedService: VideoFeedService, private fb: FormBuilder) { }
+  constructor(private _videoFeedService: VideoFeedService, private fb: FormBuilder, private router: Router) { }
 
   ngOnInit(): void {
     this.videoFeedForm = this.fb.group({
@@ -99,6 +100,7 @@ export class VideoFeedListComponent implements OnInit {
             res => console.log(res),
             err => console.log(err)
           );
+          this.router.navigate(['/video_feeds/preview', feed.id]);
           return feed.is_active = true;
         }
       }

frontend/src/app/components/video-feed-preview/video-feed-preview.component.html

@@ -2,7 +2,7 @@
     <div class="row">
       <!-- <div class="col-lg-8  offset-lg-2"> -->
       <div class=" mt-4 col-lg-9">
-          <img *ngIf="get_is_active()" style="-webkit-user-select: none;" [src]="_feedUrl" width="1037" height="583">
+          <img *ngIf="is_active" style="-webkit-user-select: none;" [src]="_feedUrl" width="1037" height="583">
       </div>
     </div>
-</div>
+</div> 

frontend/src/app/components/video-feed-preview/video-feed-preview.component.ts

@@ -1,4 +1,5 @@
 import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
 
 import { VideoFeedService } from 'src/app/services/video-feed.service';
 
@@ -9,16 +10,29 @@ import { VideoFeedService } from 'src/app/services/video-feed.service';
 })
 export class VideoFeedPreviewComponent implements OnInit {
 
-  public _feedUrl = "http://localhost:5000/video_feeds/1"; // + "/" + _id.toString()
+  public feed_id: string;
+  public _feedUrl: string;
+  public is_active: boolean;
 
-  constructor(private _videoFeedService: VideoFeedService) { }
+  constructor(private _videoFeedService: VideoFeedService, private route: ActivatedRoute) { }
 
   ngOnInit(): void {
-  }
+    let id = this.route.snapshot.paramMap.get('feed_id');
+    this.feed_id = id;
+    this._videoFeedService.getVideoFeed(id).subscribe(
+      res => {
+        console.log(res);
+        this.is_active = res.is_active;
+        // preview feed as it is
+        // this._feedUrl = res.url;
+        // run recognization & preview
+        this._feedUrl = this._videoFeedService._feedPreviewUrl + "/" + id;
 
-  get_is_active(){
-    // get is_active of the given id parameter in the route
-    return true;
+      },
+      err => {
+        // console.log(err);
+      }
+    );
   }
 
 }

frontend/src/app/services/video-feed.service.ts

@@ -9,6 +9,7 @@ import { Observable } from 'rxjs';
 export class VideoFeedService {
   _feedListUrl = "http://localhost:5000/video_feeds";
   _feedAddUrl = "http://localhost:5000/video_feeds/add"
+  _feedPreviewUrl = "http://localhost:5000/video_feeds/preview";
   _feedStartUrl = "http://localhost:5000/video_feeds/start";
   _feedStopUrl = "http://localhost:5000/video_feeds/stop";
   _feedDeleteUrl = "http://localhost:5000/video_feeds/delete";
@@ -23,6 +24,10 @@ export class VideoFeedService {
     return this.http.post<any>(this._feedAddUrl, _feed);
   }
 
+  getVideoFeed(feed_id){
+    return this.http.get<any>(this._feedListUrl + "/" + feed_id.toString());
+  }
+
   deleteVideoFeed(feed_id){
     return this.http.delete<any>(this._feedDeleteUrl + "/" + feed_id);
   }