forked from mozilla/pdf.js
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtest.html
149 lines (130 loc) · 3.66 KB
/
test.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
<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() {
canvas = document.getElementById("canvas");
canvas.mozOpaque = true;
pageDisplay = document.getElementById("pageNumber");
infoDisplay = document.getElementById("info");
pageNum = parseInt(queryParams().page) || 1;
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">
<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>