2 files changed, 24 insertions, 13 deletions
diff --git a/frontend/src/app/training/training.component.html b/frontend/src/app/training/training.component.html
index 0849d0c3..25a29828 100644
--- a/frontend/src/app/training/training.component.html
+++ b/frontend/src/app/training/training.component.html
@@ -33,9 +33,7 @@
             <h2 class="mt-5">Rezultati treniranja</h2>
             <div class="m-3" *ngIf="trainingResult">
                 <h2 class="my-2">Rezultati treniranja:</h2>
-                <p>
-                    {{trainingResult}}
-                </p>
+                <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 bff3304f..a0bec8e2 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';
@@ -19,6 +20,7 @@ export class TrainingComponent implements OnInit {
   @ViewChild(ModelLoadComponent) modelLoadComponent?: ModelLoadComponent;
   @ViewChild("trainButton") trainButtonRef!: ElementRef;
   
+  @ViewChild(MetricViewComponent) metricViewComponent!: MetricViewComponent;
 
   myExperiments?: Experiment[];
   selectedExperiment?: Experiment;
@@ -26,16 +28,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 {
@@ -47,16 +44,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];
+      if (this.modelLoadComponent)
+        this.modelLoadComponent.newModel.type = this.selectedExperiment.type;
     });
   }
 
@@ -85,7 +98,7 @@ export class TrainingComponent implements OnInit {
     this.modelsService.trainModel(this.selectedModel._id, this.selectedExperiment._id).subscribe((response: any) => {
       //console.log('Train model complete!', response);
       this.trainButtonRef.nativeElement.disabled = false;
-      Shared.openDialog("Obaveštenje", "Treniranje modela je uspešno završeno!");
+      Shared.openDialog("Obaveštenje", "Treniranje modela je počelo!");
       this.trainingResult = response;
     });
   }