10 changed files with 854 additions and 1001 deletions
Before Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
@ -1,296 +0,0 @@
@@ -1,296 +0,0 @@
|
||||
/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- / |
||||
/* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */ |
||||
|
||||
body { |
||||
background-color: #929292; |
||||
font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif; |
||||
margin: 0px; |
||||
padding: 0px; |
||||
} |
||||
|
||||
canvas { |
||||
box-shadow: 0px 4px 10px #000; |
||||
-moz-box-shadow: 0px 4px 10px #000; |
||||
-webkit-box-shadow: 0px 4px 10px #000; |
||||
} |
||||
|
||||
span { |
||||
font-size: 0.8em; |
||||
text-shadow: 0px 1px 0px #fff; |
||||
} |
||||
|
||||
.control { |
||||
display: inline-block; |
||||
float: left; |
||||
margin: 0px 20px 0px 0px; |
||||
padding: 0px 4px 0px 0px; |
||||
} |
||||
|
||||
.control > input { |
||||
float: left; |
||||
border: 1px solid #4d4d4d; |
||||
height: 20px; |
||||
padding: 0px; |
||||
margin: 0px 2px 0px 0px; |
||||
border-radius: 3px; |
||||
-moz-border-radius: 3px; |
||||
-webkit-border-radius: 3px; |
||||
box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); |
||||
-moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); |
||||
-webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); |
||||
} |
||||
|
||||
.control > select { |
||||
float: left; |
||||
border: 1px solid #4d4d4d; |
||||
height: 22px; |
||||
padding: 2px 0px 0px; |
||||
margin: 0px 0px 1px; |
||||
border-radius: 3px; |
||||
-moz-border-radius: 3px; |
||||
-webkit-border-radius: 3px; |
||||
box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); |
||||
-moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); |
||||
-webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); |
||||
} |
||||
|
||||
.control > span { |
||||
cursor: default; |
||||
float: left; |
||||
height: 18px; |
||||
margin: 5px 2px 0px; |
||||
padding: 0px; |
||||
user-select: none; |
||||
-moz-user-select: none; |
||||
-webkit-user-select: none; |
||||
} |
||||
|
||||
.control .label { |
||||
clear: both; |
||||
float: left; |
||||
font-size: 0.65em; |
||||
margin: 2px 0px 0px; |
||||
position: relative; |
||||
text-align: center; |
||||
width: 100%; |
||||
} |
||||
|
||||
.thumbnailPageNumber { |
||||
color: #fff; |
||||
font-size: 0.55em; |
||||
text-align: right; |
||||
margin: -6px 2px 6px 0px; |
||||
width: 102px; |
||||
} |
||||
|
||||
.thumbnail { |
||||
width: 104px; |
||||
height: 134px; |
||||
margin: 0px auto 10px; |
||||
} |
||||
|
||||
.page { |
||||
width: 816px; |
||||
height: 1056px; |
||||
margin: 10px auto; |
||||
} |
||||
|
||||
#controls { |
||||
background-color: #eee; |
||||
background: -moz-linear-gradient(center bottom, #ddd 0%, #fff 100%); |
||||
background: -webkit-gradient(linear, left bottom, left top, color-stop(0.0, #ddd), color-stop(1.0, #fff)); |
||||
border-bottom: 1px solid #666; |
||||
padding: 4px 0px 0px 8px; |
||||
position: fixed; |
||||
left: 0px; |
||||
top: 0px; |
||||
height: 40px; |
||||
width: 100%; |
||||
box-shadow: 0px 2px 8px #000; |
||||
-moz-box-shadow: 0px 2px 8px #000; |
||||
-webkit-box-shadow: 0px 2px 8px #000; |
||||
} |
||||
|
||||
#controls input { |
||||
user-select: text; |
||||
-moz-user-select: text; |
||||
-webkit-user-select: text; |
||||
} |
||||
|
||||
button { |
||||
background-color: #ddd; |
||||
background: -moz-linear-gradient(center bottom, #c3c3c3 0%, #f3f3f3 100%); |
||||
background: -webkit-gradient(linear, left bottom, left top, color-stop(0.0, #c3c3c3), color-stop(1.0, #f3f3f3)); |
||||
border: 1px solid #4d4d4d; |
||||
cursor: default; |
||||
float: left; |
||||
margin: 0px 0px 1px; |
||||
width: 29px; |
||||
height: 22px; |
||||
border-radius: 3px; |
||||
-moz-border-radius: 3px; |
||||
-webkit-border-radius: 3px; |
||||
} |
||||
|
||||
button:disabled { |
||||
background-color: #eee; |
||||
background: -moz-linear-gradient(center bottom, #ddd 0%, #fff 100%); |
||||
background: -webkit-gradient(linear, left bottom, left top, color-stop(0.0, #ddd), color-stop(1.0, #fff)); |
||||
} |
||||
|
||||
button:disabled > span { |
||||
opacity: 0.3; |
||||
-moz-opacity: 0.3; |
||||
-webkit-opacity: 0.3; |
||||
} |
||||
|
||||
button.down { |
||||
background-color: #777; |
||||
background: -moz-linear-gradient(center bottom, #888 0%, #555 100%); |
||||
background: -webkit-gradient(linear, left bottom, left top, color-stop(0.0, #888), color-stop(1.0, #555)); |
||||
box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.8); |
||||
-moz-box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.8); |
||||
-webkit-box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.8); |
||||
} |
||||
|
||||
#previousPageButton { |
||||
width: 28px; |
||||
border-right: 0px; |
||||
border-top-right-radius: 0px; |
||||
border-bottom-right-radius: 0px; |
||||
-moz-border-radius-topright: 0px; |
||||
-moz-border-radius-bottomright: 0px; |
||||
-webkit-border-top-right-radius: 0px; |
||||
-webkit-border-bottom-right-radius: 0px; |
||||
} |
||||
|
||||
#previousPageButton > span { |
||||
background: url('images/buttons.png') no-repeat 0px 0px; |
||||
display: inline-block; |
||||
width: 19px; |
||||
height: 19px; |
||||
} |
||||
|
||||
#nextPageButton { |
||||
width: 28px; |
||||
border-top-left-radius: 0px; |
||||
border-bottom-left-radius: 0px; |
||||
-moz-border-radius-topleft: 0px; |
||||
-moz-border-radius-bottomleft: 0px; |
||||
-webkit-border-top-left-radius: 0px; |
||||
-webkit-border-bottom-left-radius: 0px; |
||||
} |
||||
|
||||
#nextPageButton > span { |
||||
background: url('images/buttons.png') no-repeat -19px 0px; |
||||
display: inline-block; |
||||
width: 19px; |
||||
height: 19px; |
||||
} |
||||
|
||||
#singleLayoutButton { |
||||
width: 28px; |
||||
border-right: 0px; |
||||
border-top-right-radius: 0px; |
||||
border-bottom-right-radius: 0px; |
||||
-moz-border-radius-topright: 0px; |
||||
-moz-border-radius-bottomright: 0px; |
||||
-webkit-border-top-right-radius: 0px; |
||||
-webkit-border-bottom-right-radius: 0px; |
||||
} |
||||
|
||||
#singleLayoutButton > span { |
||||
background: url('images/buttons.png') no-repeat -57px 0px; |
||||
display: inline-block; |
||||
width: 19px; |
||||
height: 19px; |
||||
} |
||||
|
||||
#splitLayoutButton { |
||||
width: 28px; |
||||
border-top-left-radius: 0px; |
||||
border-bottom-left-radius: 0px; |
||||
-moz-border-radius-topleft: 0px; |
||||
-moz-border-radius-bottomleft: 0px; |
||||
-webkit-border-top-left-radius: 0px; |
||||
-webkit-border-bottom-left-radius: 0px; |
||||
} |
||||
|
||||
#splitLayoutButton > span { |
||||
background: url('images/buttons.png') no-repeat -76px 0px; |
||||
display: inline-block; |
||||
width: 19px; |
||||
height: 19px; |
||||
} |
||||
|
||||
#openFileButton { |
||||
margin-left: 3px; |
||||
} |
||||
|
||||
#openFileButton > span { |
||||
background: url('images/buttons.png') no-repeat -38px 0px; |
||||
display: inline-block; |
||||
width: 19px; |
||||
height: 19px; |
||||
} |
||||
|
||||
#fileInput { |
||||
display: none; |
||||
} |
||||
|
||||
#pageNumber { |
||||
text-align: right; |
||||
} |
||||
|
||||
#sidebar { |
||||
position: fixed; |
||||
width: 200px; |
||||
top: 62px; |
||||
bottom: 18px; |
||||
left: -140px; |
||||
transition: left 0.25s ease-in-out 1s; |
||||
-moz-transition: left 0.25s ease-in-out 1s; |
||||
-webkit-transition: left 0.25s ease-in-out 1s; |
||||
} |
||||
|
||||
#sidebar:hover { |
||||
left: 0px; |
||||
transition: left 0.25s ease-in-out 0s; |
||||
-moz-transition: left 0.25s ease-in-out 0s; |
||||
-webkit-transition: left 0.25s ease-in-out 0s; |
||||
} |
||||
|
||||
#sidebarBox { |
||||
background-color: rgba(0, 0, 0, 0.7); |
||||
width: 150px; |
||||
height: 100%; |
||||
border-top-right-radius: 8px; |
||||
border-bottom-right-radius: 8px; |
||||
-moz-border-radius-topright: 8px; |
||||
-moz-border-radius-bottomright: 8px; |
||||
-webkit-border-top-right-radius: 8px; |
||||
-webkit-border-bottom-right-radius: 8px; |
||||
box-shadow: 0px 2px 8px #000; |
||||
-moz-box-shadow: 0px 2px 8px #000; |
||||
-webkit-box-shadow: 0px 2px 8px #000; |
||||
} |
||||
|
||||
#sidebarScrollView { |
||||
position: absolute; |
||||
overflow: hidden; |
||||
overflow-y: auto; |
||||
top: 10px; |
||||
bottom: 10px; |
||||
left: 10px; |
||||
width: 130px; |
||||
} |
||||
|
||||
#sidebarContentView { |
||||
height: auto; |
||||
width: 100px; |
||||
} |
||||
|
||||
#viewer { |
||||
margin: 44px 0px 0px; |
||||
padding: 8px 0px; |
||||
} |
@ -1,66 +0,0 @@
@@ -1,66 +0,0 @@
|
||||
<!DOCTYPE html> |
||||
<html> |
||||
<head> |
||||
<title>pdf.js Multi-Page Viewer</title> |
||||
<meta http-equiv="Content-type" content="text/html;charset=UTF-8"/> |
||||
<link rel="stylesheet" href="multi_page_viewer.css" type="text/css" media="screen"/> |
||||
<script type="text/javascript" src="compatibility.js"></script> |
||||
<script type="text/javascript" src="../pdf.js"></script> |
||||
<script type="text/javascript" src="../fonts.js"></script> |
||||
<script type="text/javascript" src="../crypto.js"></script> |
||||
<script type="text/javascript" src="../glyphlist.js"></script> |
||||
<script type="text/javascript" src="multi_page_viewer.js"></script> |
||||
</head> |
||||
<body> |
||||
<div id="controls"> |
||||
<span class="control"> |
||||
<button id="previousPageButton" disabled="disabled"><span></span></button> |
||||
<button id="nextPageButton" disabled="disabled"><span></span></button> |
||||
<span class="label">Previous/Next</span> |
||||
</span> |
||||
<span class="control"> |
||||
<input type="text" id="pageNumber" value="1" size="2"/> |
||||
<span>/</span> |
||||
<span id="numPages">--</span> |
||||
<span class="label">Page Number</span> |
||||
</span> |
||||
<span class="control"> |
||||
<select id="scaleSelect"> |
||||
<option value="50">50%</option> |
||||
<option value="75">75%</option> |
||||
<option value="100">100%</option> |
||||
<option value="125">125%</option> |
||||
<option value="150" selected="selected">150%</option> |
||||
<option value="200">200%</option> |
||||
</select> |
||||
<span class="label">Zoom</span> |
||||
</span> |
||||
|
||||
<!-- WIP: Leave commented out until implemented --> |
||||
<!-- |
||||
<span class="control"> |
||||
<button id="singleLayoutButton" class="selected"><span></span></button> |
||||
<button id="splitLayoutButton"><span></span></button> |
||||
<span class="label">Page Layout</span> |
||||
</span> |
||||
--> |
||||
|
||||
<span class="control" id="fileWrapper"> |
||||
<button id="openFileButton"><span></span></button> |
||||
<input type="file" id="fileInput"/> |
||||
<span class="label">Open File</span> |
||||
</span> |
||||
</div> |
||||
|
||||
<!-- EXPERIMENTAL: Slide-out sidebar with page thumbnails (comment-out to disable) --> |
||||
<div id="sidebar"> |
||||
<div id="sidebarBox"> |
||||
<div id="sidebarScrollView"> |
||||
<div id="sidebarContentView"></div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div id="viewer"></div> |
||||
</body> |
||||
</html> |
@ -1,513 +0,0 @@
@@ -1,513 +0,0 @@
|
||||
/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- / |
||||
/* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */ |
||||
|
||||
'use strict'; |
||||
|
||||
var pageTimeout; |
||||
|
||||
var PDFViewer = { |
||||
queryParams: {}, |
||||
|
||||
element: null, |
||||
|
||||
sidebarContentView: null, |
||||
|
||||
previousPageButton: null, |
||||
nextPageButton: null, |
||||
pageNumberInput: null, |
||||
scaleSelect: null, |
||||
fileInput: null, |
||||
|
||||
willJumpToPage: false, |
||||
|
||||
pdf: null, |
||||
|
||||
url: 'compressed.tracemonkey-pldi-09.pdf', |
||||
pageNumber: 1, |
||||
numberOfPages: 1, |
||||
|
||||
scale: 1.0, |
||||
|
||||
pageWidth: function(page) { |
||||
var pdfToCssUnitsCoef = 96.0 / 72.0; |
||||
var width = (page.mediaBox[2] - page.mediaBox[0]); |
||||
return width * PDFViewer.scale * pdfToCssUnitsCoef; |
||||
}, |
||||
|
||||
pageHeight: function(page) { |
||||
var pdfToCssUnitsCoef = 96.0 / 72.0; |
||||
var height = (page.mediaBox[3] - page.mediaBox[1]); |
||||
return height * PDFViewer.scale * pdfToCssUnitsCoef; |
||||
}, |
||||
|
||||
lastPagesDrawn: [], |
||||
|
||||
visiblePages: function() { |
||||
var pageBottomMargin = 10; |
||||
var windowTop = window.pageYOffset; |
||||
var windowBottom = window.pageYOffset + window.innerHeight; |
||||
|
||||
var pageHeight, page; |
||||
var i, n = PDFViewer.numberOfPages, currentHeight = pageBottomMargin; |
||||
for (i = 1; i <= n; i++) { |
||||
var page = PDFViewer.pdf.getPage(i); |
||||
pageHeight = PDFViewer.pageHeight(page) + pageBottomMargin; |
||||
if (currentHeight + pageHeight > windowTop) |
||||
break; |
||||
currentHeight += pageHeight; |
||||
} |
||||
|
||||
var pages = []; |
||||
for (; i <= n && currentHeight < windowBottom; i++) { |
||||
var page = PDFViewer.pdf.getPage(i); |
||||
pageHeight = PDFViewer.pageHeight(page) + pageBottomMargin; |
||||
currentHeight += pageHeight; |
||||
pages.push(i); |
||||
} |
||||
|
||||
return pages; |
||||
}, |
||||
|
||||
createThumbnail: function(num) { |
||||
if (PDFViewer.sidebarContentView) { |
||||
var anchor = document.createElement('a'); |
||||
anchor.href = '#' + num; |
||||
|
||||
var containerDiv = document.createElement('div'); |
||||
containerDiv.id = 'thumbnailContainer' + num; |
||||
containerDiv.className = 'thumbnail'; |
||||
|
||||
var pageNumberDiv = document.createElement('div'); |
||||
pageNumberDiv.className = 'thumbnailPageNumber'; |
||||
pageNumberDiv.innerHTML = '' + num; |
||||
|
||||
anchor.appendChild(containerDiv); |
||||
PDFViewer.sidebarContentView.appendChild(anchor); |
||||
PDFViewer.sidebarContentView.appendChild(pageNumberDiv); |
||||
} |
||||
}, |
||||
|
||||
removeThumbnail: function(num) { |
||||
var div = document.getElementById('thumbnailContainer' + num); |
||||
|
||||
if (div) { |
||||
while (div.hasChildNodes()) { |
||||
div.removeChild(div.firstChild); |
||||
} |
||||
} |
||||
}, |
||||
|
||||
drawThumbnail: function(num) { |
||||
if (!PDFViewer.pdf) |
||||
return; |
||||
|
||||
var div = document.getElementById('thumbnailContainer' + num); |
||||
|
||||
if (div && !div.hasChildNodes()) { |
||||
var page = PDFViewer.pdf.getPage(num); |
||||
var canvas = document.createElement('canvas'); |
||||
|
||||
canvas.id = 'thumbnail' + num; |
||||
canvas.mozOpaque = true; |
||||
|
||||
var pageWidth = PDFViewer.pageWidth(page); |
||||
var pageHeight = PDFViewer.pageHeight(page); |
||||
var thumbScale = Math.min(104 / pageWidth, 134 / pageHeight); |
||||
canvas.width = pageWidth * thumbScale; |
||||
canvas.height = pageHeight * thumbScale; |
||||
div.appendChild(canvas); |
||||
|
||||
var ctx = canvas.getContext('2d'); |
||||
ctx.save(); |
||||
ctx.fillStyle = 'rgb(255, 255, 255)'; |
||||
ctx.fillRect(0, 0, canvas.width, canvas.height); |
||||
ctx.restore(); |
||||
|
||||
page.startRendering(ctx, function() { }); |
||||
} |
||||
}, |
||||
|
||||
createPage: function(num) { |
||||
var page = PDFViewer.pdf.getPage(num); |
||||
|
||||
var anchor = document.createElement('a'); |
||||
anchor.name = '' + num; |
||||
|
||||
var div = document.createElement('div'); |
||||
div.id = 'pageContainer' + num; |
||||
div.className = 'page'; |
||||
div.style.width = PDFViewer.pageWidth(page) + 'px'; |
||||
div.style.height = PDFViewer.pageHeight(page) + 'px'; |
||||
|
||||
PDFViewer.element.appendChild(anchor); |
||||
PDFViewer.element.appendChild(div); |
||||
}, |
||||
|
||||
removePage: function(num) { |
||||
var div = document.getElementById('pageContainer' + num); |
||||
|
||||
if (div) { |
||||
while (div.hasChildNodes()) { |
||||
div.removeChild(div.firstChild); |
||||
} |
||||
} |
||||
}, |
||||
|
||||
drawPage: function(num) { |
||||
if (!PDFViewer.pdf) |
||||
return; |
||||
|
||||
var div = document.getElementById('pageContainer' + num); |
||||
|
||||
if (div && !div.hasChildNodes()) { |
||||
var page = PDFViewer.pdf.getPage(num); |
||||
var canvas = document.createElement('canvas'); |
||||
|
||||
canvas.id = 'page' + num; |
||||
canvas.mozOpaque = true; |
||||
|
||||
canvas.width = PDFViewer.pageWidth(page); |
||||
canvas.height = PDFViewer.pageHeight(page); |
||||
div.appendChild(canvas); |
||||
|
||||
var ctx = canvas.getContext('2d'); |
||||
ctx.save(); |
||||
ctx.fillStyle = 'rgb(255, 255, 255)'; |
||||
ctx.fillRect(0, 0, canvas.width, canvas.height); |
||||
ctx.restore(); |
||||
|
||||
page.startRendering(ctx, function() { }); |
||||
} |
||||
}, |
||||
|
||||
changeScale: function(num) { |
||||
while (PDFViewer.element.hasChildNodes()) { |
||||
PDFViewer.element.removeChild(PDFViewer.element.firstChild); |
||||
} |
||||
|
||||
PDFViewer.scale = num / 100; |
||||
|
||||
var i; |
||||
|
||||
if (PDFViewer.pdf) { |
||||
for (i = 1; i <= PDFViewer.numberOfPages; i++) { |
||||
PDFViewer.createPage(i); |
||||
} |
||||
} |
||||
|
||||
for (i = 0; i < PDFViewer.scaleSelect.childNodes; i++) { |
||||
var option = PDFViewer.scaleSelect.childNodes[i]; |
||||
|
||||
if (option.value == num) { |
||||
if (!option.selected) { |
||||
option.selected = 'selected'; |
||||
} |
||||
} else { |
||||
if (option.selected) { |
||||
option.removeAttribute('selected'); |
||||
} |
||||
} |
||||
} |
||||
|
||||
PDFViewer.scaleSelect.value = Math.floor(PDFViewer.scale * 100) + '%'; |
||||
|
||||
// Clear the array of the last pages drawn to force a redraw.
|
||||
PDFViewer.lastPagesDrawn = []; |
||||
|
||||
// Jump the scroll position to the correct page.
|
||||
PDFViewer.goToPage(PDFViewer.pageNumber); |
||||
}, |
||||
|
||||
goToPage: function(num) { |
||||
if (1 <= num && num <= PDFViewer.numberOfPages) { |
||||
PDFViewer.pageNumber = num; |
||||
PDFViewer.pageNumberInput.value = PDFViewer.pageNumber; |
||||
PDFViewer.willJumpToPage = true; |
||||
|
||||
if (document.location.hash.substr(1) == PDFViewer.pageNumber) |
||||
// Force a "scroll event" to redraw
|
||||
setTimeout(window.onscroll, 0); |
||||
document.location.hash = PDFViewer.pageNumber; |
||||
|
||||
PDFViewer.previousPageButton.disabled = (PDFViewer.pageNumber === 1); |
||||
PDFViewer.nextPageButton.disabled = (PDFViewer.pageNumber === PDFViewer.numberOfPages); |
||||
} |
||||
}, |
||||
|
||||
goToPreviousPage: function() { |
||||
if (PDFViewer.pageNumber > 1) { |
||||
PDFViewer.goToPage(--PDFViewer.pageNumber); |
||||
} |
||||
}, |
||||
|
||||
goToNextPage: function() { |
||||
if (PDFViewer.pageNumber < PDFViewer.numberOfPages) { |
||||
PDFViewer.goToPage(++PDFViewer.pageNumber); |
||||
} |
||||
}, |
||||
|
||||
openURL: function(url) { |
||||
PDFViewer.url = url; |
||||
document.title = url; |
||||
|
||||
if (this.thumbsLoadingInterval) { |
||||
// cancel thumbs loading operations
|
||||
clearInterval(this.thumbsLoadingInterval); |
||||
this.thumbsLoadingInterval = null; |
||||
} |
||||
|
||||
var 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); |
||||
|
||||
PDFViewer.readPDF(data); |
||||
} |
||||
}; |
||||
|
||||
req.send(null); |
||||
}, |
||||
|
||||
thumbsLoadingInterval: null, |
||||
|
||||
readPDF: function(data) { |
||||
while (PDFViewer.element.hasChildNodes()) { |
||||
PDFViewer.element.removeChild(PDFViewer.element.firstChild); |
||||
} |
||||
|
||||
while (PDFViewer.sidebarContentView.hasChildNodes()) { |
||||
PDFViewer.sidebarContentView.removeChild( |
||||
PDFViewer.sidebarContentView.firstChild |
||||
); |
||||
} |
||||
|
||||
PDFViewer.pdf = new PDFDoc(new Stream(data)); |
||||
PDFViewer.numberOfPages = PDFViewer.pdf.numPages; |
||||
document.getElementById('numPages').innerHTML = |
||||
PDFViewer.numberOfPages.toString(); |
||||
|
||||
for (var i = 1; i <= PDFViewer.numberOfPages; i++) { |
||||
PDFViewer.createPage(i); |
||||
} |
||||
|
||||
if (PDFViewer.numberOfPages > 0) { |
||||
PDFViewer.drawPage(1); |
||||
document.location.hash = 1; |
||||
|
||||
// slowly loading the thumbs (few per second)
|
||||
// first time we are loading more images than subsequent
|
||||
var currentPageIndex = 1, imagesToLoad = 15; |
||||
this.thumbsLoadingInterval = setInterval((function() { |
||||
while (imagesToLoad-- > 0) { |
||||
if (currentPageIndex > PDFViewer.numberOfPages) { |
||||
clearInterval(this.thumbsLoadingInterval); |
||||
this.thumbsLoadingInterval = null; |
||||
return; |
||||
} |
||||
PDFViewer.createThumbnail(currentPageIndex); |
||||
PDFViewer.drawThumbnail(currentPageIndex); |
||||
++currentPageIndex; |
||||
} |
||||
imagesToLoad = 3; // next time loading less images
|
||||
}).bind(this), 500); |
||||
} |
||||
|
||||
PDFViewer.previousPageButton.disabled = (PDFViewer.pageNumber === 1); |
||||
PDFViewer.nextPageButton.disabled = (PDFViewer.pageNumber === PDFViewer.numberOfPages); |
||||
} |
||||
}; |
||||
|
||||
window.onload = function() { |
||||
// Parse the URL query parameters into a cached object.
|
||||
PDFViewer.queryParams = function() { |
||||
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; |
||||
}(); |
||||
|
||||
PDFViewer.element = document.getElementById('viewer'); |
||||
|
||||
PDFViewer.sidebarContentView = document.getElementById('sidebarContentView'); |
||||
|
||||
PDFViewer.pageNumberInput = document.getElementById('pageNumber'); |
||||
PDFViewer.pageNumberInput.onkeydown = function(evt) { |
||||
var charCode = evt.charCode || evt.keyCode; |
||||
|
||||
// Up arrow key.
|
||||
if (charCode === 38) { |
||||
PDFViewer.goToNextPage(); |
||||
this.select(); |
||||
} |
||||
|
||||
// Down arrow key.
|
||||
else if (charCode === 40) { |
||||
PDFViewer.goToPreviousPage(); |
||||
this.select(); |
||||
} |
||||
|
||||
// All other non-numeric keys (excluding Left arrow, Right arrow,
|
||||
// Backspace, and Delete keys).
|
||||
else if ((charCode < 48 || charCode > 57) && |
||||
charCode !== 8 && // Backspace
|
||||
charCode !== 46 && // Delete
|
||||
charCode !== 37 && // Left arrow
|
||||
charCode !== 39 // Right arrow
|
||||
) { |
||||
return false; |
||||
} |
||||
|
||||
return true; |
||||
}; |
||||
PDFViewer.pageNumberInput.onkeyup = function(evt) { |
||||
var charCode = evt.charCode || evt.keyCode; |
||||
|
||||
// All numeric keys, Backspace, and Delete.
|
||||
if ((charCode >= 48 && charCode <= 57) || |
||||
charCode === 8 || // Backspace
|
||||
charCode === 46 // Delete
|
||||
) { |
||||
PDFViewer.goToPage(this.value); |
||||
} |
||||
|
||||
this.focus(); |
||||
}; |
||||
|
||||
PDFViewer.previousPageButton = document.getElementById('previousPageButton'); |
||||
PDFViewer.previousPageButton.onclick = function(evt) { |
||||
PDFViewer.goToPreviousPage(); |
||||
}; |
||||
PDFViewer.previousPageButton.onmousedown = function(evt) { |
||||
this.className = 'down'; |
||||
}; |
||||
PDFViewer.previousPageButton.onmouseup = function(evt) { |
||||
this.className = ''; |
||||
}; |
||||
PDFViewer.previousPageButton.onmouseout = function(evt) { |
||||
this.className = ''; |
||||
}; |
||||
|
||||
PDFViewer.nextPageButton = document.getElementById('nextPageButton'); |
||||
PDFViewer.nextPageButton.onclick = function(evt) { |
||||
PDFViewer.goToNextPage(); |
||||
}; |
||||
PDFViewer.nextPageButton.onmousedown = function(evt) { |
||||
this.className = 'down'; |
||||
}; |
||||
PDFViewer.nextPageButton.onmouseup = function(evt) { |
||||
this.className = ''; |
||||
}; |
||||
PDFViewer.nextPageButton.onmouseout = function(evt) { |
||||
this.className = ''; |
||||
}; |
||||
|
||||
PDFViewer.scaleSelect = document.getElementById('scaleSelect'); |
||||
PDFViewer.scaleSelect.onchange = function(evt) { |
||||
PDFViewer.changeScale(parseInt(this.value)); |
||||
}; |
||||
|
||||
if (window.File && window.FileReader && window.FileList && window.Blob) { |
||||
var openFileButton = document.getElementById('openFileButton'); |
||||
openFileButton.onclick = function(evt) { |
||||
PDFViewer.fileInput.click(); |
||||
}; |
||||
openFileButton.onmousedown = function(evt) { |
||||
this.className = 'down'; |
||||
}; |
||||
openFileButton.onmouseup = function(evt) { |
||||
this.className = ''; |
||||
}; |
||||
openFileButton.onmouseout = function(evt) { |
||||
this.className = ''; |
||||
}; |
||||
|
||||
PDFViewer.fileInput = document.getElementById('fileInput'); |
||||
PDFViewer.fileInput.onchange = function(evt) { |
||||
var files = evt.target.files; |
||||
|
||||
if (files.length > 0) { |
||||
var file = files[0]; |
||||
var fileReader = new FileReader(); |
||||
|
||||
document.title = file.name; |
||||
|
||||
// Read the local file into a Uint8Array.
|
||||
fileReader.onload = function(evt) { |
||||
var data = evt.target.result; |
||||
var buffer = new ArrayBuffer(data.length); |
||||
var uint8Array = new Uint8Array(buffer); |
||||
|
||||
for (var i = 0; i < data.length; i++) { |
||||
uint8Array[i] = data.charCodeAt(i); |
||||
} |
||||
|
||||
PDFViewer.readPDF(uint8Array); |
||||
}; |
||||
|
||||
// Read as a binary string since "readAsArrayBuffer" is not yet
|
||||
// implemented in Firefox.
|
||||
fileReader.readAsBinaryString(file); |
||||
} |
||||
}; |
||||
PDFViewer.fileInput.value = null; |
||||
} else { |
||||
document.getElementById('fileWrapper').style.display = 'none'; |
||||
} |
||||
|
||||
PDFViewer.pageNumber = |
||||
parseInt(PDFViewer.queryParams.page) || PDFViewer.pageNumber; |
||||
PDFViewer.scale = parseInt(PDFViewer.scaleSelect.value) / 100 || 1.0; |
||||
|
||||
PDFViewer.openURL(PDFViewer.queryParams.file || PDFViewer.url); |
||||
|
||||
window.onscroll = function(evt) { |
||||
var lastPagesDrawn = PDFViewer.lastPagesDrawn; |
||||
var visiblePages = PDFViewer.visiblePages(); |
||||
|
||||
var pagesToDraw = []; |
||||
var pagesToKeep = []; |
||||
var pagesToRemove = []; |
||||
|
||||
var i; |
||||
|
||||
// Determine which visible pages were not previously drawn.
|
||||
for (i = 0; i < visiblePages.length; i++) { |
||||
if (lastPagesDrawn.indexOf(visiblePages[i]) === -1) { |
||||
pagesToDraw.push(visiblePages[i]); |
||||
PDFViewer.drawPage(visiblePages[i]); |
||||
} else { |
||||
pagesToKeep.push(visiblePages[i]); |
||||
} |
||||
} |
||||
|
||||
// Determine which previously drawn pages are no longer visible.
|
||||
for (i = 0; i < lastPagesDrawn.length; i++) { |
||||
if (visiblePages.indexOf(lastPagesDrawn[i]) === -1) { |
||||
pagesToRemove.push(lastPagesDrawn[i]); |
||||
PDFViewer.removePage(lastPagesDrawn[i]); |
||||
} |
||||
} |
||||
|
||||
PDFViewer.lastPagesDrawn = pagesToDraw.concat(pagesToKeep); |
||||
|
||||
// Update the page number input with the current page number.
|
||||
if (!PDFViewer.willJumpToPage && visiblePages.length > 0) { |
||||
PDFViewer.pageNumber = PDFViewer.pageNumberInput.value = visiblePages[0]; |
||||
PDFViewer.previousPageButton.disabled = (PDFViewer.pageNumber === 1); |
||||
PDFViewer.nextPageButton.disabled = (PDFViewer.pageNumber === PDFViewer.numberOfPages); |
||||
} else { |
||||
PDFViewer.willJumpToPage = false; |
||||
} |
||||
}; |
||||
}; |
Loading…
Reference in new issue