1 import { Component, OnInit, TemplateRef, ViewChild } from '@angular/core';
2 import { FormBuilder, FormGroup } from '@angular/forms';
3 import { HttpClient } from '@angular/common/http';
5 import { RoboService } from './../../app/robo.service';
7 import { cameraData,camerainfo } from './../datainterface'
9 import { cameraDetails } from './../datainterface';
11 // import { ToastService } from './toast.service';
13 import { ToastrService } from 'ngx-toastr';
14 import {MatTableDataSource} from '@angular/material/table';
16 import { MatPaginator } from '@angular/material/paginator';
19 selector: 'app-data-fetch',
20 templateUrl: './data-fetch.component.html',
21 styleUrls: ['./data-fetch.component.scss']
23 export class DataFetchComponent implements OnInit {
25 cameraColumns: string [] = ['cameraID','cameraLocation','cameraNumber','rtspUrl'];
26 cameraDataSource = new MatTableDataSource<camerainfo>(CAMERA_INFO_LIST);
28 SERVER_URL = "http://localhost:30092/v1/monitor/video";
29 videoUploadForm: FormGroup;
30 cameraDetailsForm: FormGroup;
32 cameraData = {} as cameraData;
36 selectedCamera: string;
37 selectedLocation: string;
41 cameradetconcat: string
47 cameraInfo = {} as cameraDetails;
51 selectedCameraID: string
55 @ViewChild(MatPaginator, {static: true}) paginator: MatPaginator;
58 private formBuilder: FormBuilder,
59 private httpClient: HttpClient,
60 private roboService: RoboService,
61 private toastService: ToastrService
65 this.fetchCameraDetails();
66 this.videoUploadForm = this.formBuilder.group({
70 this.cameraDetailsForm = this.formBuilder.group({
79 "viewValue": "camera01"
83 "viewValue": "camera02"
87 "viewValue": "camera03"
95 "viewValue": "Bangalore"
99 this.selectedCamera = "Camera"
100 this.selectedLocation = "Bangalore"
101 // this.fetchCameraDetails();
104 onFileSelect(event) {
107 if (event.target.files.length > 0) {
108 const file = event.target.files[0];
109 this.videoUploadForm.get('video').setValue(file);
112 const file = event.target.files && event.target.files[0];
114 var reader = new FileReader();
115 reader.readAsDataURL(file);
116 if (file.type.indexOf('image') > -1) {
117 this.format = 'image';
118 } else if (file.type.indexOf('video') > -1) {
119 this.format = 'video';
121 reader.onload = (event) => {
122 this.url = (<FileReader>event.target).result;
128 const formData = new FormData();
129 formData.append('file', this.videoUploadForm.get('video').value);
131 this.showFileSuccess();
132 this.httpClient.post<any>(this.SERVER_URL, formData).subscribe
134 (res) => console.log(res),
135 (err) => console.log(err)
138 cameraDetailsSubmit() {
139 const formData = new FormData();
141 this.cameraData.cameraNumber = this.selectedCamera;
142 this.cameraData.cameraLocation = this.selectedLocation;
143 this.cameraData.rtspUrl = this.selectedRTSP;
145 this.roboService.postCameraDetails(this.cameraData)
148 if(data.responce == "success"){
153 ,error => console.log(error)
158 onCameraSelection() {
159 console.log("Inside onCameraSelection.....")
162 onCameraIDSelection() {
163 console.log("Spotted...")
165 console.log("Inside onCameraIDSelection.......")
167 // this.roboService.postCameraID(this.selectedCameraID)
168 index = this.selectedCameraId.indexOf(this.selectedCameraID)
170 this.roboService.triggerDetection(this.selectedValues[index])
175 error => console.log(error));
181 console.log("Inside showSuccess.... Method")
182 this.toastService.success('Uploaded Succesfully!','Camera Data');
186 console.log("Inside showSuccess.... Method")
187 this.toastService.success('Uploaded Succesfully!','Video File');
190 fetchCameraDetails() {
193 this.roboService.getCameraInfo()
197 this.cameraInfo = data;
199 this.cameraArrayList = data.roboCamera;
200 this.cameraDataSource = new MatTableDataSource(this.cameraArrayList);
201 this.cameraDataSource.paginator = this.paginator;
203 console.log("For loop started.....")
204 for (var val of this.cameraArrayList) {
208 this.cameradetconcat = val.cameraNumber + '/'+ val.rtspUrl + '/' +val.cameraLocation
209 // this.selectedCameraId.push(val.camera);
210 this.selectedCameraId.push(this.cameradetconcat)
211 this.selectedValues.push(val.cameraID)
215 console.log("SelectedCameraID")
216 console.log(this.selectedCameraId)
218 error => console.log(error));
222 this.fetchCameraDetails();
226 const CAMERA_INFO_LIST: camerainfo[] = [
227 { cameraID: '',cameraLocation: '', cameraNumber: '', rtspUrl: '' }