From 3c1fa844f90e938a96b320cd7e85b659c34f3e2e Mon Sep 17 00:00:00 2001
From: Christina Toegl <toegl@tugraz.at>
Date: Thu, 9 Dec 2021 15:49:59 +0100
Subject: [PATCH] Fix overflow for special breadcrumbs
---
.../src/nextcloud-file-picker.js | 36 +++++++++++--------
1 file changed, 21 insertions(+), 15 deletions(-)
diff --git a/packages/file-handling/src/nextcloud-file-picker.js b/packages/file-handling/src/nextcloud-file-picker.js
index 500ed8ed..c9ce13ab 100644
--- a/packages/file-handling/src/nextcloud-file-picker.js
+++ b/packages/file-handling/src/nextcloud-file-picker.js
@@ -1854,19 +1854,21 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
}}" title="${i18n.t('nextcloud-file-picker.folder-home')}"><dbp-icon name="home"></dbp-icon> </a></span>`;
if (this.isInFavorites) {
- htmlpath[1] = html`<span> › </span><span class="breadcrumb"><a @click="${() => {
- this.loadDirectory(path);
+ htmlpath[1] = html`<span> › </span><span class="breadcrumb special"><a @click="${() => {
+ this.loadFavorites();
}}" title="${i18n.t('nextcloud-file-picker.favorites-title')}">${i18n.t('nextcloud-file-picker.favorites-title')}</a></span>`;
} else if (this.isInRecent) {
- htmlpath[1] = html`<span> › </span><span class="breadcrumb"><a @click="${() => {
- this.loadDirectory(path);
+ htmlpath[1] = html`<span> › </span><span class="breadcrumb special"><a @click="${() => {
+ this.loadAllRecentFiles();
}}" title="${i18n.t('nextcloud-file-picker.recent-files-title')}">${i18n.t('nextcloud-file-picker.recent-files-title')}</a></span>`;
} else if (this.isInFilteredRecent) {
- htmlpath[1] = html`<span> › </span><span class="breadcrumb"><a @click="${() => {
- this.loadDirectory(path);
+ htmlpath[1] = html`<span> › </span><span class="breadcrumb special"><a @click="${() => {
+ this.loadMyRecentFiles();
}}" title="${i18n.t('nextcloud-file-picker.my-recent-files-title')}">${i18n.t('nextcloud-file-picker.my-recent-files-title')}</a></span>`;
+
+
} else { // case normal folders
const directories = this.directoryPath.split('/');
@@ -1936,35 +1938,35 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
// computations for overflow - begin
//if (this.menuHeightBreadcrumb === -1) {
this.menuHeightBreadcrumb = menu.clientHeight;
- console.log("menuheight: ", this.menuHeightBreadcrumb);
+ // console.log("menuheight: ", this.menuHeightBreadcrumb);
//}
let topValue = menuStart.getBoundingClientRect().bottom;
- console.log("topValue", topValue);
+ // console.log("topValue", topValue);
let isMenuOverflow = this.menuHeightBreadcrumb + topValue >= this._('.wrapper').offsetHeight ? true : false;
- console.log("modal.offsetHeight: ", this._('.wrapper').offsetHeight);
- console.log("ismenuoverflow: ", isMenuOverflow);
- console.log("navigation height: ", this._('.nextcloud-nav').offsetHeight);
+ // console.log("modal.offsetHeight: ", this._('.wrapper').offsetHeight);
+ // console.log("ismenuoverflow: ", isMenuOverflow);
+ // console.log("navigation height: ", this._('.nextcloud-nav').offsetHeight);
//set max-width to window with
let maxWidth = this._('.wrapper').offsetWidth;
- console.log ("offsetWidth", maxWidth);
+ // console.log ("offsetWidth", maxWidth);
if (isMenuOverflow && !menu.classList.contains('hidden')) {
let actualHeight = this._('.wrapper').offsetHeight - this._('.nextcloud-nav').offsetHeight;
- console.log("actual height: ", actualHeight);
+ // console.log("actual height: ", actualHeight);
menu.setAttribute('style', 'position: fixed;top: ' + topValue + 'px;height: ' + actualHeight + 'px;max-width: ' + maxWidth + 'px;overflow-y: auto;');
menu.scrollTop = 0;
- document.body.setAttribute('style', 'overflow:hidden;'); //TODO delete?
+ document.body.setAttribute('style', 'overflow:hidden;'); //TODO replace with correct scrollbar remove
} else if (isMenuOverflow && menu.classList.contains('hidden')) {
console.log("isMenuOverflow AND hidden - remove attributes");
- document.body.removeAttribute('style', 'overflow:hidden;'); //TODO delete?
+ document.body.removeAttribute('style', 'overflow:hidden;'); //TODO replace with correct scrollbar remove
menu.removeAttribute('style');
@@ -2063,6 +2065,10 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
${commonStyles.getRadioAndCheckboxCss()}
${fileHandlingStyles.getFileHandlingCss()}
+ .breadcrumb.special a {
+ overflow: visible;
+ }
+
.extended-breadcrumb-menu li a {
max-width: none;
display: inline;
--
GitLab