Povezao metric view komponentu, chart, sa signalR tako da se iscrtavaju metrike modela kako se trenira. Ispravio neke bug-ove.

2 files changed, 25 insertions, 15 deletions

diff --git a/frontend/src/app/training/training.component.html b/frontend/src/app/training/training.component.html
index 2bee3b12..fa80089e 100644
--- a/frontend/src/app/training/training.component.html
+++ b/frontend/src/app/training/training.component.html
@@ -33,9 +33,8 @@
             <h2 class="mt-5">Rezultati treniranja</h2>
             <div class="m-3" *ngIf="trainingResult">
                 <h2 class="my-2">Rezultati treniranja:</h2>
-                <p>
-                    {{trainingResult}}
-                </p>
+                {{trainingResult}}
+                <app-metric-view *ngIf="trainingResult" [metrics]="trainingResult"></app-metric-view>
             </div>
         </div>
 
diff --git a/frontend/src/app/training/training.component.ts b/frontend/src/app/training/training.component.ts
index 4c38f166..6b5405cb 100644
--- a/frontend/src/app/training/training.component.ts
+++ b/frontend/src/app/training/training.component.ts
@@ -3,6 +3,7 @@ import { ActivatedRoute } from '@angular/router';
 import Shared from '../Shared';
 import Experiment from '../_data/Experiment';
 import Model, { ProblemType } from '../_data/Model';
+import { MetricViewComponent } from '../_elements/metric-view/metric-view.component';
 import { ModelLoadComponent } from '../_elements/model-load/model-load.component';
 import { AuthService } from '../_services/auth.service';
 import { ExperimentsService } from '../_services/experiments.service';
@@ -17,6 +18,7 @@ import { SignalRService } from '../_services/signal-r.service';
 export class TrainingComponent implements OnInit {
 
   @ViewChild(ModelLoadComponent) modelLoadComponent?: ModelLoadComponent;
+  @ViewChild(MetricViewComponent) metricViewComponent!: MetricViewComponent;
 
   myExperiments?: Experiment[];
   selectedExperiment?: Experiment;
@@ -24,16 +26,11 @@ export class TrainingComponent implements OnInit {
 
   trainingResult: any;
 
+  history: any[] = [];
+
   term: string = "";
 
   constructor(private modelsService: ModelsService, private route: ActivatedRoute, private experimentsService: ExperimentsService, private authService: AuthService, private signalRService: SignalRService) {
-    if (this.signalRService.hubConnection) {
-      this.signalRService.hubConnection.on("NotifyEpoch", (mName: string, mId: string, stat: string, totalEpochs: number, currentEpoch: number) => {
-        if (this.selectedModel?._id == mId) {
-          this.trainingResult = stat;
-        }
-      });
-    }
   }
 
   ngOnInit(): void {
@@ -45,17 +42,32 @@ export class TrainingComponent implements OnInit {
       this.authService.loggedInEvent.subscribe(_ => {
         this.fetchExperiments(experimentId);
 
-        this.signalRService.startConnection()
+        this.signalRService.startConnection();
       });
+
+      console.log(this.signalRService.hubConnection);
+      if (this.signalRService.hubConnection) {
+        this.signalRService.hubConnection.on("NotifyEpoch", (mName: string, mId: string, stat: string, totalEpochs: number, currentEpoch: number) => {
+          console.log(this.selectedModel?._id, mId);
+          if (this.selectedModel?._id == mId) {
+            stat = stat.replace(/'/g, '"');
+            this.trainingResult = JSON.parse(stat);
+            //console.log('JSON', this.trainingResult);
+            this.history.push(this.trainingResult);
+            this.metricViewComponent.update(this.history);
+          }
+        });
+      }
     });
   }
 
   fetchExperiments(andSelectWithId: string | null = '') {
     this.experimentsService.getMyExperiments().subscribe((experiments) => {
-      this.myExperiments = experiments;
+      this.myExperiments = experiments.reverse();
 
       this.selectedExperiment = this.myExperiments.filter(x => x._id == andSelectWithId)[0];
-      console.log("selektovan exp u training comp: ", this.selectedExperiment);
+      if (this.modelLoadComponent)
+        this.modelLoadComponent.newModel.type = this.selectedExperiment.type;
     });
   }
 
@@ -82,8 +94,7 @@ export class TrainingComponent implements OnInit {
     }
     this.modelsService.trainModel(this.selectedModel._id, this.selectedExperiment._id).subscribe((response: any) => {
       //console.log('Train model complete!', response);
-      Shared.openDialog("Obaveštenje", "Treniranje modela je uspešno završeno!");
-      this.trainingResult = response;
+      Shared.openDialog("Obaveštenje", "Treniranje modela je počelo!");
     });
   }
 }