Hide the fullscren button when fullscreen is unavailable

Change-Id: I72cff940cee1ad83f6bacfffdcfb9fdd0f16abcc
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/152
This commit is contained in:
Gilles Dubuc 2014-01-31 10:58:28 +01:00 committed by Mark Holmquist
parent 09314b3df9
commit 4e85f31b27
3 changed files with 28 additions and 3 deletions

View file

@ -241,6 +241,8 @@
}
} );
this.setupFullscreenButton();
this.$controlBar.append(
this.$closeButton,
this.$fullscreenButton
@ -254,6 +256,15 @@
this.addElementsToDiv( this.$preDiv, toAdd );
};
LIP.setupFullscreenButton = function () {
// If the browser doesn't support fullscreen mode, hide the fullscreen button
if ( $.support.fullscreen ) {
this.$fullscreenButton.show();
} else {
this.$fullscreenButton.hide();
}
};
LIP.setupPostDiv = function ( buildDefaults, toAdd ) {
if ( buildDefaults ) {
lightboxHooks.callAll( 'modifyDefaultPostDiv', this );

View file

@ -49,10 +49,11 @@
lightbox.load(img);
} );
QUnit.test( 'Fullscreen mode', 6, function ( assert ) {
QUnit.test( 'Fullscreen mode', 8, function ( assert ) {
var lightbox = new window.LightboxInterface(),
oldFnEnterFullscreen = $.fn.enterFullscreen,
oldFnExitFullscreen = $.fn.exitFullscreen;
oldFnExitFullscreen = $.fn.exitFullscreen,
oldSupportFullscreen = $.support.fullscreen;
// Since we don't want these tests to really open fullscreen
// which is subject to user security confirmation,
@ -63,6 +64,18 @@
// Attach lightbox to testing fixture to avoid interference with other tests.
lightbox.attach( '#qunit-fixture' );
$.support.fullscreen = false;
lightbox.setupFullscreenButton();
assert.ok( !lightbox.$fullscreenButton.is(':visible'),
'Fullscreen button is hidden when fullscreen mode is unavailable' );
$.support.fullscreen = true;
lightbox.setupFullscreenButton();
assert.ok( lightbox.$fullscreenButton.is(':visible'),
'Fullscreen button is visible when fullscreen mode is available' );
// Entering fullscreen
lightbox.$fullscreenButton.click();
@ -97,6 +110,7 @@
$.fn.enterFullscreen = oldFnEnterFullscreen;
$.fn.exitFullscreen = oldFnExitFullscreen;
$.support.fullscreen = oldSupportFullscreen;
} );
}( mediaWiki, jQuery ) );

View file

@ -192,7 +192,7 @@
$.each ( lightbox.$buttons, function ( idx, e ) {
var $e = $( e ),
offset = $e.offset(),
offset = $e.show().offset(),
width = $e.width(),
height = $e.height(),
disabled = $e.hasClass( 'disabled' );