Rise: Print to PDF

[luctrudeau]

Reveal.js supports the following option :

_Open your presentation with print-pdf included anywhere in the query string. This triggers the default index HTML to load the PDF print stylesheet (css/print/pdf.css). You can test this with lab.hakim.se/reveal-js?print-pdf._

ref: https://github.com/hakimel/reveal.js/

I tried adding ?print-pdf to my ipnb url but it does not work.

I was wondering if it was possible to enable it with RISE. This way I can make handouts for students.

[damianavila]

It should be possible, and it fact, it should work... I will try to investigate soon.

[bs1234]

I am also interested in this

What is the easiest way to print to pdf for slides created via RISE?

I try the following: jupyter ipnyb -> slides (via rise) -> print to pdf (using chrome print options)

However, result is: only the _currently active slide is printed_

Any advice for simplest way to convert slides to pdf?

[damianavila]

Any advice for simplest way to convert slides to pdf?

Probably using nbconvert and then print-pdf as stated here: https://github.com/hakimel/reveal.js#pdf-export, BUT I did not checked it lately... and usaually pdf exportation for reveal have problems (not sure if it is stable now, I have to check).

[aaronbarzilai]

Damian,

I'd love to make this work too. I tried to use your instructions above but I'm not sure I'm following. What are the steps needed if I have a notebook on my windows box at "C:\MyDir\MyNotebook.ipynb"?

[aaronbarzilai]

I managed to figure it out after more testing, thought I'd leave the instructions here:

1. Generate the slides and serve them using nbconvert:
   jupyter nbconvert --to slides "C:\MyDir\MyNotebook.ipynb" --post serve
2. It opens up a webpage for me in my browser at:
   http://127.0.0.1:8000/MyNotebook.slides.html#/
3. Add print-pdf to the querystring as
   http://127.0.0.1:8000/MyNotebook.slides.html?print-pdf
   (Note My error was leaving in the #/)
4. The page then renders the slides vertically.
5. Save to PDF in Chrome using the print option (e.g. Ctrl-P)

[damianavila]

Thanks for the detailed step @aaronbarzilai
Can you tell me which Chrome version are you using?
Are the pdf respecting correctly the slide limits?

[bs1234]

@aaronbarzilai thank you, thank you!.

Im still struggling with this. I get the error below when i try to follow your steps, is there something obvious I should check or configure (im not familiar with nbconvert)

OSError: [WinError 10048] Only one usage of each socket address (protocol/networ
k address/port) is normally permitted

[aaronbarzilai]

Version 46.0.2490.86 m
I'm on Windows 7 still.

As far as I can tell it is respecting the slide limits, but I'm just
getting started with RISE so I am not sure I've fully explored that.

Thanks,
Aaron

On Tue, Nov 24, 2015 at 2:32 PM, Damián Avila [email protected]
wrote:

Thanks for the detailed step @aaronbarzilai
https://github.com/aaronbarzilai
Can you tell me which Chrome version are you using?
Are the pdf respecting correctly the slide limits?

—
Reply to this email directly or view it on GitHub
https://github.com/damianavila/RISE/issues/127#issuecomment-159381512.

[bs1234]

I was receiving this error: "[WinError 10048] Only one usage of each socket address (protocol/network address/port) is normally permitted"
And it turns out the default IP and port 127.0.0.1:8000 were already being used by something else.

So, inspired by this issue, https://github.com/jupyter/nbconvert/issues/102#issuecomment-140565165
I changed the default IP address in serve.py from 127.0.0.1 to 127.0.0.2.

Now I _do_ see the webpage in the browser (hooray!) but still have several issues (boo)
1) Any images that had relative file paths are now not found
2) Adding "?print-pdf" doesn't appear to do anything.
3) Printing or saving to PDF does not respect the slide breaks

I also see several of these types of errors in the console:
ERROR:tornado.access:500 GET /reveal.js/js/reveal.js (127.0.0.1) 20006.00ms
ERROR:tornado.access:500 GET /reveal.js/lib/js/head.min.js (127.0.0.1) 20005.00m
ERROR:tornado.application:Uncaught exception GET /reveal.js/js/reveal.js (127.0.0.1)

My questions:
1) was changing serve.py to 127.0.0.2 a good thing to do?
2) Do i need to change that IP address elsewhere because of the tornado errors?

Any advice gratefully received to learn how to print to PDF.

[anaderi]

my workflow:

• ipython nbconvert --to slides Analysis-scheme1.ipynb --reveal-prefix https://cdn.jsdelivr.net/reveal.js/2.6.2
• python -m SimpleHTTPServer 8080
• go to URL http://server:8080/Analysis-scheme1.slides.html?print-pdf with Chrome-based browser
• Cmd-P
  and it renders all slides as separate pages in needed page orientation. Although
  
  
  
  • the headings looks quite different from what I see if I just press 'RISE slideshow' button and
  
  
  • (the most annoying part) I don't see slide numbers on those pages.
  
  

Are there any ideas how can those two can be fixed?

EDIT: of course it would be nicer if one could just append '?print-pdf' to the URL generated as one presses 'livereveal' slideshow button in jupyter toolbar.

[bs1234]

@anaderi thank you, thank you!
This was super helpful for me so adding a few comments for anyone else trying this:

My workflow (with Anaconda 3.4):

• cd to the directory containing my_notebook.ipynb
• ipython nbconvert --to slides my_notebook.ipynb --reveal-prefix https://cdn.jsdelivr.net/reveal.js/2.6.2
• open the file that was created in current directory: my_notebook.slides.html
• append "?print-pdf" to end of URL

Then chrome can print PDF of all slides _as they appear in HTML slides_.
This is the catch, because the slides created this way are different to those created with RISE.
I see scroll bars around some titles.
As well as the scroll bars around dataframes & charts (created with Bokeh) that I see with RISE
However, images are correctly scaled, so never have scroll bars.

My questions for anyone more knowledgeable:

1) How to use nbconvert but force all dataframes, titles, and charts (Bokeh) to be scaled to fit on page (so no scroll bars)
2) How to add page numbers to each slide
3) How to increase page width

Apologies if these are basic questions
thanks in advance,

[anaderi]

(a couple of months later) @damianavila, do you think there are any chance this one would be resolved soon?

[damianavila]

You mean print-pdf from the slideshow view?

Regrettably, currently, I almost don't have time to make it work... but it is in my top priority to check this again when I have some time available...

[anaderi]

maybe summer will promise a glimpse of a free time for this issue? )

[damianavila]

maybe summer will promise a glimpse of a free time for this issue? )

Maybe... :wink:

[anaderi]

meanwhile ... I've managed to merry RISE with decktape. works reasonably well.
https://github.com/astefanutti/decktape/pull/57

[damianavila]

That's great to know... Printing PDF from HTML slides was always a nightmare... I am happy to instruct people to use other packages if the resulting pdf quality is something reasonable.
Do you have any output to take a look?

[anaderi]

I have a private example (research I'm not allowed to share). If you give me link to a RISE-enabled notebook with reasonable dependencies , I'll send you the link to the slides decktape produces )

[damianavila]

If you give me link to a RISE-enabled notebook with reasonable dependencies , I'll send you the link to the slides decktape produces )

OK, I will do that... and post the link here and I will ping you...

[anaderi]

JFYI, the PR has been accepted and it is part of decktape now.

[damianavila]

Thanks for the ping @anaderi

[shortcipher3]

@anaderi I tried your decktape solution, looks very promising, but I get a ReferenceError that phantomjs can't find variable Reveal. Did I miss a step in the setup?

./bin/phantomjs.exe decktape.js rise http://localhost:8888/notebooks/test_slides.ipynb#/slide-0-0 test2.pdf
Loading page http://localhost:8888/notebooks/test_slides.ipynb#/slide-0-0 ...
Default extension for cell metadata editing loaded.
Raw Cell Format toolbar preset loaded.
Slideshow extension for metadata editing loaded.
actions jupyter-notebook:find-and-replace does not exist, still binding it in case it will be defined later...
Loading page finished with status: success
load_extensions [object Arguments]
RISE DeckTape plugin activated
Loading extension: jupyter-js-widgets/extension
Loading extension: livereveal/main
Session: kernel_created (2a77b57a-5ff9-4aaa-8f4d-80c760a6042e)
Starting WebSockets: ws://localhost:8888/api/kernels/2a1253bd-e789-4417-acf2-f8d30ddd21f9
+- ReferenceError: Can't find variable: Reveal
|_ phantomjs://webpage.evaluate(): 2
|_ phantomjs://webpage.evaluate(): 9
+- ReferenceError: Can't find variable: Reveal
|_ phantomjs://webpage.evaluate(): 5
|_ phantomjs://webpage.evaluate(): 6
Kernel: kernel_connected (2a1253bd-e789-4417-acf2-f8d30ddd21f9)
loaded widgets
Kernel: kernel_ready (2a1253bd-e789-4417-acf2-f8d30ddd21f9)
Widget backend and frontend versions are compatible
+- ReferenceError: Can't find variable: Reveal
|_ phantomjs://webpage.evaluate(): 2
|_ phantomjs://webpage.evaluate(): 8
TypeError: null is not an object (evaluating 'index.length')

[ssanderson]

I hit the same issue as @shortcipher3 this morning as well.

[astefanutti]

@shortcipher3 @ssanderson would that be possible for you to increase the delay here: https://github.com/astefanutti/decktape/blob/18d1e1537fe85c7d5cd9cdaa4f46184eda7241b0/plugins/rise.js#L36 and give it a try? It may be that it takes a bit more time for Reveal.js to initialise depending on your setup.

[shortcipher3]

@astefanutti I increased my delay from 2000 to 200000 with the same result. I tried it with a simplified slide deck (two slides, text only), so the slides themselves shouldn't be crazy.

[anhi]

@shortcipher3 @astefanutti For me, the problem was that the start_livereveal button was not yet loaded, which happens before the delay mentionend by @shortcipher3. Adding --loadPause=5000 to the decktape command line fixed the issue for me.

[astefanutti]

@anhi thanks. I can't remember if I used the loadPause option when I tested the RISE plugin. If @shortcipher3 confirms that fixes the issue, I'll add a default delay specifically to the RISE plugin so that users don't have to face that cryptic error message.

[shortcipher3]

I additionally needed to update my version of RISE, but is now working. Thanks @anhi and @astefanutti

[astefanutti]

@anhi @shortcipher3 I've just fixed a race condition in the RISE plugin configure in astefanutti/decktape@2dd3fbd1609a6e36faf9b148bc5fcf0165c2ad99. thanks for the feedback! @damianavila if you have a moment, that'd be great if you could have a look to see whether there is a possibility to replace the delays with deterministic conditions for the Jupyter notebook and RISE extension load completion.

[damianavila]

I guess we can emit some kind of event when the extension is finally "loaded" on the slideshow view... From the top of my head we don;t have anything on the notebook js machinery to do that, so I think we should need to solve it on RISE itself...

[schlichtanders]

@anaderi @shortcipher3 @ssanderson @astefanutti @damianavila
you all seem to be able to run decktape on top of a RISE reveal presentation.

Unfortunately I wan't able to see what you've done. Is there a decktape jupyter notebook extension which is undocumented still?
Or what is the way to get this run?

Thanks in advance for any help

[schlichtanders]

I now tried something and got somehow the same error which was already reported
(the url referred to in the very first cmd execution line points to a running RISE-Live-Presentation, where surprisingly the URL stays the same after I close the RISE-Live-Presentation)

D:\Projects\decktape>phantomjs decktape.js rise --loadPause=5000 http://localhost:8888/notebooks/doc/presentations/datascience.ipynb#/slide-0-0 D:\Downloads\test_rise.pdf
Qt: Untested Windows version 10.0 detected!
Loading page http://localhost:8888/notebooks/doc/presentations/datascience.ipynb#/slide-0-0 ...
Loading page finished with status: success
RISE DeckTape plugin activated
+- ReferenceError: Can't find variable: Reveal
|_ phantomjs://webpage.evaluate(): 2
|_ phantomjs://webpage.evaluate(): 9
+- ReferenceError: Can't find variable: Reveal
|_ phantomjs://webpage.evaluate(): 5
|_ phantomjs://webpage.evaluate(): 6
+- ReferenceError: Can't find variable: Reveal
|_ phantomjs://webpage.evaluate(): 2
|_ phantomjs://webpage.evaluate(): 8
TypeError: null is not an object (evaluating 'index.length')

Any help is highly appriciated

My Environment
Operating System: Windows 10
Phantomjs: the recommended one from Decktape
Decktape: master 23.03.2017
RISE: master 23.03.2017

[schlichtanders]

So I was able to do render it. For others who also found this issue like me, wanting to render a pdf, here is what I did:

1. git clone https://github.com/astefanutti/decktape
2. download decktape's forked version of phantomjs (see https://github.com/astefanutti/decktape)
   # Windows (MSVC 2013), for Windows Vista or later, bundles VC++ Runtime 2013 $ curl -L https://github.com/astefanutti/decktape/releases/download/v1.0.0/phantomjs-msvc2013-x86.exe -o phantomjs.exe # Mac OS X (Cocoa), 64-bit, for OS X 10.6 or later $ curl -L https://github.com/astefanutti/decktape/releases/download/v1.0.0/phantomjs-osx-cocoa-x86-64 -o phantomjs # Linux (static build), 64-bit, requires fontconfig (CentOS) or libfontconfig (Debian, Ubuntu) $ curl -L https://github.com/astefanutti/decktape/releases/download/v1.0.0/phantomjs-linux-x86-64 -o phantomjs
3. put phantomjs on your PATH
4. start jupyter-notebook server
   [you don't have to start the rise presentation, you even don't have to open any notebook at all I think]
5. cd decktape
6. within decktape's cloned repository run the decktape.js file like phantomjs decktape.js rise <Jupyter-Notebook-URL> <Output-File>.
   More concretely it looks something like the following:
   $ phantomjs decktape.js rise http://localhost:8888/notebooks/your/notebook.ipynb?token=5413981230123YourIndividualJupyterNotebookSessionToken412417923 /path/to/outputfile.pdf
   Note that the jupyter-notebook session token which seems needed for more recent jupyter-notebook versions. The token is shown to you when you start the jupter-notebook server from commandline.

Possible Problems:

• If I run decktape.js with wrong token first, or some other things first, it appeared to me that even if I correctly entered everything afterwards, it still failed.
  Restarting the jupyter-notebook server helped
• In between I had the impression that things didn't worked when using chrome as the default browser (compared to firefox), however in the end I was able to generate the .pdf also using chrome as default too. Probably this impression was only an accident by confusing something else.
• if you have changed the default presentation size/width/height using the notebook metadata, you might have to adapt the call to include the -s <width>x<height> parameter.
  E.g. phantomjs decktape.js rise -s 1500x900 https://localhost:8888/...
• if you experience issues when rendering svg files, please post your fix here https://github.com/astefanutti/decktape/issues/90
• [EDIT - added] math rendering problems: just try to rerender, it did different things in my case if I just immediately rerun and sometimes the output was kind of ok. I posted the issue here https://github.com/astefanutti/decktape/issues/91

Enjoy!

[schlichtanders]

One problem I experienced which is worth mentioning separately is that the fragments don't show up at all.

The current decktape rise plugin puts fragments: false, see https://github.com/astefanutti/decktape/blob/master/plugins/rise.js#L40 which should render everything together I think. Unfortunately this is not the case for, but I see only each initial slide without any fragments.

Work Around:

When changing the above line to fragments: true, every fragment is rendered as a single slide which is a very efficient work around for the moment as you can simply delete the unwanted slides afterwards. At least using this method you have everything in the pdf output.

[damianavila]

Thanks for all this info @schlichtanders

[ckirches]

I'm getting the same "ReferenceError: Can't find variable: Reveal" and am stuck. How did everyone get this to work? What might I be doing wrong?

[abhisheietk]

Have you added token information in the url. as suggested by @schlichtanders

[thallada]

Maybe there's a way to use Headless Chrome to visit each slide, print to pdf (using the --print-to-pdf flag), and then combine all the pdfs into one at the end?

[damianavila]

Maybe there's a way to use Headless Chrome to visit each slide, print to pdf

It could be probably a nice idea to test.

[lucasdurand]

Not sure if this has been addressed, but I've been struggling to get colours in custom.css to display when printing to pdf. It turns out the twitter bootstrap styles are dropping in print CSS that sets a bunch of things with !important, so it's necessary to flag as !important anything you're putting into custom.css

@media print {
  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }
... }

[damianavila]

Thanks for the note @lucasdurand (this is probably something to fix upstream, in the notebook css itself).

[lucasdurand]

You're absolutely right @damianavila. It's actually set in the notebook css file. Somewhere around here:
...Anaconda2\Lib\site-packages\notebook\static\style\style.min.css
and
...Lib\site-packages\nbconvertresources

[astefanutti]

@thallada, @schlichtanders, all, DeckTape 2.x now uses headless Chrome and has been updated to support RISE 5.x.

[damianavila]

Thanks for the info @astefanutti!

[jbednar]

Hi @damianavila, is there now a section in the docs explaining how to print to PDF like this? I tried installing DeckTape, but wasn't able to get it working, and it would be great to see a step by step example of doing so. I love RISE, but I also need to be able to share a PDF with people after the talk...

[damianavila]

There is not any reference in the docs about this.
We should try

1. validate what @schlichtanders posted above
2. try the reveal.js documented approach
3. convert using nbconvert and then to pdf using 2

Those are the alternatives, but we need to validate all of them.
I will try to take a look on this during the weekend and see if I can get a reasonable pdf.

[lucasdurand]

I have been using 3 for a few months now successfully. It produces reasonable PDFs as long as you restrict the amount of information on a slide, much less forgiving than the "live slides" view with Reveal.

[astrojuanlu]

I just used @aaronbarzilai method https://github.com/damianavila/RISE/issues/127#issuecomment-159355863 (see https://twitter.com/astrojuanlu/status/912178600916353024) but the syntax highlighting doesn't work. Does it happen to anyone else? Is there a quick workaround? If not, I will try DeckTape.

[astrojuanlu]

(note: adding !important to the relevant styles fixed the issue, so it's probably a similar problem than this one https://github.com/damianavila/RISE/issues/127#issuecomment-307891635 by @lucasdurand)

[damianavila]

Howdy all, the print issue was solved in notebook master (https://github.com/jupyter/notebook/pull/3212). We should see fix in our land soon (as soon as we have a new notebook release).

[astrojuanlu]

I tried this with notebook 5.4.0, which should contain the fix, and all the code is still black. But I guess this is not a problem in RISE...

[damianavila]

This needs to be propagated to the CDN from where nbconvert is fetching the css: https://github.com/jupyter/nbconvert/issues/747.

[damianavila]

@lucasdurand @schlichtanders I have written your recommendations in the docs, thanks for testing those options and share them.

[schlichtanders]

thank you too!

[lucasdurand]

Cheers! This was a wild ride