Giter VIP home page Giter VIP logo

decktape's Introduction

DeckTape

DeckTape is a high-quality PDF exporter for HTML presentation frameworks.

DeckTape is built on top of Puppeteer which relies on Google Chrome for laying out and rendering Web pages and provides a headless Chrome instance scriptable with a JavaScript API.

ℹ️
DeckTape 1.0 was built on top of PhantomJS which relies on Qt WebKit. See the 1.x branch for more information.

DeckTape currently supports the following presentation frameworks out of the box:

 • Bespoke.js       • DZSlides         • remark           • Shower
 • CSSS             • Flowtime.js      • reveal.js        • Slidy
 • deck.js          • impress.js       • RISE             • WebSlides

DeckTape also provides a generic command that works by emulating the end-user interaction, allowing it to be used to convert presentations from virtually any kind of framework. The generic mode is particularly useful for supporting HTML presentation frameworks that don’t expose an API or accessible state.

DeckTape’s plugin-based architecture exposes an extension API, making it possible to add support for other frameworks or to tailor existing plugins to your specific needs.

DeckTape can optionally be used to capture screenshots of your slide decks in various resolutions (similar to pageres). That can be useful to make sure your presentations are responsive or to create handouts for them.

You can browse some slide deck examples below that have been exported with DeckTape.

Install

NPM

Install DeckTape globally and run it:

$ npm install -g decktape
$ decktape

Or locally:

$ npm install decktape
$ `npm bin`/decktape

Usage

$ decktape -h

Usage: decktape [options] [command] <url> <filename>
       decktape version

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

Options:
   -s <size>, --size <size>        Size of the slides deck viewport: <width>x<height>  (ex. 1280x720)
   -p <ms>, --pause <ms>           Duration in milliseconds before each slide is exported  [1000]
   --load-pause <ms>               Duration in milliseconds between the page has loaded
                                   and starting to export slides  [0]
   --screenshots                   Capture each slide as an image  [false]
   --screenshots-directory <dir>   Screenshots output directory  [screenshots]
   --screenshots-size <size>       Screenshots resolution, can be repeated  [--size]
   --screenshots-format <format>   Screenshots image format, one of [jpg, png]  [png]
   --slides <range>                Range of slides to be exported, a combination of slide indexes
                                   and ranges (e.g. '1-3,5,8')

Defaults to the automatic command.
Iterates over the available plugins, picks the compatible one for presentation at the
specified <url> and uses it to export and write the PDF into the specified <filename>.

In addition to the general options listed above, command specific options can be displayed the following way:

$ decktape <command> -h

Commands

automatic

Iterates over the available plugins, picks the compatible one for presentation at the specified url and uses it to export and write the PDF into the specified filename.

generic

Emulates the end-user interaction by pressing the key with the specified --key option and iterates over the presentation as long as:

  1. Any change to the DOM is detected by observing mutation events targeting the body element and its subtree nor

  2. the number of slides exported has reached the specified --max-slides option.

The --key value must be one of the UI events KeyboardEvent key values and defaults to ArrowRight, e.g.:

$ decktape generic --key=ArrowDown

Options

--screenshots

Captures each slide as an image at the --screenshots-size resolution, exports it to the --screenshots-format image format and writes the output into the --screenshots-directory directory.

The --screenshots-size option can be set multiple times. For example:

$ decktape --screenshots --screenshots-size=400x300 --screenshots-size=800x600

--slides

Exports only the slides specified as a series of slides indexes and ranges, e.g.:

# Capture a single slide
$ decktape --slides 1
# Capture a series of slides
$ decktape --slides 1,3,5
# Capture a range of slides
$ decktape --slides 1-10
# Capture a combination of slides and ranges
$ decktape --slides 1,2,5-10

The rendering stops and the file written out after the largest numbered slide is exported.

Examples

The following slide deck examples have been exported using DeckTape:

HTML5 Presentation Framework Exported PDF

ES6+ maintenant !

reveal.js

devoxx-es6-maintenant.pdf (2.3MB)

reveal.js MathJax example

reveal.js

reveal-js-mathjax.pdf (0.3MB)

Getting Involved in Open Source

reveal.js

opensource-getting-involved.pdf (0.6MB)

Going Further with CDI

Asciidoctor + DZSlides

going-further-with-cdi.pdf (2.4MB)

Deck.js Modern HTML Presentations

deck.js

deck-js-presentation.pdf (0.5MB)

The Official Remark Slideshow

remark

remark-js-slideshow.pdf (0.3MB)

HTML Slidy: Slide Shows in HTML and XHTML

Slidy

html-slidy-presentation.pdf (0.5MB)

CSSS: CSS-based SlideShow System

CSSS

csss-sample-slideshow.pdf (3MB)

Shower Presentation Engine

Shower

shower-presentation-engine.pdf (0.6MB)

Welcome our new ES5 Overloards

Bespoke.js

new-es5-overloards.pdf (0.2MB)

Docker

DeckTape can be executed within a Docker container from the command-line using the astefanutti/decktape Docker image available on Docker Hub:

$ docker run astefanutti/decktape -h

For example:

  • To convert an online HTML presentation and have it exported into the working directory under the slides.pdf filename:

    $ docker run --rm -v `pwd`:/slides astefanutti/decktape http://lab.hakim.se/reveal-js slides.pdf
  • Or, to convert an HTML presentation that’s stored on the local file system in the home directory:

    $ docker run --rm -v `pwd`:/slides -v ~:/home/user astefanutti/decktape /home/user/slides.html slides.pdf
  • Or, to convert an HTML presentation that’s deployed on the local host:

    $ docker run --rm --net=host -v `pwd`:/slides astefanutti/decktape http://localhost:8000 slides.pdf

You may want to specify a tag corresponding to a released version of DeckTape for the Docker image, e.g. astefanutti/decktape:2.0.0.

Besides, it is recommended to use the following options from the docker run command:

--rm

DeckTape is meant to be run as a short-term foreground process so that it’s not necessary to have the container’s file system persisted after DeckTape exits,

-v

to mount a data volume so that DeckTape can directly write to the local file system.

Alternatively, you can use the docker cp command, e.g.:

# Run docker run without the --rm option
$ docker run astefanutti/decktape http://lab.hakim.se/reveal-js slides.pdf
# Copy the exported PDF from the latest used container to the local file system
$ docker cp `docker ps -lq`:slides/slides.pdf .
# Finally remove the latest used container
$ docker rm `docker ps -lq`

Plugin API

✏️

decktape's People

Contributors

astefanutti avatar mojavelinux avatar eljefe6a avatar anaderi avatar gavincarr avatar hadim avatar oupala avatar martin-jung avatar ricklupton avatar ssanderson avatar steshaw avatar onetapbeyond avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.