From 274249a4357b26aca650db05160c0e75f9df8f87 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Gerg=C5=91=20Tisza?= Date: Fri, 20 Feb 2015 01:20:21 +0000 Subject: [PATCH] Fix IE crop/stretch problems It seems that IE11 sometimes does not keep the aspect ratio when the width DOM property is set but height is not. Also attempt to clarify what the two similar canvas setters are good for, to the extent I could figure it out. Bug: T89679 Change-Id: I9c87e2146e3d99d1ee00d7c00142b2ae1c3d7951 --- resources/mmv/ui/mmv.ui.canvas.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/resources/mmv/ui/mmv.ui.canvas.js b/resources/mmv/ui/mmv.ui.canvas.js index 2ed1f2f33..fef3c7d99 100644 --- a/resources/mmv/ui/mmv.ui.canvas.js +++ b/resources/mmv/ui/mmv.ui.canvas.js @@ -102,7 +102,10 @@ }; /** - * Sets contained image. + * Sets image on the canvas; does not resize it to fit. This is used to make the placeholder + * image available; it will be resized and displayed by #maybeDisplayPlaceholder(). + * FIXME maybeDisplayPlaceholder() receives the placeholder so it is very unclear why this + * is necessary at all (apart from setting the LightboxImage, which is used in size calculations). * @param {mw.mmv.LightboxImage} imageRawMetadata * @param {jQuery} $imageElement */ @@ -117,8 +120,8 @@ }; /** - * Sets contained image and also the max dimensions. Called while resizing the viewer. - * Assumes set function called before. + * Resizes image to the given dimensions and displays it on the canvas. + * This is used to display the actual image; it assumes set function was already called before. * @param {mw.mmv.model.Thumbnail} thumbnail thumbnail information * @param {HTMLImageElement} imageElement * @param {mw.mmv.model.ThumbnailWidth} imageWidths @@ -129,6 +132,7 @@ // we downscale larger images but do not scale up smaller ones, that would look ugly if ( thumbnail.width > imageWidths.cssWidth ) { imageElement.width = imageWidths.cssWidth; + imageElement.height = imageWidths.cssHeight; } if ( !this.$image.is( imageElement ) ) { // http://bugs.jquery.com/ticket/4087