Merge submenu toggle and additional menu toggle

packages/file-handling/src/nextcloud-file-picker.js

@@ -59,9 +59,8 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
         this.authInfo = '';
         this.selectBtnDisabled = true;
         this.storeSession = false;
-        this.showSubmenu = false;
-        this.bounCloseSubmenuHandler = this.closeSubmenu.bind(this);
-        this.initateOpensubmenu = false;
+        this.boundCloseAdditionalMenuHandler = this.closeAdditionalMenu.bind(this);
+        this.initateOpenAdditionalMenu = false;
         this.showAdditionalMenu = false;
         this.isInFavorites = false;
         this.isInRecent = false;
@@ -106,7 +105,6 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
             showAdditionalMenu: { type: Boolean, attribute: 'show-nextcloud-additional-menu' },
             userName: { type: Boolean, attribute: false },
             storeSession: {type: Boolean, attribute: 'store-nextcloud-session'},
-            showSubmenu: {type: Boolean, attribute: false},
         };
     }
 
@@ -169,7 +167,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
                 layout: "fitColumns",
                 selectable: this.maxSelectedItems,
                 selectableRangeMode: "drag",
-                placeholder: this.isInFavorites ? i18n.t('nextcloud-file-picker.no-favorites') : this.directoriesOnly ? i18n.t('nextcloud-file-picker.no-data') : i18n.t('nextcloud-file-picker.no-data-type'), //TODO check why it is not working
+                placeholder: this.directoriesOnly ? i18n.t('nextcloud-file-picker.no-data') : i18n.t('nextcloud-file-picker.no-data-type'),
                 responsiveLayout: "collapse",
                 responsiveLayoutCollapseStartOpen: false,
                 resizableColumns: false,
@@ -349,7 +347,6 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
                 }
             });
 
-
             // Strg + click select mode on desktop
             /*if (this.tabulatorTable.browserMobile === false) {
                 this.tabulatorTable.options.selectableRangeMode = "click";
@@ -543,6 +540,13 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
         }
     }
 
+    toggleCollapse(e) {
+        const table = this.tabulatorTable;
+        setTimeout(function() {
+            table.redraw();
+        }, 0);
+    }
+
     /**
      * 
      * @param {*} data 
@@ -685,10 +689,12 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
 
                     this.loading = false;
                     this.statusText = "";
+                    this.tabulatorTable.placeholder = i18n.t('nextcloud-file-picker.no-favorites'); //TODO check why this is not working
                     this.tabulatorTable.setData(dataObject);
                     this.isPickerActive = true;
                     this._(".nextcloud-content").scrollTop = 0;
                     this._("#download-button").setAttribute("disabled", "true");
+
                 });
             }).catch(error => { //TODO verify error catching
                 console.error(error.message);
@@ -845,19 +851,13 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
         });
     }
 
-    toggleCollapse(e) {
-        const table = this.tabulatorTable;
-        setTimeout(function() {
-            table.redraw();
-        }, 0);
-    }
-
     /**
      * Loads the directory from WebDAV
      *
      * @param path
      */
     loadDirectory(path) {
+        this.hideMoreMenu();
         const i18n = this._i18n;
         if (typeof this.directoryPath === 'undefined' || this.directoryPath === undefined) {
             this.directoryPath = '';
@@ -1526,25 +1526,6 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
         return false;
     }
 
-    closeSubmenu() {
-        if (this.initateOpensubmenu && this.showSubmenu) {
-            this.initateOpensubmenu = false;
-            return;
-        }
-        if (this.showSubmenu){
-            document.removeEventListener('click', this.bounCloseSubmenuHandler);
-            this.showSubmenu = false;
-        }
-    }
-
-    toggleSubmenu() {
-        if (!this.showSubmenu) {
-            this.initateOpensubmenu = true;
-            this.showSubmenu = true;
-            document.addEventListener('click', this.bounCloseSubmenuHandler);
-        }
-    }
-
     logOut() {
         this.webDavClient = null;
         this.isPickerActive = false;
@@ -1612,6 +1593,17 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
         return this.nextcloudFileURL + this.directoryPath;
     }
 
+    closeAdditionalMenu() { //TODO integrate this
+        if (this.initateOpenAdditionalMenu && this.showAdditionalMenu) {
+            this.initateOpenAdditionalMenu = false;
+            return;
+        }
+        if (this.showAdditionalMenu){
+            document.removeEventListener('click', this.boundCloseAdditionalMenuHandler);
+            this.showAdditionalMenu = false;
+        }
+    }
+
     toggleMoreMenu() {
         const menu = this.shadowRoot.querySelector("ul.extended-menu");
         const menuStart = this.shadowRoot.querySelector("a.extended-menu-link");
@@ -1637,6 +1629,12 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
             document.body.removeAttribute('style', 'overflow:hidden;');
             menu.removeAttribute('style');
         }
+
+        if (!this.showAdditionalMenu) {
+            this.initateOpenAdditionalMenu = true;
+            this.showAdditionalMenu = true;
+            document.addEventListener('click', this.boundCloseAdditionalMenuHandler);
+        }
     }
 
     hideMoreMenu() {
@@ -2291,6 +2289,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
                                         </button>
                                     </div>
                                 </div>
+                                
                         <!-- old new folder code - begin -->
                         <!-- <div class="menu-buttons">
                             <div class="add-folder ${classMap({hidden: !this.directoriesOnly})}">