FREE THOUGHT · FREE SOFTWARE · FREE WORLD

PDF.js

PDF.js Iconpdf.js is an HTML5 technology experiment that explores building a faithful and efficient Portable Document Format (PDF) renderer without native code assistance.

pdf.js is community-driven and supported by Mozilla Labs. Our goal is to create a general-purpose, web standards-based platform for parsing and rendering PDFs, and eventually release a PDF reader extension powered by pdf.js. Integration with Firefox is a possibility if the experiment proves successful.

Viewer Constants

var DEFAULT_URL = 'compressed.tracemonkey-pldi-09.pdf';
var DEFAULT_SCALE = 'auto';
var DEFAULT_SCALE_DELTA = 1.1;
var UNKNOWN_SCALE = 0;
var CACHE_SIZE = 20;
var CSS_UNITS = 96.0 / 72.0;
var SCROLLBAR_PADDING = 40;
var VERTICAL_PADDING = 5;
var MIN_SCALE = 0.25;
var MAX_SCALE = 4.0;
var SETTINGS_MEMORY = 20;
var SCALE_SELECT_CONTAINER_PADDING = 8;
var SCALE_SELECT_PADDING = 22;

Viewer options

Options for pdf.js's viewer that can be given at the URL level. This page is current as of 2013 April 21.

Multiple values of either type can be combined by separating with an ampersand (&) including after the hash (Example: #page=2&textLayer=off).

Options after the ?

var params = PDFView.parseQueryString(document.location.search.substring(1));
var file = params.file || DEFAULT_URL;
  • file=file.pdf: pdf filename to use

Options after the #

// Special debugging flags in the hash section of the URL.
var hash = document.location.hash.substring(1);
var hashParams = PDFView.parseQueryString(hash);
  • page=1: page number
  • zoom=100: zoom level
  • nameddest=here: go to a named destionation
  • pagemode=[thumbs|bookmarks|outline|none]:
  • locale=en-US: set a localization
  • textLayer=[off|visible|shadow|hover] - Disables or reveals the text layer that is used for text selection.
  • disableRange=true: set to true to disable chunked/206 partial content viewing, load entire pdf from start
  • disableAutoFetch=true: If there are no pending requests, automatically fetch the next prevent unfetched chunk of the PDF
  • disableWorker=true - Makes it easier to use debugging tools like firebug. Support, create a new web worker and test if it/the browser fullfills all requirements to run parts of pdf.js in a web worker
  • disableFontFace=true: use custom fonts
  • disableHistory=true: manipulation of the history
  • pdfBug=all - Enables all the debugging tools. You can optionally enable specific tools by specifying them by their id e.g. pdfBug=FontInspector or pdfBug=Stepper,FontInspector

Debuggery

Debugging PDF.js

URL Parameters

pdf.js has several special url parameters to alter how pdf.js works and enable debugging tools. All of these parameters go into the hash section of the url (after the # symbol) and follow a query string syntax (e.g. #param1=value1¶m2=value2). Note: since all of these parameters are in the hash section you have to refresh the page after adding them.

if ('pdfBug' in hashParams) {
	PDFJS.pdfBug = true;
	var pdfBug = hashParams['pdfBug'];
	var enabled = pdfBug.split(',');
	PDFBug.enable(enabled);
	PDFBug.init();
}
  • pdfBug=all - Enables all the debugging tools. You can optionally enable specific tools by specifying them by their id e.g. pdfBug=FontInspector or pdfBug=Stepper,FontInspector. More about PDFBug below.
  • disableWorker=true - Disables the worker which makes it easier to use debugging tools like firebug where workers aren't supported yet.
  • textLayer=[off|visible|shadow|hover] - Disables or reveals the text layer that is used for text selection.

PDFBug Tools

To enable see above.

Font Inspector

id: FontInspector

The font inspector allows you to view what fonts are used within page. It also allows you to download the font using Save Link As.. and naming it with a .otf extension. See the section below on debugging fonts.

Stepper

id: Stepper

The stepper tool makes it so you can step through the drawing commands one at a time and hopefully find where a possible issue is coming from. It is also useful for learning how a PDF is structured and the order of its operations. To walk through the drawing commands first add a break point, refresh the page and then use the keys s to step one command at a time or c to continue until the next breakpoint(line that is checked).

github pdf.js Wiki Docs

Full list.

More Info

Javascript PDF pdf.js Portable Document Format

 

 

Comments