mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-10-08 02:14:43 +00:00
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:
parent
09c344191e
commit
6019ca23a6
@ -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;
|
||||||
|
@ -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);
|
||||||
|
|
||||||
|
@ -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;
|
||||||
|
@ -9,7 +9,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
@media not print {
|
@media not print {
|
||||||
.overflowing {
|
.overflowingVertical, .overflowingHorizontalOnly {
|
||||||
cursor: zoom-out;
|
cursor: zoom-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -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;
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user