Sakurai/pdf.js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Hello World example

Browse Source 
Perhaps the simplest use of pdf.js.

See README.md in the new folder
This commit is contained in:
Artur Adib 2011-09-14 17:34:29 -07:00
parent f57972d925
commit 6e29034912
4 changed files with 148 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
helloworld/README.md Normal file
View File

@ -0,0 +1,13 @@
## "Hello World" overview
This example is a minimalistic application of the pdf.js project. The file `helloworld.pdf` is from the GNUpdf project (see [Introduction to PDF at GNUpdf](http://gnupdf.org/Introduction_to_PDF), and contains a simple and human-readable PDF.
## Getting started
Point your browser to `index.html`. Voila. Take a peek at `hello.js` to see how to make basic calls to `pdf.js`.
## Additional resources
+ [GNUpdf - Introduction to PDF](http://gnupdf.org/Introduction_to_PDF)

49
helloworld/hello.js Normal file
View File

@ -0,0 +1,49 @@
//
// See README for overview
//
//
// Ajax GET request for binary files
// (like jQuery's $.get(), but supports the binary type ArrayBuffer)
//
var binaryGet = function(url, callback){
var xhr = new XMLHttpRequest();
xhr.open('GET', url);
xhr.mozResponseType = xhr.responseType = 'arraybuffer';
xhr.expected = (document.URL.indexOf('file:') === 0) ? 0 : 200;
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === xhr.expected) {
var data = (xhr.mozResponseArrayBuffer || xhr.mozResponse ||
xhr.responseArrayBuffer || xhr.response);
callback(data);
}
};
xhr.send(null);
}
//
// This is where the fun happens
//
binaryGet('helloworld.pdf', function(data){
//
// Instantiate PDFDoc with PDF data
//
var pdf = new PDFDoc(new Stream(data));
var page = pdf.getPage(1);
var scale = 1.5;
//
// Prepare canvas using PDF page dimensions
//
var canvas = document.getElementById('the-canvas');
var context = canvas.getContext('2d');
canvas.height = page.height * scale;
canvas.width = page.width * scale;
//
// Render PDF page into canvas context
//
page.startRendering(context);
});

68
helloworld/helloworld.pdf Normal file
View File

@ -0,0 +1,68 @@
%PDF-1.7
1 0 obj % entry point
<<
/Type /Catalog
/Pages 2 0 R
>>
endobj
2 0 obj
<<
/Type /Pages
/MediaBox [ 0 0 200 200 ]
/Count 1
/Kids [ 3 0 R ]
>>
endobj
3 0 obj
<<
/Type /Page
/Parent 2 0 R
/Resources <<
/Font <<
/F1 4 0 R
>>
>>
/Contents 5 0 R
>>
endobj
4 0 obj
<<
/Type /Font
/Subtype /Type1
/BaseFont /Times-Roman
>>
endobj
5 0 obj % page content
<<
/Length 44
>>
stream
BT
70 50 TD
/F1 12 Tf
(Hello, world!) Tj
ET
endstream
endobj
xref
0 6
0000000000 65535 f
0000000010 00000 n
0000000079 00000 n
0000000173 00000 n
0000000301 00000 n
0000000380 00000 n
trailer
<<
/Size 6
/Root 1 0 R
>>
startxref
492
%%EOF

18
helloworld/index.html Normal file
View File

@ -0,0 +1,18 @@
<!doctype html>
<html>
<head>
<!-- PDF.js-specific -->
<script type="text/javascript" src="../pdf.js"></script>
<script type="text/javascript" src="../metrics.js"></script>
<script type="text/javascript" src="../fonts.js"></script>
<script type="text/javascript" src="../glyphlist.js"></script>
<script type="text/javascript" src="hello.js"></script>
</head>
<body>
<canvas id="the-canvas" style="border:1px solid black;"/>
</body>
</html>