Merge pull request #505 from swznd/master

Add loading status indicator
This commit is contained in:
vingtetun 2011-09-21 07:19:39 -07:00
commit 6e859fb3e4
3 changed files with 16 additions and 3 deletions

View File

@ -271,3 +271,8 @@ canvas {
page-break-after: always; page-break-after: always;
} }
} }
#loading {
margin: 100px 0;
text-align: center;
}

View File

@ -89,7 +89,8 @@
</div> </div>
</div> </div>
</div> </div>
<div id="loading">Loading... 0%</div>
<div id="viewer"></div> <div id="viewer"></div>
</body> </body>
</html> </html>

View File

@ -110,13 +110,15 @@ var PDFView = {
var xhr = new XMLHttpRequest(); var xhr = new XMLHttpRequest();
xhr.open('GET', url); xhr.open('GET', url);
xhr.mozResponseType = xhr.responseType = 'arraybuffer'; xhr.mozResponseType = xhr.responseType = 'arraybuffer';
xhr.expected = (document.URL.indexOf('file:') === 0) ? 0 : 200; xhr.expected = (document.URL.indexOf('file:') === 0) ? 0 : 200;
xhr.onprogress = PDFView.progressLevel;
xhr.onreadystatechange = function() { xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === xhr.expected) { if (xhr.readyState === 4 && xhr.status === xhr.expected) {
var data = (xhr.mozResponseArrayBuffer || xhr.mozResponse || var data = (xhr.mozResponseArrayBuffer || xhr.mozResponse ||
xhr.responseArrayBuffer || xhr.response); xhr.responseArrayBuffer || xhr.response);
document.getElementById('loading').style.display = "none";
PDFView.load(data, scale); PDFView.load(data, scale);
} }
}; };
@ -124,6 +126,11 @@ var PDFView = {
xhr.send(null); xhr.send(null);
}, },
progressLevel: function(evt) {
var p = Math.round((evt.loaded / evt.total) * 100);
document.getElementById('loading').innerHTML = 'Loading... ' + p + '%';
},
navigateTo: function(dest) { navigateTo: function(dest) {
if (typeof dest === 'string') if (typeof dest === 'string')
dest = this.destinations[dest]; dest = this.destinations[dest];