<html>
-<head>
- <title>Simple pdf.js page viewer</title>
- <script type="text/javascript"
- src="pdf.js"></script>
- <style type"text/css">
-body {
- margin: 6px;
- padding: 0px;
- background-color: #c0bdb7;
-}
-#controls {
- border-bottom: 1px solid black;
- position:fixed;
- left: 0px; top: 0px;
- width: 100%;
- padding: 7px;
- background-color: rgb(242, 240, 238);
-}
-span#info {
- float: right;
- font: 14px sans-serif;
- margin-right: 10px;
-}
-#viewer {
- margin: auto;
- border: 1px solid black;
- width: 8.5in;
- height: 11in;
-}
-#pageNumber {
- text-align: right;
-}
- </style>
-
-<script type="text/javascript">
-function queryParams() {
- var qs = window.location.search.substring(1);
- var kvs = qs.split("&");
- var params = { };
- for (var i = 0; i < kvs.length; ++i) {
- var kv = kvs[i].split("=");
- params[unescape(kv[0])] = unescape(kv[1]);
- }
- return params;
-}
-
-var canvas, numPages, pageDisplay, pageNum;
-function load(userInput) {
- canvas = document.getElementById("canvas");
- canvas.mozOpaque = true;
- pageDisplay = document.getElementById("pageNumber");
- infoDisplay = document.getElementById("info");
- pageNum = parseInt(queryParams().page) || 1;
- fileName = userInput;
- if(!userInput){
- fileName = queryParams().file || "compressed.tracemonkey-pldi-09.pdf";
- }
- open(fileName);
-}
-
-function open(url) {
- document.title = url;
- req = new XMLHttpRequest();
- req.open("GET", url);
- req.mozResponseType = req.responseType = "arraybuffer";
- req.expected = (document.URL.indexOf("file:") == 0) ? 0 : 200;
- req.onreadystatechange = xhrstate;
- req.send(null);
-}
-
-function xhrstate() {
- if (req.readyState == 4 && req.status == req.expected) {
- var data = req.mozResponseArrayBuffer ||
- req.mozResponse ||
- req.responseArrayBuffer ||
- req.response;
- pdf = new PDFDoc(new Stream(data));
- numPages = pdf.numPages;
- document.getElementById("numPages").innerHTML = numPages.toString();
- gotoPage(pageNum);
- }
-}
-
-function displayPage(num) {
- pageDisplay.value = num;
-
- var t0 = Date.now();
-
- var page = pdf.getPage(pageNum = num);
-
- var t1 = Date.now();
-
- var ctx = canvas.getContext("2d");
- ctx.save();
- ctx.fillStyle = "rgb(255, 255, 255)";
- ctx.fillRect(0, 0, canvas.width, canvas.height);
- ctx.restore();
-
- var gfx = new CanvasGraphics(ctx);
-
- // page.compile will collect all fonts for us, once we have loaded them
- // we can trigger the actual page rendering with page.display
- var fonts = [];
- page.compile(gfx, fonts);
-
- var t2 = Date.now();
-
- // This should be called when font loading is complete
- page.display(gfx);
-
- var t3 = Date.now();
-
- infoDisplay.innerHTML = "Time to load/compile/render: "+ (t1 - t0) + "/" + (t2 - t1) + "/" + (t3 - t2) + " ms";
-}
-
-function nextPage() {
- if (pageNum < numPages)
- ++pageNum;
- displayPage(pageNum);
-}
-
-function prevPage() {
- if (pageNum > 1)
- --pageNum;
- displayPage(pageNum);
-}
-function gotoPage(num) {
- if (0 <= num && num <= numPages)
- pageNum = num;
- displayPage(pageNum);
-}
- </script>
-</head>
-
-<body onload="load();">
- <div id="controls">
++<<<<<<< HEAD
+ <head>
+ <title>Simple pdf.js page viewer</title>
+ <link rel="stylesheet" href="test.css"></link>
+
+ <script type="text/javascript" src="pdf.js"></script>
+ <script type="text/javascript" src="test.js"></script>
+ <script type="text/javascript" src="cffStandardStrings.js"></script>
+ <script type="text/javascript" src="glyphlist.js"></script>
+ <script type="text/javascript" src="Encodings.js"></script>
+ <script type="text/javascript" src="PDFFont.js"></script>
+ </head>
+
+ <body onload="load();">
+ <div id="controls">
+ <input type="file" style="float: right; margin: auto 32px;" onChange="load(this.value.toString());"></input>
+ <!-- This only opens supported PDFs from the source path...
+ -- Can we use JSONP to overcome the same-origin restrictions? -->
- <button onclick="prevPage();">Previous</button>
- <button onclick="nextPage();">Next</button>
- <input type="text" id="pageNumber" onchange="gotoPage(this.value);"
- value="1" size="4"></input>
- / <span id="numPages">--</span>
- <span id="info"></span>
- </div>
- <div id="viewer">
- <!-- Canvas dimensions must be specified in CSS pixels. CSS pixels
- -- are always 96 dpi. These dimensions are 8.5x11in at 96dpi. -->
- <canvas id="canvas" width="816" height="1056"></canvas>
- </div>
-</body>
-
+ <button onclick="prevPage();">Previous</button>
+ <button onclick="nextPage();">Next</button>
+ <input type="text" id="pageNumber" onchange="gotoPage(this.value);"
+ value="1" size="4"></input>
+ <span id="numPages">--</span>
+ <span id="info"></span>
+ </div>
+
+ <div id="viewer">
+ <!-- Canvas dimensions must be specified in CSS pixels. CSS pixels
+ are always 96 dpi. These dimensions are 8.5x11in at 96dpi. -->
+ <canvas id="canvas" width="816" height="1056"></canvas>
+ </div>
+ </body>
</html>
+
--- /dev/null
- function load() {
+/* -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil; c-basic-offset: 4 -*- /
+/* vim: set shiftwidth=4 tabstop=8 autoindent cindent expandtab: */
+
+var pdfDocument, canvas, pageDisplay, pageNum, pageInterval;
- fileName = queryParams().file || "compressed.tracemonkey-pldi-09.pdf";
++function load(userInput) {
+ canvas = document.getElementById("canvas");
+ canvas.mozOpaque = true;
+ pageNum = parseInt(queryParams().page) || 1;
-
++ fileName = userInput;
++ if (!userInput) {
++ fileName = queryParams().file || "compressed.tracemonkey-pldi-09.pdf";
++ }
+ open(fileName);
+}
+
+function queryParams() {
+ var qs = window.location.search.substring(1);
+ var kvs = qs.split("&");
+ var params = { };
+ for (var i = 0; i < kvs.length; ++i) {
+ var kv = kvs[i].split("=");
+ params[unescape(kv[0])] = unescape(kv[1]);
+ }
+ return params;
+}
+
+function open(url) {
+ document.title = url;
+ req = new XMLHttpRequest();
+ req.open("GET", url);
+ req.mozResponseType = req.responseType = "arraybuffer";
+ req.expected = (document.URL.indexOf("file:") == 0) ? 0 : 200;
+ req.onreadystatechange = function() {
+ if (req.readyState == 4 && req.status == req.expected) {
+ var data = req.mozResponseArrayBuffer || req.mozResponse ||
+ req.responseArrayBuffer || req.response;
+ pdfDocument = new PDFDoc(new Stream(data));
+ numPages = pdfDocument.numPages;
+ document.getElementById("numPages").innerHTML = numPages.toString();
+ goToPage(pageNum);
+ }
+ };
+ req.send(null);
+}
+
+function gotoPage(num) {
+ if (0 <= num && num <= numPages)
+ pageNum = num;
+ displayPage(pageNum);
+}
+
+function displayPage(num) {
+ if (pageNum != num)
+ window.clearTimeout(pageInterval);
+
+ document.getElementById("pageNumber").value = num;
+
+ var t0 = Date.now();
+
+ var page = pdfDocument.getPage(pageNum = num);
+
+ var t1 = Date.now();
+ var ctx = canvas.getContext("2d");
+ ctx.save();
+ ctx.fillStyle = "rgb(255, 255, 255)";
+ ctx.fillRect(0, 0, canvas.width, canvas.height);
+ ctx.restore();
+
+ var gfx = new CanvasGraphics(ctx);
+
+ // page.compile will collect all fonts for us, once we have loaded them
+ // we can trigger the actual page rendering with page.display
+ var fonts = [];
- }, 10);
+ page.compile(gfx, fonts);
+ var t2 = Date.now();
+
++ var interval = 0;
++ for (var i = 0; i < fonts.length; i++) {
++ if (fonts[i].loading) {
++ interval = 10;
++ break;
++ }
++ };
++
+ // FIXME This need to be replaced by an event
+ pageInterval = setInterval(function() {
+ for (var i = 0; i < fonts.length; i++) {
+ if (fonts[i].loading)
+ return;
+ }
+ var t3 = Date.now();
+
+ clearInterval(pageInterval);
+ page.display(gfx);
+
+ var t4 = Date.now();
+
+ var infoDisplay = document.getElementById("info");
+ infoDisplay.innerHTML = "Time to load/compile/fonts/render: "+ (t1 - t0) + "/" + (t2 - t1) + "/" + (t3 - t2) + "/" + (t4 - t3) + " ms";
++ }, interval);
+}
+
+function nextPage() {
+ if (pageNum < pdfDocument.numPages)
+ displayPage(++pageNum);
+}
+
+function prevPage() {
+ if (pageNum > 1)
+ displayPage(--pageNum);
+}
+
+function goToPage(num) {
+ if (0 <= num && num <= numPages)
+ displayPage(pageNum = num);
+}
+
projects / pdf.js.git / commitdiff