resources/lib/jquery.fullscreen.js

   1 /**
   2  * jQuery fullscreen plugin v2.0.0-git (9f8f97d127)
   3  * https://github.com/theopolisme/jquery-fullscreen
   4  *
   5  * Copyright (c) 2013 Theopolisme <theopolismewiki@gmail.com>
   6  *
   7  * This program is free software; you can redistribute it and/or modify
   8  * it under the terms of the GNU General Public License as published by
   9  * the Free Software Foundation; either version 2 of the License, or
  10  * (at your option) any later version.
  11  *
  12  * This program is distributed in the hope that it will be useful,
  13  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  14  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  15  * GNU General Public License for more details.
  16  *
  17  * You should have received a copy of the GNU General Public License along
  18  * with this program; if not, write to the Free Software Foundation, Inc.,
  19  * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
  20  */
  21 ( function ( $ ) {
  22         var setupFullscreen,
  23                 fsClass = 'jq-fullscreened';
  24
  25         /**
  26          * On fullscreenchange, trigger a jq-fullscreen-change event
  27          * The event is given an object, which contains the fullscreened DOM element (element), if any
  28          * and a boolean value (fullscreen) indicating if we've entered or exited fullscreen mode
  29          * Also remove the 'fullscreened' class from elements that are no longer fullscreen
  30          */
  31         function handleFullscreenChange () {
  32                 var fullscreenElement = document.fullscreenElement ||
  33                         document.mozFullScreenElement ||
  34                         document.webkitFullscreenElement ||
  35                         document.msFullscreenElement;
  36
  37                 if ( !fullscreenElement ) {
  38                         $( '.' + fsClass ).data( 'isFullscreened', false ).removeClass( fsClass );
  39                 }
  40
  41                 $( document ).trigger( $.Event( 'jq-fullscreen-change', { element: fullscreenElement, fullscreen: !!fullscreenElement } ) );
  42         }
  43
  44         /**
  45          * Enters full screen with the "this" element in focus.
  46          * Check the .data( 'isFullscreened' ) of the return value to check
  47          * success or failure, if you're into that sort of thing.
  48          * @chainable
  49          * @return {jQuery}
  50          */
  51         function enterFullscreen () {
  52                 var element = this.get(0),
  53                         $element = this.first();
  54                 if ( element ) {
  55                         if ( element.requestFullscreen ) {
  56                                 element.requestFullscreen();
  57                         } else if ( element.mozRequestFullScreen ) {
  58                                 element.mozRequestFullScreen();
  59                         } else if ( element.webkitRequestFullscreen ) {
  60                                 element.webkitRequestFullscreen();
  61                         } else if ( element.msRequestFullscreen ) {
  62                                 element.msRequestFullscreen();
  63                         } else {
  64                                 // Unable to make fullscreen
  65                                 $element.data( 'isFullscreened', false );
  66                                 return this;
  67                         }
  68                         // Add the fullscreen class and data attribute to `element`
  69                         $element.addClass( fsClass ).data( 'isFullscreened', true );
  70                         return this;
  71                 } else {
  72                         $element.data( 'isFullscreened', false );
  73                         return this;
  74                 }
  75         }
  76
  77         /**
  78          * Brings the "this" element out of fullscreen.
  79          * Check the .data( 'isFullscreened' ) of the return value to check
  80          * success or failure, if you're into that sort of thing.
  81          * @chainable
  82          * @return {jQuery}
  83          */
  84         function exitFullscreen () {
  85                 var fullscreenElement = ( document.fullscreenElement ||
  86                                 document.mozFullScreenElement ||
  87                                 document.webkitFullscreenElement ||
  88                                 document.msFullscreenElement );
  89
  90                 // Ensure that we only exit fullscreen if exitFullscreen() is being called on the same element that is currently fullscreen
  91                 if ( fullscreenElement && this.get(0) === fullscreenElement ) {
  92                         if ( document.exitFullscreen ) {
  93                                 document.exitFullscreen();
  94                         } else if ( document.mozCancelFullScreen ) {
  95                                 document.mozCancelFullScreen();
  96                         } else if ( document.webkitCancelFullScreen ) {
  97                                 document.webkitCancelFullScreen();
  98                         } else if ( document.msExitFullscreen ) {
  99                                 document.msExitFullscreen();
 100                         } else {
 101                                 // Unable to cancel fullscreen mode
 102                                 return this;
 103                         }
 104                         // We don't need to remove the fullscreen class here,
 105                         // because it will be removed in handleFullscreenChange.
 106                         // But we should change the data on the element so the
 107                         // caller can check for success.
 108                         this.first().data( 'isFullscreened', false );
 109                 }
 110
 111                 return this;
 112         }
 113
 114         /**
 115          * Set up fullscreen handling and install necessary event handlers.
 116          * Return false if fullscreen is not supported.
 117          */
 118         setupFullscreen = function () {
 119                 if ( $.support.fullscreen ) {
 120                         // When the fullscreen mode is changed, trigger the
 121                         // fullscreen events (and when exiting,
 122                         // also remove the fullscreen class)
 123                         $( document ).on( 'fullscreenchange webkitfullscreenchange mozfullscreenchange MSFullscreenChange', handleFullscreenChange);
 124                         // Convenience wrapper so that one only needs to listen for
 125                         // 'fullscreenerror', not all of the prefixed versions
 126                         $( document ).on( 'webkitfullscreenerror mozfullscreenerror MSFullscreenError', function () {
 127                                 $( document ).trigger( $.Event( 'fullscreenerror' ) );
 128                         } );
 129                         // Fullscreen has been set up, so always return true
 130                         setupFullscreen = function () { return true; };
 131                         return true;
 132                 } else {
 133                         // Always return false from now on, since fullscreen is not supported
 134                         setupFullscreen = function () { return false; };
 135                         return false;
 136                 }
 137         };
 138
 139         /**
 140          * Set up fullscreen handling if necessary, then make the first element
 141          * matching the given selector fullscreen
 142          * @chainable
 143          * @return {jQuery}
 144          */
 145         $.fn.enterFullscreen = function () {
 146                 if ( setupFullscreen() ) {
 147                         $.fn.enterFullscreen = enterFullscreen;
 148                         return this.enterFullscreen();
 149                 } else {
 150                         $.fn.enterFullscreen = function () { return this; };
 151                         return this;
 152                 }
 153         };
 154
 155         /**
 156          * Set up fullscreen handling if necessary, then cancel fullscreen mode
 157          * for the first element matching the given selector.
 158          * @chainable
 159          * @return {jQuery}
 160          */
 161         $.fn.exitFullscreen = function () {
 162                 if ( setupFullscreen() ) {
 163                         $.fn.exitFullscreen = exitFullscreen;
 164                         return this.exitFullscreen();
 165                 } else {
 166                         $.fn.exitFullscreen = function () { return this; };
 167                         return this;
 168                 }
 169         };
 170
 171         $.support.fullscreen = document.fullscreenEnabled ||
 172                 document.webkitFullscreenEnabled ||
 173                 document.mozFullScreenEnabled ||
 174                 document.msFullscreenEnabled;
 175 }( jQuery ) );