From a8df1c5dc98c78b837e4354117575a0a535ef40a Mon Sep 17 00:00:00 2001
From: notmasteryet <async.processingjs@yahoo.com>
Date: Wed, 31 Aug 2011 07:22:48 -0500
Subject: [PATCH] Scale images proportionally
---
web/viewer.css | 14 ++++++++++++--
web/viewer.js | 14 ++++++++++----
2 files changed, 22 insertions(+), 6 deletions(-)
diff --git a/web/viewer.css b/web/viewer.css
index a8578eb7e..ae00efd01 100755
--- a/web/viewer.css
+++ b/web/viewer.css
@@ -109,13 +109,23 @@ span#info {
}
.thumbnail {
- width: 104px;
+ width: 134px;
height: 134px;
- background-color: white;
margin-top: 5px;
margin-bottom: 5px;
margin-left:auto;
margin-right:auto;
+ line-height: 134px;
+ text-align: center;
+}
+
+.thumbnail:not([data-loaded]) {
+ background-color: gray;
+}
+
+.thumbnail > canvas {
+ vertical-align: middle;
+ display: inline-block;
}
#outlineScrollView {
diff --git a/web/viewer.js b/web/viewer.js
index c93df3b74..ceaf22fa3 100644
--- a/web/viewer.js
+++ b/web/viewer.js
@@ -123,7 +123,8 @@ 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, pages[i - 1],
+ page.width / page.height));
var pageRef = page.ref;
pagesRefMap[pageRef.num + ' ' + pageRef.gen + ' R'] = i;
}
@@ -274,7 +275,7 @@ var PageView = function(container, content, id, width, height,
};
};
-var ThumbnailView = function(container, page) {
+var ThumbnailView = function(container, page, pageRatio) {
var anchor = document.createElement('a');
anchor.href = '#' + page.id;
@@ -293,8 +294,13 @@ var ThumbnailView = function(container, page) {
canvas.id = 'thumbnail' + page.id;
canvas.mozOpaque = true;
- canvas.width = 104;
- canvas.height = 134;
+ var maxThumbSize = 134;
+ canvas.width = pageRatio >= 1 ? maxThumbSize :
+ maxThumbSize * pageRatio;
+ canvas.height = pageRatio <= 1 ? maxThumbSize :
+ maxThumbSize / pageRatio;
+
+ div.setAttribute('data-loaded', true);
div.appendChild(canvas);
var ctx = canvas.getContext('2d');