Dodat je automatski izbor metrika.

2 files changed, 55 insertions, 43 deletions

diff --git a/frontend/src/app/_pages/add-model/add-model.component.html b/frontend/src/app/_pages/add-model/add-model.component.html
index 593d52b7..5e8372c9 100644
--- a/frontend/src/app/_pages/add-model/add-model.component.html
+++ b/frontend/src/app/_pages/add-model/add-model.component.html
@@ -234,6 +234,8 @@
             </div>
 
             <div class="row p-2">
+                <!--***********************************ENKODER*********************************************-->
+
                 <div class="col-1">
                 </div>
                 <div class="col-3">
@@ -247,6 +249,9 @@
                         </option>
                     </select>
                 </div>
+                
+                <!--***********************************BROJ NEURONA SKRIVENOG SLOJA*********************************************-->
+
                 <div class="col-1">
                 </div>
                 <div class="col-3">
@@ -256,7 +261,8 @@
                     <input type="number" min="1" class="form-control" name="hiddenLayerNeurons"
                         [(ngModel)]="newModel.hiddenLayerNeurons">
                 </div>
-            </div>
+            </div>  
+<!--***********************************OPTIMIZACIJA*********************************************-->
 
             <div class="row p-2">
                 <div class="col-1">
@@ -283,7 +289,7 @@
                 </div>
             </div>
 <!--***********************************LOSS FUNCTION*********************************************-->
-            <div class="row p-2">
+            <div class="row justify-content-center">
                 <div class="col-1">
                 </div>
                 <div class="col-3">
@@ -291,7 +297,7 @@
                 </div>
                 <div class="col-2">
                     <select id=lossFunctionOptions class="form-control" name="lossFunction"
-                        [(ngModel)]="newModel.lossFunction">
+                        [(ngModel)]="newModel.lossFunction" aria-checked="true">
                         <option
                             *ngFor="let option of Object.keys(lossFunction); let optionName of Object.values(lossFunction)"
                             [value]="option">
@@ -301,8 +307,27 @@
                 </div>
                 <div class="col-1">
                 </div>
-
+            </div>
 <!-- ************************************************************************************************** -->
+
+<!--**********************************************METRIKE ZA KOMPAJLER I GRAFIKE***********************************************-->
+
+<hr>
+                <div class="form-check form-check-inline overflow-auto " style="width: max-content;">
+                    <h3>Izaberite metrike:</h3>
+                    <div id="divMetricsinput"  >
+                        
+                        <div *ngFor="let option of Object.keys(metrics); let optionName of Object.values(metrics) "class="form-check form-check-inline">
+                            
+                            <input name="cbmetrics" class="form-check-input" type="checkbox" value="{{option}}" id="metrics_{{option}}" style="float: left;"> 
+                            <label class="form-check-label" for="metrics_{{option}}" for="inlineCheckbox2">
+                                {{optionName}}
+                            </label>
+                        </div>
+                    </div>
+                </div>
+<!--************************************************************************************************* -->
+
                 <div class="col-3 mt-2">
                     <label for="type" class="form-check-label">Nasumičan redosled podataka?</label>
                     <input class="mx-3 form-check-input" type="checkbox" [(ngModel)]="newModel.randomOrder"
@@ -310,9 +335,9 @@
                 </div>
                 <div class="col-1">
                 </div>
-            </div>
+            
 
-            <!--<div class="row p-2">
+            <div class="row p-2 justify-content-left">
                 <div class="col-3"></div>
                 <div class="col-3">
                     <label for="hiddenLayerActivationFunction" class="col-form-label">Funkcija aktivacije skrivenih
@@ -332,7 +357,7 @@
                 </div>
                 <div class="col-3"></div>
             </div>
-        -->
+        
             <div class="row p-2">
                 <div class="col-1">
                 </div>
@@ -353,36 +378,8 @@
                         [(ngModel)]="tempTestSetDistribution" [disabled]="!newModel.randomTestSet">
                 </div>
             </div>
-            <div class="col">
-                trening
-                <mat-slider min="10" max="90" step="10" value="10" name="randomTestSetDistribution" thumbLabel
-                    [disabled]="!newModel.randomTestSet" [(ngModel)]="tempTestSetDistribution">
-                </mat-slider>
-                test
-            </div>
+ 
 <!--***********************************AKTIVACIONE FUNKCIJE*********************************************-->            
-<h3 >Aktivacione funkcije</h3>
-           
-            <div class="row p-2" style="align-self: center;">
-                <div class="col-3"></div>
-                <div class="col-3">
-                    <label for="hiddenLayerActivationFunction" class="col-form-label" style="text-align: center;">Funkcija aktivacije skrivenih
-                        slojeva:</label>
-                </div>
-                <div class="col-3">
-                    <div *ngFor="let item of [].constructor(newModel.hiddenLayers); let i = index">
-                        <select [id]="'hiddenLayerActivationFunctionOption_'+i" class="form-control"
-                            [(ngModel)]="newModel.hiddenLayerActivationFunctions[i]">
-                            <option
-                                *ngFor="let option of Object.keys(ActivationFunction); let optionName of Object.values(ActivationFunction)"
-                                [value]="option">
-                                {{ optionName }}
-                            </option>
-                        </select>
-                    </div>
-                </div>
-                <div class="col-3"></div>
-            </div>
 
             <div class="row p-2" style="align-self: center;">
                 <div class="col-1">
@@ -405,13 +402,13 @@
                 </div>
 
 
-                <!--<div class="col">
+                <div class="col">
                     trening
                     <mat-slider min="10" max="90" step="10" value="10" name="randomTestSetDistribution" thumbLabel
                         [disabled]="!newModel.randomTestSet" [(ngModel)]="tempTestSetDistribution">
                     </mat-slider>
                     test
-                </div>-->
+                </div>
                 <div class="col">
                 </div>
             </div>
diff --git a/frontend/src/app/_pages/add-model/add-model.component.ts b/frontend/src/app/_pages/add-model/add-model.component.ts
index 4428c8c6..a1d36b42 100644
--- a/frontend/src/app/_pages/add-model/add-model.component.ts
+++ b/frontend/src/app/_pages/add-model/add-model.component.ts
@@ -1,6 +1,6 @@
 import { Component, OnInit, ViewChild } from '@angular/core';
 import Model, { LossFunctionBinaryClassification, LossFunctionMultiClassification, LossFunctionRegression, NullValReplacer, ReplaceWith } from 'src/app/_data/Model';
-import { ProblemType, Encoding, ActivationFunction, LossFunction, Optimizer, NullValueOptions } from 'src/app/_data/Model';
+import { ProblemType, Encoding, ActivationFunction, LossFunction, Optimizer, NullValueOptions,Metrics,MetricsRegression , MetricsBinaryClassification,MetricsMultiClassification} from 'src/app/_data/Model';
 import { DatasetLoadComponent } from 'src/app/_elements/dataset-load/dataset-load.component';
 import { ModelsService } from 'src/app/_services/models.service';
 import shared from 'src/app/Shared';
@@ -10,6 +10,7 @@ import { DatasetsService } from 'src/app/_services/datasets.service';
 import { NgxCsvParser } from 'ngx-csv-parser';
 import { CsvParseService } from 'src/app/_services/csv-parse.service';
 
+
 @Component({
   selector: 'app-add-model',
   templateUrl: './add-model.component.html',
@@ -27,7 +28,7 @@ export class AddModelComponent implements OnInit {
   ProblemType = ProblemType;
   Encoding = Encoding;
   ActivationFunction = ActivationFunction;
-  activationFunction:any=ActivationFunction
+  metrics:any=Metrics;
   LossFunction = LossFunction;
   lossFunction : any = LossFunction;
   Optimizer = Optimizer;
@@ -54,7 +55,7 @@ export class AddModelComponent implements OnInit {
   term: string = "";
 
   selectedProblemType:string='';
-  
+  selectedMetrics=[];
 
   constructor(private models: ModelsService, private datasets: DatasetsService, private csv: CsvParseService) {
     this.newModel = new Model();
@@ -108,6 +109,7 @@ export class AddModelComponent implements OnInit {
 
     this.getCheckedInputCols();
     this.getCheckedOutputCol();
+    this.getMetrics();
 
     if (this.validationInputsOutput()) {
       console.log('ADD MODEL: STEP 1 - UPLOAD FILE');
@@ -155,7 +157,7 @@ export class AddModelComponent implements OnInit {
     if (this.selectedDataset) { //dataset je izabran
       this.getCheckedInputCols();
       this.getCheckedOutputCol();
-
+      this.getMetrics();
       if (this.validationInputsOutput()) {
         this.newModel.datasetId = this.selectedDataset._id;
 
@@ -473,17 +475,30 @@ export class AddModelComponent implements OnInit {
     switch(this.problemtype){
       case 'regresioni':
         this.lossFunction=LossFunctionRegression;
+        this.metrics=MetricsRegression;
         break;
       case 'binarni-klasifikacioni':
         this.lossFunction=LossFunctionBinaryClassification;
+        this.metrics=MetricsBinaryClassification;
         break;
       case 'multi-klasifikacioni':
         this.lossFunction=LossFunctionMultiClassification;
+        this.metrics=MetricsMultiClassification;
       break;
       default:
         break;
     }
   }
 
-  
+  getMetrics() {
+    this.newModel.metrics=[];
+    let cb = document.getElementsByName("cbmetrics");
+
+    for (let i = 0; i < cb.length; i++) {
+      let chb = <HTMLInputElement>cb[i];
+      if (chb.checked == true)
+        this.newModel.metrics.push(chb.value);
+    }
+   
+  }
 }