New plugin: ViewerJS to open ODF and PDF directly in the browser

[silverhook]

People often put documents and slides in PDF and ODF on their websites and it’d be really cool if Pelican would have a plugin where visitors could just open the document in the browser or even the blog writer could embed the document into the blog post itself.

Luckily, there are WebODF and PDF.JS that do exactly that and they’re both packaged into one neat script called ViewerJS!

All that would need to be done is to include ViewerJS as a plugin and that would take care of the magic! :dancers:

The instructions seem to be pretty easy – basically we’d just need modify the links to prepend "/ViewerJS/#.. in the href field.

Embedding the documents though, is just a bit more tricky and I haven’t the foggiest (yet) how to deal with iframe and in Pelican.

[florian-wagner]

:+1: I like the idea. Something like a view directive:

.. view:: test.pdf

[silverhook]

@florian-wagner proposed:

.. view:: test.pdf

Excuse my ignorance, but is your proposal to use another command/label in the markup (if so, I suppose you wrote in RST)? If so, We have to think of a valid MarkDown alternative as well.

How about this (inspired by the <img> markup):

?[]({filename}/documents/test.pdf)

or

?[][link_to_doc]

[link_to_doc]: {filename}/documents/test.pdf

If though, your proposal was that Pelican (with this specific plugin e.g.) would automatically embed PDF and ODF, than I don’t think that’s a good idea. Or at least, that this would be an option that the user can opt in or out.

[florian-wagner]

Yes, I am writing in rst, but obviously there should be a markdown method as well. The user can opt in or opt out by installing the plugin or not, but it would by nice if pdf files could be embedded as easily as images or youtube videos. So I just wanted to give you a :+1: for the idea :-)

For the time being, I excluded the viewer.html from pelican processing and keep it as an external static page: http://www.fwagner.info/javascript/pdfjs/web/viewer.html?file=/paper/JAG2015.pdf#pagemode=thumbs But ideally, I would love to have it integrated with the rest.

[justinmayer]

Anyone in this discussion want to work on implementing this as a plugin?

[zoenglinghou]

Is there any update with the plugin?

[kdeldycke]

This mono-repository no longer accept any submission of Pelican plugin as submodules. Instead, new plugin should be packaged as independent modules so you'll be free to publish them out on PyPi.

To help, there a plugin template available at: https://github.com/getpelican/cookiecutter-pelican-plugin

[liu2g]

For future people interested in using this in their Pelican website, and before this being implemented as a plugin (I'm sorry I wish I could but I'm not a front end person), here is my "hack and dirty" way to use it.

1. Download ViewerJS from their website
2. Unzip the ViewerJS folder into the content folder in the website repo
3. Add 'ViewerJS' to STATIC_PATHS in pelicanconf.py
4. To insert the viewer, use line in the markdown file (I assume rst works too) <iframe src = "ViewerJS/#../path/to/file.pdf"> </iframe>

Pay special attention to the src field, and the first / is needed in the path to file

In addition, someone in this post points out that

...That (ViewerJS) could be added to your theme then use a raw directive to display it

and

"Added to your theme" means modify your Sphinx theme's templates. See sphinx-doc.org/en/stable/templating.html...

With very little front end experience so far, I unfortunately was not able to follow them, so if someone understands it, please give better suggestions.