Blame view
js/threejs/THREEx.js
3.04 KB
670b6d6f8
2016/09/22 - Copy...
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 |
// This THREEx helper makes it easy to handle the fullscreen API
// * it hides the prefix for each browser
// * it hides the little discrepencies of the various vendor API
// * at the time of this writing (nov 2011) it is available in
// [firefox nightly](http://blog.pearce.org.nz/2011/11/firefoxs-html-full-screen-api-enabled.html),
// [webkit nightly](http://peter.sh/2011/01/javascript-full-screen-api-navigation-timing-and-repeating-css-gradients/) and
// [chrome stable](http://updates.html5rocks.com/2011/10/Let-Your-Content-Do-the-Talking-Fullscreen-API).
// # Code
/** @namespace */
var THREEx = THREEx || {};
THREEx.FullScreen = THREEx.FullScreen || {};
/**
* test if it is possible to have fullscreen
*
* @returns {Boolean} true if fullscreen API is available, false otherwise
*/
THREEx.FullScreen.available = function()
{
return this._hasWebkitFullScreen || this._hasMozFullScreen;
}
/**
* test if fullscreen is currently activated
*
* @returns {Boolean} true if fullscreen is currently activated, false otherwise
*/
THREEx.FullScreen.activated = function()
{
if( this._hasWebkitFullScreen ){
return document.webkitIsFullScreen;
}else if( this._hasMozFullScreen ){
return document.mozFullScreen;
}else{
console.assert(false);
}
}
/**
* Request fullscreen on a given element
* @param {DomElement} element to make fullscreen. optional. default to document.body
*/
THREEx.FullScreen.request = function(element)
{
element = element || document.body;
if( this._hasWebkitFullScreen ){
element.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
}else if( this._hasMozFullScreen ){
element.mozRequestFullScreen();
}else{
console.assert(false);
}
}
/**
* Cancel fullscreen
*/
THREEx.FullScreen.cancel = function()
{
if( this._hasWebkitFullScreen ){
document.webkitCancelFullScreen();
}else if( this._hasMozFullScreen ){
document.mozCancelFullScreen();
}else{
console.assert(false);
}
}
// internal functions to know which fullscreen API implementation is available
THREEx.FullScreen._hasWebkitFullScreen = 'webkitCancelFullScreen' in document ? true : false;
THREEx.FullScreen._hasMozFullScreen = 'mozCancelFullScreen' in document ? true : false;
/**
* Bind a key to renderer screenshot
* usage: THREEx.FullScreen.bindKey({ charCode : 'a'.charCodeAt(0) });
*/
THREEx.FullScreen.bindKey = function(opts){
opts = opts || {};
var charCode = opts.charCode || 'f'.charCodeAt(0);
var dblclick = opts.dblclick !== undefined ? opts.dblclick : false;
var element = opts.element
var toggle = function(){
if( THREEx.FullScreen.activated() ){
THREEx.FullScreen.cancel();
}else{
THREEx.FullScreen.request(element);
}
}
var onKeyPress = function(event){
if( event.which !== charCode ) return;
toggle();
}.bind(this);
document.addEventListener('keypress', onKeyPress, false);
dblclick && document.addEventListener('dblclick', toggle, false);
return {
unbind : function(){
document.removeEventListener('keypress', onKeyPress, false);
dblclick && document.removeEventListener('dblclick', toggle, false);
}
};
}
|