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

6 files changed, 66 insertions, 35 deletions

diff --git a/frontend/src/app/_elements/_charts/box-plot/box-plot.component.html b/frontend/src/app/_elements/_charts/box-plot/box-plot.component.html
index 688eafae..3b2bf976 100644
--- a/frontend/src/app/_elements/_charts/box-plot/box-plot.component.html
+++ b/frontend/src/app/_elements/_charts/box-plot/box-plot.component.html
@@ -1,3 +1,3 @@
-<div class="chart-wrapper">
+<div class="chart-wrapper position-relative">
     <canvas #boxplot [width]="width" [height]="height"></canvas>
 </div>
\ No newline at end of file
diff --git a/frontend/src/app/_elements/_charts/line-chart/line-chart.component.html b/frontend/src/app/_elements/_charts/line-chart/line-chart.component.html
index d48212cd..1c711562 100644
--- a/frontend/src/app/_elements/_charts/line-chart/line-chart.component.html
+++ b/frontend/src/app/_elements/_charts/line-chart/line-chart.component.html
@@ -1,4 +1,4 @@
-<div #wrapper style="width:100%;height:95%;">
-    <canvas  id="myChart" #canvas>   
+<div #wrapper class="position-relative" style="width:100%;height:95%;">
+    <canvas id="myChart" #canvas>   
     </canvas>
 </div>
\ No newline at end of file
diff --git a/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.html b/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.html
index 7faf3af0..fe3998ff 100644
--- a/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.html
+++ b/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.html
@@ -1,3 +1,3 @@
-<div class="chart-wrapper">
+<div class="chart-wrapper position-relative">
     <canvas #piechart [width]="width" [height]="height"></canvas>
 </div>
\ No newline at end of file
diff --git a/frontend/src/app/_elements/column-table/column-table.component.css b/frontend/src/app/_elements/column-table/column-table.component.css
index 311773f7..40ae3c05 100644
--- a/frontend/src/app/_elements/column-table/column-table.component.css
+++ b/frontend/src/app/_elements/column-table/column-table.component.css
@@ -13,7 +13,7 @@ table.fixed {
 }
 
 table.fixed td {
-    overflow: hidden;
+    /* overflow: hidden; */
     max-width: 200px;
     min-width: 200px;
     vertical-align: middle;
@@ -21,7 +21,7 @@ table.fixed td {
 }
 
 table.fixed th {
-    overflow: hidden;
+    /* overflow: hidden; */
     max-width: 250px;
     min-width: 120px;
     vertical-align: middle;
diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts
index 9a8cbeee..26228978 100644
--- a/frontend/src/app/_elements/column-table/column-table.component.ts
+++ b/frontend/src/app/_elements/column-table/column-table.component.ts
@@ -114,20 +114,11 @@ export class ColumnTableComponent implements AfterViewInit {
         else
           this.columnsChecked.push(false);
       });
-      this.nullValOption = [];
+      //this.nullValOption = [];
       for (let i = 0; i < this.dataset!.columnInfo.length; i++) {
-        let nullValRep = this.experiment.nullValuesReplacers.find(x => x.column == this.dataset!.columnInfo[i].columnName);
-        if (nullValRep != undefined) {
-          if (nullValRep.option == NullValueOptions.DeleteRows)
-            this.nullValOption.push(`Obriši redove (${this.dataset.columnInfo[i].numNulls})`);
-          else if (nullValRep.option == NullValueOptions.DeleteColumns)
-          this.nullValOption.push(`Obriši kolonu`);
-          else {
-            this.nullValOption.push(`Popuni sa ${nullValRep.value}`);
-          }
-        }
-        else 
-          this.nullValOption.push(`Obriši redove (${this.dataset.columnInfo[i].numNulls})`);
+        //let nullValRep = this.experiment.nullValuesReplacers.find(x => x.column == this.dataset!.columnInfo[i].columnName);
+        let nullValRep = this.experiment.nullValuesReplacers[i];
+        this.nullValOption[i] = (nullValRep.option == NullValueOptions.DeleteRows) ? `Obriši redove (${this.dataset.columnInfo[i].numNulls})` : ((nullValRep.option == NullValueOptions.DeleteColumns) ? `Isključi kolonu` : `Popuni sa ${nullValRep.value}`);
       }
     }
     this.resetPagging();
@@ -171,10 +162,10 @@ export class ColumnTableComponent implements AfterViewInit {
   }
 
   setDeleteRowsForMissingValTreatment() {
-    if (this.experiment != undefined) {
+    if (this.experiment != undefined && this.dataset != undefined) {
       this.experiment.nullValues = NullValueOptions.DeleteRows;
       this.experiment.nullValuesReplacers = [];
-      for (let i = 0; i < this.experiment.inputColumns.length; i++) {
+      for (let i = 0; i < this.dataset?.columnInfo.length; i++) {
         this.experiment.nullValuesReplacers.push({
           column: this.experiment.inputColumns[i],
           option: NullValueOptions.DeleteRows,
@@ -204,13 +195,17 @@ export class ColumnTableComponent implements AfterViewInit {
         }
         if (this.experiment.inputColumns.length == 1)
           this.experiment.outputColumn = this.experiment.inputColumns[0];
+
+        let index = this.dataset?.columnInfo.findIndex(x => x.columnName == columnName)!;
+        this.nullValOption[index] = (this.experiment.nullValuesReplacers[index].option == NullValueOptions.DeleteRows) ? "Obriši redove (" + this.dataset?.columnInfo[index].numNulls + ")" : "Popuni sa " + this.experiment.nullValuesReplacers[index].value;
       }
       else {
         this.experiment.inputColumns = this.experiment.inputColumns.filter(x => x != columnName);
         //console.log("Input columns: ", this.experiment.inputColumns);
         //TODO: da se zatamni kolona koja je unchecked
         //this.experiment.encodings = this.experiment.encodings.filter(x => x.columnName != columnName); samo na kraju iz enkodinga skloni necekirane
-        this.experiment.nullValuesReplacers = this.experiment.nullValuesReplacers.filter(x => x.column != columnName);
+        let index = this.dataset?.columnInfo.findIndex(x => x.columnName == columnName)!;
+        this.nullValOption[index] = "Isključi kolonu";
         if (columnName == this.experiment.outputColumn) {
           if (this.experiment.inputColumns.length > 0)
             this.experiment.outputColumn = this.experiment.inputColumns[0];
@@ -224,11 +219,12 @@ export class ColumnTableComponent implements AfterViewInit {
 
   outputColumnChanged() {
     let outputColReplacer = this.experiment.nullValuesReplacers.find(x => x.column == this.experiment.outputColumn);
-    let index = this.experiment.nullValuesReplacers.findIndex(x => x.column == this.experiment.outputColumn);
+    //let index = this.experiment.nullValuesReplacers.findIndex(x => x.column == this.experiment.outputColumn);
     if (outputColReplacer != undefined) {
       outputColReplacer.option = NullValueOptions.DeleteRows;
       
       let numOfRowsToDelete = (this.dataset!.columnInfo.filter(x => x.columnName == this.experiment.outputColumn)[0]).numNulls;
+      let index = this.dataset!.columnInfo.findIndex(x => x.columnName == this.experiment.outputColumn);
       this.nullValOption[index] = "Obriši redove (" + numOfRowsToDelete + ")";
     }
 
@@ -285,7 +281,16 @@ export class ColumnTableComponent implements AfterViewInit {
     if (this.experiment != undefined && this.dataset != undefined) {
 
       if (selectedMissingValuesOption == NullValueOptions.DeleteColumns) {
-        this.experiment.nullValues = NullValueOptions.DeleteColumns;
+        for (let i = 0; i < this.dataset.columnInfo.length; i++) {
+          if (this.dataset.columnInfo[i].numNulls > 0 && this.dataset.columnInfo[i].columnName != this.experiment.outputColumn) {
+            this.experiment.inputColumns = this.experiment.inputColumns.filter(x => x != this.dataset!.columnInfo[i].columnName);
+            this.columnsChecked[i] = false;
+            console.log(this.dataset!.columnInfo[i].columnName);
+
+            this.nullValOption[i] = "Isključi kolonu";
+          }
+        }
+        /*this.experiment.nullValues = NullValueOptions.DeleteColumns;
 
         let outputColReplacer = this.experiment.nullValuesReplacers.find(x => x.column == this.experiment.outputColumn);
 
@@ -297,16 +302,18 @@ export class ColumnTableComponent implements AfterViewInit {
               option: NullValueOptions.DeleteColumns,
               value: ""
             });
-            this.nullValOption[i] = "Obriši kolonu";
+            let colIndex = this.dataset.columnInfo.findIndex(x => x.columnName == this.experiment.inputColumns[i]);
+            this.nullValOption[colIndex] = "Isključi kolonu";
           }
           else {
             if (outputColReplacer != undefined) {
               this.experiment.nullValuesReplacers.push(outputColReplacer);
               let numOfRowsToDelete = (this.dataset.columnInfo.filter(x => x.columnName == this.experiment!.inputColumns[i])[0]).numNulls;
-              this.nullValOption[i] = (outputColReplacer.option == NullValueOptions.DeleteRows) ? "Obriši redove (" + numOfRowsToDelete + ")" : "Popuni sa " + outputColReplacer.value + "";
+              let colIndex = this.dataset.columnInfo.findIndex(x => x.columnName == this.experiment.inputColumns[i]);
+              this.nullValOption[colIndex] = (outputColReplacer.option == NullValueOptions.DeleteRows) ? "Obriši redove (" + numOfRowsToDelete + ")" : "Popuni sa " + outputColReplacer.value + "";
             }
           }
-        }
+        }*/
         //obrisi kolone koje sadrze nedostajuce vrednosti iz input kolona 
         /*for (let i = 0; i < this.dataset.columnInfo.length; i++) {
           if (this.dataset.columnInfo[i].numNulls > 0) {
@@ -326,7 +333,8 @@ export class ColumnTableComponent implements AfterViewInit {
             value: ""
           });
           let numOfRowsToDelete = (this.dataset.columnInfo.filter(x => x.columnName == this.experiment!.inputColumns[i])[0]).numNulls;
-          this.nullValOption[i] = "Obriši redove (" + numOfRowsToDelete + ")";
+          let colIndex = this.dataset.columnInfo.findIndex(x => x.columnName == this.experiment.inputColumns[i]);
+          this.nullValOption[colIndex] = "Obriši redove (" + numOfRowsToDelete + ")";
         }
       }
       this.columnTableChangeDetected();
@@ -369,7 +377,16 @@ export class ColumnTableComponent implements AfterViewInit {
 
   MissValsDeleteClicked(event: Event, replacementType: NullValueOptions, index: number) {
     if (this.experiment != undefined && this.dataset != undefined) {
-      let columnName = (<HTMLInputElement>event.currentTarget).value;
+
+        this.experiment.nullValuesReplacers[index].option = NullValueOptions.DeleteRows;
+        this.experiment.nullValuesReplacers[index].value = "";
+
+        this.nullValOption[index] = "Obriši redove (" + this.dataset.columnInfo[index].numNulls + ")";
+
+        this.columnTableChangeDetected();
+    }
+
+      /*let columnName = (<HTMLInputElement>event.currentTarget).value;
       let arrayElement = this.experiment.nullValuesReplacers.filter(x => x.column == columnName)[0];
 
       if (arrayElement == undefined) {
@@ -385,14 +402,21 @@ export class ColumnTableComponent implements AfterViewInit {
       }
 
       let numOfRowsToDelete = (this.dataset.columnInfo.filter(x => x.columnName == this.experiment!.inputColumns[index])[0]).numNulls;
-      this.nullValOption[index] = (replacementType == NullValueOptions.DeleteColumns) ? "Obriši kolonu" : "Obriši redove (" + numOfRowsToDelete + ")";
+      this.nullValOption[index] = (replacementType == NullValueOptions.DeleteColumns) ? "Isključi kolonu" : "Obriši redove (" + numOfRowsToDelete + ")";
       this.columnTableChangeDetected();
-    }
+    }*/
   }
 
   MissValsReplaceClicked(event: Event, columnName: string, index: number) {
     if (this.experiment != undefined) {
-      let fillValue = (<HTMLInputElement>event.currentTarget).value;
+      this.experiment.nullValuesReplacers[index].option = NullValueOptions.Replace;
+      let value = (<HTMLInputElement>event.currentTarget).value;
+      this.experiment.nullValuesReplacers[index].value = value;
+      this.nullValOption[index] = "Popuni sa " + value;
+
+      this.columnTableChangeDetected();
+
+      /*let fillValue = (<HTMLInputElement>event.currentTarget).value;
       let arrayElement = this.experiment.nullValuesReplacers.filter(x => x.column == columnName)[0];
 
       if (arrayElement == undefined) {
@@ -408,7 +432,7 @@ export class ColumnTableComponent implements AfterViewInit {
       }
 
       this.nullValOption[index] = "Popuni sa: " + fillValue;
-      this.columnTableChangeDetected();
+      this.columnTableChangeDetected();*/
     }
   }
   getValue(columnName: string): string {
diff --git a/frontend/src/app/_elements/folder/folder.component.ts b/frontend/src/app/_elements/folder/folder.component.ts
index 6e04f963..93e8ba98 100644
--- a/frontend/src/app/_elements/folder/folder.component.ts
+++ b/frontend/src/app/_elements/folder/folder.component.ts
@@ -182,6 +182,9 @@ export class FolderComponent implements AfterViewInit {
       this.folders[TabType.MyModels] = models;
       if (selectedModelId) {
         this.selectFile(models.filter(x => x._id == selectedModelId)[0]);
+        setTimeout(() => {
+          this.okPressed.emit();
+        });
       }
       this.searchTermsChanged();
     });
@@ -233,11 +236,14 @@ export class FolderComponent implements AfterViewInit {
   }
 
   saveNewFile() {
+    this.loadingAction = true;
     switch (this.type) {
       case FolderType.Dataset:
         this.formDataset!.uploadDataset((dataset: Dataset) => {
           this.newFile = undefined;
-          Shared.openDialog("Obaveštenje", "Uspešno ste dodali novi izvor podataka u kolekciju. Molimo sačekajte par trenutaka da se obradi.");
+          this.loadingAction = false;
+          this.okPressed.emit();
+          //Shared.openDialog("Obaveštenje", "Uspešno ste dodali novi izvor podataka u kolekciju. Molimo sačekajte par trenutaka da se obradi.");
           this.refreshFiles();
         },
           () => {
@@ -248,7 +254,8 @@ export class FolderComponent implements AfterViewInit {
         this.formModel.newModel.type = this.formModel.forProblemType;
         this.modelsService.addModel(this.formModel.newModel).subscribe(model => {
           this.newFile = undefined;
-          Shared.openDialog("Obaveštenje", "Uspešno ste dodali novu konfiguraciju neuronske mreže u kolekciju.");
+          this.loadingAction = false;
+          //Shared.openDialog("Obaveštenje", "Uspešno ste dodali novu konfiguraciju neuronske mreže u kolekciju.");
           this.refreshFiles(null, model._id); // todo select model
         }, (err) => {
           Shared.openDialog("Neuspeo pokušaj!", "Konfiguracija neuronske mreže sa unetim nazivom već postoji u Vašoj kolekciji. Izmenite naziv ili iskoristite postojeću konfiguraciju.");