Merge branch 'dev' of http://gitlab.pmf.kg.ac.rs/igrannonica/neuronstellar into dev

# Conflicts:
#	frontend/src/app/_pages/add-model/add-model.component.html
#	frontend/src/app/_pages/add-model/add-model.component.ts
#	frontend/src/app/app.module.ts

17 files changed, 325 insertions, 143 deletions

diff --git a/frontend/src/app/_pages/add-model/add-model.component.css b/frontend/src/app/_pages/add-model/add-model.component.css
index 6d961287..7f05af0f 100644
--- a/frontend/src/app/_pages/add-model/add-model.component.css
+++ b/frontend/src/app/_pages/add-model/add-model.component.css
@@ -32,4 +32,11 @@
 }
 ul li:hover {
     background-color: lightblue;
-}
\ No newline at end of file
+}
+
+#divInputs {
+    margin-left: 20px;
+}
+#divOutputs {
+    margin-left: 20px;
+}
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 3d5fd7b1..179e9aea 100644
--- a/frontend/src/app/_pages/add-model/add-model.component.html
+++ b/frontend/src/app/_pages/add-model/add-model.component.html
@@ -25,42 +25,8 @@
 
         <div class="py-3 pr-5 justify-content-center">
 
-            <div class="col-12 d-flex my-5">
-                <h2 class="">Izvor podataka:</h2>
-                <div class="col-1">
-                </div>
-                <button type="button" id="btnMyDataset" class="btn" (click)="viewMyDatasetsForm()"
-                    [ngClass]="{'btnType1': showMyDatasets, 'btnType2': !showMyDatasets}">
-                    Izaberite dataset iz kolekcije
-                </button>
-                <h3 class="mt-3 mx-3">ili</h3>
-                <button type="button" id="btnNewDataset" class="btn" (click)="viewNewDatasetForm()"
-                    [ngClass]="{'btnType1': !showMyDatasets, 'btnType2': showMyDatasets}">
-                    Dodajte novi dataset
-                </button>
-            </div>
-            <div class="px-5 my-2">
-                <input *ngIf="showMyDatasets" type="text" class="form-control" placeholder="Pretraga"
-                    [(ngModel)]="term">
-            </div>
-            <div class="px-5">
-                <div *ngIf="showMyDatasets" class="overflow-auto" style="max-height: 500px;">
-                    <ul class="list-group">
-                        <li class="list-group-item p-3" *ngFor="let dataset of myDatasets|filter:term"
-                            [ngClass]="{'selectedDatasetClass': this.selectedDataset == dataset}">
-                            <app-item-dataset name="usersDataset" [dataset]="dataset"
-                                (click)="selectThisDataset(dataset);"></app-item-dataset>
-                        </li>
-                    </ul>
-                </div>
-            </div>
+            <app-dataset-load (selectedDatasetChangeEvent)="datasetHasChanged($event)"></app-dataset-load>
 
-            <app-dataset-load [style]="(showMyDatasets)?'display:none;visibility:hidden;':''" id="dataset"
-                (loaded)="scrollToNextForm(); datasetLoaded = true; selectedDataset = datasetLoadComponent?.dataset; datasetFile = datasetLoadComponent?.csvRecords; datasetHasHeader = datasetLoadComponent?.dataset!.hasHeader">
-            </app-dataset-load>
-            <div class="px-5 mt-5">
-                <app-datatable [data]="datasetFile" [hasHeader]="datasetHasHeader"></app-datatable>
-            </div>
         </div>
         <span id="selectInAndOuts"></span>
         <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 d47b24e6..ba8f7d01 100644
--- a/frontend/src/app/_pages/add-model/add-model.component.ts
+++ b/frontend/src/app/_pages/add-model/add-model.component.ts
@@ -5,9 +5,7 @@ import { DatasetLoadComponent } from 'src/app/_elements/dataset-load/dataset-loa
 import { ModelsService } from 'src/app/_services/models.service';
 import shared from 'src/app/Shared';
 import Dataset from 'src/app/_data/Dataset';
-import { DatatableComponent } from 'src/app/_elements/datatable/datatable.component';
 import { DatasetsService } from 'src/app/_services/datasets.service';
-import { NgxCsvParser } from 'ngx-csv-parser';
 import { CsvParseService } from 'src/app/_services/csv-parse.service';
 
 
@@ -18,11 +16,6 @@ import { CsvParseService } from 'src/app/_services/csv-parse.service';
 })
 export class AddModelComponent implements OnInit {
 
-  @ViewChild(DatasetLoadComponent) datasetLoadComponent?: DatasetLoadComponent;
-  @ViewChild(DatatableComponent) datatable?: DatatableComponent;
-  datasetLoaded: boolean = false;
-  selectedDatasetLoaded: boolean = false;
-
   newModel: Model;
 
   ProblemType = ProblemType;
@@ -71,8 +64,13 @@ export class AddModelComponent implements OnInit {
     (<HTMLInputElement>document.getElementById("btnMyDataset")).focus();
   }
 
+  datasetHasChanged(selectedDataset: Dataset) {
+    this.selectedDataset = selectedDataset;
+    this.resetCbsAndRbs();
+    this.refreshThreeNullValueRadioOptions();
+  }
 
-  viewMyDatasetsForm() {
+  /*viewMyDatasetsForm() {
     this.showMyDatasets = true;
     this.resetSelectedDataset();
     //this.datasetLoaded = false;
@@ -82,7 +80,7 @@ export class AddModelComponent implements OnInit {
     this.showMyDatasets = false;
     this.resetSelectedDataset();
     this.resetCbsAndRbs();
-  }
+  }*/
 
   addModel() {
     if (!this.showMyDatasets)
@@ -174,7 +172,7 @@ export class AddModelComponent implements OnInit {
         this.models.addModel(this.newModel).subscribe((response) => {
           callback(response);
         }, (error) => {
-          alert("Model sa unetim nazivom već postoji u Vašoj kolekciji.\nPromenite naziv modela i nastavite sa kreiranim datasetom.");
+          shared.openDialog("Neuspeo pokušaj!", "Model sa unetim nazivom već postoji u Vašoj kolekciji. Promenite naziv modela i nastavite sa kreiranim datasetom.");
         });
       }
     }
@@ -217,47 +215,47 @@ export class AddModelComponent implements OnInit {
       return false;
     }
     else if (this.newModel.inputColumns.length == 0) {
-      alert("Molimo Vas da izaberete ulaznu kolonu/kolone za mrežu.");
+      shared.openDialog("Neuspeo pokušaj!", "Molimo Vas da izaberete ulaznu kolonu/kolone za mrežu.");
       return false;
     }
     else if (this.newModel.columnToPredict == '') {
-      alert("Molimo Vas da izaberete izlaznu kolonu za mrežu.");
+      shared.openDialog("Neuspeo pokušaj!", "Molimo Vas da izaberete izlaznu kolonu za mrežu.");
       return false;
     }
     for (let i = 0; i < this.newModel.inputColumns.length; i++) {
       if (this.newModel.inputColumns[i] == this.newModel.columnToPredict) {
         let colName = this.newModel.columnToPredict;
-        alert("Izabrali ste istu kolonu (" + colName + ") kao ulaznu i izlaznu iz mreže. Korigujte izbor.");
+        shared.openDialog("Neuspeo pokušaj!", "Izabrali ste istu kolonu (" + colName + ") kao ulaznu i izlaznu iz mreže. Korigujte izbor.");
         return false;
       }
     }
     return true;*/
   }
 
-  selectThisDataset(dataset: Dataset) {
+  /*selectThisDataset(dataset: Dataset) {
     this.selectedDataset = dataset;
-    this.selectedDatasetLoaded = false;
+    //this.selectedDatasetLoaded = false;
     this.existingDatasetSelected = true;
     this.datasetHasHeader = this.selectedDataset.hasHeader;
 
     this.datasets.getDatasetFile(dataset.fileId).subscribe((file: string | undefined) => {
       if (file) {
         this.datasetFile = this.csv.csvToArray(file, (dataset.delimiter == "razmak") ? " " : (dataset.delimiter == "") ? "," : dataset.delimiter);
-        /*for (let i = this.datasetFile.length - 1; i >= 0; i--) {  //moguce da je vise redova na kraju fajla prazno i sl.
-          if (this.datasetFile[i].length != this.datasetFile[0].length)
-            this.datasetFile[i].pop();
-          else
-            break; //nema potrebe dalje
-        }*/
+        //for (let i = this.datasetFile.length - 1; i >= 0; i--) {  //moguce da je vise redova na kraju fajla prazno i sl.
+          //if (this.datasetFile[i].length != this.datasetFile[0].length)
+            //this.datasetFile[i].pop();
+          //else
+          //  break; //nema potrebe dalje
+        //}
         //console.log(this.datasetFile);
         this.resetCbsAndRbs();
         this.refreshThreeNullValueRadioOptions();
-        this.selectedDatasetLoaded = true;
+        //this.selectedDatasetLoaded = true;
         this.scrollToNextForm();
       }
     });
     //this.datasetHasHeader = false;
-  }
+  }*/
 
   scrollToNextForm() {
     (<HTMLSelectElement>document.getElementById("selectInAndOuts")).scrollIntoView({
@@ -267,7 +265,7 @@ export class AddModelComponent implements OnInit {
     });
   }
 
-  resetSelectedDataset(): boolean {
+  /*resetSelectedDataset(): boolean {
     const temp = this.selectedDataset;
     this.selectedDataset = this.otherDataset;
     this.otherDataset = temp;
@@ -275,7 +273,7 @@ export class AddModelComponent implements OnInit {
     this.datasetFile = this.otherDatasetFile;
     this.otherDatasetFile = tempFile;
     return true;
-  }
+  }*/
   resetCbsAndRbs(): boolean {
     this.uncheckRbs();
     this.checkAllCbs();
@@ -345,7 +343,7 @@ export class AddModelComponent implements OnInit {
       let colIndex = this.findColIndexByName(colName);
       let sumOfNulls = 0;
 
-      let startValue = (this.datasetLoadComponent?.dataset.hasHeader) ? 1 : 0;
+      let startValue = (this.selectedDataset!.hasHeader) ? 1 : 0;
       for (let i = startValue; i < this.datasetFile.length; i++) {
         if (this.datasetFile[i][colIndex] == "" || this.datasetFile[i][colIndex] == undefined)
           ++sumOfNulls;
@@ -360,7 +358,7 @@ export class AddModelComponent implements OnInit {
       let sum = 0;
       let n = 0;
 
-      let startValue = (this.datasetLoadComponent?.dataset.hasHeader) ? 1 : 0;
+      let startValue = (this.selectedDataset!.hasHeader) ? 1 : 0;
       for (let i = startValue; i < this.datasetFile.length; i++)
         if (this.datasetFile[i][colIndex] != '') {
           sum += Number(this.datasetFile[i][colIndex]);
@@ -467,9 +465,13 @@ export class AddModelComponent implements OnInit {
 
   arrayColumn = (arr: any[][], n: number) => [...this.dropEmptyString(new Set(arr.map(x => x[n])))];
 
-  dropEmptyString(set: Set<string>): Set<string> {
+  dropEmptyString(set: Set<any>): Set<string> {
     if (set.has(""))
       set.delete("");
+    if (set.has(null))
+      set.delete(null);
+    if (set.has(undefined))
+      set.delete(undefined);
     return set;
   }
 
diff --git a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.html b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.html
index a4ab6e2c..27e06884 100644
--- a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.html
+++ b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.html
@@ -5,7 +5,9 @@
         <div class="row mt-3 mb-2 d-flex justify-content-center">
     
     <div class="col-sm-6" style="margin-bottom: 10px;">
+      <p class="glyphicon glyphicon-search"></p>
     <input type="text" class="form-control" placeholder="Pretraga" [(ngModel)]="term">
+    
     </div>
 
             <div class="row">
@@ -14,7 +16,7 @@
                     <div class="card-body">
                       <h3 class="card-title"><b>{{predictor.name}}</b></h3>
                       <p class="card-text">{{predictor.description}}</p>
-                      <a  class="btn btn-primary" (click)="openPredictor(predictor._id)">Otvori</a>
+                      <a  class="btn btn-primary" (click)="openPredictor(predictor._id)">Iskoristi</a>
                     </div>
                     <div class="card-footer text-muted">
                         Kreirao: {{predictor.username}} <br>
diff --git a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.ts b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.ts
index 4f96fc36..891b3cab 100644
--- a/frontend/src/app/_pages/browse-predictors/browse-predictors.component.ts
+++ b/frontend/src/app/_pages/browse-predictors/browse-predictors.component.ts
@@ -20,7 +20,7 @@ export class BrowsePredictorsComponent implements OnInit {
   ngOnInit(): void {
   }
   openPredictor(id:string):void{
-    this.router.navigateByUrl('/predict?id='+id);
+    this.router.navigate(['predict/'+id]);
   };
 
 }
diff --git a/frontend/src/app/_pages/filter-datasets/filter-datasets.component.ts b/frontend/src/app/_pages/filter-datasets/filter-datasets.component.ts
index b75decf2..fc146046 100644
--- a/frontend/src/app/_pages/filter-datasets/filter-datasets.component.ts
+++ b/frontend/src/app/_pages/filter-datasets/filter-datasets.component.ts
@@ -4,6 +4,7 @@ import Dataset from 'src/app/_data/Dataset';
 import {Router} from '@angular/router'
 import { JwtHelperService } from '@auth0/angular-jwt';
 import { CookieService } from 'ngx-cookie-service';
+import shared from 'src/app/Shared';
 
 @Component({
   selector: 'app-filter-datasets',
@@ -12,6 +13,7 @@ import { CookieService } from 'ngx-cookie-service';
 })
 export class FilterDatasetsComponent implements OnInit {
 
+  shared = shared;
   publicDatasets?: Dataset[];
   term: string = "";
   constructor(private datasets: DatasetsService,private router:Router, private cookie: CookieService) {
@@ -37,11 +39,9 @@ export class FilterDatasetsComponent implements OnInit {
     if(name!=null && name!="")
     this.datasets.addDataset(newDataset).subscribe((response:string)=>{
       console.log(response);
-      alert("Uspenso ste dodali dataset sa imenom "+newDataset.name);
+      shared.openDialog("Obaveštenje", "Uspešno ste dodali dataset sa nazivom " + newDataset.name);
     },(error)=>{
-      alert("Vec imate dataset sa istim imenom molim vas unesite drugo ime");
-      
-
+      shared.openDialog("Obaveštenje", "U svojoj kolekciji već imate dataset sa ovim imenom. Molimo Vas da unesete drugo ime.");
     });
   
   };
diff --git a/frontend/src/app/_pages/my-datasets/my-datasets.component.html b/frontend/src/app/_pages/my-datasets/my-datasets.component.html
index 623b9ac8..2e17201d 100644
--- a/frontend/src/app/_pages/my-datasets/my-datasets.component.html
+++ b/frontend/src/app/_pages/my-datasets/my-datasets.component.html
@@ -1,5 +1,37 @@
-<ul class="list-group my-2">
-    <li class="list-group-item" *ngFor="let dataset of myDatasets">
-        <app-item-dataset [dataset]="dataset"></app-item-dataset>
-    </li>
-</ul>
\ No newline at end of file
+<div id="wrapper">
+    <div id="container" class="container p-5" style="background-color: white; min-height: 100%;">
+        <div class="row mt-3 mb-2 d-flex justify-content-center">
+        
+        <div class="col-sm-6" style="margin-bottom: 10px;">
+        </div>
+        
+            <div class="row">
+                <div class="col-sm-4" style="margin-bottom: 10px;" *ngFor="let dataset of myDatasets">
+                <app-item-dataset [dataset]="dataset"></app-item-dataset>
+                
+                <div class="panel-footer row"><!-- panel-footer -->
+                    <div class="col-xs-6 text-center">
+                        <div>
+                          <button type="button" class="btn btn-default btn-lg" mat-raised-button color="primary" (click)="deleteThisDataset(dataset)">Obriši
+                            <span class="glyphicon glyphicon-chevron-right"></span>
+                        </button>
+                        </div>
+                    </div>
+                </div><!-- end panel-footer -->
+
+                
+                
+                </div>
+            </div>
+        <div class="text-center" *ngIf="this.myDatasets.length == 0" >
+        <h2>Nema rezultata</h2>
+        </div>
+        </div>
+    
+    </div>
+    
+    
+    
+    
+    
+    </div>
diff --git a/frontend/src/app/_pages/my-datasets/my-datasets.component.ts b/frontend/src/app/_pages/my-datasets/my-datasets.component.ts
index 13b0c47b..eb5e32f8 100644
--- a/frontend/src/app/_pages/my-datasets/my-datasets.component.ts
+++ b/frontend/src/app/_pages/my-datasets/my-datasets.component.ts
@@ -1,5 +1,9 @@
 import { Component, OnInit } from '@angular/core';
+import {Router} from '@angular/router';
+import { DatasetsService } from 'src/app/_services/datasets.service';
 import Dataset from 'src/app/_data/Dataset';
+import { JwtHelperService } from '@auth0/angular-jwt';
+import { CookieService } from 'ngx-cookie-service';
 
 @Component({
   selector: 'app-my-datasets',
@@ -7,18 +11,47 @@ import Dataset from 'src/app/_data/Dataset';
   styleUrls: ['./my-datasets.component.css']
 })
 export class MyDatasetsComponent implements OnInit {
+  myDatasets: Dataset[] = [];
 
-  myDatasets?: Dataset[];
+  constructor(private datasetsS : DatasetsService) {
 
-  constructor() {
-    this.myDatasets = [
-      new Dataset('Titanik', 'Opis titanik', ['K1', 'K2', 'K3', 'Ime', 'Preziveli']),
-      new Dataset('Neki drugi set', 'opis', ['a', 'b', 'c']),
-      new Dataset('Treci set', 'opis', ['a', 'b', 'c'])
-    ];
-  }
+    
+
+     }
 
   ngOnInit(): void {
+    this.datasetsS.getMyDatasets();
+
+  }
+/*
+  editModel(): void{
+    this.modelsS.editModel().subscribe(m => {
+      this.myModel = m;
+
+    })
+  }
+*/
+
+deleteThisDataset(dataset: Dataset): void{
+  console.log("OK");
+  this.datasetsS.deleteDataset(dataset).subscribe((response) => {
+    console.log("OBRISANO JE", response);
+    //na kraju uspesnog
+    this.getAllMyDatasets();
+  }, (error) =>{
+      if (error.error == "Dataset with name = {name} deleted") {
+        alert("Greška pri brisanju dataseta!");
+      }
+    });
+
+}
+
+  getAllMyDatasets(): void{
+    this.datasetsS.getMyDatasets().subscribe(m => {
+      
+      this.myDatasets = m;
+      console.log(this.myDatasets);
+    });
   }
 
 }
diff --git a/frontend/src/app/_pages/my-models/my-models.component.html b/frontend/src/app/_pages/my-models/my-models.component.html
index e2533d89..4aebc1f2 100644
--- a/frontend/src/app/_pages/my-models/my-models.component.html
+++ b/frontend/src/app/_pages/my-models/my-models.component.html
@@ -8,12 +8,22 @@
             <div class="row">
                 <div class="col-sm-4" style="margin-bottom: 10px;" *ngFor="let model of myModels">
                 <app-item-model [model]="model"></app-item-model>
-                <app-annvisual align-items-center [model]="model" style="width: 100%;"></app-annvisual>
-                <div style="width: 25%; margin: auto;">
-                    <button mat-raised-button color="primary" (click)="deleteThisModel(model)" style="margin-top: 3px; width: 100%;">Obriši</button>
-                    
-                    <button mat-raised-button color="primary" (click)="deleteThisModel(model)" style="margin-top: 3px; width: 100%;">Koristi</button>
-                </div>
+                
+                <div class="panel-footer row"><!-- panel-footer -->
+                    <div class="col-xs-6 text-center">
+                        <div>
+                          <button type="button" class="btn btn-default btn-lg" (click)="deleteThisModel(model)" mat-raised-button color="primary">Koristi
+                              <span class="glyphicon glyphicon-search"></span>
+                          </button>
+                          <button type="button" class="btn btn-default btn-lg" mat-raised-button color="primary" (click)="deleteThisModel(model)">Obriši
+                            <span class="glyphicon glyphicon-chevron-right"></span>
+                        </button>
+                        </div>
+                    </div>
+                </div><!-- end panel-footer -->
+
+                
+                
                 </div>
             </div>
         <div class="text-center" *ngIf="this.myModels.length == 0" >
diff --git a/frontend/src/app/_pages/my-models/my-models.component.ts b/frontend/src/app/_pages/my-models/my-models.component.ts
index bd6b0a2b..6086b1b1 100644
--- a/frontend/src/app/_pages/my-models/my-models.component.ts
+++ b/frontend/src/app/_pages/my-models/my-models.component.ts
@@ -1,4 +1,5 @@
 import { Component, OnInit } from '@angular/core';
+import shared from 'src/app/Shared';
 import Model from 'src/app/_data/Model';
 import { ModelsService } from 'src/app/_services/models.service';
 
@@ -38,7 +39,7 @@ deleteThisModel(model: Model): void{
     this.getAllMyModels();
   }, (error) =>{
       if (error.error == "Model with name = {name} deleted") {
-        alert("Greška pri brisanju modela!");
+        shared.openDialog("Obaveštenje", "Greška prilikom brisanja modela.");
       }
     });
 
diff --git a/frontend/src/app/_pages/my-predictors/my-predictors.component.html b/frontend/src/app/_pages/my-predictors/my-predictors.component.html
index d739f561..3746d35e 100644
--- a/frontend/src/app/_pages/my-predictors/my-predictors.component.html
+++ b/frontend/src/app/_pages/my-predictors/my-predictors.component.html
@@ -7,7 +7,7 @@
         <app-item-predictor [predictor]="predictor"></app-item-predictor>
     </div>
     <div>
-        <button (click)="delete()" mat-raised-button color="warn" style="min-width: 15rem;float: right" ><mat-icon>delete</mat-icon></button>
+        <button (click)="delete(predictor)" mat-raised-button color="warn" style="min-width: 15rem;float: right" ><mat-icon>delete</mat-icon></button>
     </div>
     
 </div>
diff --git a/frontend/src/app/_pages/my-predictors/my-predictors.component.ts b/frontend/src/app/_pages/my-predictors/my-predictors.component.ts
index 58daa44f..13cfdab2 100644
--- a/frontend/src/app/_pages/my-predictors/my-predictors.component.ts
+++ b/frontend/src/app/_pages/my-predictors/my-predictors.component.ts
@@ -1,5 +1,6 @@
 import { Component, OnInit } from '@angular/core';
 import Predictor from 'src/app/_data/Predictor';
+import { PredictorsService } from 'src/app/_services/predictors.service';
 
 @Component({
   selector: 'app-my-predictors',
@@ -7,22 +8,38 @@ import Predictor from 'src/app/_data/Predictor';
   styleUrls: ['./my-predictors.component.css']
 })
 export class MyPredictorsComponent implements OnInit {
-  predictors: Predictor[];
-  constructor() { 
-  this.predictors = [
-    new Predictor('Titanik', 'Opis titanik', ['K1', 'K2', 'K3', 'Ime', 'Preziveli'],'Preziveli'),
-    new Predictor('Neki drugi set', 'opis', ['a', 'b', 'c'],'c'),
-    new Predictor('Preživeli', 'Za uneto ime osobe, predvidja da li je ta osoba preživela ili ne.', ['Ime'], 'OsobaJePreživela'),
-    new Predictor('Drugi model', 'Lorem ipsum dolor sir amet', ['kruska'], 'jagoda')];
+  predictors: Predictor[] = [];
+  constructor(private predictorsS : PredictorsService) {
   }
   ngOnInit(): void {
+    this.getAllMyPredictors();
+
   }
 
-  delete(){
-    confirm("IZABRANI MODEL ĆE BITI IZBRISAN")
+  delete(predictor: Predictor){
+    if(window.confirm("IZABRANI MODEL ĆE BITI IZBRISAN"))
+      {
+      this.predictorsS.deletePredictor(predictor).subscribe((response) => {
+        console.log("OBRISANOOO JEE", response);
+        //na kraju uspesnog
+        this.getAllMyPredictors();
+      }, (error) =>{
+          if (error.error == "Predictor with name = {name} deleted") {
+            alert("Greška pri brisanju modela!");
+          }
+        });
+    }
+    
     
   }
-  
+
+  getAllMyPredictors(): void{
+    this.predictorsS.getMyPredictors().subscribe(m => {
+      
+      this.predictors = m;
+      console.log(this.predictors);
+    });
+  }
 
 
 }
diff --git a/frontend/src/app/_pages/predict/predict.component.css b/frontend/src/app/_pages/predict/predict.component.css
index e69de29b..dab059a5 100644
--- a/frontend/src/app/_pages/predict/predict.component.css
+++ b/frontend/src/app/_pages/predict/predict.component.css
@@ -0,0 +1,3 @@
+#wrapper {
+    color: #003459;
+}
\ No newline at end of file
diff --git a/frontend/src/app/_pages/predict/predict.component.html b/frontend/src/app/_pages/predict/predict.component.html
index fe17c96d..13afa8e4 100644
--- a/frontend/src/app/_pages/predict/predict.component.html
+++ b/frontend/src/app/_pages/predict/predict.component.html
@@ -18,8 +18,25 @@
             <div>
                 <label for="output" class="col-sm-5 col-form-label">Opis prediktora: <b>{{predictor.description}}</b></label>
             </div>
+
+            
+        </div>
+    <br>
+        <label for="type" class="form-check-label" ><b>Informacije o prediktoru</b></label>
+        <div class="col-5 mt-2">
+            <label for="type" class="form-check-label"  >Prediktor {{predictor.isPublic?"je":"nije"}} javni.</label>
+        </div>
+        <div class="col-5 mt-2">
+            <label for="type" class="form-check-label" >Prediktor {{predictor.accessibleByLink?"je":"nije"}} dostupan za deljenje.</label>
+        </div>
+        <br>
+        <div class="col-2">
+            <label for="dateCreated" class="col-form-label">Datum:</label> 
+            <input type="text" class="form-control-plaintext" id="dateCreated" placeholder="--/--/--"
+                value="{{predictor.dateCreated | date: 'dd/MM/yyyy'}}" readonly>
         </div>
 
+
         <br>
         <div >
             <!--input -->
@@ -28,44 +45,20 @@
                 <div *ngIf="predictor" class="form-group row mt-3 mb-2 d-flex justify-content-left">
                     <div *ngFor="let input of predictor.inputs; let i = index">
                         <label for="{{input}}" class="col-sm-2 col-form-label"><b>{{input}}</b></label>
-                        <input name="{{input}}"  type="text"  [(ngModel)]="inputs[i]" >
+                        <input name="{{input}}"  type="text"  [(ngModel)]="inputs[i].value" >
 
                     </div>
                     
                 </div>
             </div>
            
-            
+            <br>    
 
         </div>
         <div>
             <label for="output" class="col-sm-2 col-form-label">Izlaz: <b>{{predictor.output}}</b></label>
         </div>
-        <br>
-        <br>
-        <br>
-        <br>
-        <br>
-
-        <div class="col-5 mt-2">
-            <label for="type" class="form-check-label">Da li je prediktor javan?</label>
-            <input class="mx-3 form-check-input" type="checkbox" [(ngModel)]="predictor.isPublic"
-                type="checkbox" value="" >
-        </div>
-        <div class="col-5 mt-2">
-            <label for="type" class="form-check-label">Da li je dostupan za deljenje?</label>
-            <input class="mx-3 form-check-input" type="checkbox" [(ngModel)]="predictor.accessibleByLink"
-                type="checkbox" value="" >
-        </div>
-        <br>
-        <div class="col-2">
-            <label for="dateCreated" class="col-form-label">Datum:</label> 
-            <input type="text" class="form-control-plaintext" id="dateCreated" placeholder="--/--/--"
-                value="{{predictor.dateCreated | date: 'dd/MM/yyyy'}}" readonly>
-        </div>
-
         
-        <br><br>
         <div class="form-group row mt-5 mb-3">
             <div class="col"></div>
             <button class="btn btn-lg col-4" style="background-color:#003459; color:white;"
diff --git a/frontend/src/app/_pages/predict/predict.component.ts b/frontend/src/app/_pages/predict/predict.component.ts
index 3f431fff..1c1c7425 100644
--- a/frontend/src/app/_pages/predict/predict.component.ts
+++ b/frontend/src/app/_pages/predict/predict.component.ts
@@ -2,6 +2,7 @@ import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import Predictor from 'src/app/_data/Predictor';
 import { PredictorsService } from 'src/app/_services/predictors.service';
+import shared from 'src/app/Shared';
 
 @Component({
   selector: 'app-predict',
@@ -10,7 +11,8 @@ import { PredictorsService } from 'src/app/_services/predictors.service';
 })
 export class PredictComponent implements OnInit {
 
-  inputs : String[] = [];
+  inputs : Column[] = [];
+
 
   predictor:Predictor;
   constructor(private predictS : PredictorsService, private route: ActivatedRoute) {
@@ -22,6 +24,7 @@ export class PredictComponent implements OnInit {
       this.predictS.getPredictor(url["id"]).subscribe(p => {
       
         this.predictor = p;
+        this.predictor.inputs.forEach((p,index)=> this.inputs[index] = new Column(p, ""));
         console.log(this.predictor);
       })
     });
@@ -29,9 +32,16 @@ export class PredictComponent implements OnInit {
 
   usePredictor(): void{ 
     this.predictS.usePredictor(this.predictor, this.inputs).subscribe(p => {
-      
-      alert("Uspesno ste poslali preditor!");
+      shared.openDialog("Obaveštenje", "Prediktor je uspešno poslat na probu."); //pisalo je "na treniranje" ??
     })
     console.log(this.inputs);
   }
 }
+
+
+export class Column {
+  constructor(
+    public name : string, 
+    public value : (number | string)){
+  }
+}
\ No newline at end of file
diff --git a/frontend/src/app/_pages/profile/profile.component.html b/frontend/src/app/_pages/profile/profile.component.html
index d082a003..557d69fd 100644
--- a/frontend/src/app/_pages/profile/profile.component.html
+++ b/frontend/src/app/_pages/profile/profile.component.html
@@ -30,12 +30,14 @@
                                     <label class="small mb-1" for="inputPassword">Važeća lozinka</label>
                                     <input class="form-control" id="inputPassword" name="inputPassword" type="password" [(ngModel)]="this.oldPass" placeholder="Trenutna lozinka">
                                     <small *ngIf="wrongPassBool" class="form-text text-danger">Neispravna lozinka.</small>
+                                    <small *ngIf="wrongOldPassBool" class="form-text text-danger">Pogrešan format.</small>
                                 </div>
                                 <!-- Form Group (new password)-->
                                 <div class="col-md-6">
                                     <label class="small mb-1" for="inputNewPassword">Nova lozinka</label>
                                     <input class="form-control" id="inputNewPassword" name="inputNewPassword" type="password" [(ngModel)]="this.newPass1" placeholder="Ukucaj novu lozinku">
                                     <small *ngIf="wrongNewPassBool" class="form-text text-danger">Lozinke se ne podudaraju.</small>
+                                    <small *ngIf="wrongNewPass1Bool" class="form-text text-danger">Pogrešan format.</small>
                                 </div>
                             </div>
     
@@ -52,6 +54,7 @@
                                     <label class="small mb-1" for="inputNewPasswordAgain">Ponovo nova lozinka</label>
                                     <input class="form-control" id="inputNewPasswordAgain" name="inputNewPasswordAgain" type="password" [(ngModel)]="this.newPass2" placeholder="Ukucaj novu lozinku">
                                     <small *ngIf="wrongNewPassBool" class="form-text text-danger">Lozinke se ne podudaraju.</small>
+                                    <small *ngIf="wrongNewPass2Bool" class="form-text text-danger">Pogrešan format.</small>
                                 </div>
                             </div>
                         </div>
@@ -73,11 +76,13 @@
                             <div class="col-md-6">
                                 <label class="small mb-1" for="inputUsername">Korisničko ime (kako će ostali korisnici videti tvoje ime)</label>
                                 <input class="form-control" id="inputUsername" name="inputUsername" type="text" [(ngModel)]="this.username">
+                                <small *ngIf="wrongUsernameBool" class="form-text text-danger">Pogrešan format.</small>
                             </div>
                             <!-- Form Group (email address)-->
                             <div class="col-md-6">
                                 <label class="small mb-1" for="inputEmailAddress">Email adresa</label>
                                 <input class="form-control" id="inputEmailAddress" name="inputEmailAddress" type="email" [(ngModel)]="this.email">
+                                <small *ngIf="wrongEmailBool" class="form-text text-danger">Pogrešan format.</small>
                             </div>
                         </div>
 
@@ -87,11 +92,13 @@
                             <div class="col-md-6">
                                 <label class="small mb-1" for="inputFirstName">Ime</label>
                                 <input class="form-control" id="inputFirstName" name="inputFirstName" type="text" [(ngModel)]="this.firstName">
+                                <small *ngIf="wrongFirstNameBool" class="form-text text-danger">Pogrešan format.</small>
                             </div>
                             <!-- Form Group (last name)-->
                             <div class="col-md-6">
                                 <label class="small mb-1" for="inputLastName">Prezime</label>
                                 <input class="form-control" id="inputLastName" name="inputLastName" type="text" [(ngModel)]="this.lastName">
+                                <small *ngIf="wrongLastNameBool" class="form-text text-danger">Pogrešan format.</small>
                             </div>
                         </div>
 
diff --git a/frontend/src/app/_pages/profile/profile.component.ts b/frontend/src/app/_pages/profile/profile.component.ts
index 3e9a0d11..d055fad3 100644
--- a/frontend/src/app/_pages/profile/profile.component.ts
+++ b/frontend/src/app/_pages/profile/profile.component.ts
@@ -6,6 +6,7 @@ import { Router } from '@angular/router';
 import { PICTURES } from 'src/app/_data/ProfilePictures';
 import { Picture } from 'src/app/_data/ProfilePictures';
 import shared from '../../Shared';
+import { share } from 'rxjs';
 
 
 @Component({
@@ -71,6 +72,9 @@ export class ProfileComponent implements OnInit {
   }
 
   saveInfoChanges() {
+    if (!(this.checkInfoChanges())) //nije prosao regex
+      return;
+
     let editedUser: User = {
       _id: this.user._id,
       username: this.username,
@@ -84,18 +88,20 @@ export class ProfileComponent implements OnInit {
     this.userInfoService.changeUserInfo(editedUser).subscribe((response: any) =>{
       if (this.user.username != editedUser.username) { //promenio username, ide logout
         this.user = editedUser;
-        alert("Nakon promene korisničkog imena, moraćete ponovo da se ulogujete.");
+        this.resetInfo();
+        shared.openDialog("Obaveštenje", "Nakon promene korisničkog imena, moraćete ponovo da se ulogujete.");
         this.authService.logOut();
         this.router.navigate(['']);
         return;
       }
+      shared.openDialog("Obaveštenje", "Podaci su uspešno promenjeni.");
       this.user = editedUser;
       console.log(this.user);
       this.resetInfo();
     }, (error: any) =>{
       if (error.error == "Username already exists!") {
-        alert("Ukucano korisničko ime je već zauzeto!\nIzaberite neko drugo.");
-        (<HTMLSelectElement>document.getElementById("inputUsername")).focus();
+        shared.openDialog("Obaveštenje", "Ukucano korisničko ime je već zauzeto! Izaberite neko drugo.");
+        //(<HTMLSelectElement>document.getElementById("inputUsername")).focus();
         //poruka obavestenja ispod inputa
         this.resetInfo();
       }
@@ -103,38 +109,41 @@ export class ProfileComponent implements OnInit {
   }
 
   savePasswordChanges() {
+    this.wrongPassBool = false;
+    this.wrongNewPassBool = false;
+
+    if (!(this.checkPasswordChanges())) //nije prosao regex
+      return;
+
     if (this.newPass1 == '' && this.newPass2 == '') //ne zeli da promeni lozinku
       return;
-    console.log("zeli da promeni lozinku");
+    //console.log("zeli da promeni lozinku");
 
     if (this.newPass1 != this.newPass2) { //netacno ponovio novu lozinku
       this.wrongNewPassBool = true;
       this.resetNewPassInputs();
-      console.log("Netacno ponovljena lozinka");
+      //console.log("Netacno ponovljena lozinka");
       return;
     }
 
-    this.wrongPassBool = false;
-    this.wrongNewPassBool = false;
-
     let passwordArray: string[] = [this.oldPass, this.newPass1];
     this.userInfoService.changeUserPassword(passwordArray).subscribe((response: any) => {
-      console.log("PROMENIO LOZINKU");
+      //console.log("PROMENIO LOZINKU");
       this.resetNewPassInputs();
-      alert("Nakon promene lozinke, moraćete ponovo da se ulogujete.");
+      shared.openDialog("Obaveštenje", "Nakon promene lozinke, moraćete ponovo da se ulogujete.");
       this.authService.logOut();
       this.router.navigate(['']);
     }, (error: any) => {
       console.log("error poruka: ", error.error);
       if (error.error == 'Wrong old password!') {
         this.wrongPassBool = true;
-        (<HTMLSelectElement>document.getElementById("inputPassword")).focus();
+        //(<HTMLSelectElement>document.getElementById("inputPassword")).focus();
         return;
       }
       else if (error.error == 'Identical password!') {
-        alert("Stara i nova lozinka su identične.");
+        shared.openDialog("Obaveštenje", "Stara i nova lozinka su identične."); 
         this.resetNewPassInputs();
-        (<HTMLSelectElement>document.getElementById("inputNewPassword")).focus();
+        //(<HTMLSelectElement>document.getElementById("inputNewPassword")).focus();
         return;
       }
     });
@@ -161,5 +170,95 @@ export class ProfileComponent implements OnInit {
     shared.photoId = this.photoId;
   }
   
+  checkPasswordChanges() : boolean {
+    this.passwordValidation();
+
+    if (!(this.wrongOldPassBool || this.wrongNewPass1Bool || this.wrongNewPass2Bool))
+      return true;
+    return false;
+  }
+  checkInfoChanges() : boolean {
+    this.firstName = this.firstName.trim();
+    this.lastName = this.lastName.trim();
+    this.username = this.username.trim();
+    this.email = this.email.trim();
+
+    this.firstNameValidation();
+    this.lastNameValidation();
+    this.usernameValidation();
+    this.emailValidation();
+
+    if (!(this.wrongUsernameBool || this.wrongEmailBool || this.wrongFirstNameBool || this.wrongLastNameBool))
+      return true;
+    return false;
+  }
+
+  isCorrectName(element: string): boolean {
+    if (this.pattName.test(element) && !(this.pattTwoSpaces.test(element)) && (element.length >= 1 && element.length <= 30))
+      return true;
+    return false;
+  }
+  isCorrectUsername(element: string): boolean {
+    if (this.pattUsername.test(element) && !(this.pattTwoSpaces.test(element)) && (element.length >= 1 && element.length <= 30))
+      return true;
+    return false;
+  }
+  isCorrectEmail(element: string): boolean {
+    if (this.pattEmail.test(element.toLowerCase()) && element.length <= 320)
+      return true;
+    return false;
+  }
+  isCorrectPassword(element: string): boolean {
+    if (this.pattPassword.test(element))
+      return true;
+    return false;
+  }
+  firstNameValidation() {
+    if (this.isCorrectName(this.firstName) == true) {
+      this.wrongFirstNameBool = false;
+      return;
+    }
+    //(<HTMLSelectElement>document.getElementById('firstName')).focus();
+    this.wrongFirstNameBool = true;
+  }
+  lastNameValidation() {
+    if (this.isCorrectName(this.lastName) == true) {
+      this.wrongLastNameBool = false;
+      return;
+    }
+    //(<HTMLSelectElement>document.getElementById('lastName')).focus();
+    this.wrongLastNameBool = true;
+  }
+  usernameValidation() {
+    if (this.isCorrectUsername(this.username) == true) {
+      this.wrongUsernameBool = false;
+      return;
+    }
+    //(<HTMLSelectElement>document.getElementById('username-register')).focus();
+    this.wrongUsernameBool = true;
+  }
+  emailValidation() {
+    if (this.isCorrectEmail(this.email) == true) {
+      this.wrongEmailBool = false;
+      return;
+    }
+    //(<HTMLSelectElement>document.getElementById('email')).focus();
+    this.wrongEmailBool = true;
+  }
+  passwordValidation() {
+    if (this.isCorrectPassword(this.oldPass) && this.isCorrectPassword(this.newPass1) && this.newPass1 == this.newPass2) {
+      this.wrongOldPassBool = false;
+      this.wrongNewPass1Bool = false;
+      this.wrongNewPass2Bool = false;
+      return;
+    }
+    this.oldPass = '';
+    this.newPass1 = '';
+    this.newPass2 = '';
+    //(<HTMLSelectElement>document.getElementById('pass1')).focus();
+    this.wrongOldPassBool = true;
+    this.wrongNewPass1Bool = true;
+    this.wrongNewPass2Bool = true;
+  }
 
 }