astefanutti / decktape Goto Github PK

There is a small detail that break the user experience of docker usage: we have to specify a path for the generated file (here: /pwd/export.pdf) even if we want to file to be saved on the current directory on the host.

The current command looks like:

docker run --rm -v `pwd`:/pwd  astefanutti/decktape http://remarkjs.com/ /pwd/export.pdf

Is there a way to prevent that and to specify only export.pdf on the command line and to export the file to the current directory (pwd) on the host?

docker run --rm -v `pwd`:/pwd  astefanutti/decktape http://remarkjs.com/ export.pdf

I tried to bind / (-v 'pwd':/) but I had an error:

docker: Invalid bind mount: destination can't be '/'. See 'docker run --help'.

Is there a hosted version of decktape anywhere? I'm picturing a simple webpage to which I can give a URL for a presentation and have it give me the PDF. Just curious if such a thing exists.

@astefanutti : this is part of my current HTML

<table width="100%" cellspacing=12 id="emailActiviation" bgcolor="white" style="border-top: solid 3px #AA1111;font-family: sans-serif;">
        <tbody>
                <tr align="left" bgcolor="#EBEBEB">
                        <td align="left" style="font-size: 30px;color:white ">
                            <a href="http://google.com"> <img src="http://blog.invstr.com/wp-content/uploads/2014/12/Apple-Store-Button-UK.png" alt= "Iphone" style=" max-height:40px; vertical-align: text-top; float:right;padding-left:5px" /> </a>

                        </td>
                </tr>

        </tbody>
</table>

I tried to print an presentation with decktape. At the end I get an error from phantomjs

Problemsignatur:
  Problemereignisname:  BEX
  Anwendungsname:   phantomjs.exe
  Anwendungsversion:    2.0.0.0
  Anwendungszeitstempel:    55c375c7
  Fehlermodulname:  nvinit.dll_unloaded
  Fehlermodulversion:   0.0.0.0
  Fehlermodulzeitstempel:   50ef1ca7
  Ausnahmeoffset:   72c7ce59
  Ausnahmecode: c0000005
  Ausnahmedaten:    00000008
  Betriebsystemversion: 6.1.7601.2.1.0.256.48
  Gebietsschema-ID: 1031
  Zusatzinformation 1:  0a9e
  Zusatzinformation 2:  0a9e372d3b4ad19135b953a78882e789
  Zusatzinformation 3:  0a9e
  Zusatzinformation 4:  0a9e372d3b4ad19135b953a78882e789

The PDF seems complete, but the PDF isn't printable :-(

I build my slides with flowtime.js, and then convert to pdf using the command:
.phantomjs decktape.js flowtime "/Users/name/etc/doc.html" "/Users/name/etc/doc.pdf" --size=1920x1080

This worked perfectly, but as of today I get the message "Killed: 9". I updated to OSX 10.12 earlier this week so that's probably related. I've updated to the latest version of decktape

Trying to use your custom build of PhantomJS 2 to generate PDFs. I am running into issues where the kerning is messed up on Linux (CentOS 6) where it is fine on OS X.

OSX: http://i.imgur.com/FAwKIFR.png
CentoS: http://i.imgur.com/FttX4XO.png

PhantomJS 1.9.8 doesn't work with web fonts, installing the font locally does not work either
PhantomJS 2.1 release doesn't support multiple pages
PhantomJS 2 master doesn't support multiple pages
Decktape's custom PhantomJS almost works, but with font kerning issues, its the closest I've been able to get.

Trying to get PhantomJS working properly has been the most frustrating thing I've ever done in my life. Should I try switching to Ubuntu or give up and user Slimer?

As per ariya/phantomjs#13822, PhantomJS Linux binary can be statically built so that only fontconfig or libfontconfig (depending on the distribution) package is required as a dependency on the host. That avoids having to generate and distribute distro-specific binaries.

Add an option that exports each slide as an image as it is creating the PDF. This can be accomplished by calling the page.render method before the printer.printPage call.

The benefit of exporting each slide to an image is that those images can then be used independently to create other documents, such as a handout that includes slide notes under each slide image.

Currently, it seems that only raster images are supported (png, jpg). Ideally, it would be possible to also have slides exported as SVGs (for all the same benefits, and more, that decktape provides by creating a PDF).

Refactor the existing plugins to be more compliant with standard CommonJS patterns.

As some properties are common to all the plugins (actually added in the main decktape.js script), exporting anonymous prototype with prototypal inheritance may be a better option over exporting anonymous function.

I've been struggling to export my Remark presentation. My slides have backgrounds using CSS3 Linear Gradients, and these appear not to work with decktape. This is the CSS I use for the slides:

.remark-slide-content.blue {
    background: #7474BF;
    background: -webkit-linear-gradient(-30deg, #7474BF, #348AC7);
    background: linear-gradient(-30deg, #7474BF , #348AC7);
    color: #fdfdfd;
}

All my slides are exported with white background. If I remove the linear gradient (both with and without -webkit prefix), it works (I get the solid BG color as specified). If I leave the gradient (I've tried leaving only the prefixed one, the not prefixed one, and both), I get a white background.

On a side note (and possibly another bug, but I don't want to get into it right now, it just helps eliminate some things on this issue), PhantomJS seems to render linear gradients. My slides used to have animate.css fade-in transitions. When I have these on, my slides are exported as raster images (bitmaps) inside the PDF, instead of text. In this case, I get the linear background just fine (but my slides are now images instead of texts). When I remove the animations, I get regular text inside the PDF, but no background.

I'm pretty lost, I must say!

Running something like ./bin/phantomjs decktape.js -p 1000 generic http://localhost:8080/ a.pdf gets the next exception: Error opening /Users/user/git/decktape/generic: No such file or directory

I tried to export the default reveal presentation: http://lab.hakim.se/reveal-js/ but decktape get stuck:

$ npm start reveal http://lab.hakim.se/reveal-js/ rev2.pdf

> [email protected] start /home/romain/Documents/dev/decktape
> ./bin/phantomjs decktape.js "reveal" "http://lab.hakim.se/reveal-js/" "rev2.pdf"

Loading page http://lab.hakim.se/reveal-js/ ...

And nothing else happens until I press ctrl-C.

Can anyone confirm the behaviour?

This happens with the git install of decktape, and with the docker version (see #51).

It's great that in 1.0.0 text is properly kept in PDF (#3), however I discovered an issue with monospaced fonts rendering (a variable-width font is used) . It is especially problematic with source code. The following presentation fragment in remark.js (0.12) has been rendered with old decktape and 1.0.0 (attached).

# Power Assertions - basic case

 - reused Java `assert` keyword

```groovy
assert (2 + 3) * 4 != (2 * 4) + (3 * 4)
```

--
 - self explaining reason of failure

```groovy
Assertion failed:

assert (2 + 3) * 4 != (2 * 4) + (3 * 4)
          |    |   |     |    |    |
          5    20  false 8    20   12
```

In a case there would be a problem with reproduce that issue I can provide complete example.

Hi,

I've made a Dockerized version of Decktape. It's kinda nice, as you don't need to worry about install phantomJS etc. Instead you can just run something like:

docker run amouat/decktape reveal http://192.168.99.100:8000/ /pres.pdf

And you're at the races. If you like, I'm happy for you to copy the Dockerfile into your project, which has the advantage that you can set-up an automated build that will build a new container whenever the source code changes. Otherwise, I'll just force a rebuild of my project now and again.

https://github.com/amouat/decktape-docker
https://hub.docker.com/r/amouat/decktape/

Adrian.

Is it possible to extract the title of a presentation and embed it in the exported PDF? I've tested a few of the generated PDFS using PyPDF2, and none of them have title metadata. I guess this may be hard or impossible for some or all of the plugins.

The main driver for this is that I'd like to be able to extract the title in decktape.io to generate better filenames.

My Remark slides use Flexbox extensively. After many hours I finally figured out how to make my slides kind of work with Phantom 2.0's Flexbox support. Are there plans to update to Phantom 2.1? It has much better Flexbox support.

error

1. wget https://gnab.github.io/remark/\#1
2. download remark js locally
3. jekyll serve
4. open http://localhost:4000 works nicely
5. ~/git/decktape/bin/phantomjs ~/git/decktape/decktape.js remark http://127.0.0.1:4000/ --slides 1-5 remark.pdf

Loading page http://127.0.0.1:4000/ ...
Loading page finished with status: success
Remark JS DeckTape plugin activated
Printing slide #1       ( 1/19) ...      Regenerating: 1 file(s) changed at 2016-05-05 02:58:32 ...done in 0.003893 seconds.
Printing slide #4       ( 4/19) ...      Regenerating: 1 file(s) changed at 2016-05-05 02:58:36 ...done in 0.00326 seconds.
Printing slide #5       ( 5/19) ...
Printed 5 slides

1. move contents of <textarea id="source"> </textarea> into body.md and add argument to remark.create sourceUrl: 'body.md',
2. restart jekyll, http://localhost:4000 still works nicely
3. but ~/git/decktape/bin/phantomjs ~/git/decktape/decktape.js remark http://127.0.0.1:4000/ --slides 1-5 remark.pdf produces just empty slide:

➜  ~/git/decktape/bin/phantomjs  ~/git/decktape/decktape.js remark   http://127.0.0.1:4000/ --slides 1-5 remark.pdf
Loading page http://127.0.0.1:4000/ ...
Loading page finished with status: success
Remark JS DeckTape plugin activated
Printing slide #1       (1/1) ...
Printed 1 slides
➜  bug       Regenerating: 1

What am I doing wrong?

I think there is an issue when the slide URL has a "&" character

bin/phantomjs decktape.js http://localhost/test/index.php?r=test/viewslides&id=64 test.pdf

I get:

filename argument is required

Usage: phantomjs decktape.js [options] [command]

command one of: automatic, csss, deck, dzslides, flowtime, generic, impress, remark, reveal, shower, slidy
url URL of the slides deck
filename Filename of the output PDF file

Works fine when URL has no "&"

Hello,

Im trying to run decktape on localhost. Using MAC OS X.

I run command:

./bin/phantomjs decktape.js reveal http://localhost/test/slides.html test.pdf

I get this error:

filename argument is required

Usage: phantomjs decktape.js reveal [options]

url URL of the slides deck
filename Filename of the output PDF file

What am I doing wrong?

I've a reveal presentation that exports very well with this command:

$ ./bin/phantomjs decktape.js reveal http://reveal.local/ reveal.pdf

The problem is on the internal PDF links that opens the browser to go to the original content.

What I'd like is that the internal links of the presentation converts to internal links in PDF.

Is that possible? I'm doing something wrong?

My HTML links are like this one:

<a href="#/section-01">Internal example link</a>

Thanks

Is there any way we could get a 32-bit version of the binary for windows available? Our enterprise has 32-bit windows installed and won't let us install visual studio or compilation tools to build it ourselves.

Any help would be appreciated. Thanks!

Adding an SVG image to markdown as an image causes any background image to be positioned incorrectly.

background-image: url(images/background.png)

# Slide with SVG

The background has a vertical offset

![](images/drawing.svg)

Only tested with remarkjs on Windows. DeckTape dfc4b77,

Example output

Without SVG:

With SVG:

Testcase

https://github.com/rbirkby/DeckTapeIssue

If I render my Jupyter Notebook / RISE presentation, any cells marked as "Fragment" are omitted from the PDF.

I couldn't find a configuration option in reveal.js to force all fragments to be displayed immediately. The fragments: false option used in the RISE plugin seems to disable displaying all fragments also when used in an interactive browser (by adding ?fragments=false to the URL).

My work-around is to turn fragments into normal cells before rendering, but that's of course not optimal.

Currently there are precompiled binaries for Win, OSX, CentOS and Debian. But not for Ubuntu. So I've built one for Ubuntu 16.04. If I give you a link where you can pull this new Ubuntu binary would you be interested in making this binary available on http://astefanutti.github.io/decktape/downloads?

I'm working with shower.js
My OS is Ubuntu 14.04 64bits
I'm trying to render the presentation to PDF
My phantom build is working

I run the following command

 ./phantomjs/bin/phantomjs decktape.js shower http://labs.webgeodatavore.com/presentation-openstreetmap/ output.pdf

I have two issues:

• The first one is identical to #3: On Ubuntu,it rasterizes all the slides content. Using wine with Windows binary help me avoid this issue
• Another one is the fact that no html link can be clicked in the presentation whereas I have some of them in the HTML version

Are you able to reproduce the second issue? How can I help to solve it?

I had decktape happily running until I upgraded my Ubuntu box to 15.15. Then running the forked version of phantomjs produces the following error:

./bin/phantomjs: error while loading shared libraries: libicui18n.so.52: cannot open shared object file: No such file or directory

I'm thinking it's probably because that binary was compiled on ICU52 and the only version available on the Ubuntu 15.10 repos is 55? Any advice most appreciated.

Let me also take the opportunity to thank the developers for an awesome piece of code, I use decktape to generate pdf versions of all my lecture slides and works wonders!

Not sure which of the supported frameworks have "Speaker Notes" (like remarkjs has).

It would be useful to be able to print

• slides + note pages
• note pages alone (numbered according to corresponding slides)

Ideally, that should be a global option supported for all presentation backends.

As in Issue #17 I have a problem with the printer. I installed PhantomJS as told in the Build-section but nevertheless it doesn't work.
Afterwards I saw that this tool isn't capable to work with Shower 2 but nevertheless I find it awkward that PhantomJS doesn't work although it is installed. Can there be a conflict with the installed "real" PhantomJS 2?

I've got a reveal.js presentation with

            Reveal.configure({
                keyboard: {
                    65: function() {
                        var videos = document.getElementsByTagName("video");
                        for (v of videos) {
                            if (v.paused) v.play();
                            else v.pause();
                        }
                    }
                }
            });

following the call to Reveal.initialize(). I get the following errors in this case:

Loading page http://localhost:8000 ...
Loading page finished with status: success
Reveal JS DeckTape plugin activated
TypeError: undefined is not an object (evaluating 'dom.wrapper.querySelectorAll')

  http://localhost:8000/js/reveal.js:3339 in getTotalSlides
  phantomjs://webpage.evaluate():4
  phantomjs://webpage.evaluate():5
TypeError: undefined is not an object (evaluating 'dom.wrapper.querySelectorAll')

  http://localhost:8000/js/reveal.js:866 in configure
  phantomjs://webpage.evaluate():2
  phantomjs://webpage.evaluate():3
TypeError: undefined is not an object (evaluating 'Reveal.getCurrentSlide().getAttribute')

  phantomjs://webpage.evaluate():3
  phantomjs://webpage.evaluate():8

However, by removing the call to Reveal.configure(), a PDF is generated as expected.

Decktape fails to get font from Google Fonts if HTTPS is used:

+- Unable to load resource from URL:
https://fonts.googleapis.com/css?family=Roboto+Mono:400,400i,700,700i&subset=latin-ext
|_ Error code: 6
|_ Description: SSL handshake failed

Sample font inclusion (fails also with @import):

<link href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,400i,700,700i&subset=latin-ext" rel="stylesheet">

Tested with 1.0.0 as a Docker image (as a side effect of #67).

To test this, I started with the sample html file that comes with reveal.js and stripped out the entire <div class="reveal"> ... </div> and replaced it with the following code bits.

This works:

<div class="reveal">
  <div class="slides">
    <section>Normal Text</section>
  </div>
</div>

This works:

<div class="reveal">
  <div class="slides">
    <section data-markdown>
      <script type="text/template">
        ## Markdown Text
      </script>
    </section>
  </div>
</div>

But if I put "## Markdown Text" inside a file called text.md and use the following in my html, it looks exactly as the above test when I view it in my browser but I get a blank pdf from decktape.

<div class="reveal">
  <div class="slides">
    <section data-markdown="text.md"/>
  </div>
</div>

Any thoughts?

The existing shower.js plugin does not work with the new Shower 2.x architecture.

I checked out master, built my own phantomjs in the submodule and PDF rendered some slides. The resulting PDF although very nice doesn't have selectable text.

For me this is still way better than the print-pdf option which has many problems so I don't really mind but since your README mentions selectable text I thought I should let you know.

When building using docker in Linux, fonts installed in ~/.local/share/fonts/ won't work. I guess a -v mount trick could be used. I decided to build phantomjs instead.

I haven't confirmed if docker has access to globally installed fonts.

I run this command in Windows 7 (64):

> bin\phantomjs.exe decktape.js reveal file:///E:\Code\conf1.html E:\Temp\test_decktape.pdf

I get the pdf but there's also an error that seems to be caused by escaping of special characters in the windows shell:

Loading page file:///E:\Code\conf1.html ...
+- Unable to load resource from URL: e:Codeconf1_fileseveal.js-3.2.0/css/print/paper.css
|_ Error code: 301
|_ Description: Protocol "e" is unknown
Loading page finished with status: success
Reveal JS DeckTape plugin activated
Printing slide #/portrait-statistique-pour-le-quebec-2003-2014-1 (7/7) ...
Printed 7 slides

Is this a bug or is just that I should specify my input file name differently?

@astefanutti , dose this solution work with old config files or we need to update it with respect to decktape.js and i don't want to use dzsilder thing ( How i escape it ? ) i want only my pdf with working hyperlink and header footer will it possible with decktape.js if it's possible could you give me hint or guide me .

In my Jupyter Notebook slides which have been created using RISE, I'm using both the "Slide" and "Sub-Slide" slide types. My last slide is #/slide-8-0 with a sub-slide #/slide-8-1. Decktape fails to include the last sub-slide. If I change its type to "Sub-Slide", it gets included.

If I open the original presentation interactively in the browser, jump to the #/slide-8-0 slide and execute this in the JavaScript console, I get "null" instead of ["SECTION"]:

> Reveal.getCurrentSlide().parentNode.nextElementSibling.nodeName.match(/section/i);
null

Probably that test in hasNextSlide() would need to be tweaked to detect trailing sub-slides as well.

Document the reason(s) why decktape relies on a custom build of PhantomJS. The documentation will serve two purposes:

1. Help users understand why these steps are necessary; justify the extra overhead
2. Track the upstream change request (where we are in aligning with upstream)

My understanding is that the patch to PhantomJS is to provide a printer module that can combine multiple PDF pages into one. By default, PhantomJS can only capture and write one PDF page to file at a time. Since there is no way to merge PDF files using JavaScript, there's no other easy solution besides patching PhantomJS to provide this functionality.

Where are we with the upstream request? Are they considering adding this new module?

Phantomjs is unfortunately based on QtWebKit which is now deprecated and so many rendering issue won't be fixed anytime soon.

The thing is QtWebKit is today year behind modern browser (Chromium and Firefox). Fortunately they planned to switch to a more modern backend (QtWebEngine, Chromium or Electron, see ariya/phantomjs#10209). But it will obiously take time...

Slimerjs (http://slimerjs.org) is very similar to Phantomjs (almost the same API). And it is based on Gecko which fixe the issue I have (see #4, and #5).

This is why I decided to wrote a small js script to render my slides (made with revealjs) based on Slimerjs.

I wonder to know wether you're interested in integrating Slimerjs to decktape once my "proof of concept" script is done.

In the same way you created plugins, we could add a backend layer abstraction. Then, users could easly choose between both backend (Phantomjs or Slimerjs).

Some disadvantages about Slimerjs :

• not headless : it opens a window (but on Linux or MacOS, you can use the tool xvfb to hide hem)
• for now I use page.render('page.png'); to render slide one by one. I need to investigate wether it is possible to render multiple slide as a pdf directly or to merge all png files to a single pdf once the rendering process is done (with http://pdfkit.org maybe ?).

Would you be interested in such a feature ?

In Chromium and Firefox when you print the page <video> tag are replaced by the current image display by the tag.

Would it be possible to do the same in decktape ?

Hi there,

I try to make a pdf out of a reveal.js presentation. Haven't used phantomjs before and thus had to compile it myself (running linux debian 7.0).
The subsequent call to decktape however returns some strange error messages:
Call:
bin/phantomjs decktape.js reveal.js http://127.0.0.1:8001/index.html out.pdf

Error: Cannot find module 'printer'

  phantomjs://bootstrap.js:299 in require
  phantomjs://bootstrap.js:263 in require `

I am maybe wrong but the rendered SVG (<svg width="100%" data-src="schema.svg"></svg>) with decktape do not use the viewBox attribute. See the screenshot below.

While it renders correctly with both last version of Chromium and Firefox.

When invoking decktape on a slide set the progress shows e.g. 10 slides but keeps counting up indefinitely.

As a workaround I currently use the generic command instead which works fine for me.

Tested the MAC version, it works perfect. Would you also help to compile a Linux version ?

Issue

Decktape does not load certain SVGs with reveal.js. Possibly related to #12?

Minimal reproducible example

http://bit.ly/1QLgsv1

My attempts to fix

• Linux vs. OSX
• Rebuilt phantom.js
• Reveal.js with no plugins / default themes
• Reveal.js local server vs. web

Thank you in advance for considering this issue, and for this wonderful tool!
Andrew

For rendering formulas I use MathJax:

      MathJax.Hub.Config({
          tex2jax: {
            skipTags: ['script', 'noscript', 'style', 'textarea', 'pre'],
            inlineMath: [['$','$'], ['\\(','\\)']],
            extensions: ["AMSmath.js", "AMSsymbols.js", "autobold.js"]
          }
      });
      MathJax.Hub.Queue(function() {
          $(MathJax.Hub.getAllJax()).map(function(index, elem) {
              return(elem.SourceElement());
          }).parent().addClass('has-jax');
      });
      MathJax.Hub.Configured();

but the formula \int_{\Delta} \dfrac{\sin x}{\cos y} dz rendered in HTML:

and in PDF:

it looks a bit different.
Is there a simple way to fix it?

When testing the decktape output generated when rendering MathJax formulas within GitPitch presentations (built on reveal.js) I am seeing significant differences in the font rendering between OSX and Linux/Ubuntu 16.04.

Here is a screenshot of the PDF output generated on OSX:

Here is a screenshot of the PDF output generated on Ubuntu:

These outputs were generated using the same slideshow input. The OSX output appears to be using a high quality font compared to the rather plain Ubuntu output.

All output show here was generated using decktape 1.0.0.

Should I expect to see consistent rendering across OSX and Linux? If not, what steps can I take, if any, to improve the fonts used by decktape when generating MathJax output in PDFs on my Linux deployment?

A sample GitPitch presentation rendered to PDF by decktape on Linux can be found here. Just click Print option at the bottom of the page. Thanks for any help you can provide.

I'm trying to use the decktape docker container, but I'm having some trouble using the container and letting it access the network.

Here is the result of my command:

>docker run --rm -v `pwd`:/pwd astefanutti/decktape http://remarkjs.com/ /pwd/export.pdf
Loading page http://remarkjs.com/ ...
+- Unable to load resource from URL: http://remarkjs.com/
|_ Error code: 4
|_ Description: Socket operation timed out
Loading page finished with status: fail
Unable to load the address: http://remarkjs.com/

I'm pretty sure that I'm doing something wrong as the docker container must have been tested by someone else.

Can anyone help me?