From 4890c5d01734f96be65d5959929f541aeeefb6a8 Mon Sep 17 00:00:00 2001
From: Jonas <Snuffleupagus@server.fake>
Date: Thu, 18 Jul 2013 18:28:59 +0200
Subject: [PATCH] Fix the positioning of the progressive loadingBar
---
web/ui_utils.js | 25 ++++++++++++++++++++++---
web/viewer.css | 3 ---
web/viewer.js | 22 ++++++++++++----------
3 files changed, 34 insertions(+), 16 deletions(-)
diff --git a/web/ui_utils.js b/web/ui_utils.js
index a0e777b1d..0b2980ffc 100644
--- a/web/ui_utils.js
+++ b/web/ui_utils.js
@@ -155,15 +155,18 @@ var ProgressBar = (function ProgressBarClosure() {
function ProgressBar(id, opts) {
- // Fetch the sub-elements for later
+ // Fetch the sub-elements for later.
this.div = document.querySelector(id + ' .progress');
- // Get options, with sensible defaults
+ // Get the loading bar element, so it can be resized to fit the viewer.
+ this.bar = this.div.parentNode;
+
+ // Get options, with sensible defaults.
this.height = opts.height || 100;
this.width = opts.width || 100;
this.units = opts.units || '%';
- // Initialize heights
+ // Initialize heights.
this.div.style.height = this.height + this.units;
this.percent = 0;
}
@@ -190,6 +193,22 @@ var ProgressBar = (function ProgressBarClosure() {
this._indeterminate = isNaN(val);
this._percent = clamp(val, 0, 100);
this.updateBar();
+ },
+
+ setWidth: function ProgressBar_setWidth(viewer) {
+ if (viewer) {
+ var container = viewer.parentNode;
+ var scrollbarWidth = container.offsetWidth - viewer.offsetWidth;
+ if (scrollbarWidth > 0) {
+ this.bar.setAttribute('style', 'width: calc(100% - ' +
+ scrollbarWidth + 'px);');
+ }
+ }
+ },
+
+ hide: function ProgressBar_hide() {
+ this.bar.classList.add('hidden');
+ this.bar.removeAttribute('style');
}
};
diff --git a/web/viewer.css b/web/viewer.css
index d30ea371f..5f809df8d 100644
--- a/web/viewer.css
+++ b/web/viewer.css
@@ -231,9 +231,6 @@ html[dir='rtl'] #sidebarContent {
left: 0;
outline: none;
}
-.loadingInProgress #viewerContainer {
- top: 39px;
-}
.toolbar {
position: relative;
diff --git a/web/viewer.js b/web/viewer.js
index ae968334a..94e0d6f29 100644
--- a/web/viewer.js
+++ b/web/viewer.js
@@ -746,16 +746,21 @@ var PDFView = {
return support;
},
+ get loadingBar() {
+ var bar = new ProgressBar('#loadingBar', {});
+ Object.defineProperty(this, 'loadingBar', { value: bar,
+ enumerable: true,
+ configurable: true,
+ writable: false });
+ return bar;
+ },
+
get isHorizontalScrollbarEnabled() {
var div = document.getElementById('viewerContainer');
return div.scrollWidth > div.clientWidth;
},
initPassiveLoading: function pdfViewInitPassiveLoading() {
- if (!PDFView.loadingBar) {
- PDFView.loadingBar = new ProgressBar('#loadingBar', {});
- }
-
var pdfDataRangeTransport = {
rangeListeners: [],
progressListeners: [],
@@ -857,10 +862,6 @@ var PDFView = {
}
}
- if (!PDFView.loadingBar) {
- PDFView.loadingBar = new ProgressBar('#loadingBar', {});
- }
-
this.pdfDocument = null;
var self = this;
self.loading = true;
@@ -1150,8 +1151,7 @@ var PDFView = {
errorWrapper.setAttribute('hidden', 'true');
pdfDocument.dataLoaded().then(function() {
- var loadingBar = document.getElementById('loadingBar');
- loadingBar.classList.add('hidden');
+ PDFView.loadingBar.hide();
var outerContainer = document.getElementById('outerContainer');
outerContainer.classList.remove('loadingInProgress');
});
@@ -1213,6 +1213,8 @@ var PDFView = {
event.initCustomEvent('documentload', true, true, {});
window.dispatchEvent(event);
+ PDFView.loadingBar.setWidth(container);
+
for (var pageNum = 1; pageNum <= pagesCount; ++pageNum) {
var pagePromise = pdfDocument.getPage(pageNum);
pagePromise.then(function(pdfPage) {