"Treniraj model" stranica uradjena. Biranje eksperimenta i modela pa treniranje. Dodata item-experiment komponenta(kartica). Dodat api poziv getMyExperiments. Izmenjene klase Model i Experiment na back-u i trainModel u kontroleru.

11 files changed, 110 insertions, 34 deletions

diff --git a/frontend/src/app/_elements/item-experiment/item-experiment.component.css b/frontend/src/app/_elements/item-experiment/item-experiment.component.css
new file mode 100644
index 00000000..e69de29b
--- /dev/null
+++ b/frontend/src/app/_elements/item-experiment/item-experiment.component.css
diff --git a/frontend/src/app/_elements/item-experiment/item-experiment.component.html b/frontend/src/app/_elements/item-experiment/item-experiment.component.html
new file mode 100644
index 00000000..51fbfef3
--- /dev/null
+++ b/frontend/src/app/_elements/item-experiment/item-experiment.component.html
@@ -0,0 +1,10 @@
+<div class="card" style="min-width: 12rem;">
+    <div class="card-header">
+        Naziv eksperimenta: <b>{{experiment.name}}</b>
+    </div>
+    <div class="card-body overflow-hidden">
+        <p class="card-text">
+            Opis: {{experiment.description}}
+        </p>
+    </div>
+</div>
\ No newline at end of file
diff --git a/frontend/src/app/_elements/item-experiment/item-experiment.component.spec.ts b/frontend/src/app/_elements/item-experiment/item-experiment.component.spec.ts
new file mode 100644
index 00000000..1da7d05d
--- /dev/null
+++ b/frontend/src/app/_elements/item-experiment/item-experiment.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ItemExperimentComponent } from './item-experiment.component';
+
+describe('ItemExperimentComponent', () => {
+  let component: ItemExperimentComponent;
+  let fixture: ComponentFixture<ItemExperimentComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ItemExperimentComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ItemExperimentComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_elements/item-experiment/item-experiment.component.ts b/frontend/src/app/_elements/item-experiment/item-experiment.component.ts
new file mode 100644
index 00000000..31900d35
--- /dev/null
+++ b/frontend/src/app/_elements/item-experiment/item-experiment.component.ts
@@ -0,0 +1,15 @@
+import { Component, Input, OnInit } from '@angular/core';
+import Experiment from 'src/app/_data/Experiment';
+
+@Component({
+  selector: 'app-item-experiment',
+  templateUrl: './item-experiment.component.html',
+  styleUrls: ['./item-experiment.component.css']
+})
+export class ItemExperimentComponent{
+
+  @Input() experiment: Experiment = new Experiment();
+
+  constructor() { }
+
+}
diff --git a/frontend/src/app/_services/experiments.service.ts b/frontend/src/app/_services/experiments.service.ts
index 60d1bfb2..ecb3e262 100644
--- a/frontend/src/app/_services/experiments.service.ts
+++ b/frontend/src/app/_services/experiments.service.ts
@@ -15,4 +15,8 @@ export class ExperimentsService {
   addExperiment(experiment: Experiment): Observable<any> {
     return this.http.post(`${API_SETTINGS.apiURL}/experiment/add`, experiment, { headers: this.authService.authHeader() });
   }
+
+  getMyExperiments(): Observable<Experiment[]> {
+    return this.http.get<Experiment[]>(`${API_SETTINGS.apiURL}/experiment/getmyexperiments`, { headers: this.authService.authHeader() });
+  }
 }
diff --git a/frontend/src/app/_services/models.service.ts b/frontend/src/app/_services/models.service.ts
index 3fbad109..9a1e71da 100644
--- a/frontend/src/app/_services/models.service.ts
+++ b/frontend/src/app/_services/models.service.ts
@@ -35,8 +35,8 @@ export class ModelsService {
   addDataset(dataset: Dataset): Observable<any> {
     return this.http.post(`${API_SETTINGS.apiURL}/dataset/add`, dataset, { headers: this.authService.authHeader() });
   }
-  trainModel(model: Model): Observable<any> {
-    return this.http.post(`${API_SETTINGS.apiURL}/model/sendmodel`, model, { headers: this.authService.authHeader(), responseType: 'text' });
+  trainModel(modelId: string, experimentId: string): Observable<any> {
+    return this.http.post(`${API_SETTINGS.apiURL}/model/trainmodel`, { ModelId: modelId, ExperimentId: experimentId }, { headers: this.authService.authHeader(), responseType: 'text' });
   }
 
   getMyDatasets(): Observable<Dataset[]> {
diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts
index 3909c680..727bca63 100644
--- a/frontend/src/app/app.module.ts
+++ b/frontend/src/app/app.module.ts
@@ -45,6 +45,7 @@ import { AlertDialogComponent } from './_modals/alert-dialog/alert-dialog.compon
 import { AddNewDatasetComponent } from './_elements/add-new-dataset/add-new-dataset.component';
 import { GraphComponent } from './_elements/graph/graph.component';
 import { TrainingComponent } from './training/training.component';
+import { ItemExperimentComponent } from './_elements/item-experiment/item-experiment.component';
 
 @NgModule({
   declarations: [
@@ -79,7 +80,8 @@ import { TrainingComponent } from './training/training.component';
     AlertDialogComponent,
     AddNewDatasetComponent,
     GraphComponent,
-    TrainingComponent
+    TrainingComponent,
+    ItemExperimentComponent
   ],
   imports: [
     BrowserModule,
diff --git a/frontend/src/app/experiment/experiment.component.ts b/frontend/src/app/experiment/experiment.component.ts
index 74ee9ee7..b8b6f69c 100644
--- a/frontend/src/app/experiment/experiment.component.ts
+++ b/frontend/src/app/experiment/experiment.component.ts
@@ -204,22 +204,4 @@ export class ExperimentComponent implements OnInit {
       }
     });
   }
-
-  trainModel() {
-    this.trainingResult = undefined;
-    //console.log('Training model...', this.selectedModel);
-    if (!this.selectedDataset) {
-      Shared.openDialog('Greška', 'Izvor podataka nije izabran!');
-      return;
-    }
-    // TODO proveri nullValues
-    if (!this.selectedModel) {
-      Shared.openDialog('Greška', 'Model nije izabran!');
-      return;
-    }
-    this.modelsService.trainModel(this.selectedModel).subscribe((response: any) => {
-      console.log('Train model complete!', response);
-      this.trainingResult = response;
-    });
-  }
 }
diff --git a/frontend/src/app/training/training.component.css b/frontend/src/app/training/training.component.css
index ee4b0448..490c56b5 100644
--- a/frontend/src/app/training/training.component.css
+++ b/frontend/src/app/training/training.component.css
@@ -29,7 +29,7 @@
     border-color: #003459;
 }
 
-.selectedDatasetClass {
+.selectedExperimentClass {
     /*border-color: 2px solid #003459;*/
     background-color: lightblue;
 }
diff --git a/frontend/src/app/training/training.component.html b/frontend/src/app/training/training.component.html
index 1939d3cf..2e574c12 100644
--- a/frontend/src/app/training/training.component.html
+++ b/frontend/src/app/training/training.component.html
@@ -4,13 +4,25 @@
 <div id="wrapper">
     <div id="container" class="container p-5" style="background-color: white; min-height: 100%;">
 
-<h2>1. Izaberi eksperiment</h2>
-TODO
+<h2>1. Izaberite eksperiment iz kolekcije</h2>
+<div class="px-5 my-2">
+    <input type="text" class="form-control" placeholder="Pretraga"
+        [(ngModel)]="term">
+</div>
+<div class="overflow-auto" style="max-height: 500px;">
+    <ul class="list-group">
+        <li class="list-group-item p-3" *ngFor="let experiment of myExperiments|filter:term"
+            [ngClass]="{'selectedExperimentClass': this.selectedExperiment == experiment}">
+            <app-item-experiment [experiment]="experiment"
+                (click)="selectThisExperiment(experiment);"></app-item-experiment>
+        </li>
+    </ul>
+</div>
 
-<h2>2.Izaberi model</h2>
+<h2>2.Izaberite model</h2>
 <app-model-load (selectedModelChangeEvent)="selectModel($event)"></app-model-load>
 
-<h2>3. Treniraj model</h2>
+<h2>3. Trenirajte model</h2>
 <button class="btn btn-lg col-4" style="background-color:#003459; color:white;" (click)="trainModel();">Treniraj
     model</button>
 
diff --git a/frontend/src/app/training/training.component.ts b/frontend/src/app/training/training.component.ts
index cb6c304c..4f20bc87 100644
--- a/frontend/src/app/training/training.component.ts
+++ b/frontend/src/app/training/training.component.ts
@@ -1,29 +1,55 @@
 import { Component, OnInit } from '@angular/core';
+import Shared from '../Shared';
 import Experiment from '../_data/Experiment';
 import Model from '../_data/Model';
+import { DatasetsService } from '../_services/datasets.service';
+import { ExperimentsService } from '../_services/experiments.service';
+import { ModelsService } from '../_services/models.service';
 
 @Component({
   selector: 'app-training',
   templateUrl: './training.component.html',
   styleUrls: ['./training.component.css']
 })
-export class TrainingComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
+export class TrainingComponent{
 
+  myExperiments?: Experiment[];
   selectedExperiment?: Experiment;
   selectedModel?: Model;
 
   trainingResult: any;
 
-  selectModel($model: Model) {
+  term: string = "";
+
+  constructor(private modelsService: ModelsService, private datasetsService: DatasetsService, private experimentsService: ExperimentsService) { 
+    this.experimentsService.getMyExperiments().subscribe((experiments) => {
+      this.myExperiments = experiments;
+      console.log(this.myExperiments);
+    });
+  }
+
+  selectThisExperiment(experiment: Experiment) {
+    this.selectedExperiment = experiment;
+  }
 
+  selectModel(model: Model) {
+    this.selectedModel = model;
   }
 
   trainModel() {
-    //eksperiment i model moraju da budu izabrani
+    this.trainingResult = undefined;
+
+    if (this.selectedExperiment == undefined) {
+      Shared.openDialog("Greška", "Molimo Vas da izaberete eksperiment iz kolekcije.");
+      return;
+    }
+    if (this.selectedModel == undefined) {
+      Shared.openDialog("Greška", "Molimo Vas da izaberete model.");
+      return;
+    }
+    this.modelsService.trainModel(this.selectedModel._id, this.selectedExperiment._id).subscribe((response: any) => {
+      console.log('Train model complete!', response);
+      this.trainingResult = response;
+    });
   }
 }