crossbrowdy
Version:
A Multimedia JavaScript framework to create real cross-platform and hybrid game engines, games, emulators, multimedia libraries and apps.
901 lines (761 loc) • 112 kB
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>CrossBrowdy API documentation [printable] Source: CrossBase/audiovisual/image/CB_Screen.js</title>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/sunlight.default.css">
<link type="text/css" rel="stylesheet" href="styles/site.yeti.css">
</head>
<body style="min-width:800px; overflow-wrap:break-word; word-wrap:break-word; word-break:break-word; line-break:strict; hyphens:none; -webkit-hyphens:none; -moz-hyphens:none;">
<div class="navbar navbar-default navbar-fixed-top ">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="index.html">CrossBrowdy API documentation [printable]</a>
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#topNavigation">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse" id="topNavigation">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="namespaces.list.html" class="dropdown-toggle" data-toggle="dropdown">Namespaces<b class="caret"></b></a>
<ul class="dropdown-menu inline">
<li><a href="CB_Arrays.html">CB_Arrays</a></li><li><a href="CB_AudioDetector.html">CB_AudioDetector</a></li><li><a href="CB_Client.html">CB_Client</a></li><li><a href="CB_Collisions.html">CB_Collisions</a></li><li><a href="CB_Configuration.html">CB_Configuration</a></li><li><a href="CB_Configuration.CrossBase.html">CB_Configuration.CrossBase</a></li><li><a href="CB_Configuration.CrossBrowdy.html">CB_Configuration.CrossBrowdy</a></li><li><a href="CB_Controllers.html">CB_Controllers</a></li><li><a href="CB_Controllers_Proprietary.html">CB_Controllers_Proprietary</a></li><li><a href="CB_Controllers_Proprietary.WII.html">CB_Controllers_Proprietary.WII</a></li><li><a href="CB_Controllers_Proprietary.WII_U.html">CB_Controllers_Proprietary.WII_U</a></li><li><a href="CB_Device.html">CB_Device</a></li><li><a href="CB_Device.AmbientLight.html">CB_Device.AmbientLight</a></li><li><a href="CB_Device.Battery.html">CB_Device.Battery</a></li><li><a href="CB_Device.Location.html">CB_Device.Location</a></li><li><a href="CB_Device.Motion.html">CB_Device.Motion</a></li><li><a href="CB_Device.Orientation.html">CB_Device.Orientation</a></li><li><a href="CB_Device.Proximity.html">CB_Device.Proximity</a></li><li><a href="CB_Device.Vibration.html">CB_Device.Vibration</a></li><li><a href="CB_Elements.html">CB_Elements</a></li><li><a href="CB_Events.html">CB_Events</a></li><li><a href="CB_Keyboard.html">CB_Keyboard</a></li><li><a href="CB_Keyboard.chars.html">CB_Keyboard.chars</a></li><li><a href="CB_Keyboard.extended.html">CB_Keyboard.extended</a></li><li><a href="CB_Keyboard.keys.html">CB_Keyboard.keys</a></li><li><a href="CB_Modules.html">CB_Modules</a></li><li><a href="CB_Mouse.html">CB_Mouse</a></li><li><a href="CB_Mouse.CursorImage.html">CB_Mouse.CursorImage</a></li><li><a href="CB_Net.html">CB_Net</a></li><li><a href="CB_Net.Fetch.html">CB_Net.Fetch</a></li><li><a href="CB_Net.REST.html">CB_Net.REST</a></li><li><a href="CB_Net.Sockets.html">CB_Net.Sockets</a></li><li><a href="CB_Net.Sockets.SockJS.html">CB_Net.Sockets.SockJS</a></li><li><a href="CB_Net.XHR.html">CB_Net.XHR</a></li><li><a href="CB_Pointer.html">CB_Pointer</a></li><li><a href="CB_Screen.html">CB_Screen</a></li><li><a href="CB_Speaker.html">CB_Speaker</a></li><li><a href="CB_Touch.html">CB_Touch</a></li><li><a href="CB_baseSymbols.html">CB_baseSymbols</a></li>
</ul>
</li>
<li class="dropdown">
<a href="classes.list.html" class="dropdown-toggle" data-toggle="dropdown">Classes<b class="caret"></b></a>
<ul class="dropdown-menu inline">
<li><a href="CB_AudioFile.html">CB_AudioFile</a></li><li><a href="CB_AudioFileCache.html">CB_AudioFileCache</a></li><li><a href="CB_AudioFileSprites.html">CB_AudioFileSprites</a></li><li><a href="CB_AudioFileSpritesPool.html">CB_AudioFileSpritesPool</a></li><li><a href="CB_AudioFile_API.AAPI.html">CB_AudioFile_API.AAPI</a></li><li><a href="CB_AudioFile_API.ACMP.html">CB_AudioFile_API.ACMP</a></li><li><a href="CB_AudioFile_API.SM2.html">CB_AudioFile_API.SM2</a></li><li><a href="CB_AudioFile_API.WAAPI.html">CB_AudioFile_API.WAAPI</a></li><li><a href="CB_Canvas.html">CB_Canvas</a></li><li><a href="CB_GraphicSprites.html">CB_GraphicSprites</a></li><li><a href="CB_GraphicSpritesScene.html">CB_GraphicSpritesScene</a></li>
</ul>
</li>
<li class="dropdown">
<a href="global.html" class="dropdown-toggle" data-toggle="dropdown">Global<b class="caret"></b></a>
<ul class="dropdown-menu inline">
<li><a href="global.html#CB_BASE_NAME">CB_BASE_NAME</a></li><li><a href="global.html#CB_CREDITS_DEFAULT">CB_CREDITS_DEFAULT</a></li><li><a href="global.html#CB_NAME">CB_NAME</a></li><li><a href="global.html#CB_OPTIONS">CB_OPTIONS</a></li><li><a href="global.html#CB_VERSION">CB_VERSION</a></li><li><a href="global.html#CB_addCredits">CB_addCredits</a></li><li><a href="global.html#CB_baseToBase">CB_baseToBase</a></li><li><a href="global.html#CB_baseToInt">CB_baseToInt</a></li><li><a href="global.html#CB_br2nl">CB_br2nl</a></li><li><a href="global.html#CB_brToNl">CB_brToNl</a></li><li><a href="global.html#CB_combineArraysOrObjects">CB_combineArraysOrObjects</a></li><li><a href="global.html#CB_combineAutomatically">CB_combineAutomatically</a></li><li><a href="global.html#CB_combineJSON">CB_combineJSON</a></li><li><a href="global.html#CB_combineURIParameters">CB_combineURIParameters</a></li><li><a href="global.html#CB_combineURLParameters">CB_combineURLParameters</a></li><li><a href="global.html#CB_console">CB_console</a></li><li><a href="global.html#CB_copyObject">CB_copyObject</a></li><li><a href="global.html#CB_countDecimalDigits">CB_countDecimalDigits</a></li><li><a href="global.html#CB_countDecimalPart">CB_countDecimalPart</a></li><li><a href="global.html#CB_countDecimals">CB_countDecimals</a></li><li><a href="global.html#CB_countIntegerDigits">CB_countIntegerDigits</a></li><li><a href="global.html#CB_countIntegerPart">CB_countIntegerPart</a></li><li><a href="global.html#CB_credits">CB_credits</a></li><li><a href="global.html#CB_forEach">CB_forEach</a></li><li><a href="global.html#CB_forceString">CB_forceString</a></li><li><a href="global.html#CB_getBase64StringObject">CB_getBase64StringObject</a></li><li><a href="global.html#CB_getCookie">CB_getCookie</a></li><li><a href="global.html#CB_getDatum">CB_getDatum</a></li><li><a href="global.html#CB_getJSONPropertyValue">CB_getJSONPropertyValue</a></li><li><a href="global.html#CB_getLZStringObject">CB_getLZStringObject</a></li><li><a href="global.html#CB_getValueIndex">CB_getValueIndex</a></li><li><a href="global.html#CB_getValuePath">CB_getValuePath</a></li><li><a href="global.html#CB_includeJSFile">CB_includeJSFile</a></li><li><a href="global.html#CB_indexOf">CB_indexOf</a></li><li><a href="global.html#CB_init">CB_init</a></li><li><a href="global.html#CB_intToBase">CB_intToBase</a></li><li><a href="global.html#CB_isArray">CB_isArray</a></li><li><a href="global.html#CB_isEmail">CB_isEmail</a></li><li><a href="global.html#CB_isFileLocal">CB_isFileLocal</a></li><li><a href="global.html#CB_isString">CB_isString</a></li><li><a href="global.html#CB_lastIndexOf">CB_lastIndexOf</a></li><li><a href="global.html#CB_ltrim">CB_ltrim</a></li><li><a href="global.html#CB_nl2br">CB_nl2br</a></li><li><a href="global.html#CB_nlToBr">CB_nlToBr</a></li><li><a href="global.html#CB_numberFormat">CB_numberFormat</a></li><li><a href="global.html#CB_numberOfDecimalDigits">CB_numberOfDecimalDigits</a></li><li><a href="global.html#CB_numberOfDecimals">CB_numberOfDecimals</a></li><li><a href="global.html#CB_numberOfIntegerDigits">CB_numberOfIntegerDigits</a></li><li><a href="global.html#CB_parseJSON">CB_parseJSON</a></li><li><a href="global.html#CB_parseString">CB_parseString</a></li><li><a href="global.html#CB_regularExpressionString">CB_regularExpressionString</a></li><li><a href="global.html#CB_renderString">CB_renderString</a></li><li><a href="global.html#CB_replaceAll">CB_replaceAll</a></li><li><a href="global.html#CB_rtrim">CB_rtrim</a></li><li><a href="global.html#CB_scriptPath">CB_scriptPath</a></li><li><a href="global.html#CB_scriptPathCalculate">CB_scriptPathCalculate</a></li><li><a href="global.html#CB_setCookie">CB_setCookie</a></li><li><a href="global.html#CB_setDatum">CB_setDatum</a></li><li><a href="global.html#CB_sizeOf">CB_sizeOf</a></li><li><a href="global.html#CB_sizeof">CB_sizeof</a></li><li><a href="global.html#CB_stringifyJSON">CB_stringifyJSON</a></li><li><a href="global.html#CB_symmetricCall">CB_symmetricCall</a></li><li><a href="global.html#CB_symmetricCallClear">CB_symmetricCallClear</a></li><li><a href="global.html#CB_this">CB_this</a></li><li><a href="global.html#CB_trim">CB_trim</a></li>
</ul>
</li>
</ul>
<div class="col-sm-3 col-md-3">
<form class="navbar-form" role="search">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search" name="q" id="search-input">
<div class="input-group-btn">
<button class="btn btn-default" id="search-submit"><i class="glyphicon glyphicon-search"></i></button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="container" id="toc-content" style="width:100%;">
<div class="row" style="width:100%;">
<div class="col-md-12">
<div id="main">
<h1 class="page-title">Source: CrossBase/audiovisual/image/CB_Screen.js</h1>
<section>
<article>
<pre
class="sunlight-highlight-javascript linenums">/**
* @file Screen management. Contains the {@link CB_Screen} static class.
* @author Joan Alba Maldonado <workindalian@gmail.com>
* @license Creative Commons Attribution 4.0 International. See more at {@link https://crossbrowdy.com/about#what_is_the_crossbrowdy_copyright_and_license}.
*/
/**
* Static class to manage the screen. It will return itself if it is tried to be instantiated. It can use [detect-zoom]{@link https://github.com/tombigel/detect-zoom} and [NoSleep.js]{@link https://github.com/richtr/NoSleep.js?utm_source=recordnotfound.com}.
* @namespace
*/
var CB_Screen = function() { return CB_Screen; };
{
CB_Screen._screenWidth = 0; //Screen width resolution.
CB_Screen._screenHeight = 0; //Screen height resolution.
CB_Screen._previousScreenWidth = 0; //Previous screen width resolution.
CB_Screen._previousScreenHeight = 0; //Previous screen height resolution.
CB_Screen._screenAvailableWidth = 0; //Screen available width resolution.
CB_Screen._screenAvailableHeight = 0; //Screen available height resolution.
CB_Screen._previousScreenAvailableWidth = 0; //Previous screen available width resolution.
CB_Screen._previousScreenAvailableHeight = 0; //Previous screen available height resolution.
CB_Screen._windowWidth = 0; //Window width resolution.
CB_Screen._windowHeight = 0; //Window height resolution.
CB_Screen._previousWindowWidth = 0; //Previous window width resolution.
CB_Screen._previousWindowHeight = 0; //Previous window height resolution.
CB_Screen._screenColorDepth = 0; //Screen color depth.
CB_Screen._scrollLeft = null; //Left scroll value.
CB_Screen._scrollTop = null; //Top scroll value.
CB_Screen._previousScrollLeft = null; //Previous left scroll value.
CB_Screen._previousScrollTop = null; //Previous top scroll value.
CB_Screen._zoom = 1; //Zoom applied to the web.
CB_Screen._pixelRatio = 1; //Pixel ratio multiplied by the zoom.
CB_Screen._previousZoom = 0; //Zoom applied to the web.
CB_Screen._previousPixelRatio = 0; //Pixel ratio multiplied by the zoom.
CB_Screen._isLandscape = null; //Tells whether web is displayed in landscape or portrait position.
CB_Screen._isVisible = null; //Tells whether web is visible or not.
CB_Screen._isFocused = null; //Tells whether web is focused or not (has lost the focus).
CB_Screen._isFullScreen = null; //Tells whether full screen mode is enabled or not.
CB_Screen._screenLock = null; //Keeps the MozWakeLock object to be able to release the lock related with the screen (so far, only works in Firefox/Firefox OS).
CB_Screen._noSleep = null; //Keeps the last NoSleep object for the NoSleep.js library.
CB_Screen._noSleepEnabled = false; //Boolean to keeps the status of the noSleep.js object (enabled or disabled).
CB_Screen._eventsHolder = {}; //Keeps the functions to fire for every special event (if any).
/*
CB_Screen.onResizeFunction; //Function that is executed when window is resized (onResize event).
CB_Screen.onScrollLeftFunction; //Function that is executen when scroll left is changed.
CB_Screen.onScrollTopFunction; //Function that is executen when scroll top is changed.
CB_Screen.onVisibilityChangeFunction; //Function that is executed when window gets or losts the visibility.
CB_Screen.onFocusChangeFunction; //Function that is executed when window gets or losts the focus.
CB_Screen.onResizeOrZoomFunction; //Function that is executed when window is resized or zoom is applied.
CB_Screen.onOrientationChangeFunction; //Function that is executed when orientation changes (landscape or portrait).
CB_Screen.onFullScreenChangeFunction; //Function that is executed when full screen mode changes.
*/
CB_Screen._storedScreenWidth = 0; //Old screen available width resolution (internal use only).
CB_Screen._storedScreenHeight = 0; //Old screen available height resolution (internal use only).
CB_Screen._storedScreenAvailableWidth = 0; //Old screen available width resolution (internal use only).
CB_Screen._storedScreenAvailableHeight = 0; //Old screen available height resolution (internal use only).
CB_Screen._storedWindowWidth = 0; //Old window width resolution (internal use only).
CB_Screen._storedWindowHeight = 0; //Old window height resolution (internal use only).
CB_Screen._storedZoom = 0; //Zoom applied to the web.
CB_Screen._storedPixelRatio = 0; //Pixel ratio multiplied by the zoom.
CB_Screen._refreshTimeout = null; //It will store the timeout that refresh screen properties all the time.
CB_Screen.initialized = false; //It will tells whether the object has been initialized or not.
//Initializes all values:
CB_Screen.init = function()
{
if (CB_Screen.initialized) { return CB_Screen; }
//Sets that the object has already been initialized:
CB_Screen.initialized = true;
//Stores first values for both old window width and height:
CB_Screen._storedScreenWidth = CB_Screen._screenWidth;
CB_Screen._storedScreenHeight = CB_Screen._screenHeight;
CB_Screen._storedScreenAvailableWidth = CB_Screen._screenAvailableWidth;
CB_Screen._storedScreenAvailableHeight = CB_Screen._screenAvailableHeight;
CB_Screen._storedWindowWidth = CB_Screen._windowWidth;
CB_Screen._storedWindowHeight = CB_Screen._windowHeight;
//It also stores for both zoom level and pixel ratio:
CB_Screen._storedZoom = CB_Screen._zoom;
CB_Screen._storedPixelRatio = CB_Screen._pixelRatio;
//Sets the handler for the scroll event:
CB_Events.add(window, "scroll", function() { CB_Screen.getScrollTop(); CB_Screen.getScrollLeft(); }, true, true, false);
//It will check all the time if visibility changes:
CB_Screen._isVisible = true; //By default, window is visible. NOTE: this can produce a false positive if the script is loading being not visible.
if ("hidden" in document) { CB_Events.add(document, "visibilitychange", CB_Screen._visibilityChanged, true, true, false); } //document.addEventListener("visibilitychange", CB_Screen._visibilityChanged); }
else if ("mozHidden" in document) { CB_Events.add(document, "mozvisibilitychange", CB_Screen._visibilityChanged, true, true, false); } //document.addEventListener("mozvisibilitychange", CB_Screen._visibilityChanged); }
else if ("webkitHidden" in document) { CB_Events.add(document, "webkitvisibilitychange", CB_Screen._visibilityChanged, true, true, false); } //document.addEventListener("webkitvisibilitychange", CB_Screen._visibilityChanged); }
else if ("msHidden" in document) { CB_Events.add(document, "msvisibilitychange", CB_Screen._visibilityChanged, true, true, false); } // document.addEventListener("msvisibilitychange", CB_Screen._visibilityChanged); }
//else if ("onfocusin" in document) { document.onfocusin = document.onfocusout = CB_Screen._visibilityChanged; }
//else if ("onfocusin" in document) { document.onfocusin = document.onfocusout = function() { CB_Screen._visibilityChanged(); CB_Screen._focusChanged(); } }
//else { window.onfocus = window.onblur = CB_Screen._visibilityChanged; }
//else { window.onfocus = window.onblur = function() { CB_Screen._visibilityChanged(); CB_Screen._focusChanged(); } }
//It will check all the time if focus changes:
CB_Screen._isFocused = true; //By default, window is focused. NOTE: this can produce a false positive if the script is loading being not visible.
var focusOrBlurEventWorks = false;
try //Using catch due some web clients doesn't allow to manipulate the window object of parent iframes:
{
CB_Events.add(CB_Client.getWindow(), "focus", function() { focusOrBlurEventWorks = true; CB_Screen._focusChanged(true); }, true, true, false);
CB_Events.add(CB_Client.getWindow(), "blur", function() { focusOrBlurEventWorks = true; CB_Screen._focusChanged(false); }, true, true, false);
}
catch(E)
{
CB_Events.add(window, "focus", function() { focusOrBlurEventWorks = true; CB_Screen._focusChanged(true); }, true, true, false);
CB_Events.add(window, "blur", function() { focusOrBlurEventWorks = true; CB_Screen._focusChanged(false); }, true, true, false);
}
CB_Events.add(document, "mousedown", function() { if (focusOrBlurEventWorks) { return; } CB_Screen._focusChanged(true); }, true, true, false); //Mouse click will set focus too (IE8 fix).
CB_Events.add(document, "click", function() { if (focusOrBlurEventWorks) { return; } CB_Screen._focusChanged(true); }, true, true, false); //Click will set focus too (IE8 fix).
//CB_Events.add(document, "keydown", function() { if (focusOrBlurEventWorks) { return; } CB_Screen._focusChanged(true); }, true, true, false); //Key down event will set focus too (IE8 fix).
//CB_Events.add(document, "mousemove", function() { if (focusOrBlurEventWorks) { return; } CB_Screen._focusChanged(true); }, true, true, false); //Mouse movemenet will set focus too (IE8 fix).
//Starts running the loop:
CB_Screen._mainLoop();
return CB_Screen;
}
//Loop to watch the screen changes:
CB_Screen._mainLoop = function()
{
//Cancels the timeout (if any):
clearTimeout(CB_Screen._refreshTimeout);
CB_Screen.getWidth(); //Defines screen width resolution.
CB_Screen.getHeight(); //Defines screen height resolution.
CB_Screen.getWidthPrevious(); //Defines previous window width resolution.
CB_Screen.getHeightPrevious(); //Defines previous window height resolution.
CB_Screen.getAvailableWidth(); //Defines screen available width resolution.
CB_Screen.getAvailableHeight(); //Defines screen available height resolution.
CB_Screen.getAvailableWidthPrevious(); //Defines previous window width resolution.
CB_Screen.getAvailableHeightPrevious(); //Defines previous window height resolution.
CB_Screen.getWindowWidth(); //Defines window width resolution.
CB_Screen.getWindowHeight(); //Defines window height resolution.
CB_Screen.getWindowWidthPrevious(); //Defines previous window width resolution.
CB_Screen.getWindowHeightPrevious(); //Defines previous window height resolution.
CB_Screen.getColorDepth(); //Defines screen color depth.
//CB_Screen.getScrollLeft(); //Defines scroll left (and executes defined function if it changes).
//CB_Screen.getScrollTop(); //Defines scroll top (and executes defined function if it changes).
CB_Screen.getZoom(); //Defines zoom level.
CB_Screen.getPixelRatio(); //Defines pixel ratio multiplied by the zoom level.
CB_Screen.isLandscape(); //Defines whether device is in landscape or portrait position (and executes defined function if it changes).
CB_Screen.isFullScreen(); //Defines whether it's in full screen mode or not (and executes defined function if it changes).
//Executes the function defined for Resize and Zoom events (if any):
CB_Screen._processOnResizeOrZoomFunction();
//Executes the function defined for Full screen change event (if any):
//CB_Screen.onFullScreenChangeFunction(CB_Screen.onFullScreenChangeFunction, false);
//Executes the function again:
CB_Screen._refreshTimeout = setTimeout(CB_Screen._mainLoop, 1); //Calls itself again to update values all the time.
}
/**
* Gets the current screen width (horizontal resolution). Uses the [window.screen.width]{@link https://developer.mozilla.org/en-US/docs/Web/API/Screen/width} property internally, when possible.
* @function
* @returns {number} Returns the current screen width (horizontal resolution) in pixels.
*/
CB_Screen.getWidth = function()
{
if (screen && screen.width && !isNaN(screen.width))
{
CB_Screen._screenWidth = screen.width;
}
return CB_Screen._screenWidth;
}
/**
* Gets the current screen height (vertical resolution). Uses the [window.screen.height]{@link https://developer.mozilla.org/en-US/docs/Web/API/Screen/height} property internally, when possible.
* @function
* @returns {number} Returns the current screen height (vertical resolution) in pixels.
*/
CB_Screen.getHeight = function()
{
if (screen && screen.height && !isNaN(screen.height))
{
CB_Screen._screenHeight = screen.height;
}
return CB_Screen._screenHeight;
}
/**
* Gets the previous screen width (horizontal resolution). Calculated through the [window.screen.width]{@link https://developer.mozilla.org/en-US/docs/Web/API/Screen/width} property internally, when possible. Useful when the resolution (screen size and/or orientation) changed.
* @function
* @returns {number} Returns the previous screen width (horizontal resolution) in pixels.
*/
CB_Screen.getWidthPrevious = function()
{
if (CB_Screen._previousScreenWidth === 0) { CB_Screen._previousScreenWidth = CB_Screen.getWidth(); }
return CB_Screen._previousScreenWidth;
}
/**
* Gets the previous screen height (vertical resolution). Calculated through the [window.screen.height]{@link https://developer.mozilla.org/en-US/docs/Web/API/Screen/height} property internally, when possible. Useful when the resolution (screen size and/or orientation) changed.
* @function
* @returns {number} Returns the previous screen height (vertical resolution) in pixels.
*/
CB_Screen.getHeightPrevious = function()
{
if (CB_Screen._previousScreenHeight === 0) { CB_Screen._previousScreenHeight = CB_Screen.getHeight(); }
return CB_Screen._previousScreenHeight;
}
/**
* Gets the current available screen width (horizontal resolution). Uses the [window.screen.availWidth]{@link https://developer.mozilla.org/en-US/docs/Web/API/Screen/availWidth} property internally, when possible.
* @function
* @returns {number} Returns the current available screen width (horizontal resolution) in pixels.
*/
CB_Screen.getAvailableWidth = function()
{
if (screen && screen.availWidth && !isNaN(screen.availWidth))
{
CB_Screen._screenAvailableWidth = screen.availWidth;
}
return CB_Screen._screenAvailableWidth;
}
/**
* Gets the current available screen height (vertical resolution). Uses the [window.screen.availHeight]{@link https://developer.mozilla.org/en-US/docs/Web/API/Screen/availHeight} property internally, when possible.
* @function
* @returns {number} Returns the current available screen height (vertical resolution) in pixels.
*/
CB_Screen.getAvailableHeight = function()
{
if (screen && screen.availHeight && !isNaN(screen.availHeight))
{
CB_Screen._screenAvailableHeight = screen.availHeight;
}
return CB_Screen._screenAvailableHeight;
}
/**
* Gets the previous available screen width (horizontal resolution). Useful when the resolution (screen size and/or orientation) changed. Uses the [window.screen.availWidth]{@link https://developer.mozilla.org/en-US/docs/Web/API/Screen/availWidth} property internally, when possible.
* @function
* @returns {number} Returns the previous available screen width (horizontal resolution) in pixels.
*/
CB_Screen.getAvailableWidthPrevious = function()
{
if (CB_Screen._previousScreenAvailableWidth === 0) { CB_Screen._previousScreenAvailableWidth = CB_Screen.getAvailableWidth(); }
return CB_Screen._previousScreenAvailableWidth;
}
/**
* Gets the previous available screen height (vertical resolution). Useful when the resolution (screen size and/or orientation) changed. Uses the [window.screen.availHeight]{@link https://developer.mozilla.org/en-US/docs/Web/API/Screen/availHeight} property internally, when possible.
* @function
* @returns {number} Returns the previous available screen height (vertical resolution) in pixels.
*/
CB_Screen.getAvailableHeightPrevious = function()
{
if (CB_Screen._previousScreenAvailableHeight === 0) { CB_Screen._previousScreenAvailableHeight = CB_Screen.getAvailableHeight(); }
return CB_Screen._previousScreenAvailableHeight;
}
/**
* Gets the current window width (horizontal resolution). Internally, uses the [window.innerWidth]{@link https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth} if possible and fallbacks to [document.documentElement.clientWidth]{@link https://developer.mozilla.org/en-US/docs/Web/API/Element/clientWidth} or [document.body.clientWidth]{@link https://developer.mozilla.org/en-US/docs/Web/API/Element/clientWidth} property otherwise, when possible.
* @function
* @returns {number} Returns the current window width (horizontal resolution) in pixels.
*/
CB_Screen.getWindowWidth = function()
{
if (window && window.innerWidth && !isNaN(window.innerWidth))
{
CB_Screen._windowWidth = window.innerWidth;
}
else if (document && document.documentElement && document.documentElement.clientWidth && !isNaN(document.documentElement.clientWidth) && document.documentElement.clientWidth > 0)
{
CB_Screen._windowWidth = document.documentElement.clientWidth;
}
else if (document && document.body && document.body.clientWidth && !isNaN(document.body.clientWidth) && document.body.clientWidth > 0)
{
CB_Screen._windowWidth = document.body.clientWidth;
}
return CB_Screen._windowWidth;
}
/**
* Gets the current window height (vertical resolution). Internally, uses the [window.innerHeight]{@link https://developer.mozilla.org/en-US/docs/Web/API/Window/innerHeight} if possible and fallbacks to [document.documentElement.clientHeight]{@link https://developer.mozilla.org/en-US/docs/Web/API/Element/clientHeight} or [document.body.clientHeight]{@link https://developer.mozilla.org/en-US/docs/Web/API/Element/clientHeight} property otherwise, when possible.
* @function
* @returns {number} Returns the current window height (vertical resolution) in pixels.
*/
CB_Screen.getWindowHeight = function()
{
if (window && window.innerHeight && !isNaN(window.innerHeight))
{
CB_Screen._windowHeight = window.innerHeight;
}
else if (document && document.documentElement && document.documentElement.clientHeight && !isNaN(document.documentElement.clientHeight) && document.documentElement.clientHeight > 0)
{
CB_Screen._windowHeight = document.documentElement.clientHeight;
}
else if (document && document.body && document.body.clientHeight && !isNaN(document.body.clientHeight) && document.body.clientHeight > 0)
{
CB_Screen._windowHeight = document.body.clientHeight;
}
return CB_Screen._windowHeight;
}
/**
* Gets the previous window width (horizontal resolution). Useful when the resolution (screen size and/or orientation) or window size changed. Internally, uses the [window.innerWidth]{@link https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth} if possible and fallbacks to [document.documentElement.clientWidth]{@link https://developer.mozilla.org/en-US/docs/Web/API/Element/clientWidth} or [document.body.clientWidth]{@link https://developer.mozilla.org/en-US/docs/Web/API/Element/clientWidth} property otherwise, when possible.
* @function
* @returns {number} Returns the previous window width (horizontal resolution) in pixels.
*/
CB_Screen.getWindowWidthPrevious = function()
{
if (CB_Screen._previousWindowWidth === 0) { CB_Screen._previousWindowWidth = CB_Screen.getWindowWidth(); }
return CB_Screen._previousWindowWidth;
}
/**
* Gets the previous window height (vertical resolution). Useful when the resolution (screen size and/or orientation) or window size changed. Internally, uses the [window.innerHeight]{@link https://developer.mozilla.org/en-US/docs/Web/API/Window/innerHeight} if possible and fallbacks to [document.documentElement.clientHeight]{@link https://developer.mozilla.org/en-US/docs/Web/API/Element/clientHeight} or [document.body.clientHeight]{@link https://developer.mozilla.org/en-US/docs/Web/API/Element/clientHeight} property otherwise, when possible.
* @function
* @returns {number} Returns the previous window height (vertical resolution) in pixels.
*/
CB_Screen.getWindowHeightPrevious = function()
{
if (CB_Screen._previousWindowHeight === 0) { CB_Screen._previousWindowHeight = CB_Screen.getWindowHeight(); }
return CB_Screen._previousWindowHeight;
}
/**
* Gets the current color depth. Uses the [window.screen.colorDepth]{@link https://developer.mozilla.org/en-US/docs/Web/API/Screen/colorDepth} property internally, when possible.
* @function
* @returns {number} Returns the current color depth.
*/
CB_Screen.getColorDepth = function()
{
if (screen && screen.colorDepth && !isNaN(screen.colorDepth))
{
CB_Screen._screenColorDepth = screen.colorDepth;
}
return CB_Screen._screenColorDepth;
}
/**
* Gets the current scroll left position (horizontal scroll) of the screen (main window). Uses the {@link CB_Elements.getScrollLeftById} function internally.
* @function
* @returns {number|null} Returns the current scroll left position (horizontal scroll) of the screen (main window). It could return null if something fails.
*/
CB_Screen.getScrollLeft = function()
{
CB_Screen._previousScrollLeft = CB_Screen._scrollLeft;
return CB_Elements.getScrollLeftById
(
window, //elementId
function(scrollLeft, scrollLeftPrevious, scrollWidth, visiblePixels, scrollRelative, scrollRelativePrevious) //onScrollLeftChanges:
{
//If there is any defined function:
if (typeof(CB_Screen._eventsHolder["onScrollLeft"]) === "function")
{
//Sets the new and old positions (just in case the function needs it):
CB_Screen._previousScrollLeft = CB_Screen._scrollLeft;
CB_Screen._scrollLeft = scrollLeft;
//Executes the function:
CB_Screen._eventsHolder["onScrollLeft"]();
}
},
true, //fireFirstTime
false, //fireAlways
null, //timeoutMs
true, //returnNullOnFail
undefined //timeout
);
}
/**
* Gets the current scroll top position (vertical scroll) of the screen (main window). Uses the {@link CB_Elements.getScrollTopById} function internally.
* @function
* @returns {number|null} Returns the current scroll top position (vertical scroll) of the screen (main window). It could return null if something fails.
*/
CB_Screen.getScrollTop = function()
{
CB_Screen._previousScrollTop = CB_Screen._scrollTop;
return CB_Elements.getScrollTopById
(
window, //elementId
function(scrollTop, scrollTopPrevious, scrollHeight, visiblePixels, scrollRelative, scrollRelativePrevious) //onScrollTopChanges:
{
//If there is any defined function:
if (typeof(CB_Screen._eventsHolder["onScrollTop"]) === "function")
{
//Sets the new and old positions (just in case the function needs it):
CB_Screen._previousScrollTop = CB_Screen._scrollTop;
CB_Screen._scrollTop = scrollTop;
//Executes the function:
CB_Screen._eventsHolder["onScrollTop"]();
}
},
true, //fireFirstTime
false, //fireAlways
null, //timeoutMs
true, //returnNullOnFail
undefined //timeout
);
}
/**
* Gets the current zoom level of the screen (main window). Uses [detect-zoom]{@link https://github.com/tombigel/detect-zoom} internally.
* @function
* @returns {number} Returns the current zoom level of the screen (main window). Default zoom level is 1 (one) even when it fails.
* @todo Find a better and more-compatible way to detect zoom which supports as many web clients as possible.
*/
CB_Screen.getZoom = function()
{
//if (typeof(detectZoom) !== "undefined" && detectZoom !== null && detectZoom && typeof(detectZoom.zoom) !== "undefined" && detectZoom.zoom !== null && detectZoom.zoom && typeof(detectZoom.zoom) === "function")
if (typeof(detectZoom) !== "undefined" && detectZoom !== null && typeof(detectZoom.zoom) === "function")
{
CB_Screen._zoom = detectZoom.zoom();
//if (CB_Screen._zoom === null || CB_Screen._zoom === 0 || !CB_Screen._zoom) { CB_Screen._zoom = 1; }
if (!CB_Screen._zoom) { CB_Screen._zoom = 1; }
//} else { CB_Screen._zoom = CB_Screen._previousZoom = 0; }
} else { CB_Screen._zoom = CB_Screen._previousZoom = 1; }
return CB_Screen._zoom;
}
/**
* Gets the previous zoom level of the screen (main window). Useful when the zoom changed. Uses [detect-zoom]{@link https://github.com/tombigel/detect-zoom} internally.
* @function
* @returns {number} Returns the previous zoom level of the screen (main window). Default previous zoom level is 0 (zero) even when it fails.
*/
CB_Screen.getZoomPrevious = function()
{
return CB_Screen._previousZoom;
}
/**
* Gets the current pixel ratio of the screen (main window). Uses [detect-zoom]{@link https://github.com/tombigel/detect-zoom} internally.
* @function
* @returns {number} Returns the current pixel ratio of the screen (main window). Default pixel ratio is 1 (one) even when it fails.
* @todo Find a better and more-compatible way to detect pixel ratio which supports as many web clients as possible.
*/
CB_Screen.getPixelRatio = function()
{
//if (typeof(detectZoom) !== "undefined" && detectZoom !== null && detectZoom && typeof(detectZoom.device) !== "undefined" && detectZoom.device !== null && detectZoom.device && typeof(detectZoom.device) === "function")
if (typeof(detectZoom) !== "undefined" && detectZoom !== null && typeof(detectZoom.device) === "function")
{
CB_Screen._pixelRatio = detectZoom.device();
//} else { CB_Screen._pixelRatio = CB_Screen._previousPixelRatio = 0; }
//if (CB_Screen._pixelRatio === null || CB_Screen._pixelRatio === 0 || !CB_Screen._pixelRatio) { CB_Screen._pixelRatio = 1; }
if (!CB_Screen._pixelRatio) { CB_Screen._pixelRatio = 1; }
} else { CB_Screen._pixelRatio = CB_Screen._previousPixelRatio = 1; }
return CB_Screen._pixelRatio;
}
/**
* Gets the previous pixel ratio of the screen (main window). Useful when the zoom/pixel-ratio changed. Uses [detect-zoom]{@link https://github.com/tombigel/detect-zoom} internally.
* @function
* @returns {number} Returns the previous pixel ratio of the screen (main window). Default previous pixel ratio is 0 (zero) even when it fails.
* @todo Find a better and more-compatible way to detect pixel ratio which supports as many web clients as possible.
*/
CB_Screen.getPixelRatioPrevious = function()
{
return CB_Screen._previousPixelRatio;
}
/**
* Tells whether the screen (main window) is in landscape position.
* @function
* @returns {boolean} Returns whether the screen is in landscape position.
*/
CB_Screen.isLandscape = function()
{
var isLandscape = false;
if (CB_Screen.getWindowWidth() > CB_Screen.getWindowHeight())
{
isLandscape = true;
}
//If it's not the first time and position has been changed, calls the onOrientationChange function (if any):
if (CB_Screen._isLandscape !== null && CB_Screen._isLandscape !== isLandscape)
{
//If there is any defined function:
if (typeof(CB_Screen._eventsHolder["onOrientationChange"]) === "function")
{
//Sets the new position (just in case the function needs it):
CB_Screen._isLandscape = isLandscape;
//Executes the function:
CB_Screen._eventsHolder["onOrientationChange"]();
}
}
//Sets the new position:
CB_Screen._isLandscape = isLandscape;
return CB_Screen._isLandscape;
}
//Sets whether the web is visible (called every time that visibility changes):
CB_Screen._visibilityChanged = function(e)
{
var isVisible = true; //By default is visible.
//if (!e) { e = window.event; }
e = CB_Events.normalize(e);
// if (e.type === "focus" || e.type === "focusin")
{
// isVisible = true;
}
// else if (e.type === "blur" || e.type === "focusout")
{
// isVisible = false;
}
// else
{
var hidden = "";
if (typeof(document.hidden) !== "undefined")
{
hidden = "hidden";
}
else if (typeof(document.mozHidden) !== "undefined")
{
hidden = "mozHidden";
}
else if (typeof document.msHidden !== "undefined")
{
hidden = "msHidden";
}
else if (typeof document.webkitHidden !== "undefined")
{
hidden = "webkitHidden";
}
//if (hidden !== "") { isVisible = document[hidden] ? false : true; }
if (hidden !== "") { isVisible = !document[hidden]; }
}
//Calls the onVisibilityChange function (if any):
if (typeof(CB_Screen._eventsHolder["onVisibilityChange"]) === "function")
{
//Sets the new visibility (just in case the function needs it):
CB_Screen._isVisible = isVisible;
//Executes the function:
CB_Screen._eventsHolder["onVisibilityChange"]();
}
//Sets the new visibility:
CB_Screen._isVisible = isVisible;
}
/**
* Tells whether the main window is visible or not.
* @function
* @returns {boolean} Returns whether the main window is visible or not.
*/
CB_Screen.isVisible = function()
{
return CB_Screen._isVisible;
}
/*
//Called every time that focus is lost:
CB_Screen.focusLost = function()
{
//Focus has not been recovered (yet):
CB_Screen.focusRecovered = false;
//If focus is not recovered, set as not focused:
setTimeout(
function()
{
if (!CB_Screen.focusRecovered)
{
CB_Screen._focusChanged(false);
}
}, 500);
return;
}
*/
//Sets whether the web is focused (called every time that focus changes):
CB_Screen._focusChanged = function(isFocused)
{
//If is focused, the focus has been recovered:
//if (isFocused) { CB_Screen.focusRecovered = true; }
//Calls the onFocusChange function (if any):
if (typeof(CB_Screen._eventsHolder["onFocusChange"]) === "function")
{
//Sets whether is focused or not (just in case the function needs it):
CB_Screen._isFocused = isFocused;
//Executes the function:
CB_Screen._eventsHolder["onFocusChange"]();
}
//Sets whether is focused or not:
CB_Screen._isFocused = isFocused;
}
/**
* Tells whether the main window is focused or not.
* @function
* @returns {boolean} Returns whether the main window is focused or not.
*/
CB_Screen.isFocused = function()
{
return CB_Screen._isFocused;
}
/**
* Sets the focus to the main window (if possible).
* @function
*/
CB_Screen.focus = function()
{
//try { CB_Client.getWindow(true).focus(); } catch(E) {}
CB_Client.getWindow(false).focus();
}
/**
* Sets a function to execute when the left scroll position (horizontal scroll) is changed in the screen (main window) or removes it.
* @function
* @param {function|null} callbackFunction - The function (event listener) that we want to execute when the event is fired, with no parameters. If a null value is used, the event will be removed.
* @param {boolean} [keepOldFunction=true] - Defines whether we want to keep any possible previous event listener for the same target and event name or not.
*/
CB_Screen.onScrollLeft = function(callbackFunction, keepOldFunction)
{
return CB_Screen._setSpecialEventFunction("onScrollLeft", callbackFunction, keepOldFunction);
}
/**
* Sets a function to execute when the top scroll position (vertical scroll) is changed in the screen (main window) or removes it.
* @function
* @param {function|null} callbackFunction - The function (event listener) that we want to execute when the event is fired, with no parameters. If a null value is used, the event will be removed.
* @param {boolean} [keepOldFunction=true] - Defines whether we want to keep any possible previous event listener for the same target and event name or not.
*/
CB_Screen.onScrollTop = function(callbackFunction, keepOldFunction)
{
return CB_Screen._setSpecialEventFunction("onScrollTop", callbackFunction, keepOldFunction);
}
/**
* Sets a function to execute when the screen (main window) orientation is changed (portrait or landscape) or removes it.
* @function
* @param {function|null} callbackFunction - The function (event listener) that we want to execute when the event is fired, with no parameters. If a null value is used, the event will be removed.
* @param {boolean} [keepOldFunction=true] - Defines whether we want to keep any possible previous event listener for the same target and event name or not.
*/
CB_Screen.onOrientationChange = function(callbackFunction, keepOldFunction)
{
return CB_Screen._setSpecialEventFunction("onOrientationChange", callbackFunction, keepOldFunction);
}
/**
* Sets a function to execute when the screen (main window) visibility is changed or removes it.
* @function
* @param {function|null} callbackFunction - The function (event listener) that we want to execute when the event is fired, with no parameters. If a null value is used, the event will be removed.
* @param {boolean} [keepOldFunction=true] - Defines whether we want to keep any possible previous event listener for the same target and event name or not.
*/
CB_Screen.onVisibilityChange = function(callbackFunction, keepOldFunction)
{
return CB_Screen._setSpecialEventFunction("onVisibilityChange", callbackFunction, keepOldFunction);
}
/**
* Sets a function to execute when the screen (main window) focus is changed or removes it.
* @function
* @param {function|null} callbackFunction - The function (event listener) that we want to execute when the event is fired, with no parameters. If a null value is used, the event will be removed.
* @param {boolean} [keepOldFunction=true] - Defines whether we want to keep any possible previous event listener for the same target and event name or not.
*/
CB_Screen.onFocusChange = function(callbackFunction, keepOldFunction)
{
return CB_Screen._setSpecialEventFunction("onFocusChange", callbackFunction, keepOldFunction);
}
/**
* Sets a function to execute when the screen (main window) is resized ([onResize]{@link https://developer.mozilla.org/en-US/docs/Web/Events/resize} event) or removes it.
* @function
* @param {function|null} callbackFunction - The function (event listener) that we want to execute when the event is fired, with no parameters. If a null value is used, the event will be removed.
* @param {boolean} [keepOldFunction=true] - Defines whether we want to keep any possible previous event listener for the same target and event name or not.
*/
CB_Screen.onResize = function(callbackFunction, keepOldFunction, useCapture)
{
//If they are not set, use default values for optional parameters:
if (typeof(keepOldFunction) === "undefined" || keepOldFunction === null) { keepOldFunction = true; } //If not set, it keeps old function by default.
//If a function has been sent:
if (typeof(callbackFunction) === "function")
{
//If able, adds the function given to the event:
var functionToAdd =
function()
{
CB_Screen.init(); //Updates screen properties.
if (typeof(callbackFunction) === "function") { return callbackFunction(); }
return true;
};
///////CB_Screen._eventsHolder["onResize"] = functionToAdd;
CB_Events.add(window, "resize", functionToAdd, useCapture, keepOldFunction, true);
}
//...but if the function given is null, it will cancel the event:
else if (callbackFunction === null)/////// && CB_Screen._eventsHolder["onResize"] !== null)
{
//CB_Events.remove(window, "resize", CB_Screen._eventsHolder["onResize"], useCapture);
CB_Events.removeByName(window, "resize");
////////CB_Screen._eventsHolder["onResize"] = null;
}
}
//Sets a function to execute when window is resized or zoom is applied:
CB_Screen._processOnResizeOrZoomFunction = function()
{
//If there is no function to process, exits:
if (typeof(CB_Screen._eventsHolder["onResizeOrZoom"]) !== "function") { return; }
//If this is the first time, set stored values:
if (CB_Screen._storedScreenWidth === 0) { CB_Screen._storedScreenWidth = CB_Screen.getWidth(); }
if (CB_Screen._storedScreenHeight === 0) { CB_Screen._storedScreenHeight = CB_Screen.getHeight(); }
if (CB_Screen._storedScreenAvailableWidth === 0) { CB_Screen._storedScreenAvailableWidth = CB_Screen.getAvailableWidth(); }
if (CB_Screen._storedScreenAvailableHeight === 0) { CB_Screen._storedScreenAvailableHeight = CB_Screen.getAvailableHeight(); }
if (CB_Screen._storedWindowWidth === 0) { CB_Screen._storedWindowWidth = CB_Screen.getWindowWidth(); }
if (CB_Screen._storedWindowHeight === 0) { CB_Screen._storedWindowHeight = CB_Screen.getWindowHeight(); }
if (CB_Screen._storedZoom === 0) { CB_Screen._storedZoom = CB_Screen.getZoom(); }
if (CB_Screen._storedPixelRatio === 0) { CB_Screen._storedPixelRatio = CB_Screen.getPixelRatio(); }
//If the window has been resized or zoomed, stores the previous values:
var windowResizedOrZoomed = false;
if (CB_Screen._storedWindowWidth !== CB_Screen.getWindowWidth() || CB_Screen._storedWindowHeight !== CB_Screen.getWindowHeight() || CB_Screen._storedZoom !== CB_Screen.getZoom() || CB_Screen._storedPixelRatio !== CB_Screen.getPixelRatio())
{
//Window has been resized or zoomed:
windowResizedOrZoomed = true;
//Stores the previous width and height:
CB_Screen._previousWindowWidth = CB_Screen._storedWindowWidth;
CB_Screen._previousWindowHeight = CB_Screen._storedWindowHeight;
CB_Screen._previousScreenWidth = CB_Screen._storedScreenWidth;
CB_Screen._previousScreenHeight = CB_Screen._storedScreenHeight;
CB_Screen._previousScreenAvailableWidth = CB_Screen._storedScreenAvailableWidth;
CB_Screen._previousScreenAvailableHeight = CB_Screen._storedScreenAvailableHeight;
//If the zoom has been changed, stores the previous zoom and pixel ratio:
if (CB_Screen._storedZoom !== CB_Screen.getZoom() || CB_Screen._storedPixelRatio !== CB_Screen.getPixelRatio())
{
CB_Screen._previousZoom = CB_Screen._storedZoom;
CB_Screen._previousPixelRatio = CB_Screen._storedPixelRatio;
}
//Stores the current window width and height:
CB_Screen._storedScreenWidth = CB_Screen.getWidth();
CB_Screen._storedScreenHeight = CB_Screen.getHeight();
CB_Screen._storedScreenAvailableWidth = CB_Screen.getAvailableWidth();
CB_Screen._storedScreenAvailableHeight = CB_Screen.getAvailableHeight();
CB_Screen._storedWindowWidth = CB_Screen.getWindowWidth();
CB_Screen._storedWindowHeight = CB_Screen.getWindowHeight();
//Stores the current zoom and pixel ratio:
CB_Screen._storedZoom = CB_Screen.getZoom();
CB_Screen._storedPixelRatio = CB_Screen.getPixelRatio();
}
//If the window has been resized or zoomed, executes the function:
if (windowResizedOrZoomed)
{
CB_Screen.init(); //It also refresh CB_Screen properties before calling the function.
CB_Screen._eventsHolder["onResizeOrZoom"](); //Executes the function.
}
}
/**
* Sets a function to execute when the screen (main window) is resized or the zoom is changed, or removes it.
* @function
* @param {function|null} callbackFunction - The function (event listener) that we want to execute when the event is fired, with no parameters. If a null value is used, the event will be removed.
* @param {boolean} [keepOldFunction=true] - Defines whether we want to keep