Badass JavaScript

A showcase of awesome JavaScript that pushes the boundaries of what's possible on the web, by @devongovett.

WPS: PostScript and PDF Interpreter For HTML5 Canvas

July 19th 2010

WPS is a PostScript and PDF parser and interpreter written in JavaScript using the HTML5 Canvas tag.  PostScript is a programming language often used in page layout programs, and is the basis of the PDF format, which started out as a superset of PostScript.  According to Adobe, “a PDF file is actually a PostScript file which has already been interpreted by a RIP and made into clearly defined objects.”  WPS takes PostScript or PDF code and generates an output image using the HTML5 Canvas element.  For example, this PostScript:

/n 10 def
/w 25 def

0 0 n w mul dup .gbox

4 dict begin
  0 1 n 1 sub {
    /i exch def
    /ii 1 1 n div i mul sub def
    0 1 n 1 sub {
      /j exch def
      /jj 1 1 n div j mul sub def
      ii jj 0 setrgbcolor
      w j mul w i mul w w rectfill
    } for
  } for
end

would be converted into the following image.

image

The PostScript and PDF formats are very large, and thus only a small subset of the operations are implemented in WPS.  Even so, it is exciting to think that one day in the not so distant future we will be able to embed PDF files in the browser without the need for plugins.

You can check out a page with lots of examples here, a sandbox where you can enter PostScript or PDF code and see the results here, and the source code here.

This post was submitted by Fabien Ménager.  You can submit a post, too!