Osposobio pretragu u folder komponenti. Promenio experiment stranu tako da moze da se skroluje od koraka do koraka. Dodao nacin da komponente manuelno skroluju pozadinu.

1 files changed, 34 insertions, 3 deletions

diff --git a/frontend/src/app/_elements/folder/folder.component.ts b/frontend/src/app/_elements/folder/folder.component.ts
index 485a8dd7..91565f3c 100644
--- a/frontend/src/app/_elements/folder/folder.component.ts
+++ b/frontend/src/app/_elements/folder/folder.component.ts
@@ -20,11 +20,15 @@ export class FolderComponent implements OnInit {
   newFileSelected: boolean = true;
 
   selectedFileIndex: number = -1;
+  selectedFile?: (Dataset | Model);
   hoveringOverFileIndex: number = -1;
 
   fileToDisplay?: (Dataset | Model);
 
   @Output() selectedFileChanged: EventEmitter<(Dataset | Model)> = new EventEmitter();
+  @Output() okPressed: EventEmitter<string> = new EventEmitter();
+
+  searchTerm: string = '';
 
   constructor() {
     //PLACEHOLDER
@@ -33,6 +37,9 @@ export class FolderComponent implements OnInit {
       new Dataset('Dijamanti'),
       new Dataset('Filmovi'),
     ]
+
+    this.filteredFiles.length = 0;
+    this.filteredFiles.push(...this.files);
   }
 
   ngOnInit(): void {
@@ -60,17 +67,19 @@ export class FolderComponent implements OnInit {
     if (!this.newFile) {
       this.createNewFile();
     }
-    this.fileToDisplay = this.newFile;
     this.selectedFileIndex = -1;
+    this.fileToDisplay = this.newFile;
+    this.selectedFile = this.newFile;
     this.newFileSelected = true;
     this.selectedFileChanged.emit(this.newFile);
   }
 
   selectFile(index: number) {
     this.selectedFileIndex = index;
-    this.fileToDisplay = this.files[index];
+    this.selectedFile = this.filteredFiles[index];
+    this.fileToDisplay = this.filteredFiles[index];
     this.newFileSelected = false;
-    this.selectedFileChanged.emit(this.files[index]);
+    this.selectedFileChanged.emit(this.selectedFile);
   }
 
   createNewFile() {
@@ -81,6 +90,10 @@ export class FolderComponent implements OnInit {
     }
   }
 
+  ok() {
+    this.okPressed.emit();
+  }
+
   saveNewFile() {
     // TODO
   }
@@ -97,6 +110,24 @@ export class FolderComponent implements OnInit {
   newFileZIndex() {
     return (this.files.length + 1);
   }
+
+  clearSearchTerm() {
+    this.searchTerm = '';
+  }
+
+  filteredFiles: (Dataset | Model)[] = [];
+
+  searchTermsChanged() {
+    this.filteredFiles.length = 0;
+    this.filteredFiles.push(...this.files.filter((file) => file.name.toLowerCase().includes(this.searchTerm.toLowerCase())));
+    if (this.selectedFile) {
+      if (!this.filteredFiles.includes(this.selectedFile)) {
+        this.selectFile(-1);
+      } else {
+        this.selectedFileIndex = this.filteredFiles.indexOf(this.selectedFile);
+      }
+    }
+  }
 }
 
 export enum FolderType {