From 6e290349120160b39cfaf565fc061d00958cdd13 Mon Sep 17 00:00:00 2001
From: Artur Adib <arturadib@gmail.com>
Date: Wed, 14 Sep 2011 17:34:29 -0700
Subject: [PATCH] Hello World example
Perhaps the simplest use of pdf.js.
See README.md in the new folder
---
helloworld/README.md | 13 ++++++++
helloworld/hello.js | 49 ++++++++++++++++++++++++++++
helloworld/helloworld.pdf | 68 +++++++++++++++++++++++++++++++++++++++
helloworld/index.html | 18 +++++++++++
4 files changed, 148 insertions(+)
create mode 100644 helloworld/README.md
create mode 100644 helloworld/hello.js
create mode 100644 helloworld/helloworld.pdf
create mode 100644 helloworld/index.html
diff --git a/helloworld/README.md b/helloworld/README.md
new file mode 100644
index 000000000..70d5e760b
--- /dev/null
+++ b/helloworld/README.md
@@ -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)
diff --git a/helloworld/hello.js b/helloworld/hello.js
new file mode 100644
index 000000000..0bf46311a
--- /dev/null
+++ b/helloworld/hello.js
@@ -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);
+});
diff --git a/helloworld/helloworld.pdf b/helloworld/helloworld.pdf
new file mode 100644
index 000000000..d98b4e1db
--- /dev/null
+++ b/helloworld/helloworld.pdf
@@ -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
\ No newline at end of file
diff --git a/helloworld/index.html b/helloworld/index.html
new file mode 100644
index 000000000..68a465f52
--- /dev/null
+++ b/helloworld/index.html
@@ -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>