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

viewer: Support Retina/HiDPI thumbnails

Browse Source 
Reuse the existing getOutputScale() machinery to render and/or rescale
thumbnail images to the native display resolution. Fixes blurry thumbnails on
HiDPI displays making it a lot easier to make out the content.
This commit is contained in:
Mike Corbin 2015-05-16 14:18:36 +01:00
parent 07af86cf70
commit 357ee6cbb2
1 changed files with 14 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
web/pdf_thumbnail_view.js
View File

@ -14,7 +14,7 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
*/ */
/* globals mozL10n, RenderingStates, Promise */ /* globals mozL10n, RenderingStates, Promise, getOutputScale */
'use strict'; 'use strict';
@ -177,12 +177,11 @@ var PDFThumbnailView = (function PDFThumbnailViewClosure() {
/** /**
* @private * @private
*/ */
_getPageDrawContext: function PDFThumbnailView_getPageDrawContext() { _getPageDrawContext:
function PDFThumbnailView_getPageDrawContext(noCtxScale) {
var canvas = document.createElement('canvas'); var canvas = document.createElement('canvas');
canvas.id = this.renderingId; canvas.id = this.renderingId;
canvas.width = this.canvasWidth;
canvas.height = this.canvasHeight;
canvas.className = 'thumbnailImage'; canvas.className = 'thumbnailImage';
canvas.setAttribute('aria-label', mozL10n.get('thumb_page_canvas', canvas.setAttribute('aria-label', mozL10n.get('thumb_page_canvas',
{page: this.id}, 'Thumbnail of Page {{page}}')); {page: this.id}, 'Thumbnail of Page {{page}}'));
@ -191,7 +190,16 @@ var PDFThumbnailView = (function PDFThumbnailViewClosure() {
this.div.setAttribute('data-loaded', true); this.div.setAttribute('data-loaded', true);
this.ring.appendChild(canvas); this.ring.appendChild(canvas);
return canvas.getContext('2d'); var ctx = canvas.getContext('2d');
var outputScale = getOutputScale(ctx);
canvas.width = (this.canvasWidth * outputScale.sx) | 0;
canvas.height = (this.canvasHeight * outputScale.sy) | 0;
canvas.style.width = this.canvasWidth + 'px';
canvas.style.height = this.canvasHeight + 'px';
if (!noCtxScale && outputScale.scaled) {
ctx.scale(outputScale.sx, outputScale.sy);
}
return ctx;
}, },
draw: function PDFThumbnailView_draw() { draw: function PDFThumbnailView_draw() {
@ -274,7 +282,7 @@ var PDFThumbnailView = (function PDFThumbnailViewClosure() {
this.hasImage = true; this.hasImage = true;
this.renderingState = RenderingStates.FINISHED; this.renderingState = RenderingStates.FINISHED;
var ctx = this._getPageDrawContext(); var ctx = this._getPageDrawContext(true);
var canvas = ctx.canvas; var canvas = ctx.canvas;
if (img.width <= 2 * canvas.width) { if (img.width <= 2 * canvas.width) {