search modified

src/app/show-folder/show-folder.component.html

@@ -20,12 +20,18 @@
       </ion-back-button>
     </ion-buttons>
     <ion-title> {{ title }} </ion-title>
-    <ion-buttons *ngIf="parentItem" slot="end">
-      <ion-button (click)="createFolder()"><mat-icon>create_new_folder</mat-icon></ion-button>
-      <ion-button (click)="addFile()"><mat-icon>upload_file</mat-icon></ion-button>
+    <ion-buttons slot="end">
+      <ion-button *ngIf="enableCreateOperations" (click)="createFolder()"><mat-icon>create_new_folder</mat-icon></ion-button>
+      <ion-button *ngIf="enableCreateOperations" (click)="addFile()"><mat-icon>upload_file</mat-icon></ion-button>
+      <ion-button (click)="changeSearchEnabled()">
+        <mat-icon>manage_search</mat-icon>
+      </ion-button>
     </ion-buttons>
     <ion-progress-bar *ngIf="!filtereBySearchItems" type="indeterminate"></ion-progress-bar>
   </ion-toolbar>
+  <ion-searchbar *ngIf="searchenabled"
+    [disabled]="!filtereBySearchItems || (filtereBySearchItems.length == 0 && currentSearch.length==0)" [debounce]="500"
+    (ionClear)="searchCleared()" (ionChange)="searchItems($event)"></ion-searchbar>
   <div>
     <ion-buttons slot="start">
       <ion-item>
@@ -38,10 +44,6 @@
       </ion-item>
       <ion-button (click)="changeSortType()"><mat-icon>{{ currentSortType }}</mat-icon></ion-button>
     </ion-buttons>
-    <ion-buttons slot="end">
-      <ion-searchbar [disabled]="!filtereBySearchItems || (filtereBySearchItems.length == 0 && currentSearch.length==0)"
-        [debounce]="500" (ionClear)="searchCleared()" (ionChange)="searchItems($event)"></ion-searchbar>
-    </ion-buttons>
   </div>
   <input hidden type="file" #filepicker (change)="fileSelected($event)" />
   <app-items-list [items]="filtereBySearchItems" [underUploadItem]="underUpload"

src/app/show-folder/show-folder.component.ts

@@ -52,7 +52,9 @@ export class ShowFolderComponent implements OnInit, OnDestroy, AfterViewInit {
 
   @Input() root: boolean = false;
 
+  @Input() enableCreateOperations = false;
 
+  searchenabled = false;
 
   selectedSegment = "all";
 
@@ -64,7 +66,7 @@ export class ShowFolderComponent implements OnInit, OnDestroy, AfterViewInit {
   currentSearch: string = "";
 
   @ViewChild('filepicker') uploader!: ElementRef;
-  
+
   customSortAlertOptions = {
     header: 'Sort by',
     translucent: true,
@@ -99,7 +101,7 @@ export class ShowFolderComponent implements OnInit, OnDestroy, AfterViewInit {
     this.backButtonSubscription = this.event.BackButtonEvent.subscribe(() => this.onbackButtonPressed());
   }
 
-  
+
 
   ngOnDestroy(): void {
     var p: IonBackButtonDelegate
@@ -123,7 +125,7 @@ export class ShowFolderComponent implements OnInit, OnDestroy, AfterViewInit {
           res.forEach(i => {
             var localItem = new WSItem(i);
             tmpItems$.push(localItem);
-            if (segmentFilterFunction(localItem)){
+            if (segmentFilterFunction(localItem)) {
               tmpFilteredBySegment$.push(localItem);
             }
           });
@@ -138,6 +140,12 @@ export class ShowFolderComponent implements OnInit, OnDestroy, AfterViewInit {
     }
   }
 
+  changeSearchEnabled() {
+    this.searchenabled = !this.searchenabled;
+    if (!this.searchenabled)
+      this.searchCleared()
+  }
+
   onbackButtonPressed() {
     if (!this.root) {
       console.log("back clicked (not root)");
@@ -166,15 +174,15 @@ export class ShowFolderComponent implements OnInit, OnDestroy, AfterViewInit {
 
   filterBy(value: string) {
     if (value == this.selectedSegment) return;
-    
+
     this.filtereBySearchItems = undefined;
     this.selectedSegment = value;
-    
+
     if (this.selectedSegment == "all")
-      this.filtereBySearchItems = this._items;
-    else 
+      this.filteredBySegmentItems = this._items;
+    else
       this.filteredBySegmentItems = this._items?.filter(this.getSegmentFilterFunction());
-    
+
     if (this.currentSearch.length != 0)
       this.filtereBySearchItems = this.filteredBySegmentItems?.filter(d => d.getTitle().toLowerCase().indexOf(this.currentSearch) > -1);
     else this.filtereBySearchItems = this.filteredBySegmentItems;
@@ -197,13 +205,13 @@ export class ShowFolderComponent implements OnInit, OnDestroy, AfterViewInit {
 
   updateSort() {
     this._items = this._items?.sort(Sorting.getSortFunction(this.currentSortName, this.currentSortType));
-    
+
     if (this.selectedSegment == "all")
       this.filteredBySegmentItems = this._items;
     else
       this.filteredBySegmentItems = this.filteredBySegmentItems?.sort(Sorting.getSortFunction(this.currentSortName, this.currentSortType));
-    
-    if (this.currentSearch.length!=0 )
+
+    if (this.currentSearch.length != 0)
       this.filtereBySearchItems = this.filtereBySearchItems?.sort(Sorting.getSortFunction(this.currentSortName, this.currentSortType));
     else this.filtereBySearchItems = this.filteredBySegmentItems;
   }
@@ -214,9 +222,9 @@ export class ShowFolderComponent implements OnInit, OnDestroy, AfterViewInit {
     this.filtereBySearchItems = this.filteredBySegmentItems?.filter(d => d.getTitle().toLowerCase().indexOf(query) > -1);
   }
 
-  searchCleared(){
+  searchCleared() {
     this.currentSearch = "";
-    this.filtereBySearchItems = this.filteredBySegmentItems 
+    this.filtereBySearchItems = this.filteredBySegmentItems
   }
 
   itemClicked(item: WSItem) {

src/app/trash/trash.page.html

@@ -1,4 +1,4 @@
 <ion-content [fullscreen]="true">
-  <show-folder  title="Trash" [root]="true" [parentItem]="getCurrentItem()" [items]="getValues()"></show-folder>
+  <show-folder  title="Trash" [root]="true" [parentItem]="getCurrentItem()"  [items]="getValues()"></show-folder>
 </ion-content>
 

src/app/vres/vres.page.html

@@ -1,3 +1,3 @@
 <ion-content [fullscreen]="true">
-  <show-folder [root]="root" [title]="getTitle()" [parentItem]="getCurrentItem()" [items]="getValues()" (folderClickedEvent)="openFolder($event)"></show-folder>
+  <show-folder [root]="root" [title]="getTitle()" [parentItem]="getCurrentItem()" [items]="getValues()" [enableCreateOperations]="enableCreateOperations()" (folderClickedEvent)="openFolder($event)"></show-folder>
 </ion-content>

src/app/vres/vres.page.ts

@@ -27,6 +27,10 @@ export class VresPage implements OnInit {
     private route: ActivatedRoute,
     private alertCtrl: AlertController) { }
 
+   
+  enableCreateOperations() : boolean {
+    return this.getCurrentItem() != undefined;
+  }  
 
   ngOnInit() {
     var folderId: string | undefined = this.route.snapshot.paramMap.get('folderId') || undefined;

src/app/ws/ws.page.html

@@ -1,3 +1,3 @@
 <ion-content [fullscreen]="true">
-  <show-folder [title]="getTitle()" [root]="root" [parentItem]="getCurrentItem()" [items]="getValues()" (folderClickedEvent)="openFolder($event)"></show-folder>
+  <show-folder [title]="getTitle()" [root]="root" [parentItem]="getCurrentItem()" [items]="getValues()"  [enableCreateOperations]="enableCreateOperations()" (folderClickedEvent)="openFolder($event)"></show-folder>
 </ion-content>

src/app/ws/ws.page.ts

@@ -92,4 +92,8 @@ export class WsPage implements OnInit {
     return this.root ? "My Workspace" : this.item?.getTitle()
   }
 
+  enableCreateOperations() : boolean {
+    return this.getCurrentItem() != undefined;
+  }  
+
 }