Bug 812899 part 2. Change the centering code in nsImageDocument to only try vertically centering via auto margins when we're not overflowing in the vertical direction, because if we _are_ overflowing that should cut off part of the image per spec. r=khuey

This commit is contained in:
Boris Zbarsky 2016-02-05 23:31:19 -05:00
parent 09c344191e
commit 6019ca23a6
5 changed files with 81 additions and 9 deletions

View File

@ -414,7 +414,11 @@ ImageDocument::RestoreImage()
imageContent->UnsetAttr(kNameSpaceID_None, nsGkAtoms::height, true); imageContent->UnsetAttr(kNameSpaceID_None, nsGkAtoms::height, true);
if (ImageIsOverflowing()) { if (ImageIsOverflowing()) {
SetModeClass(eOverflowing); if (!mImageIsOverflowingVertically) {
SetModeClass(eOverflowingHorizontalOnly);
} else {
SetModeClass(eOverflowingVertical);
}
} }
else { else {
SetModeClass(eNone); SetModeClass(eNone);
@ -506,10 +510,16 @@ ImageDocument::SetModeClass(eModeClasses mode)
classList->Remove(NS_LITERAL_STRING("shrinkToFit"), rv); classList->Remove(NS_LITERAL_STRING("shrinkToFit"), rv);
} }
if (mode == eOverflowing) { if (mode == eOverflowingVertical) {
classList->Add(NS_LITERAL_STRING("overflowing"), rv); classList->Add(NS_LITERAL_STRING("overflowingVertical"), rv);
} else { } else {
classList->Remove(NS_LITERAL_STRING("overflowing"), rv); classList->Remove(NS_LITERAL_STRING("overflowingVertical"), rv);
}
if (mode == eOverflowingHorizontalOnly) {
classList->Add(NS_LITERAL_STRING("overflowingHorizontalOnly"), rv);
} else {
classList->Remove(NS_LITERAL_STRING("overflowingHorizontalOnly"), rv);
} }
} }
@ -682,17 +692,26 @@ ImageDocument::CheckOverflowing(bool changeState)
} }
bool imageWasOverflowing = ImageIsOverflowing(); bool imageWasOverflowing = ImageIsOverflowing();
bool imageWasOverflowingVertically = mImageIsOverflowingVertically;
mImageIsOverflowingHorizontally = mImageWidth > mVisibleWidth; mImageIsOverflowingHorizontally = mImageWidth > mVisibleWidth;
mImageIsOverflowingVertically = mImageHeight > mVisibleHeight; mImageIsOverflowingVertically = mImageHeight > mVisibleHeight;
bool windowBecameBigEnough = imageWasOverflowing && !ImageIsOverflowing(); bool windowBecameBigEnough = imageWasOverflowing && !ImageIsOverflowing();
bool verticalOverflowChanged =
mImageIsOverflowingVertically != imageWasOverflowingVertically;
if (changeState || mShouldResize || mFirstResize || if (changeState || mShouldResize || mFirstResize ||
windowBecameBigEnough) { windowBecameBigEnough || verticalOverflowChanged) {
if (ImageIsOverflowing() && (changeState || mShouldResize)) { if (ImageIsOverflowing() && (changeState || mShouldResize)) {
ShrinkToFit(); ShrinkToFit();
} }
else if (mImageIsResized || mFirstResize || windowBecameBigEnough) { else if (mImageIsResized || mFirstResize || windowBecameBigEnough) {
RestoreImage(); RestoreImage();
} else if (!mImageIsResized && verticalOverflowChanged) {
if (mImageIsOverflowingVertically) {
SetModeClass(eOverflowingVertical);
} else {
SetModeClass(eOverflowingHorizontalOnly);
}
} }
} }
mFirstResize = false; mFirstResize = false;

View File

@ -101,7 +101,8 @@ protected:
enum eModeClasses { enum eModeClasses {
eNone, eNone,
eShrinkToFit, eShrinkToFit,
eOverflowing eOverflowingVertical, // And maybe horizontal too.
eOverflowingHorizontalOnly
}; };
void SetModeClass(eModeClasses mode); void SetModeClass(eModeClasses mode);

View File

@ -88,8 +88,53 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=369370
is(kidDoc.body.scrollLeft, 0, "Checking scrollLeft"); is(kidDoc.body.scrollLeft, 0, "Checking scrollLeft");
is(kidDoc.body.scrollTop, 0, "Checking scrollTop"); is(kidDoc.body.scrollTop, 0, "Checking scrollTop");
kidWin.close(); // ========== test 5 ==========
SimpleTest.finish(); // Click in the upper left to zoom in again
event = makeClickFor(25, 25);
img.dispatchEvent(event);
ok(true, "----- click 5 -----");
is(img.width, 800, "image width");
is(img.height, 600, "image height");
is(kidDoc.body.scrollLeft, 0, "Checking scrollLeft");
is(kidDoc.body.scrollTop, 0, "Checking scrollTop");
is(img.getBoundingClientRect().top, 0, "Image is in view vertically");
// ========== test 6 ==========
// Now try resizing the window so the image fits vertically.
function test6() {
kidWin.addEventListener("resize", function resizeListener() {
kidWin.removeEventListener("resize", resizeListener);
// Give the image document time to respond
SimpleTest.executeSoon(function() {
is(img.height, 600, "image height");
is(img.getBoundingClientRect().top, 25, "Image is vertically centered");
test7();
});
});
var decorationSize = kidWin.outerHeight - kidWin.innerHeight;
kidWin.resizeTo(400, 600 + 50 + decorationSize);
}
// ========== test 7 ==========
// Now try resizing the window so the image no longer fits vertically.
function test7() {
kidWin.addEventListener("resize", function resizeListener() {
kidWin.removeEventListener("resize", resizeListener);
// Give the image document time to respond
SimpleTest.executeSoon(function() {
is(img.height, 600, "image height");
is(img.getBoundingClientRect().top, 0, "Image is at top again");
kidWin.close();
SimpleTest.finish();
});
});
var decorationSize = kidWin.outerHeight - kidWin.innerHeight;
kidWin.resizeTo(400, 300 + decorationSize);
}
test6();
} }
var kidWin; var kidWin;
var kidDoc; var kidDoc;

View File

@ -9,7 +9,7 @@
*/ */
@media not print { @media not print {
.overflowing { .overflowingVertical, .overflowingHorizontalOnly {
cursor: zoom-out; cursor: zoom-out;
} }

View File

@ -23,6 +23,13 @@
left: 0; left: 0;
} }
img.overflowingVertical {
/* If we're overflowing vertically, we need to set margin-top to
0. Otherwise we'll end up trying to vertically center, and end
up cutting off the top part of the image. */
margin-top: 0;
}
.completeRotation { .completeRotation {
transition: transform 0.3s ease 0s; transition: transform 0.3s ease 0s;
} }