Dodao servis za parsiranje csv stringova, ucitao fajl sa backenda kada korisnik izabere postojeci dataset u add-model. Dodao delimiter u dataset klasu.

8 files changed, 97 insertions, 13 deletions

diff --git a/frontend/src/app/_data/Dataset.ts b/frontend/src/app/_data/Dataset.ts
index 6e6cbffe..665df932 100644
--- a/frontend/src/app/_data/Dataset.ts
+++ b/frontend/src/app/_data/Dataset.ts
@@ -10,6 +10,7 @@ export default class Dataset {
         public accessibleByLink: boolean = false,
         public dateCreated: Date = new Date(),
         public lastUpdated: Date = new Date(),
-        public username: string = 'tester1'
+        public username: string = '',
+        public delimiter: string = ''
     ) { }
 }
\ No newline at end of file
diff --git a/frontend/src/app/_elements/dataset-load/dataset-load.component.html b/frontend/src/app/_elements/dataset-load/dataset-load.component.html
index b159c748..7addc761 100644
--- a/frontend/src/app/_elements/dataset-load/dataset-load.component.html
+++ b/frontend/src/app/_elements/dataset-load/dataset-load.component.html
@@ -15,7 +15,7 @@
     </div>
     <div class="col-4 mt-4">
       <input list=delimiterOptions placeholder="Izaberite ili ukucajte delimiter za .csv fajl" class="form-control mt-2"
-        [(ngModel)]="delimiter" (input)="update()">
+        [(ngModel)]="dataset.delimiter" (input)="update()">
       <datalist id=delimiterOptions>
         <option *ngFor="let option of delimiterOptions">{{option}}</option>
       </datalist>
diff --git a/frontend/src/app/_elements/dataset-load/dataset-load.component.ts b/frontend/src/app/_elements/dataset-load/dataset-load.component.ts
index 7f432b9a..64ce8044 100644
--- a/frontend/src/app/_elements/dataset-load/dataset-load.component.ts
+++ b/frontend/src/app/_elements/dataset-load/dataset-load.component.ts
@@ -11,7 +11,6 @@ export class DatasetLoadComponent {
 
   @Output() loaded = new EventEmitter<string>();
 
-  delimiter: string = "";
   delimiterOptions: Array<string> = [",", ";", "\t", "razmak", "|"]; //podrazumevano ","
 
   hasHeader: boolean = true;
@@ -49,7 +48,7 @@ export class DatasetLoadComponent {
     if (this.files.length < 1)
       return;
 
-    this.ngxCsvParser.parse(this.files[0], { header: false, delimiter: (this.delimiter == "razmak") ? " " : (this.delimiter == "") ? "," : this.delimiter })
+    this.ngxCsvParser.parse(this.files[0], { header: false, delimiter: (this.dataset.delimiter == "razmak") ? " " : (this.dataset.delimiter == "") ? "," : this.dataset.delimiter })
       .pipe().subscribe((result) => {
 
         console.log('Result', result);
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 1c9198a3..156e51bc 100644
--- a/frontend/src/app/_pages/add-model/add-model.component.ts
+++ b/frontend/src/app/_pages/add-model/add-model.component.ts
@@ -6,7 +6,9 @@ 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';
 
 @Component({
   selector: 'app-add-model',
@@ -38,12 +40,14 @@ export class AddModelComponent implements OnInit {
   myDatasets?: Dataset[];
   existingDatasetSelected: boolean = false;
   selectedDataset?: Dataset;
+  otherDataset?: Dataset;
+  otherDatasetFile?: any[];
   datasetFile?: any[];
   datasetHasHeader?: boolean = true;
 
   tempTestSetDistribution: number = 90;
 
-  constructor(private models: ModelsService) {
+  constructor(private models: ModelsService, private datasets: DatasetsService, private csv: CsvParseService) {
     this.newModel = new Model();
 
     this.models.getMyDatasets().subscribe((datasets) => {
@@ -213,14 +217,23 @@ export class AddModelComponent implements OnInit {
 
 
     //this.datasetFile = csvRecords;
+    this.datasets.getDatasetFile(dataset.fileId).subscribe((file: string | undefined) => {
+      if (file) {
+        this.datasetFile = this.csv.csvToArray(file, (dataset.delimiter == "razmak") ? " " : (dataset.delimiter == "") ? "," : dataset.delimiter);
+      }
+    });
     this.datasetHasHeader = false;
 
     this.resetCbsAndRbs();
   }
 
   resetSelectedDataset(): boolean {
-    this.existingDatasetSelected = false;
-    this.selectedDataset = undefined;
+    const temp = this.selectedDataset;
+    this.selectedDataset = this.otherDataset;
+    this.otherDataset = temp;
+    const tempFile = this.datasetFile;
+    this.datasetFile = this.otherDatasetFile;
+    this.otherDatasetFile = tempFile;
     return true;
   }
   resetCbsAndRbs(): boolean {
diff --git a/frontend/src/app/_pages/home/home.component.html b/frontend/src/app/_pages/home/home.component.html
index 689a302b..7e895a2d 100644
--- a/frontend/src/app/_pages/home/home.component.html
+++ b/frontend/src/app/_pages/home/home.component.html
@@ -2,7 +2,7 @@
     <img src="../../../assets/svg/logo.svg" class="bi me-2" width="256" height="256" role="img">
     <div *ngIf="shared.loggedIn" class="d-flex flex-column align-items-center">
         <h2 class="my-4">Započnite sa treniranjem!</h2>
-        <div id="cards" class="row align-items-center justify-content-center">
+        <div id="cards" class="row align-items-stretch justify-content-center">
             <div class="card shadow col-3 m-1" style="width: 18rem;">
                 <div class="card-body">
                     <mat-icon width="48px" height="48px"
@@ -46,7 +46,7 @@
     </div>
     <h2 class="my-4">Pogledajte javne izvore podataka!</h2>
     <app-carousel [items]="publicDatasets">
-        
+
     </app-carousel>
     <h3><a routerLink="browse-datasets">Pogledaj sve javne izvore podataka...</a></h3>
     <h2 class="my-4">Iskoristite već trenirane modele!</h2>
diff --git a/frontend/src/app/_services/csv-parse.service.spec.ts b/frontend/src/app/_services/csv-parse.service.spec.ts
new file mode 100644
index 00000000..ab685d49
--- /dev/null
+++ b/frontend/src/app/_services/csv-parse.service.spec.ts
@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { CsvParseService } from './csv-parse.service';
+
+describe('CsvParseService', () => {
+  let service: CsvParseService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(CsvParseService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});
diff --git a/frontend/src/app/_services/csv-parse.service.ts b/frontend/src/app/_services/csv-parse.service.ts
new file mode 100644
index 00000000..d53f504e
--- /dev/null
+++ b/frontend/src/app/_services/csv-parse.service.ts
@@ -0,0 +1,53 @@
+import { Injectable } from "@angular/core";
+@Injectable({ providedIn: 'root' })
+export class CsvParseService {
+
+  csvToArray(strData: string, strDelimiter: string): string[][] {
+    strDelimiter = (strDelimiter || ",");
+
+    let objPattern = new RegExp(
+      (
+        // Delimiters.
+        "(\\" + strDelimiter + "|\\r?\\n|\\r|^)" +
+
+        // Quoted fields.
+        "(?:\"([^\"]*(?:\"\"[^\"]*)*)\"|" +
+
+        // Standard fields.
+        "([^\"\\" + strDelimiter + "\\r\\n]*))"
+      ),
+      "gi"
+    );
+
+    let arrData: string[][] = [[]];
+
+    let arrMatches = null;
+
+    while (arrMatches = objPattern.exec(strData)) {
+
+      let strMatchedDelimiter = arrMatches[1];
+
+      if (
+        strMatchedDelimiter.length &&
+        strMatchedDelimiter !== strDelimiter
+      ) {
+        arrData.push([]);
+      }
+
+      let strMatchedValue;
+
+      if (arrMatches[2]) {
+        strMatchedValue = arrMatches[2].replace(
+          new RegExp("\"\"", "g"),
+          "\""
+        );
+      } else {
+        strMatchedValue = arrMatches[3];
+      }
+
+      arrData[arrData.length - 1].push(strMatchedValue);
+    }
+
+    return (arrData);
+  }
+}
\ No newline at end of file
diff --git a/frontend/src/app/_services/datasets.service.ts b/frontend/src/app/_services/datasets.service.ts
index fadcdeae..35ca24e5 100644
--- a/frontend/src/app/_services/datasets.service.ts
+++ b/frontend/src/app/_services/datasets.service.ts
@@ -13,12 +13,14 @@ export class DatasetsService {
   constructor(private http: HttpClient, private authService: AuthService) { }
 
   getPublicDatasets(): Observable<Dataset[]> {
-    return this.http.get<Dataset[]>(`${API_SETTINGS.apiURL}/Dataset/publicdatasets`, { headers: this.authService.authHeader() });
+    return this.http.get<Dataset[]>(`${API_SETTINGS.apiURL}/dataset/publicdatasets`, { headers: this.authService.authHeader() });
   }
 
-  addDataset(dataset:Dataset):any{
+  addDataset(dataset: Dataset): any {
     return this.http.post(`${API_SETTINGS.apiURL}/dataset/add`, dataset, { headers: this.authService.authHeader() });
   }
 
-
+  getDatasetFile(fileId: any): any {
+    return this.http.get(`${API_SETTINGS.apiURL}/file/download?id=${fileId}`, { headers: this.authService.authHeader(), responseType: 'text' });
+  }
 }