MediaWiki:Gadget-jquery.fullscreen.js

Note: After saving, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
• Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.

// __NOINDEX__
// Derivative work of:
// jQuery.FullScreen plugin
// HTML5 FullScreen API plugin for jQuery, based on 
// http://johndyer.name/native-fullscreen-javascript-api-plus-jquery-plugin/
//
// Triple-licensed: Public Domain, MIT and WTFPL license - share and enjoy!
// Source https://gist.github.com/2128691#file-jquery-fullscreen-js
// <nowiki>

/**
 * @example 
  // In FF it seems only to work in response to
  // a click-event
  // Switch to fullscreen
  $('#bodyContent').click(function() {
     $(this).requestFullScreen();
  });
 
  // Add a button if fullscreen is supported
  if ($.FullScreenSupported) $('<button>').text("Full screen").insertBefore('#bodyContent');
 
  // Listen to Fullscreen-changes
  $(document).fullScreenChange(function() {
    console.log($.FullScreen.isFullScreen());
  });

  // Close Fullscreen
  $.FullScreen.cancelFullScreen();
 **/

// List the global variables for jsHint-Validation. Please make sure that it passes http://jshint.com/
// Scheme: globalVariable:allowOverwriting[, globalVariable:allowOverwriting][, globalVariable:allowOverwriting]
/*global jQuery:false, mediaWiki:false*/

// Set jsHint-options. You should not set forin or undef to false if your script does not validate.
/*jshint forin:true, noarg:true, noempty:true, eqeqeq:true, bitwise:true, strict:true, undef:true, curly:true, browser:true, boss:true*/


(function($) {
	'use strict';

	function isFullScreen() {
		return !!( document[!prefix ? 'fullScreen' : 'webkit' === prefix ? 'webkitIsFullScreen' : prefix + 'FullScreen']
			|| document[prefix ? prefix + 'FullscreenElement' : 'fullscreenElement'] );
	}

	function cancelFullScreen() {
		return document[prefix ? prefix + cancel : cancel]();
	}

	var supported = !!document.cancelFullScreen,
		prefixes = ['webkit', 'moz', 'o', 'ms', 'khtml'],
		cancels = ['CancelFullScreen', 'ExitFullscreen'],
		prefix = '',
		cancel = 'cancelFullScreen',
		noop = $.noop,
		i, j;

	if (!supported && document.exitFullScreen) {
		cancel = 'exitFullScreen';
		supported = true;
	}
	if (!supported) {
		for (j = 0; cancel = cancels[j]; j++) {
			for (i = 0; prefix = prefixes[i]; i++) {
				if (typeof document[prefix + cancel] !== 'undefined') {
					supported = true;
					break;
				}
			}
			if (supported) {
				break;
			}
		}
	}

	if (supported) {
		$.fn.requestFullScreen = function() {
			return this.each(function() {
				return ( this[prefix ? prefix + 'RequestFullScreen' : 'requestFullScreen']
					|| this[prefix ? prefix + 'RequestFullscreen' : 'requestFullscreen'] ).call( this );
			});
		};
		$.fn.fullScreenChange = function(fn) {
			var ar = [
					prefix + 'fullscreenchange ' +
					prefix + 'FullscreenChange ' +
					prefix.toUpperCase() + 'FullscreenChange'
				].concat([].slice.call(arguments, 0)),
				$e = $(this);

			return $e.on.apply($e, ar);
		};
		$.FullScreen = {
			isFullScreen: isFullScreen,
			cancelFullScreen: cancelFullScreen
		};
		$.FullScreenSupported = true;
	} else {
		$.fn.requestFullScreen = $.fn.fullScreenChange = noop;
		$.FullScreen = {
			isFullScreen: function() {
				return false;
			},
			cancelFullScreen: noop
		};
	}
})(jQuery);

// </nowiki>