first commit
This commit is contained in:
275
libraries/framework/js/utility/fullscreen/jquery.fullscreen.js
Normal file
275
libraries/framework/js/utility/fullscreen/jquery.fullscreen.js
Normal file
@@ -0,0 +1,275 @@
|
||||
/*
|
||||
* jQuery.fullscreen library v0.4.2
|
||||
* Copyright (c) 2013 Vladimir Zhuravlev
|
||||
*
|
||||
* @license https://github.com/private-face/jquery.fullscreen/blob/master/LICENSE
|
||||
*
|
||||
* Date: Tue Jul 22 11:54:54 CDT 2014
|
||||
**/
|
||||
;
|
||||
(function($) {
|
||||
|
||||
function defined(a) {
|
||||
return typeof a !== 'undefined';
|
||||
}
|
||||
|
||||
function extend(child, parent, prototype) {
|
||||
var F = function() {};
|
||||
F.prototype = parent.prototype;
|
||||
child.prototype = new F();
|
||||
child.prototype.constructor = child;
|
||||
parent.prototype.constructor = parent;
|
||||
child._super = parent.prototype;
|
||||
if (prototype) {
|
||||
$.extend(child.prototype, prototype);
|
||||
}
|
||||
}
|
||||
|
||||
var SUBST = [
|
||||
['', ''], // spec
|
||||
['exit', 'cancel'], // firefox & old webkits expect cancelFullScreen instead of exitFullscreen
|
||||
['screen', 'Screen'] // firefox expects FullScreen instead of Fullscreen
|
||||
];
|
||||
|
||||
var VENDOR_PREFIXES = ['', 'o', 'ms', 'moz', 'webkit', 'webkitCurrent'];
|
||||
|
||||
function native(obj, name) {
|
||||
var prefixed;
|
||||
|
||||
if (typeof obj === 'string') {
|
||||
name = obj;
|
||||
obj = document;
|
||||
}
|
||||
|
||||
for (var i = 0; i < SUBST.length; ++i) {
|
||||
name = name.replace(SUBST[i][0], SUBST[i][1]);
|
||||
for (var j = 0; j < VENDOR_PREFIXES.length; ++j) {
|
||||
prefixed = VENDOR_PREFIXES[j];
|
||||
prefixed += j === 0 ? name : name.charAt(0).toUpperCase() + name.substr(1);
|
||||
if (defined(obj[prefixed])) {
|
||||
return obj[prefixed];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return void 0;
|
||||
}var ua = navigator.userAgent;
|
||||
var fsEnabled = native('fullscreenEnabled');
|
||||
var IS_ANDROID_CHROME = ua.indexOf('Android') !== -1 && ua.indexOf('Chrome') !== -1;
|
||||
var IS_NATIVELY_SUPPORTED =
|
||||
!IS_ANDROID_CHROME &&
|
||||
defined(native('fullscreenElement')) &&
|
||||
(!defined(fsEnabled) || fsEnabled === true);
|
||||
|
||||
var version = $.fn.jquery.split('.');
|
||||
var JQ_LT_17 = (parseInt(version[0]) < 2 && parseInt(version[1]) < 7);
|
||||
|
||||
var FullScreenAbstract = function() {
|
||||
this.__options = null;
|
||||
this._fullScreenElement = null;
|
||||
this.__savedStyles = {};
|
||||
};
|
||||
|
||||
FullScreenAbstract.prototype = {
|
||||
_DEFAULT_OPTIONS: {
|
||||
styles: {
|
||||
'boxSizing': 'border-box',
|
||||
'MozBoxSizing': 'border-box',
|
||||
'WebkitBoxSizing': 'border-box'
|
||||
},
|
||||
toggleClass: null
|
||||
},
|
||||
__documentOverflow: 'visible',
|
||||
__htmlOverflow: 'visible',
|
||||
_preventDocumentScroll: function() {
|
||||
// Disabled ability
|
||||
this.__documentOverflow = $('body')[0].style.overflow;
|
||||
this.__htmlOverflow = $('html')[0].style.overflow;
|
||||
|
||||
},
|
||||
_allowDocumentScroll: function() {
|
||||
$('body')[0].style.overflow = this.__documentOverflow;
|
||||
$('html')[0].style.overflow = this.__htmlOverflow;
|
||||
},
|
||||
_fullScreenChange: function() {
|
||||
if (!this.__options)
|
||||
return; // only process fullscreenchange events caused by this plugin
|
||||
if (!this.isFullScreen()) {
|
||||
this._allowDocumentScroll();
|
||||
this._revertStyles();
|
||||
this._triggerEvents();
|
||||
this._fullScreenElement = null;
|
||||
} else {
|
||||
this._preventDocumentScroll();
|
||||
this._triggerEvents();
|
||||
}
|
||||
},
|
||||
_fullScreenError: function(e) {
|
||||
if (!this.__options)
|
||||
return; // only process fullscreenchange events caused by this plugin
|
||||
this._revertStyles();
|
||||
this._fullScreenElement = null;
|
||||
if (e) {
|
||||
$(document).trigger('fscreenerror', [e]);
|
||||
}
|
||||
},
|
||||
_triggerEvents: function() {
|
||||
$(this._fullScreenElement).trigger(this.isFullScreen() ? 'fscreenopen' : 'fscreenclose');
|
||||
$(document).trigger('fscreenchange', [this.isFullScreen(), this._fullScreenElement]);
|
||||
},
|
||||
_saveAndApplyStyles: function() {
|
||||
var $elem = $(this._fullScreenElement);
|
||||
this.__savedStyles = {};
|
||||
for (var property in this.__options.styles) {
|
||||
// save
|
||||
this.__savedStyles[property] = this._fullScreenElement.style[property];
|
||||
// apply
|
||||
this._fullScreenElement.style[property] = this.__options.styles[property];
|
||||
}
|
||||
if (this.__options.toggleClass) {
|
||||
$elem.addClass(this.__options.toggleClass);
|
||||
}
|
||||
},
|
||||
_revertStyles: function() {
|
||||
var $elem = $(this._fullScreenElement);
|
||||
for (var property in this.__options.styles) {
|
||||
this._fullScreenElement.style[property] = this.__savedStyles[property];
|
||||
}
|
||||
if (this.__options.toggleClass) {
|
||||
$elem.removeClass(this.__options.toggleClass);
|
||||
}
|
||||
},
|
||||
open: function(elem, options) {
|
||||
// do nothing if request is for already fullscreened element
|
||||
if (elem === this._fullScreenElement) {
|
||||
return;
|
||||
}
|
||||
// exit active fullscreen before opening another one
|
||||
if (this.isFullScreen()) {
|
||||
this.exit();
|
||||
}
|
||||
// save fullscreened element
|
||||
this._fullScreenElement = elem;
|
||||
// apply options, if any
|
||||
this.__options = $.extend(true, {}, this._DEFAULT_OPTIONS, options);
|
||||
// save current element styles and apply new
|
||||
this._saveAndApplyStyles();
|
||||
},
|
||||
exit: null,
|
||||
isFullScreen: null,
|
||||
isNativelySupported: function() {
|
||||
return IS_NATIVELY_SUPPORTED;
|
||||
}
|
||||
};
|
||||
var FullScreenNative = function() {
|
||||
FullScreenNative._super.constructor.apply(this, arguments);
|
||||
this.exit = $.proxy(native('exitFullscreen'), document);
|
||||
this._DEFAULT_OPTIONS = $.extend(true, {}, this._DEFAULT_OPTIONS, {
|
||||
'styles': {
|
||||
'width': '100%',
|
||||
'height': '100%'
|
||||
}
|
||||
});
|
||||
$(document)
|
||||
.bind(this._prefixedString('fullscreenchange') + ' MSFullscreenChange', $.proxy(this._fullScreenChange, this))
|
||||
.bind(this._prefixedString('fullscreenerror') + ' MSFullscreenError', $.proxy(this._fullScreenError, this));
|
||||
};
|
||||
|
||||
extend(FullScreenNative, FullScreenAbstract, {
|
||||
VENDOR_PREFIXES: ['', 'o', 'moz', 'webkit'],
|
||||
_prefixedString: function(str) {
|
||||
return $.map(this.VENDOR_PREFIXES, function(s) {
|
||||
return s + str;
|
||||
}).join(' ');
|
||||
},
|
||||
open: function(elem, options) {
|
||||
FullScreenNative._super.open.apply(this, arguments);
|
||||
var requestFS = native(elem, 'requestFullscreen');
|
||||
requestFS.call(elem);
|
||||
},
|
||||
exit: $.noop,
|
||||
isFullScreen: function() {
|
||||
return native('fullscreenElement') !== null;
|
||||
},
|
||||
element: function() {
|
||||
return native('fullscreenElement');
|
||||
}
|
||||
});
|
||||
var FullScreenFallback = function() {
|
||||
FullScreenFallback._super.constructor.apply(this, arguments);
|
||||
this._DEFAULT_OPTIONS = $.extend({}, this._DEFAULT_OPTIONS, {
|
||||
'styles': {
|
||||
'position': 'fixed',
|
||||
'zIndex': '2147483647',
|
||||
'left': 0,
|
||||
'top': 0,
|
||||
'bottom': 0,
|
||||
'right': 0
|
||||
}
|
||||
});
|
||||
this.__delegateKeydownHandler();
|
||||
};
|
||||
|
||||
extend(FullScreenFallback, FullScreenAbstract, {
|
||||
__isFullScreen: false,
|
||||
__delegateKeydownHandler: function() {
|
||||
var $doc = $(document);
|
||||
$doc.delegate('*', 'keydown.fullscreen', $.proxy(this.__keydownHandler, this));
|
||||
var data = JQ_LT_17 ? $doc.data('events') : $._data(document).events;
|
||||
var events = data['keydown'];
|
||||
if (!JQ_LT_17) {
|
||||
events.splice(0, 0, events.splice(events.delegateCount - 1, 1)[0]);
|
||||
} else {
|
||||
data.live.unshift(data.live.pop());
|
||||
}
|
||||
},
|
||||
__keydownHandler: function(e) {
|
||||
if (this.isFullScreen() && e.which === 27) {
|
||||
this.exit();
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
_revertStyles: function() {
|
||||
FullScreenFallback._super._revertStyles.apply(this, arguments);
|
||||
// force redraw (fixes bug in IE7 with content dissapearing)
|
||||
this._fullScreenElement.offsetHeight;
|
||||
},
|
||||
open: function(elem) {
|
||||
FullScreenFallback._super.open.apply(this, arguments);
|
||||
this.__isFullScreen = true;
|
||||
this._fullScreenChange();
|
||||
},
|
||||
exit: function() {
|
||||
this.__isFullScreen = false;
|
||||
this._fullScreenChange();
|
||||
},
|
||||
isFullScreen: function() {
|
||||
return this.__isFullScreen;
|
||||
},
|
||||
element: function() {
|
||||
return this.__isFullScreen ? this._fullScreenElement : null;
|
||||
}
|
||||
});$.fullscreen = IS_NATIVELY_SUPPORTED
|
||||
? new FullScreenNative()
|
||||
: new FullScreenFallback();
|
||||
|
||||
$.fn.fullscreen = function(options) {
|
||||
var elem = this[0];
|
||||
|
||||
options = $.extend({
|
||||
toggleClass: null,
|
||||
overflow: 'hidden'
|
||||
}, options);
|
||||
options.styles = {
|
||||
overflow: options.overflow
|
||||
};
|
||||
delete options.overflow;
|
||||
|
||||
if (elem) {
|
||||
$.fullscreen.open(elem, options);
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
})(jQuery);
|
||||
Reference in New Issue
Block a user