Fix buttons fadeOut when coming back from fullscreen

Bug: T164410
Change-Id: I4275c15733b10cff68a20b19e5fb195a88fafebf
This commit is contained in:
Matthias Mullie 2017-06-07 16:52:52 +02:00
parent a95c268dc3
commit 31c93b79fa
3 changed files with 22 additions and 4 deletions

View file

@ -338,9 +338,18 @@
delayIn: tooltipDelay,
gravity: this.correctEW( 'ne' )
} )
.click( function () {
.click( function ( e ) {
if ( ui.isFullscreen ) {
ui.exitFullscreen();
// mousemove is throttled and the mouse coordinates only
// register every 250ms, so there is a chance that we moved
// our mouse over one of the buttons but it didn't register,
// and a fadeOut is triggered; when we're coming back from
// fullscreen, we'll want to make sure the mouse data is
// current so that the fadeOut behavior will not trigger
ui.mousePosition = { x: e.pageX, y: e.pageY };
ui.buttons.revealAndFade( ui.mousePosition );
} else {
ui.enterFullscreen();
}

View file

@ -175,9 +175,12 @@
offset = $e.offset();
if ( y >= offset.top &&
y <= offset.top + $e.height() &&
// using css( 'height' ) & css( 'width' ) instead of .height()
// and .width() since those don't include padding, and as a
// result can return a smaller size than is actually the button
y <= offset.top + parseInt( $e.css( 'height' ) ) &&
x >= offset.left &&
x <= offset.left + $e.width() ) {
x <= offset.left + parseInt( $e.css( 'width' ) ) ) {
hovered = true;
}
} );

View file

@ -144,7 +144,7 @@
restoreScrollTo();
} );
QUnit.test( 'Fullscreen mode', 8, function ( assert ) {
QUnit.test( 'Fullscreen mode', 9, function ( assert ) {
var buttonOffset, panelBottom,
oldRevealButtonsAndFadeIfNeeded,
lightbox = new mw.mmv.LightboxInterface(),
@ -202,6 +202,12 @@
assert.ok( panelBottom === $( window ).height(), 'Image metadata does not extend beyond the viewport' );
lightbox.buttons.revealAndFade = function ( position ) {
assert.ok( true, 'Closing fullscreen triggers a reveal + fade' );
oldRevealButtonsAndFadeIfNeeded.call( this, position );
};
// Exiting fullscreen
lightbox.buttons.$fullscreen.click();