minor changes

src/app/app-routing.module.ts

@@ -8,8 +8,8 @@ import { StatusListComponent } from "./status-list/status-list.component";
 const routes: Routes = [
   { path: "", component: StatusListComponent },
   {
-    path: "login",
+    path: "admin",
-    component: LoginComponent
+    component: AdminComponent
   }
 ];
 

src/app/status-list/status-list.component.html

@@ -90,13 +90,27 @@
     <p class="stat-text"><span>Statystyki szczegółowe:</span></p>
     <ul class="list-group">
       <p style="margin-bottom:15px">
-        <span>Średni czas gry: </span> <span class="boldMe">23</span
+        <span>Średni czas gry: </span>
-        ><span> min</span><br />
+        <span class="boldMe"
+          >{{
+            average > 60
+              ? this.Math.floor(average / 60)
+              : this.Math.floor(average)
+          }}
+          {{ average > 60 ? "min" : "sek" }}</span
+        ><br />
       </p>
 
-      <span>Przewidywane zakończenie: </span>
+      <div *ngIf="this.activeDevice.lastStatus == 1">
-      <span class="boldMe">10</span
+        <span>Przewidywane zakończenie: </span>
-      ><span> min</span>
+        <span class="boldMe">{{
+          average - time < 0
+            ? "Zaraz koniec !"
+            : average - time > 60
+            ? this.Math.floor((average - time) / 60)
+            : this.Math.floor(average - time)
+        }}</span>
+      </div>
     </ul>
   </div>
 </div>

src/app/status-list/status-list.component.ts

@@ -19,8 +19,35 @@ export class StatusListComponent implements OnInit {
   activeDevice = { name: "", lastStatus: "", ip: "", _id: "" };
   activeID = 0;
   time = 0;
-
+  days = [0, 0, 0, 0, 0, 0, 0];
+  average = 0;
   Math: any;
+  hours = [
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0,
+    0
+  ];
 
   ngOnInit() {
     this.statusService.getDB().subscribe(data => {
@@ -43,10 +70,89 @@ export class StatusListComponent implements OnInit {
     this.activeDevice = this.devices[index];
     //console.log(this.activeDevice);
     this.statusService.getStatus(this.activeDevice._id).subscribe(status => {
+      let tempStatus = [...status];
+      tempStatus.reverse();
       let i = status.findIndex(item => {
         return item.value != status[0].value;
       });
-      //console.log(i);
+      this.days = [0, 0, 0, 0, 0, 0, 0];
+      status.forEach(s => {
+        if (s.value === "1") {
+          const time = new Date(s.time);
+          //console.log(time);
+          const index = time.getDay();
+          this.days[index] = this.days[index] + 1;
+        }
+      });
+      let count = 0;
+      let allTime = 0;
+      status.reduce((prev, curr) => {
+        if (prev.value === "1") {
+          count++;
+          allTime +=
+            new Date(prev.time).valueOf() - new Date(curr.time).valueOf();
+        }
+        return curr;
+      });
+      this.average = allTime / count / 1000;
+
+      this.hours = [
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0,
+        0
+      ];
+      const now = new Date();
+      now.setDate(now.getDate());
+      now.setHours(8);
+      now.setMinutes(0);
+      now.setSeconds(0);
+      //console.log(now);
+      const index = tempStatus.findIndex(
+        s => new Date(s.time).valueOf() > now.valueOf()
+      );
+      let todayStatus = tempStatus.slice(index);
+      //console.log(todayStatus);
+      todayStatus.reduce((prev, curr) => {
+        if (prev.value === "1") {
+          const prevTime = new Date(prev.time);
+          const currTime = new Date(curr.time);
+          //console.log(prevTime.getHours());
+          if (prevTime.getHours() !== currTime.getHours()) {
+            this.hours[prevTime.getHours() - 8] +=
+              (60 - prevTime.getMinutes()) * 60 * 1000;
+            this.hours[currTime.getHours() - 8] +=
+              currTime.getMinutes() * 60 * 1000;
+          } else {
+            this.hours[prevTime.getHours() - 8] +=
+              currTime.valueOf() - prevTime.valueOf();
+          }
+        }
+        return curr;
+      });
+      this.hours = this.hours.map(h => h / 1000 / 60);
+      //console.log(this.hours);
+      this.showChart();
       let newStatus;
       if (i == -1) {
         newStatus = status;
@@ -72,11 +178,25 @@ export class StatusListComponent implements OnInit {
     this.LineChart = new Chart("lineChart", {
       type: "line",
       data: {
-        labels: ["8:00", "10:00", "12:00", "14:00", "16:00"],
+        labels: [
+          "8:00",
+          "9:00",
+          "10:00",
+          "11:00",
+          "12:00",
+          "13:00",
+          "14:00",
+          "15:00",
+          "16:00",
+          "17:00",
+          "18:00",
+          "19:00",
+          "20:00"
+        ],
         datasets: [
           {
             label: "Ruch w ciągu dnia",
-            data: [6, 7, 8, 5, 4],
+            data: this.hours,
             fill: false,
             lineTension: 0.2,
             borderColor: "rgba(75,192,192,0.6)",
@@ -92,17 +212,20 @@ export class StatusListComponent implements OnInit {
             }
           }
         ]
+      },
+      options: {
+        animation: false
       }
     });
 
     this.BarChart = new Chart("barChart", {
       type: "bar",
       data: {
-        labels: ["Jan", "Feb", "March", "Apr", "May"],
+        labels: ["Pon", "Wto", "Śro", "Czwa", "Pia", "Sob", "Niedz"],
         datasets: [
           {
-            label: "Rozegranych gier",
+            label: "Liczba rozegranych gier",
-            data: [60, 70, 80, 50, 40],
+            data: this.days,
             fill: true,
             lineTension: 0.2,
             borderColor: "white",
@@ -112,7 +235,9 @@ export class StatusListComponent implements OnInit {
               "rgba(54,162,235,0.6)",
               "rgba(255,206,86,0.6)",
               "rgba(75,192,192,0.6)",
-              "rgba(153,102,255,0.6)"
+              "rgba(153,102,255,0.6)",
+              "rgba(255,99,132,0.6)",
+              "rgba(54,162,235,0.6)"
             ]
           }
         ]
@@ -125,6 +250,9 @@ export class StatusListComponent implements OnInit {
             }
           }
         ]
+      },
+      options: {
+        animation: false
       }
     });
   }