beta release

Dockerfile

@@ -50,6 +50,7 @@ RUN rm /etc/nginx/sites-available/default
 COPY nginx.conf /etc/nginx/sites-available/default
 
 COPY entrypoint.sh /
+RUN touch /docker
 EXPOSE 80
 ENV PYTHONUNBUFFERED 1
 ENTRYPOINT [ "/entrypoint.sh" ]

README

@@ -1,4 +1,10 @@
-install https://github.com/OpenIPC/python-dvr
+Features:
-test on python 3.11
+- python on backend server | full async support
+- https://github.com/OpenIPC/python-dvr on main module
+- Embed h264x to mp4 encoder https://git.pblr-nyk.pro/gsd/MiskaRisa264
+- Full windows / linux / docker support
+- Embed go2rtc to stream
+- Angular material on front
 
-npm add @angular/[email protected] @angular/cdk  --force
+Use docker image to full component support
+p.s replace registry to public or delete him from Dockerfile

backend/config_parser.py

@@ -83,7 +83,8 @@ class Go2Rtc:
     WIN = "https://github.com/AlexxIT/go2rtc/releases/download/v1.9.4/go2rtc_win64.zip"
     LNX = "https://github.com/AlexxIT/go2rtc/releases/download/v1.9.4/go2rtc_linux_amd64"
 
-    def __init__(self) -> None:
+    def __init__(self, port = 1984) -> None:
+        self.port = port
         self.enabled = False
         try:
             self.check_exists()
@@ -108,8 +109,20 @@ class Go2Rtc:
         else:
             raise Exception("Go2Rtc not found, he is disabled")
 
-    async def start_go2rtc(self, recorders):
+    #http://localhost:1984/go2rtc/stream.html?src=0_0_0
-        lines = "streams:\n"
+    def get_stream(self, recorder_index, channel_index, stream_index):
+        if os.path.exists("/docker"):
+            return {"port":0, "route":f"go2rtc/stream.html?src={recorder_index}_{channel_index}_{stream_index}"}
+        else:
+            return {"port":self.port, "route":f"go2rtc/stream.html?src={recorder_index}_{channel_index}_{stream_index}"}
+
+    async def start_go2rtc(self, recorders, base_path = "/go2rtc"):
+        api = "api:\n"
+        api += f' listen: ":{self.port}"\n'
+        api += f' base_path: "{base_path}"\n'
+        api += f' origin: "*"\n'
+         
+        lines = api + "streams:\n"
         for recorder in recorders:
             lines += Go2RtcChannel(recorder, 2).generate_lines()
             

backend/server.py

@@ -160,6 +160,9 @@ class Server:
                 response.status_code = 400
                 return {"ok":False, "error":e}
 
+        @self.app.get(self.API_BASE_REF + "/stream/{recorder_index}/{channel_index}/{stream_index}")
+        async def getGo2RtcStream(recorder_index, channel_index, stream_index):
+            return self.go2rtc.get_stream(recorder_index, channel_index, stream_index)
 
     def run(self):
         uvicorn.run(

frontend/ang_dvrip/src/app/app-routing.module.ts

@@ -3,10 +3,12 @@ import { RouterModule, Routes } from '@angular/router';
 import {MainComponent} from "./components/main/main.component";
 import {HistoryComponent} from "./components/history/history.component";
 import {AboutComponent} from "./components/about/about.component";
+import {StreamComponent} from "./components/stream/stream.component";
 
 const routes: Routes = [
   {path: "history/:recorderId/:channelId", component:HistoryComponent},
   {path: "about/:recorderId/:channelId", component:AboutComponent},
+  {path: "stream/:recorderId/:channelId", component:StreamComponent},
   {path: "**", component: MainComponent}
 ];
 

frontend/ang_dvrip/src/app/app.component.html

@@ -22,6 +22,8 @@
   <mat-toolbar *ngIf="!loading && availble_channels.length>0 && availble_recorders.length>0" style="border-bottom: black 1px solid">
     <button mat-button [routerLink]="['about', selected_recorder, selected_channel]">Обзор</button>
     <span class="spacer"></span>
+    <button mat-button [routerLink]="['stream', selected_recorder, selected_channel]">Просмотр в реальном времени</button>
+    <span class="spacer"></span>
     <button mat-button [routerLink]="['history', selected_recorder, selected_channel]">История обнаружений</button>
     <span class="spacer"></span>
     <button mat-button>Бибки</button>

frontend/ang_dvrip/src/app/app.module.ts

@@ -29,6 +29,7 @@ import {MatProgressBarModule} from "@angular/material/progress-bar";
 import {MatProgressSpinnerModule} from "@angular/material/progress-spinner";
 import {MatIconModule} from "@angular/material/icon";
 import { AboutComponent } from './components/about/about.component';
+import { StreamComponent } from './components/stream/stream.component';
 
 @NgModule({
   declarations: [
@@ -36,7 +37,8 @@ import { AboutComponent } from './components/about/about.component';
     MainComponent,
     HistoryComponent,
     TranscodeModalComponent,
-    AboutComponent
+    AboutComponent,
+    StreamComponent
   ],
   imports: [
     BrowserModule,

frontend/ang_dvrip/src/app/components/about/about.component.css

@@ -0,0 +1,9 @@
+.snapshot {
+  width: 100%;
+}
+
+.center {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}

frontend/ang_dvrip/src/app/components/about/about.component.html

@@ -1 +1,5 @@
-<img style="width: 100%" [src]="'/api/dvrip/snapshot/' + recorder_index + '/' + channel_index">
+<div class="center snapshot">
+  <p style="text-align: center">Обновлено: {{updated.toLocaleString()}}</p>
+  <img class="snapshot" style="cursor: pointer" [src]="img" (click)="getSnapshot()">
+</div>
+

frontend/ang_dvrip/src/app/components/about/about.component.ts

@@ -9,12 +9,20 @@ import {ActivatedRoute} from "@angular/router";
 export class AboutComponent implements OnInit {
   recorder_index: number = 0;
   channel_index: number = 0;
+  img: string = "";
+  updated: Date = new Date();
 
   constructor(private route:ActivatedRoute) {}
 
   ngOnInit(): void {
     this.recorder_index = Number.parseInt(<string>this.route.snapshot.paramMap.get('recorderId'));
     this.channel_index = Number.parseInt(<string>this.route.snapshot.paramMap.get('channelId'));
+    this.getSnapshot();
+  }
+
+  getSnapshot() {
+    this.img = `/api/dvrip/snapshot/${this.recorder_index}/${this.channel_index}?timestamp=${new Date().getTime()}`
+    this.updated = new Date();
   }
 
 }

frontend/ang_dvrip/src/app/components/history/history.component.html

@@ -1,5 +1,5 @@
 <ng-container>
-  <div>
+  <div style="text-align: center">
     <mat-form-field>
       <mat-label>Выбранный поток</mat-label>
       <mat-select [(value)]="selected_stream" (valueChange)="getHistory()">

frontend/ang_dvrip/src/app/components/main/main.component.html

@@ -1,2 +1 @@
 <p style="text-align: center">Добро пожаловать в альтернативный клиент для просмотра истории с рекодреров для видео записи</p>
-<mat-icon>home</mat-icon>

frontend/ang_dvrip/src/app/components/stream/stream.component.html

@@ -0,0 +1,13 @@
+<div style="text-align: center">
+  <mat-form-field>
+    <mat-label>Выбранный поток</mat-label>
+    <mat-select [(value)]="selected_stream" (valueChange)="getStreamUrl()">
+      <mat-option [value]="0">Основной</mat-option>
+      <mat-option [value]="1">Дополнительный</mat-option>
+    </mat-select>
+  </mat-form-field>
+  <button mat-button (click)="getOpenNewWindow()">Открыть в новом окне</button>
+</div>
+<ng-container>
+  <iframe width="100%" height="100%" [src]="url"></iframe>
+</ng-container>

frontend/ang_dvrip/src/app/components/stream/stream.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { StreamComponent } from './stream.component';
+
+describe('StreamComponent', () => {
+  let component: StreamComponent;
+  let fixture: ComponentFixture<StreamComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ StreamComponent ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(StreamComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

frontend/ang_dvrip/src/app/components/stream/stream.component.ts

@@ -0,0 +1,48 @@
+import {Component, OnInit, Sanitizer} from '@angular/core';
+import {ActivatedRoute} from "@angular/router";
+import {HttpClient} from "@angular/common/http";
+import {DomSanitizer, SafeUrl} from "@angular/platform-browser";
+
+interface StreamUrlResponse {
+  port:number,
+  route:string
+}
+
+@Component({
+  selector: 'app-stream',
+  templateUrl: './stream.component.html',
+  styleUrls: ['./stream.component.css']
+})
+export class StreamComponent implements OnInit {
+
+  selected_stream:number = 1
+  recorder_index:number = 0;
+  channel_index:number = 0;
+  url:SafeUrl|null = null;
+  unsafe_url:string = "";
+
+  constructor(private route:ActivatedRoute,
+              private http: HttpClient,
+              private sanitazer:DomSanitizer) {}
+
+  ngOnInit(): void {
+    this.recorder_index = Number.parseInt(<string>this.route.snapshot.paramMap.get('recorderId'));
+    this.channel_index = Number.parseInt(<string>this.route.snapshot.paramMap.get('channelId'));
+    this.getStreamUrl();
+  }
+
+  getStreamUrl() {
+    this.http.get(`api/dvrip/stream/${this.recorder_index}/${this.channel_index}/${this.selected_stream}`).subscribe(
+      (r:StreamUrlResponse|any) => {
+        const url = `${location.protocol}//${location.hostname}:${r.port == 0?+location.port:r.port}/${r.route}`;
+        this.url = this.sanitazer.bypassSecurityTrustResourceUrl(url);
+        this.unsafe_url = url;
+      }
+    )
+  }
+
+  getOpenNewWindow() {
+    window.open(this.unsafe_url);
+  }
+
+}

nginx.conf

@@ -26,29 +26,12 @@ server {
         etag off;
 	}
 
-    location ^~ /api {
+    location ^~ /go2rtc {
-		proxy_pass         http://localhost:1984;
+		            proxy_pass         http://localhost:1984;
-		proxy_http_version 1.1;
+		            proxy_http_version 1.1;
-                proxy_set_header Upgrade $http_upgrade;
+		            proxy_set_header Upgrade $http_upgrade;
-                proxy_set_header Connection "upgrade";
+		            proxy_set_header Connection "Upgrade";
-                proxy_read_timeout 86400;
+		            proxy_set_header X-Forwarded-Host $host;
     }
 
-    #http://localhost:4444/stream.html?src=0_0_0&mode=mse
-    location ^~ /stream.html {
-		proxy_pass         http://localhost:1984;
-		#proxy_redirect     off;
-		#proxy_set_header   Host $host;
-		#proxy_set_header   X-Forwarded-For $proxy_add_x_forwarded_for;
-    }
-
-    location ^~ /video-stream.js {
-		proxy_pass         http://localhost:1984/video-stream.js;
-    }
-
-    location ^~ /video-rtc.js {
-		proxy_pass         http://localhost:1984/video-rtc.js;
-    }
-
-    
 }