ROBO UI changes
[ealt-edge.git] / example-apps / ROBO / RoboUI / src / app / data-monitor / data-monitor.component.ts
index 64bc2b6..e17ce7d 100644 (file)
@@ -9,6 +9,8 @@ import { RoboService } from './../../app/robo.service';
 
 import { DomSanitizer, SafeUrl } from "@angular/platform-browser";
 
+import { timer } from "rxjs"
+
 @Component({
   selector: 'app-data-monitor',
   templateUrl: './data-monitor.component.html',
@@ -16,7 +18,7 @@ import { DomSanitizer, SafeUrl } from "@angular/platform-browser";
 })
 export class DataMonitorComponent implements OnInit {
 
-  monitorColumns: string [] = ['shelfName','objType','currentCount','totalCount','time'];
+  monitorColumns: string [] = ['shelfName','objType','currentCount','maxCount','status','time'];
   monitorDataSource = new MatTableDataSource<monitorinfo>(MONITOR_INFO_LIST);
 
   monitorArrayList = [];
@@ -24,6 +26,7 @@ export class DataMonitorComponent implements OnInit {
   imageBlobUrl : any;
   image: any;
   thumbnail: any;
+  myvar: any
 
   monitorInfo = {} as monitorDetails;
 
@@ -39,22 +42,45 @@ export class DataMonitorComponent implements OnInit {
     this.inventoryDetails();
   }
 
+  timerFunc() {
+    debugger;
+    setInterval(this.refreshPage, 2000);
+    // setTimeout(this.refreshPage , 2000);
+  }
+
   refreshPage() {
+    console.log("Inside refreshPage....")
     this.inventoryDetails();
     this.monitorDetails();
   }
 
   monitorDetails() {
     debugger;
+    // setInterval(function(){ 
+    //   console.log("Oooo Yeaaa!");
+    //   this.roboService.getMonitorImage()
+    //     .subscribe( (data:any) => {
+          
+    //   debugger;
+    //   console.log(data);
+    //   // referred https://stackoverflow.com/questions/55591871/view-blob-response-as-image-in-angular
+      
+    //   let objectURL = 'data:image/jpeg;base64,' + data.image;
+    //   this.thumbnail = this.sanitizer.bypassSecurityTrustUrl(objectURL);
+
+    //  },
+    //  error => console.log(error));
+
+
+    // }, 2000);
     this.roboService.getMonitorImage()
         .subscribe( (data:any) => {
           
       debugger;
-      console.log(data);
-      // referred https://stackoverflow.com/questions/55591871/view-blob-response-as-image-in-angular
       
       let objectURL = 'data:image/jpeg;base64,' + data.image;
       this.thumbnail = this.sanitizer.bypassSecurityTrustUrl(objectURL);
+      debugger;
 
      },
      error => console.log(error));    
@@ -62,6 +88,21 @@ export class DataMonitorComponent implements OnInit {
   }
 
   inventoryDetails() {
+    console.log("inventoryDetails started....")
+
+    // setInterval(function(){ 
+    //   console.log("Oooo!");
+    //   this.roboService.getMonitorInfo()
+    //   .subscribe(data => {
+    //   console.log(data);
+    //   this.monitorInfo = data;
+      
+    //   this.monitorArrayList = data.InventryData;
+    //   this.monitorDataSource = new MatTableDataSource(this.monitorArrayList);
+    //   this.monitorDataSource.paginator = this.paginator;
+    //  },
+    //  error => console.log(error));
+    // }, 2000);
     this.roboService.getMonitorInfo()
       .subscribe(data => {
       console.log(data);
@@ -72,10 +113,23 @@ export class DataMonitorComponent implements OnInit {
       this.monitorDataSource.paginator = this.paginator;
      },
      error => console.log(error));
+     console.log("inventoryDetails finished...")
+   }
+
+   getColor(clr) {
+      if(clr == "Mostly Filled"){
+        return "green"
+      }
+      if(clr == "Partially Filled"){
+        return "orange"
+      }
+      if(clr == "Needs Filling"){
+        return "red"
+      }
    }
 
 }
 
 const MONITOR_INFO_LIST: monitorinfo[] = [
-  { shelfName: '', ObjType: '', currentCount: '', totalCount: '', time: '' }
+  { shelfName: '', ObjType: '', currentCount: '', maxCount: '', status: '', time: '' }
 ];