stefanie grewenig & johannes thönes - internet ausdrucken mit javascript - code.talks 2015

43
code.talks 2015 INTERNET AUSDRUCKEN MIT JAVASCRIPT Wir drucken das Internet. Wir meinen das ernst. Ja, es macht Sinn. #codetalkshh #oinewebapp #pdfmake @thoughtworks @sgrewenig @jthoenes

Upload: aboutyougmbh

Post on 21-Mar-2017

723 views

Category:

Internet


0 download

TRANSCRIPT

c o d e . t a l k s 2 0 1 5

INTERNET AUSDRUCKEN MIT JAVASCRIPT

Wir drucken das Internet.Wir meinen das ernst.

Ja, es macht Sinn.

#codetalkshh #offlinewebapp #pdfmake @thoughtworks

@sgrewenig @jthoenes

WHY???

WHAT IF…<img/>

<img/>

x

x

x

add section

x

WHY NOT ?

LAYOUTING & STYLEDYNAMIC CONTENT

<img/>

LIMITATIONS OF CHROME PRINT

WHY NOT USE A LIBRARY ?

Insert JavaScript options here…

.json

.html

.pdf

.json

.html

.pdfpdfmake.js.js{ }

MAY THE DEMO GODS BE WITH US!

WHAAAAT ? ? ?

WUT ? PAGE BREAKS

var pageBreakBefore = !_.isUndefined(currentNode.headlineLevel) && _.isEmpty(followingNodesOnPage)

var pageBreakBefore = !_.isUndefined(currentNode.headlineLevel) && _.isEmpty(followingNodesOnPage) && !_.isEmpty(nodesOnNextPage)

<img/>

var pageBreakBefore = !_.isUndefined(currentNode.headlineLevel) && _.isEmpty(followingNodesOnPage) && !_.isEmpty(nodesOnNextPage) && !_.isEmpty(leadingNodesOnPage)

<img/>

@KleinesFert

WUT ? TEXT WRAP

<img/> c1 c2

<img/>c2c1 c3

<img/> c2c1 c3

<img/>

& tables, lists, …

WUT ? FONTS

Embedded PDF fonts can only do 95 d$fferenT characTers.!"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcdefghijklmnopqrstuvwxyz{|}~ÄÖÜäöüß

It took 6 weeks, 4 developers, 1 designer and pdfmake to become browser independent

and testable!

HAPPY JOHANNES!

PROPER LAYOUTING IS HARD, BUT POSSIBLE.

ONE MORE ABSTRACTION LAYER THAT CAN BE EASILY TESTED.

~3200 TO ~8400 LOC

THANKS

@sgrewenig

@jthoenes

& THANKS TO THE TEAM