• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
2011 09-pdfjs
 

2011 09-pdfjs

on

  • 1,520 views

Lightning talk abo

Lightning talk abo

Statistics

Views

Total Views
1,520
Views on SlideShare
1,441
Embed Views
79

Actions

Likes
0
Downloads
5
Comments
0

5 Embeds 79

http://jujo00obo2o234ungd3t8qjfcjrs3o6k-a-sites-opensocial.googleusercontent.com 59
http://paper.li 12
http://us-w1.rockmelt.com 3
http://us-w1.rockmelt.com 3
http://a0.twimg.com 2

Accessibility

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    2011 09-pdfjs 2011 09-pdfjs Presentation Transcript

    • pdf.jsJulian Viereck @jviereck
    • Overview• What is pdf.js• How PDF is structured• Processing in pdf.js• Images & Fonts• Problems• Todo• Demo
    • What is pdf.js• building faithful & efficient PDF renderer• HTML5 technology experiment• no native code• secure (web sandbox)• Mozilla Labs Project - Open Source
    • How PDF is structured Header PDF version sequence of objets Body [Objects] fonts, drawing cmds, images, words, bookmarks, form fieldsxRef Table mapping objID byte offset Trailer root objID, xRef byte offset PDF file root obj = ref to pages catalog
    • Processing in pdf.js• get plain Uint8Array via XHR2, build Stream• new PDFDoc(stream): read xRef, root object• page = PDFDoc.getPage(N) Internal• page.startRendering(graphics) Representation • read & convert all PDF cmds ➟ IR PartialEvaluator • load required objects (fonts, images) • graphics.executeIR(IR) CanvasGraphics
    • 1. page=PDFDoc.getPage(2) 5 0 obj stream maybe ➟ obj#3 << encoded! /Length 8 0 R2. page.startRendering(...) >> ➟ obj#4, obj#5 stream /GS1 gs /F0 12 Tf 3 0 obj BT << 100 700 Td /Type /Page (Hello World!) Tj /MediaBox 0 612 792] [0 ET /Resources 4 0 R 50 600 m /Parent 2 0 R 400 600 l /Contents 5 0 R S >> endstream endobj endobj
    • xRef, catalog, IR5 0 obj + resources PartialEvaluator Form<< /Length 8 0 R>> setGState: [ LW: 10 ] stream dependency: [ font0 ] /GS1 gs setFont: font0, 12 /F0 12 Tf beginText BT moveText: 100, 700 100 700 Td showText: “Hello World!” (Hello World!) Tj endText ET moveTo: 50, 600 50 600 m lineTo: 400, 600 400 600 l stroke S endstreamendobj CanvasGraphics
    • Images• JPEG streams: • DOMImg.src = data:image/jpeg;base64, + window.btoa(bytesToString(bytes));• If not JPEG stream: • read bytes, convert to colorspace • imgData = canvas.getImageData() • fillWithPixelData(bytes, imgData) • canvas.putImageData(imgData)
    • Fonts• There are lots of different font formats! • fonts are converted to OpenType • use CSS: @font-face { font-family:font0; src:url (data:font/opentype;base64, ...)• some fonts can’t be converted :( • use drawing commands?
    • Problems platform = browser + OS• No way to detect font is loaded (hacks)• Font width (wrong on some platforms)• Subpixel font size depending on platform• Text selection• Printing• Speed • use workers (postMessage lose shape) • partial rendering
    • Todo• more font work, printing, speed• support more rendering spec• explore using SVG• PDF forms, “advanced PDF features”• infrastructure: automated testing, requireJS• test more PDF (need your help!)
    • Demo
    • ContactGithub: https://github.com/andreasgal/pdf.jsMailing list: https://groups.google.com/group/mozilla.dev.pdf-js/topicsIRC: irc.mozilla.org #pdfjs