Help with viewer.js

[James McKenzie]

Hi there pdf.js community,

I recently discovered the pdf.js viewer and I'm hoping for a little help finding some functions.

For my project, I have taken the viewer and modified it a bit to embed it within a surrounding webpage (staging site only). I have found that when I load the page, the window is automatically scrolled to the bottom, cutting off the header of the website. This only happens after a PDF is successfully loaded into the pdf.js viewer. I believe there is something in viewer.js that is trying to bring the PDF up to the top of the window, but I can't pinpoint it. Does anyone know what line of code is causing this?

I've also built a jQuery function that moves the viewer to a new location in the DOM in order to create a full-screen effect. When doing this, the pdf loses it's current page. I noticed that the codebase has the ability to remember the last page the user viewed - does anyone know what function I could call to initiate that after the user goes to full-screen?

Thank you very much - your assistant is very much appreciated!

James McKenzie
Communications Designer

( T 416 598-2233 ext.26 | F 416 598-1676
( Neglia Design Inc | 302 King Street East Toronto, ON Canada M5A 1K6
( http://www.NegliaDesign.com | ja...@negliadesign.com

[Brendan Dahl]

On Aug 6, 2012, at 7:56 AM, James McKenzie wrote:

> For my project, I have taken the viewer and modified it a bit to embed it within a surrounding webpage (staging site only). I have found that when I load the page, the window is automatically scrolled to the bottom, cutting off the header of the website. This only happens after a PDF is successfully loaded into the pdf.js viewer. I believe there is something in viewer.js that is trying to bring the PDF up to the top of the window, but I can't pinpoint it. Does anyone know what line of code is causing this?

There are a few places that we use scrollIntoView in https://github.com/mozilla/pdf.js/blob/master/web/viewer.js

> I've also built a jQuery function that moves the viewer to a new location in the DOM in order to create a full-screen effect. When doing this, the pdf loses it's current page. I noticed that the codebase has the ability to remember the last page the user viewed - does anyone know what function I could call to initiate that after the user goes to full-screen?

I'm not sure you want the remembering part, you can just use PDFView.page and then after you make it "fullscreen" just set PDFView.page back to that page number and it should scroll it back into view. We also now include a full screen function, you may want to look at it for ideas on how to get yours to work. https://github.com/mozilla/pdf.js/blob/master/web/viewer.js#L1103


Brendan

[James McKenzie]

Brendan thank you so much for your help! I was able to get the PDFView.page working well, though I'm still struggling with the scrollIntoView function. It appears the standard behaviour of scrollIntoView() is to scroll both the inline div as well as the entire page body. I've not been able to find a way around that. Do you happen to know how I can isolate the scrolling behaviour to only the inline div that contains the pdf?

Thanks again,

James

[Yury Delendik]

James,

Yes, it's a well-known issue with scrollIntoView --
https://github.com/mozilla/pdf.js/issues/1738. Best thing is to replace
this method to the custom one, which will traverse the DOM tree and
calculate the scroll offset based on the elements margins, borders, and
paddings.

Thanks.

> _______________________________________________
> dev-pdf-js mailing list
> dev-p...@lists.mozilla.org
> https://lists.mozilla.org/listinfo/dev-pdf-js

[James McKenzie]

I've found the solution to my problem.

To prevent my entire web page from scrolling when scrollIntoView is called, I use some code from http://jsfiddle.net/QN3mK/

Each time before scrollIntoView is called within viewer.js, the code takes note of the current scroll position, and then re-enstates that position after scrollIntoView runs.

Cheers!

-James

[muhammada...@gmail.com]

I want to load PDF inside div along with left side content & top header contents, on demand, like click of button, rendering partial view, i want to load only first page then on next page click load second one..and so on

[supriya...@gmail.com]

Hi Brenden,

I am developing a web Application for PDF Rendering using Pdf.js,core.js etc
I need to store the content into a local storage in core.js.I am unable to do so as the localstorage access throws an error saying undefined.
ALso we are planning to store the contents in server.Kindly suggest.