From f135128664cae62a831ed46853ac820af6a4812b Mon Sep 17 00:00:00 2001
From: Vincent Petry <pvince81@owncloud.com>
Date: Fri, 2 Oct 2015 18:02:55 +0200
Subject: [PATCH] Fix filelist size issues, breadcrumb, multiselect
- calculate multiselect header width to exclude scrollbar
- call FileList._onResize() when sidebar is toggled ("appresized"), this
also updates the breadcrumb width
- moved global getScrollBarWidth() to OC.Util namespace
---
apps/files/js/filelist.js | 4 +++
core/js/js.js | 68 +++++++++++++++++++++++++--------------
2 files changed, 47 insertions(+), 25 deletions(-)
diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js
index 9c4e43b3b8b..2516dd3e957 100644
--- a/apps/files/js/filelist.js
+++ b/apps/files/js/filelist.js
@@ -233,6 +233,7 @@
this.$el.find('thead th .columntitle').click(_.bind(this._onClickHeader, this));
this._onResize = _.debounce(_.bind(this._onResize, this), 100);
+ $('#app-content').on('appresized', this._onResize);
$(window).resize(this._onResize);
this.$el.on('show', this._onResize);
@@ -278,6 +279,7 @@
this.fileActions.off('registerAction', this._onFileActionsUpdated);
this.fileActions.off('setDefault', this._onFileActionsUpdated);
OC.Plugins.detach('OCA.Files.FileList', this);
+ $('#app-content').off('appresized', this._onResize);
},
/**
@@ -437,6 +439,8 @@
this.breadcrumb.setMaxWidth(containerWidth - actionsWidth - 10);
+ this.$table.find('>thead').width($('#app-content').width() - OC.Util.getScrollBarWidth());
+
this.updateSearch();
},
diff --git a/core/js/js.js b/core/js/js.js
index e40141ac617..38ccc70cb15 100644
--- a/core/js/js.js
+++ b/core/js/js.js
@@ -1636,6 +1636,45 @@ OC.Util = {
return $('html').hasClass('ie8');
},
+ /**
+ * Returns the width of a generic browser scrollbar
+ *
+ * @return {int} width of scrollbar
+ */
+ getScrollBarWidth: function() {
+ if (this._scrollBarWidth) {
+ return this._scrollBarWidth;
+ }
+
+ var inner = document.createElement('p');
+ inner.style.width = "100%";
+ inner.style.height = "200px";
+
+ var outer = document.createElement('div');
+ outer.style.position = "absolute";
+ outer.style.top = "0px";
+ outer.style.left = "0px";
+ outer.style.visibility = "hidden";
+ outer.style.width = "200px";
+ outer.style.height = "150px";
+ outer.style.overflow = "hidden";
+ outer.appendChild (inner);
+
+ document.body.appendChild (outer);
+ var w1 = inner.offsetWidth;
+ outer.style.overflow = 'scroll';
+ var w2 = inner.offsetWidth;
+ if(w1 === w2) {
+ w2 = outer.clientWidth;
+ }
+
+ document.body.removeChild (outer);
+
+ this._scrollBarWidth = (w1 - w2);
+
+ return this._scrollBarWidth;
+ },
+
/**
* Remove the time component from a given date
*
@@ -1926,32 +1965,11 @@ jQuery.fn.exists = function(){
return this.length > 0;
};
+/**
+ * @deprecated use OC.Util.getScrollBarWidth() instead
+ */
function getScrollBarWidth() {
- var inner = document.createElement('p');
- inner.style.width = "100%";
- inner.style.height = "200px";
-
- var outer = document.createElement('div');
- outer.style.position = "absolute";
- outer.style.top = "0px";
- outer.style.left = "0px";
- outer.style.visibility = "hidden";
- outer.style.width = "200px";
- outer.style.height = "150px";
- outer.style.overflow = "hidden";
- outer.appendChild (inner);
-
- document.body.appendChild (outer);
- var w1 = inner.offsetWidth;
- outer.style.overflow = 'scroll';
- var w2 = inner.offsetWidth;
- if(w1 === w2) {
- w2 = outer.clientWidth;
- }
-
- document.body.removeChild (outer);
-
- return (w1 - w2);
+ return OC.Util.getScrollBarWidth();
}
/**
--
GitLab