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

Merge pull request #509 from vingtetun/master

Browse Source 
Support CropBox (see PDFReference page 145)
This commit is contained in:
Andreas Gal 2011-09-22 16:03:41 -07:00
commit 8c7934e59d
3 changed files with 61 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
pdf.js
View File

@ -3324,6 +3324,31 @@ var Page = (function pagePage() {
return shadow(this, 'mediaBox',
((IsArray(obj) && obj.length == 4) ? obj : null));
},
get view() {
var obj = this.inheritPageProp('CropBox');
var view = {
x: 0,
y: 0,
width: this.width,
height: this.height
};
if (IsArray(obj) && obj.length == 4) {
var rotate = this.rotate;
if (rotate == 0 || rotate == 180) {
view.x = obj[0];
view.y = obj[1];
view.width = obj[2] - view.x;
view.height = obj[3] - view.y;
} else {
view.x = obj[1];
view.y = obj[0];
view.width = obj[3] - view.x;
view.height = obj[2] - view.y;
}
}
return shadow(this, 'cropBox', view);
},
get annotations() {
return shadow(this, 'annotations', this.inheritPageProp('Annots'));
},

10
web/viewer.css
View File

@ -119,6 +119,7 @@ span#info {
margin-right:auto;
line-height: 134px;
text-align: center;
overflow: hidden;
}
.thumbnail:not([data-loaded]) {
@ -195,16 +196,17 @@ span#info {
canvas {
margin: auto;
display: block;
box-shadow: 0px 4px 10px #000;
-moz-box-shadow: 0px 4px 10px #000;
-webkit-box-shadow: 0px 4px 10px #000;
}
.page {
width: 816px;
height: 1056px;
margin: 10px auto;
position:relative;
position: relative;
overflow: hidden;
box-shadow: 0px 4px 10px #000;
-moz-box-shadow: 0px 4px 10px #000;
-webkit-box-shadow: 0px 4px 10px #000;
}
.page > a {

45
web/viewer.js
View File

@ -58,9 +58,9 @@ var PDFView = {
var currentPage = this.pages[this.page - 1];
var pageWidthScale = (window.innerWidth - kScrollbarPadding) /
currentPage.width / kCssUnits;
currentPage.width / kCssUnits;
var pageHeightScale = (window.innerHeight - kScrollbarPadding) /
currentPage.height / kCssUnits;
currentPage.height / kCssUnits;
if ('page-width' == value)
this.setScale(pageWidthScale, resetAutoSettings);
if ('page-height' == value)
@ -170,7 +170,7 @@ var PDFView = {
var page = pdf.getPage(i);
pages.push(new PageView(container, page, i, page.width, page.height,
page.stats, this.navigateTo.bind(this)));
thumbnails.push(new ThumbnailView(sidebar, pages[i - 1],
thumbnails.push(new ThumbnailView(sidebar, page, i,
page.width / page.height));
var pageRef = page.ref;
pagesRefMap[pageRef.num + ' ' + pageRef.gen + ' R'] = i;
@ -237,13 +237,17 @@ var PDFView = {
}
};
var PageView = function(container, content, id, width, height,
var PageView = function(container, content, id, pageWidth, pageHeight,
stats, navigateTo) {
this.width = width;
this.height = height;
this.id = id;
this.content = content;
var view = this.content.view;
this.x = view.x;
this.y = view.y;
this.width = view.width;
this.height = view.height;
var anchor = document.createElement('a');
anchor.name = '' + this.id;
@ -272,11 +276,12 @@ var PageView = function(container, content, id, width, height,
return false;
};
}
var links = content.getLinks();
for (var i = 0; i < links.length; i++) {
var link = document.createElement('a');
link.style.left = Math.floor(links[i].x * scale) + 'px';
link.style.top = Math.floor(links[i].y * scale) + 'px';
link.style.left = (Math.floor(links[i].x - this.x) * scale) + 'px';
link.style.top = (Math.floor(links[i].y - this.y) * scale) + 'px';
link.style.width = Math.ceil(links[i].width * scale) + 'px';
link.style.height = Math.ceil(links[i].height * scale) + 'px';
link.href = links[i].url || '';
@ -364,8 +369,9 @@ var PageView = function(container, content, id, width, height,
canvas.id = 'page' + this.id;
canvas.mozOpaque = true;
canvas.width = this.width * this.scale;
canvas.height = this.height * this.scale;
var scale = this.scale;
canvas.width = pageWidth * scale;
canvas.height = pageHeight * scale;
div.appendChild(canvas);
var ctx = canvas.getContext('2d');
@ -373,6 +379,7 @@ var PageView = function(container, content, id, width, height,
ctx.fillStyle = 'rgb(255, 255, 255)';
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.restore();
ctx.translate(-this.x * scale, -this.y * scale);
stats.begin = Date.now();
this.content.startRendering(ctx, this.updateStats);
@ -391,12 +398,12 @@ var PageView = function(container, content, id, width, height,
};
};
var ThumbnailView = function(container, page, pageRatio) {
var ThumbnailView = function(container, page, id, pageRatio) {
var anchor = document.createElement('a');
anchor.href = '#' + page.id;
anchor.href = '#' + id;
var div = document.createElement('div');
div.id = 'thumbnailContainer' + page.id;
div.id = 'thumbnailContainer' + id;
div.className = 'thumbnail';
anchor.appendChild(div);
@ -407,7 +414,7 @@ var ThumbnailView = function(container, page, pageRatio) {
return;
var canvas = document.createElement('canvas');
canvas.id = 'thumbnail' + page.id;
canvas.id = 'thumbnail' + id;
canvas.mozOpaque = true;
var maxThumbSize = 134;
@ -425,7 +432,15 @@ var ThumbnailView = function(container, page, pageRatio) {
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.restore();
page.content.startRendering(ctx, function() { });
var view = page.view;
var scaleX = (canvas.width / page.width);
var scaleY = (canvas.height / page.height);
ctx.translate(-view.x * scaleX, -view.y * scaleY);
div.style.width = (view.width * scaleX) + 'px';
div.style.height = (view.height * scaleY) + 'px';
div.style.lineHeight = (view.height * scaleY) + 'px';
page.startRendering(ctx, function() { });
};
};