export to PDF

[CB]

Hello out there,
first of all: This is a great tool. I love it sooo much.
But: Is there any way of exporting the slides to PDF?
This is for me the deal breaker right now as we are comparing online
presentation tools in HTML5 right now and I would love to use deck.js
for our projects.

Perhaps some once can point me into the right direction?
Like: how is the presentation created in deck.js within html5? is this
canvas?
I saw there are js on the web for downloading a png of the current
canvas.
Is this the road to go or are there better ways for this?

Any help and ideas highly appreciated...

CB

[Caleb Troughton]

This is relatively new, and as you can see in the README, incredibly young and untested, but give this a try:

https://github.com/imakewebthings/deck2pdf

[Rémi]

Hi Christian, Hi Caleb,

I also have/had to provide printouts from my deck.js presentation. I will have a look at Caleb's solution, it seems to be good.
To answer one of your questions, deck.js is not going through a canvas, it is pure html.
Sometimes, I need high quality printouts so maybe it won't fit my needs: it seems to be going through png and thus rasterizing vector graphics and text.


For now, I am using a custom firefox extension (https://github.com/twitwi/firefox-pdfsequenceprint).
In practice, I manually select which slides to export in order to skip some of the subslides/animations. The extension makes it easy to export each slide as pdf and then I use pdftk to concatenate them.
The extension is still very rough and makes some suppositions (works for me, no packaging, ...) but with some work we can easily improve it.


I previously went through the process of finding a good modern presentation tool. I ended up with deck.js because it is the best ;) (http://home.heeere.com/tech-deckjs.html).
Please note that when trying deck.js right now, you can feel that the scaling of slides is not adapted (the scale extension changes the font size). I want to soon release an extension that proposes another way of scaling: you design your slides at a given resolution (e.g. 800x600) and they are rescaled to the container size (e.g. 400x300 for thumbnails, 1280x1024 for fullscreen) with options to keep the aspect ratio or not, etc. That is how I am currently designing my slides these days (unfortunately I cannot publicly disclose them as an example).
When doing your comparison, you can suppose that this feature is available.


Rémi

[Caleb Troughton]

The extension makes it easy to export each slide as pdf and then I use pdftk to concatenate them.

 

Yea, the deck2pdf scripts rasterize to png first, then combine each png into a PDF, so no vector goodness. The README mentions this is a method used by an old version of the PDF generator for the Slippy presentation package.  In fact, the new version of Slippy's PDF generator uses PhantomJS to create multiple individual slides as PDFs and then pdftk to combine them all into one. If anybody wanted to make a pull request to deck2pdf that moved over to this tactic I'd probably accept it blindly.  But this rasterization method just happened to be the quickest way I could hack it together, to get the project started.

 

Please note that when trying deck.js right now, you can feel that the scaling of slides is not adapted (the scale extension changes the font size). I want to soon release an extension that proposes another way of scaling: you design your slides at a given resolution (e.g. 800x600) and they are rescaled to the container size (e.g. 400x300 for thumbnails, 1280x1024 for fullscreen) with options to keep the aspect ratio or not, etc. 

"Changes the font size" may not be the best description, but I know what you mean. It scales each slide separately, effectively reducing the font size uniformly on any given slide but resulting in widely varying sizing across a deck.  deck.scale USED to work the way you're wanting it to work, by scaling all slides the same amount, but it did so by scaling the whole deck container. It had the nasty side effect of scaling everything inside the deck, including the extension HTML (the status indicator would often end up unreadable and floating in the middle of the page). A few months bacck, when reworking deck.scale to use a wrapper around each slide that does nothing but scale, I switched to this new per-slide style.  I personally don't mind it, but totally understand how others would find it undesirable. I'd be willing to accept a pull to the existing scale extension that added an option to switch tactics, taking the worst-case scale and using that value for all slides.

The second part of this alternative scale you're working on, the predefined and preserved aspect ratio: I like the idea and would also be willing to incorporate that into the existing scale extension someday.  It seems like something that should work as expected, but would not surprise me if it turned up a few hairy cases. Keep me updated on your progress with your extension or let us know on this list when it's ready.

- Caleb

[Rémi]

Christian, Caleb, all,

On 23/05/12 12:17, Rémi wrote:

...

I want to soon release an extension that proposes another way of scaling: you design your slides at a given resolution (e.g. 800x600) and they are rescaled to the container size (e.g. 400x300 for thumbnails, 1280x1024 for fullscreen) with options to keep the aspect ratio or not, etc. That is how I am currently designing my slides these days (unfortunately I cannot publicly disclose them as an example).
When doing your comparison, you can suppose that this feature is available.

I pushed an early, operational, tested (firefox and chromium), version but with only a minimal example to a branch of my repo
  https://github.com/twitwi/deck.js/tree/newmaster

Note that I had to override a few css properties (from the core css file) in the html example.
It might be needed to view the samples/deck-fit.html sources to understand a little more the usage of the extension. In the example you can resize the container to experiment with it or press 's' to switch to fullscreen.

I'm not sure of when I will have time to make a proper documenting example...

Rémi

[remi-1...@heeere.com]

Hi Christian, Hi all,

Some months ago, we talked about an extension for scaling the slides in "the proper way" (with some definition of "proper" :) ).

After some cleaning, the extension is available, together with a simple interactive demo:
        http://home.heeere.com/tech-deckjs-ext.html

Enjoy and don't hesitate to give feedback.
Thanks,
Rémi