webodf / ViewerJS

ViewerJS: Document Reader in JavaScript
http://viewerjs.org
1.94k stars 421 forks source link

Loading gif image during pdf load #96

Open rony4pm opened 10 years ago

rony4pm commented 10 years ago

Hi Guys,

Is there any implementation of loading status. As status bar, or just a simple loading gif?

GaboDot commented 10 years ago

It would be helpful, large pdf's take extra time to show complete... I hope we get an answer soon = )

kossebau commented 9 years ago

There is no implementation yet, but I agree it would be good to have. Anyone up for coding one? :)

Shreeshrii commented 9 years ago

Is there any option that can be set for displaying first page after it has been downloaded and let the file continue downloading, rather than waiting for whole file to download?

kossebau commented 9 years ago

Is there any option that can be set for displaying first page after it has been downloaded and let the file continue downloading, rather than waiting for whole file to download?

No, nothing implemented at the moment to support that. Would be nice to have, agreed. But currently both the PDF and the ODF plugins only deal with complete files, so they have to be downloaded first completely.

Shreeshrii commented 9 years ago

ok. Thanks!

vhugogarcia commented 9 years ago

Any workaround or update to enable a loading alert or something.... ? thanks in advance

frankiekam commented 9 years ago

You mean like this? round I managed to solve it. The trick is to modify this code inside index.html:

#canvasContainer {overflow: auto;padding-top: 6px;padding-bottom: 6px;position: absolute;top: 32px;right: 0;bottom: 32px;left: 0;text-align: center;background-color: #888;background-image: url(images/texture.png)}

Specifically the "background-image:" part of the CSS. What you need to do is to change texture.png to an animated loading icon (i.e., an animated gif file), set the image to non-repeating and then set the image so that it appears in the centre of the screen. You can see it live in action here: http://www.cambridgekids.org/m29/course/view.php?id=2 Login as guest. Anything is possible with programming. Endless possibilities. Cheers Frankie Kam, Malaysia.

guidodo commented 8 years ago

In essence all that is needed (for PDF files) is to split up:

PDFJS.getDocument(location).then(function loadPDF(doc) {

and hook up a onProgress function:

var pdfjsTask = PDFJS.getDocument(location);
pdfjsTask.onProgress = function(obj) { ... }
pdfjsTask.then(function loadPDF(doc) {

Full patch (against source code) is attached. It'll show an overlay with a HTML5 progress bar during download.