mirror of
https://github.com/photonstorm/phaser
synced 2024-11-24 05:33:35 +00:00
1344 lines
36 KiB
JavaScript
1344 lines
36 KiB
JavaScript
/**
|
|
* @author Richard Davey <rich@photonstorm.com>
|
|
* @copyright 2016 Photon Storm Ltd.
|
|
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
|
|
*/
|
|
|
|
/**
|
|
* @classdesc
|
|
* Detects device support capabilities and is responsible for device initialization - see {@link Phaser.Device.whenReady whenReady}.
|
|
*
|
|
* This class represents a singleton object that can be accessed directly as `game.device`
|
|
* (or, as a fallback, `Phaser.Device` when a game instance is not available) without the need to instantiate it.
|
|
*
|
|
* Unless otherwise noted the device capabilities are only guaranteed after initialization. Initialization
|
|
* occurs automatically and is guaranteed complete before {@link Phaser.Game} begins its "boot" phase.
|
|
* Feature detection can be modified in the {@link Phaser.Device.onInitialized onInitialized} signal.
|
|
*
|
|
* When checking features using the exposed properties only the *truth-iness* of the value should be relied upon
|
|
* unless the documentation states otherwise: properties may return `false`, `''`, `null`, or even `undefined`
|
|
* when indicating the lack of a feature.
|
|
*
|
|
* Uses elements from System.js by MrDoob and Modernizr
|
|
*
|
|
* @description
|
|
* It is not possible to instantiate the Device class manually.
|
|
*
|
|
* @class
|
|
* @protected
|
|
*/
|
|
Phaser.Device = function () {
|
|
|
|
/**
|
|
* The time the device became ready.
|
|
* @property {integer} deviceReadyAt
|
|
* @protected
|
|
*/
|
|
this.deviceReadyAt = 0;
|
|
|
|
/**
|
|
* The time as which initialization has completed.
|
|
* @property {boolean} initialized
|
|
* @protected
|
|
*/
|
|
this.initialized = false;
|
|
|
|
// Browser / Host / Operating System
|
|
|
|
/**
|
|
* @property {boolean} desktop - Is running on a desktop?
|
|
* @default
|
|
*/
|
|
this.desktop = false;
|
|
|
|
/**
|
|
* @property {boolean} iOS - Is running on iOS?
|
|
* @default
|
|
*/
|
|
this.iOS = false;
|
|
|
|
/**
|
|
* @property {number} iOSVersion - If running in iOS this will contain the major version number.
|
|
* @default
|
|
*/
|
|
this.iOSVersion = 0;
|
|
|
|
/**
|
|
* @property {boolean} cocoonJS - Is the game running under CocoonJS?
|
|
* @default
|
|
*/
|
|
this.cocoonJS = false;
|
|
|
|
/**
|
|
* @property {boolean} cocoonJSApp - Is this game running with CocoonJS.App?
|
|
* @default
|
|
*/
|
|
this.cocoonJSApp = false;
|
|
|
|
/**
|
|
* @property {boolean} cordova - Is the game running under Apache Cordova?
|
|
* @default
|
|
*/
|
|
this.cordova = false;
|
|
|
|
/**
|
|
* @property {boolean} node - Is the game running under Node.js?
|
|
* @default
|
|
*/
|
|
this.node = false;
|
|
|
|
/**
|
|
* @property {boolean} nodeWebkit - Is the game running under Node-Webkit?
|
|
* @default
|
|
*/
|
|
this.nodeWebkit = false;
|
|
|
|
/**
|
|
* @property {boolean} electron - Is the game running under GitHub Electron?
|
|
* @default
|
|
*/
|
|
this.electron = false;
|
|
|
|
/**
|
|
* @property {boolean} ejecta - Is the game running under Ejecta?
|
|
* @default
|
|
*/
|
|
this.ejecta = false;
|
|
|
|
/**
|
|
* @property {boolean} crosswalk - Is the game running under the Intel Crosswalk XDK?
|
|
* @default
|
|
*/
|
|
this.crosswalk = false;
|
|
|
|
/**
|
|
* @property {boolean} android - Is running on android?
|
|
* @default
|
|
*/
|
|
this.android = false;
|
|
|
|
/**
|
|
* @property {boolean} chromeOS - Is running on chromeOS?
|
|
* @default
|
|
*/
|
|
this.chromeOS = false;
|
|
|
|
/**
|
|
* @property {boolean} linux - Is running on linux?
|
|
* @default
|
|
*/
|
|
this.linux = false;
|
|
|
|
/**
|
|
* @property {boolean} macOS - Is running on macOS?
|
|
* @default
|
|
*/
|
|
this.macOS = false;
|
|
|
|
/**
|
|
* @property {boolean} windows - Is running on windows?
|
|
* @default
|
|
*/
|
|
this.windows = false;
|
|
|
|
/**
|
|
* @property {boolean} windowsPhone - Is running on a Windows Phone?
|
|
* @default
|
|
*/
|
|
this.windowsPhone = false;
|
|
|
|
// Features
|
|
|
|
/**
|
|
* @property {boolean} canvas - Is canvas available?
|
|
* @default
|
|
*/
|
|
this.canvas = false;
|
|
|
|
/**
|
|
* @property {?boolean} canvasBitBltShift - True if canvas supports a 'copy' bitblt onto itself when the source and destination regions overlap.
|
|
* @default
|
|
*/
|
|
this.canvasBitBltShift = null;
|
|
|
|
/**
|
|
* If the browser isn't capable of handling tinting with alpha this will be false.
|
|
* @property {boolean} canHandleAlpha
|
|
* @default
|
|
*/
|
|
this.canHandleAlpha = false;
|
|
|
|
/**
|
|
* Whether or not the Canvas BlendModes are supported, consequently the ability to tint using the multiply method.
|
|
* @property {boolean} canUseMultiply
|
|
* @default
|
|
*/
|
|
this.canUseMultiply = false;
|
|
|
|
/**
|
|
* @property {boolean} webGL - Is webGL available?
|
|
* @default
|
|
*/
|
|
this.webGL = false;
|
|
|
|
/**
|
|
* @property {boolean} file - Is file available?
|
|
* @default
|
|
*/
|
|
this.file = false;
|
|
|
|
/**
|
|
* @property {boolean} fileSystem - Is fileSystem available?
|
|
* @default
|
|
*/
|
|
this.fileSystem = false;
|
|
|
|
/**
|
|
* @property {boolean} localStorage - Is localStorage available?
|
|
* @default
|
|
*/
|
|
this.localStorage = false;
|
|
|
|
/**
|
|
* @property {boolean} worker - Is worker available?
|
|
* @default
|
|
*/
|
|
this.worker = false;
|
|
|
|
/**
|
|
* @property {boolean} pointerLock - Is Pointer Lock available?
|
|
* @default
|
|
*/
|
|
this.pointerLock = false;
|
|
|
|
/**
|
|
* @property {boolean} typedArray - Does the browser support TypedArrays?
|
|
* @default
|
|
*/
|
|
this.typedArray = false;
|
|
|
|
/**
|
|
* @property {boolean} vibration - Does the device support the Vibration API?
|
|
* @default
|
|
*/
|
|
this.vibration = false;
|
|
|
|
/**
|
|
* @property {boolean} getUserMedia - Does the device support the getUserMedia API?
|
|
* @default
|
|
*/
|
|
this.getUserMedia = true;
|
|
|
|
/**
|
|
* @property {boolean} quirksMode - Is the browser running in strict mode (false) or quirks mode? (true)
|
|
* @default
|
|
*/
|
|
this.quirksMode = false;
|
|
|
|
// Input
|
|
|
|
/**
|
|
* @property {boolean} touch - Is touch available?
|
|
* @default
|
|
*/
|
|
this.touch = false;
|
|
|
|
/**
|
|
* @property {boolean} mspointer - Is mspointer available?
|
|
* @default
|
|
*/
|
|
this.mspointer = false;
|
|
|
|
/**
|
|
* @property {?string} wheelType - The newest type of Wheel/Scroll event supported: 'wheel', 'mousewheel', 'DOMMouseScroll'
|
|
* @default
|
|
* @protected
|
|
*/
|
|
this.wheelEvent = null;
|
|
|
|
// Browser
|
|
|
|
/**
|
|
* @property {boolean} chrome - Set to true if running in Chrome.
|
|
* @default
|
|
*/
|
|
this.chrome = false;
|
|
|
|
/**
|
|
* @property {number} chromeVersion - If running in Chrome this will contain the major version number.
|
|
* @default
|
|
*/
|
|
this.chromeVersion = 0;
|
|
|
|
/**
|
|
* @property {boolean} firefox - Set to true if running in Firefox.
|
|
* @default
|
|
*/
|
|
this.firefox = false;
|
|
|
|
/**
|
|
* @property {number} firefoxVersion - If running in Firefox this will contain the major version number.
|
|
* @default
|
|
*/
|
|
this.firefoxVersion = 0;
|
|
|
|
/**
|
|
* @property {boolean} ie - Set to true if running in Internet Explorer.
|
|
* @default
|
|
*/
|
|
this.ie = false;
|
|
|
|
/**
|
|
* @property {number} ieVersion - If running in Internet Explorer this will contain the major version number. Beyond IE10 you should use Device.trident and Device.tridentVersion.
|
|
* @default
|
|
*/
|
|
this.ieVersion = 0;
|
|
|
|
/**
|
|
* @property {boolean} trident - Set to true if running a Trident version of Internet Explorer (IE11+)
|
|
* @default
|
|
*/
|
|
this.trident = false;
|
|
|
|
/**
|
|
* @property {number} tridentVersion - If running in Internet Explorer 11 this will contain the major version number. See {@link http://msdn.microsoft.com/en-us/library/ie/ms537503(v=vs.85).aspx}
|
|
* @default
|
|
*/
|
|
this.tridentVersion = 0;
|
|
|
|
/**
|
|
* @property {boolean} edge - Set to true if running in Microsoft Edge browser.
|
|
* @default
|
|
*/
|
|
this.edge = false;
|
|
|
|
/**
|
|
* @property {boolean} mobileSafari - Set to true if running in Mobile Safari.
|
|
* @default
|
|
*/
|
|
this.mobileSafari = false;
|
|
|
|
/**
|
|
* @property {boolean} opera - Set to true if running in Opera.
|
|
* @default
|
|
*/
|
|
this.opera = false;
|
|
|
|
/**
|
|
* @property {boolean} safari - Set to true if running in Safari.
|
|
* @default
|
|
*/
|
|
this.safari = false;
|
|
|
|
/**
|
|
* @property {number} safariVersion - If running in Safari this will contain the major version number.
|
|
* @default
|
|
*/
|
|
this.safariVersion = 0;
|
|
|
|
/**
|
|
* @property {boolean} webApp - Set to true if running as a WebApp, i.e. within a WebView
|
|
* @default
|
|
*/
|
|
this.webApp = false;
|
|
|
|
/**
|
|
* @property {boolean} silk - Set to true if running in the Silk browser (as used on the Amazon Kindle)
|
|
* @default
|
|
*/
|
|
this.silk = false;
|
|
|
|
// Audio
|
|
|
|
/**
|
|
* @property {boolean} audioData - Are Audio tags available?
|
|
* @default
|
|
*/
|
|
this.audioData = false;
|
|
|
|
/**
|
|
* @property {boolean} webAudio - Is the WebAudio API available?
|
|
* @default
|
|
*/
|
|
this.webAudio = false;
|
|
|
|
/**
|
|
* @property {boolean} ogg - Can this device play ogg files?
|
|
* @default
|
|
*/
|
|
this.ogg = false;
|
|
|
|
/**
|
|
* @property {boolean} opus - Can this device play opus files?
|
|
* @default
|
|
*/
|
|
this.opus = false;
|
|
|
|
/**
|
|
* @property {boolean} mp3 - Can this device play mp3 files?
|
|
* @default
|
|
*/
|
|
this.mp3 = false;
|
|
|
|
/**
|
|
* @property {boolean} wav - Can this device play wav files?
|
|
* @default
|
|
*/
|
|
this.wav = false;
|
|
|
|
/**
|
|
* Can this device play m4a files?
|
|
* @property {boolean} m4a - True if this device can play m4a files.
|
|
* @default
|
|
*/
|
|
this.m4a = false;
|
|
|
|
/**
|
|
* @property {boolean} webm - Can this device play webm files?
|
|
* @default
|
|
*/
|
|
this.webm = false;
|
|
|
|
/**
|
|
* @property {boolean} dolby - Can this device play EC-3 Dolby Digital Plus files?
|
|
* @default
|
|
*/
|
|
this.dolby = false;
|
|
|
|
// Video
|
|
|
|
/**
|
|
* @property {boolean} oggVideo - Can this device play ogg video files?
|
|
* @default
|
|
*/
|
|
this.oggVideo = false;
|
|
|
|
/**
|
|
* @property {boolean} h264Video - Can this device play h264 mp4 video files?
|
|
* @default
|
|
*/
|
|
this.h264Video = false;
|
|
|
|
/**
|
|
* @property {boolean} mp4Video - Can this device play h264 mp4 video files?
|
|
* @default
|
|
*/
|
|
this.mp4Video = false;
|
|
|
|
/**
|
|
* @property {boolean} webmVideo - Can this device play webm video files?
|
|
* @default
|
|
*/
|
|
this.webmVideo = false;
|
|
|
|
/**
|
|
* @property {boolean} vp9Video - Can this device play vp9 video files?
|
|
* @default
|
|
*/
|
|
this.vp9Video = false;
|
|
|
|
/**
|
|
* @property {boolean} hlsVideo - Can this device play hls video files?
|
|
* @default
|
|
*/
|
|
this.hlsVideo = false;
|
|
|
|
// Device
|
|
|
|
/**
|
|
* @property {boolean} iPhone - Is running on iPhone?
|
|
* @default
|
|
*/
|
|
this.iPhone = false;
|
|
|
|
/**
|
|
* @property {boolean} iPhone4 - Is running on iPhone4?
|
|
* @default
|
|
*/
|
|
this.iPhone4 = false;
|
|
|
|
/**
|
|
* @property {boolean} iPad - Is running on iPad?
|
|
* @default
|
|
*/
|
|
this.iPad = false;
|
|
|
|
// Device features
|
|
|
|
/**
|
|
* @property {number} pixelRatio - PixelRatio of the host device?
|
|
* @default
|
|
*/
|
|
this.pixelRatio = 0;
|
|
|
|
/**
|
|
* @property {boolean} LITTLE_ENDIAN - Is the device big or little endian? (only detected if the browser supports TypedArrays)
|
|
* @default
|
|
*/
|
|
this.LITTLE_ENDIAN = false;
|
|
|
|
/**
|
|
* @property {boolean} support32bit - Does the device context support 32bit pixel manipulation using array buffer views?
|
|
* @default
|
|
*/
|
|
this.support32bit = false;
|
|
|
|
/**
|
|
* @property {boolean} fullscreen - Does the browser support the Full Screen API?
|
|
* @default
|
|
*/
|
|
this.fullscreen = false;
|
|
|
|
/**
|
|
* @property {string} requestFullscreen - If the browser supports the Full Screen API this holds the call you need to use to activate it.
|
|
* @default
|
|
*/
|
|
this.requestFullscreen = '';
|
|
|
|
/**
|
|
* @property {string} cancelFullscreen - If the browser supports the Full Screen API this holds the call you need to use to cancel it.
|
|
* @default
|
|
*/
|
|
this.cancelFullscreen = '';
|
|
|
|
/**
|
|
* @property {boolean} fullscreenKeyboard - Does the browser support access to the Keyboard during Full Screen mode?
|
|
* @default
|
|
*/
|
|
this.fullscreenKeyboard = false;
|
|
|
|
};
|
|
|
|
// Device is really a singleton/static entity; instantiate it
|
|
// and add new methods directly sans-prototype.
|
|
Phaser.Device = new Phaser.Device();
|
|
|
|
/**
|
|
* This signal is dispatched after device initialization occurs but before any of the ready
|
|
* callbacks (see {@link Phaser.Device.whenReady whenReady}) have been invoked.
|
|
*
|
|
* Local "patching" for a particular device can/should be done in this event.
|
|
*
|
|
* _Note_: This signal is removed after the device has been readied; if a handler has not been
|
|
* added _before_ `new Phaser.Game(..)` it is probably too late.
|
|
*
|
|
* @type {?Phaser.Signal}
|
|
* @static
|
|
*/
|
|
Phaser.Device.onInitialized = new Phaser.Signal();
|
|
|
|
/**
|
|
* Add a device-ready handler and ensure the device ready sequence is started.
|
|
*
|
|
* Phaser.Device will _not_ activate or initialize until at least one `whenReady` handler is added,
|
|
* which is normally done automatically be calling `new Phaser.Game(..)`.
|
|
*
|
|
* The handler is invoked when the device is considered "ready", which may be immediately
|
|
* if the device is already "ready". See {@link Phaser.Device#deviceReadyAt deviceReadyAt}.
|
|
*
|
|
* @method
|
|
* @param {function} handler - Callback to invoke when the device is ready. It is invoked with the given context the Phaser.Device object is supplied as the first argument.
|
|
* @param {object} [context] - Context in which to invoke the handler
|
|
* @param {boolean} [nonPrimer=false] - If true the device ready check will not be started.
|
|
*/
|
|
Phaser.Device.whenReady = function (callback, context, nonPrimer) {
|
|
|
|
var readyCheck = this._readyCheck;
|
|
|
|
if (this.deviceReadyAt || !readyCheck)
|
|
{
|
|
callback.call(context, this);
|
|
}
|
|
else if (readyCheck._monitor || nonPrimer)
|
|
{
|
|
readyCheck._queue = readyCheck._queue || [];
|
|
readyCheck._queue.push([callback, context]);
|
|
}
|
|
else
|
|
{
|
|
readyCheck._monitor = readyCheck.bind(this);
|
|
readyCheck._queue = readyCheck._queue || [];
|
|
readyCheck._queue.push([callback, context]);
|
|
|
|
var cordova = typeof window.cordova !== 'undefined';
|
|
var cocoonJS = navigator['isCocoonJS'];
|
|
|
|
if (document.readyState === 'complete' || document.readyState === 'interactive')
|
|
{
|
|
// Why is there an additional timeout here?
|
|
window.setTimeout(readyCheck._monitor, 0);
|
|
}
|
|
else if (cordova && !cocoonJS)
|
|
{
|
|
// Ref. http://docs.phonegap.com/en/3.5.0/cordova_events_events.md.html#deviceready
|
|
// Cordova, but NOT Cocoon?
|
|
document.addEventListener('deviceready', readyCheck._monitor, false);
|
|
}
|
|
else
|
|
{
|
|
document.addEventListener('DOMContentLoaded', readyCheck._monitor, false);
|
|
window.addEventListener('load', readyCheck._monitor, false);
|
|
}
|
|
}
|
|
|
|
};
|
|
|
|
/**
|
|
* Internal method used for checking when the device is ready.
|
|
* This function is removed from Phaser.Device when the device becomes ready.
|
|
*
|
|
* @method
|
|
* @private
|
|
*/
|
|
Phaser.Device._readyCheck = function () {
|
|
|
|
var readyCheck = this._readyCheck;
|
|
|
|
if (!document.body)
|
|
{
|
|
window.setTimeout(readyCheck._monitor, 20);
|
|
}
|
|
else if (!this.deviceReadyAt)
|
|
{
|
|
this.deviceReadyAt = Date.now();
|
|
|
|
document.removeEventListener('deviceready', readyCheck._monitor);
|
|
document.removeEventListener('DOMContentLoaded', readyCheck._monitor);
|
|
window.removeEventListener('load', readyCheck._monitor);
|
|
|
|
this._initialize();
|
|
this.initialized = true;
|
|
|
|
this.onInitialized.dispatch(this);
|
|
|
|
var item;
|
|
while ((item = readyCheck._queue.shift()))
|
|
{
|
|
var callback = item[0];
|
|
var context = item[1];
|
|
callback.call(context, this);
|
|
}
|
|
|
|
// Remove no longer useful methods and properties.
|
|
this._readyCheck = null;
|
|
this._initialize = null;
|
|
this.onInitialized = null;
|
|
}
|
|
|
|
};
|
|
|
|
/**
|
|
* Internal method to initialize the capability checks.
|
|
* This function is removed from Phaser.Device once the device is initialized.
|
|
*
|
|
* @method
|
|
* @private
|
|
*/
|
|
Phaser.Device._initialize = function () {
|
|
|
|
var device = this;
|
|
|
|
/**
|
|
* Check which OS is game running on.
|
|
*/
|
|
function _checkOS () {
|
|
|
|
var ua = navigator.userAgent;
|
|
|
|
if (/Playstation Vita/.test(ua))
|
|
{
|
|
device.vita = true;
|
|
}
|
|
else if (/Kindle/.test(ua) || /\bKF[A-Z][A-Z]+/.test(ua) || /Silk.*Mobile Safari/.test(ua))
|
|
{
|
|
device.kindle = true;
|
|
// This will NOT detect early generations of Kindle Fire, I think there is no reliable way...
|
|
// E.g. "Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_6_3; en-us; Silk/1.1.0-80) AppleWebKit/533.16 (KHTML, like Gecko) Version/5.0 Safari/533.16 Silk-Accelerated=true"
|
|
}
|
|
else if (/Android/.test(ua))
|
|
{
|
|
device.android = true;
|
|
}
|
|
else if (/CrOS/.test(ua))
|
|
{
|
|
device.chromeOS = true;
|
|
}
|
|
else if (/iP[ao]d|iPhone/i.test(ua))
|
|
{
|
|
device.iOS = true;
|
|
(navigator.appVersion).match(/OS (\d+)/);
|
|
device.iOSVersion = parseInt(RegExp.$1, 10);
|
|
}
|
|
else if (/Linux/.test(ua))
|
|
{
|
|
device.linux = true;
|
|
}
|
|
else if (/Mac OS/.test(ua))
|
|
{
|
|
device.macOS = true;
|
|
}
|
|
else if (/Windows/.test(ua))
|
|
{
|
|
device.windows = true;
|
|
}
|
|
|
|
if (/Windows Phone/i.test(ua) || /IEMobile/i.test(ua))
|
|
{
|
|
device.android = false;
|
|
device.iOS = false;
|
|
device.macOS = false;
|
|
device.windows = true;
|
|
device.windowsPhone = true;
|
|
}
|
|
|
|
var silk = /Silk/.test(ua); // detected in browsers
|
|
|
|
if (device.windows || device.macOS || (device.linux && !silk) || device.chromeOS)
|
|
{
|
|
device.desktop = true;
|
|
}
|
|
|
|
// Windows Phone / Table reset
|
|
if (device.windowsPhone || ((/Windows NT/i.test(ua)) && (/Touch/i.test(ua))))
|
|
{
|
|
device.desktop = false;
|
|
}
|
|
|
|
}
|
|
|
|
/**
|
|
* Checks if the browser correctly supports putImageData alpha channels.
|
|
* If the browser isn't capable of handling tinting with alpha, `Device.canHandleAlpha` will be false.
|
|
* Also checks whether the Canvas BlendModes are supported by the current browser for drawImage.
|
|
*/
|
|
function _checkCanvasFeatures () {
|
|
|
|
var canvas = Phaser.CanvasPool.create(this, 6, 1);
|
|
var context = canvas.getContext('2d');
|
|
|
|
context.fillStyle = 'rgba(10, 20, 30, 0.5)';
|
|
|
|
// Draw a single pixel
|
|
context.fillRect(0, 0, 1, 1);
|
|
|
|
// Get the color values
|
|
var s1 = context.getImageData(0, 0, 1, 1);
|
|
|
|
if (s1)
|
|
{
|
|
// Plot them to x2
|
|
context.putImageData(s1, 1, 0);
|
|
|
|
// Get those values
|
|
var s2 = context.getImageData(1, 0, 1, 1);
|
|
|
|
// Compare and set
|
|
device.canHandleAlpha = (
|
|
s2.data[0] === s1.data[0] &&
|
|
s2.data[1] === s1.data[1] &&
|
|
s2.data[2] === s1.data[2] &&
|
|
s2.data[3] === s1.data[3]
|
|
);
|
|
}
|
|
|
|
// Checks whether the Canvas BlendModes are supported by the current browser for drawImage.
|
|
|
|
var pngHead = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABAQMAAADD8p2OAAAAA1BMVEX/';
|
|
var pngEnd = 'AAAACklEQVQI12NgAAAAAgAB4iG8MwAAAABJRU5ErkJggg==';
|
|
|
|
var magenta = new Image();
|
|
magenta.src = pngHead + 'AP804Oa6' + pngEnd;
|
|
|
|
var yellow = new Image();
|
|
yellow.src = pngHead + '/wCKxvRF' + pngEnd;
|
|
|
|
context.clearRect(0, 0, 6, 1);
|
|
|
|
context.globalCompositeOperation = 'multiply';
|
|
context.drawImage(magenta, 0, 0);
|
|
context.drawImage(yellow, 2, 0);
|
|
|
|
if (context.getImageData(2, 0, 1, 1))
|
|
{
|
|
var data = context.getImageData(2, 0, 1, 1).data;
|
|
|
|
device.canUseMultiply = (data[0] === 255 && data[1] === 0 && data[2] === 0);
|
|
}
|
|
|
|
Phaser.CanvasPool.removeByCanvas(canvas);
|
|
|
|
}
|
|
|
|
/**
|
|
* Check HTML5 features of the host environment.
|
|
*/
|
|
function _checkFeatures () {
|
|
|
|
device.canvas = !!window['CanvasRenderingContext2D'] || device.cocoonJS;
|
|
|
|
try {
|
|
device.localStorage = !!localStorage.getItem;
|
|
} catch (error) {
|
|
device.localStorage = false;
|
|
}
|
|
|
|
device.file = !!window['File'] && !!window['FileReader'] && !!window['FileList'] && !!window['Blob'];
|
|
device.fileSystem = !!window['requestFileSystem'];
|
|
|
|
device.webGL = ( function () { try { var canvas = document.createElement( 'canvas' ); /*Force screencanvas to false*/ canvas.screencanvas = false; return !! window.WebGLRenderingContext && ( canvas.getContext( 'webgl' ) || canvas.getContext( 'experimental-webgl' ) ); } catch( e ) { return false; } } )();
|
|
device.webGL = !!device.webGL;
|
|
|
|
device.worker = !!window['Worker'];
|
|
|
|
device.pointerLock = 'pointerLockElement' in document || 'mozPointerLockElement' in document || 'webkitPointerLockElement' in document;
|
|
|
|
device.quirksMode = (document.compatMode === 'CSS1Compat') ? false : true;
|
|
|
|
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia || navigator.oGetUserMedia;
|
|
|
|
window.URL = window.URL || window.webkitURL || window.mozURL || window.msURL;
|
|
|
|
device.getUserMedia = device.getUserMedia && !!navigator.getUserMedia && !!window.URL;
|
|
|
|
// Older versions of firefox (< 21) apparently claim support but user media does not actually work
|
|
if (device.firefox && device.firefoxVersion < 21)
|
|
{
|
|
device.getUserMedia = false;
|
|
}
|
|
|
|
// TODO: replace canvasBitBltShift detection with actual feature check
|
|
|
|
// Excludes iOS versions as they generally wrap UIWebView (eg. Safari WebKit) and it
|
|
// is safer to not try and use the fast copy-over method.
|
|
if (!device.iOS && (device.ie || device.firefox || device.chrome))
|
|
{
|
|
device.canvasBitBltShift = true;
|
|
}
|
|
|
|
// Known not to work
|
|
if (device.safari || device.mobileSafari)
|
|
{
|
|
device.canvasBitBltShift = false;
|
|
}
|
|
|
|
}
|
|
|
|
/**
|
|
* Checks/configures various input.
|
|
*/
|
|
function _checkInput () {
|
|
|
|
if ('ontouchstart' in document.documentElement || (window.navigator.maxTouchPoints && window.navigator.maxTouchPoints >= 1))
|
|
{
|
|
device.touch = true;
|
|
}
|
|
|
|
if (window.PointerEvent || window.MSPointerEvent || window.navigator.msPointerEnabled || window.navigator.pointerEnabled)
|
|
{
|
|
device.mspointer = true;
|
|
}
|
|
|
|
if (!device.cocoonJS)
|
|
{
|
|
// See https://developer.mozilla.org/en-US/docs/Web/Events/wheel
|
|
if ('onwheel' in window || (device.ie && 'WheelEvent' in window))
|
|
{
|
|
// DOM3 Wheel Event: FF 17+, IE 9+, Chrome 31+, Safari 7+
|
|
device.wheelEvent = 'wheel';
|
|
}
|
|
else if ('onmousewheel' in window)
|
|
{
|
|
// Non-FF legacy: IE 6-9, Chrome 1-31, Safari 5-7.
|
|
device.wheelEvent = 'mousewheel';
|
|
}
|
|
else if (device.firefox && 'MouseScrollEvent' in window)
|
|
{
|
|
// FF prior to 17. This should probably be scrubbed.
|
|
device.wheelEvent = 'DOMMouseScroll';
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
/**
|
|
* Checks for support of the Full Screen API.
|
|
*/
|
|
function _checkFullScreenSupport () {
|
|
|
|
var fs = [
|
|
'requestFullscreen',
|
|
'requestFullScreen',
|
|
'webkitRequestFullscreen',
|
|
'webkitRequestFullScreen',
|
|
'msRequestFullscreen',
|
|
'msRequestFullScreen',
|
|
'mozRequestFullScreen',
|
|
'mozRequestFullscreen'
|
|
];
|
|
|
|
var element = document.createElement('div');
|
|
|
|
for (var i = 0; i < fs.length; i++)
|
|
{
|
|
if (element[fs[i]])
|
|
{
|
|
device.fullscreen = true;
|
|
device.requestFullscreen = fs[i];
|
|
break;
|
|
}
|
|
}
|
|
|
|
var cfs = [
|
|
'cancelFullScreen',
|
|
'exitFullscreen',
|
|
'webkitCancelFullScreen',
|
|
'webkitExitFullscreen',
|
|
'msCancelFullScreen',
|
|
'msExitFullscreen',
|
|
'mozCancelFullScreen',
|
|
'mozExitFullscreen'
|
|
];
|
|
|
|
if (device.fullscreen)
|
|
{
|
|
for (var i = 0; i < cfs.length; i++)
|
|
{
|
|
if (document[cfs[i]])
|
|
{
|
|
device.cancelFullscreen = cfs[i];
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Keyboard Input?
|
|
if (window['Element'] && Element['ALLOW_KEYBOARD_INPUT'])
|
|
{
|
|
device.fullscreenKeyboard = true;
|
|
}
|
|
|
|
}
|
|
|
|
/**
|
|
* Check what browser is game running in.
|
|
*/
|
|
function _checkBrowser () {
|
|
|
|
var ua = navigator.userAgent;
|
|
|
|
if (/Edge\/\d+/.test(ua))
|
|
{
|
|
device.edge = true;
|
|
}
|
|
else if (/Chrome\/(\d+)/.test(ua) && !device.windowsPhone)
|
|
{
|
|
device.chrome = true;
|
|
device.chromeVersion = parseInt(RegExp.$1, 10);
|
|
}
|
|
else if (/Firefox\D+(\d+)/.test(ua))
|
|
{
|
|
device.firefox = true;
|
|
device.firefoxVersion = parseInt(RegExp.$1, 10);
|
|
}
|
|
else if (/AppleWebKit/.test(ua) && device.iOS)
|
|
{
|
|
device.mobileSafari = true;
|
|
}
|
|
else if (/MSIE (\d+\.\d+);/.test(ua))
|
|
{
|
|
device.ie = true;
|
|
device.ieVersion = parseInt(RegExp.$1, 10);
|
|
}
|
|
else if (/Opera/.test(ua))
|
|
{
|
|
device.opera = true;
|
|
}
|
|
else if (/Safari\/(\d+)/.test(ua) && !device.windowsPhone)
|
|
{
|
|
device.safari = true;
|
|
|
|
if (/Version\/(\d+)\./.test(ua))
|
|
{
|
|
device.safariVersion = parseInt(RegExp.$1, 10);
|
|
}
|
|
}
|
|
else if (/Trident\/(\d+\.\d+)(.*)rv:(\d+\.\d+)/.test(ua))
|
|
{
|
|
device.ie = true;
|
|
device.trident = true;
|
|
device.tridentVersion = parseInt(RegExp.$1, 10);
|
|
device.ieVersion = parseInt(RegExp.$3, 10);
|
|
}
|
|
|
|
// Silk gets its own if clause because its ua also contains 'Safari'
|
|
if (/Silk/.test(ua))
|
|
{
|
|
device.silk = true;
|
|
}
|
|
|
|
// WebApp mode in iOS
|
|
if (navigator['standalone'])
|
|
{
|
|
device.webApp = true;
|
|
}
|
|
|
|
if (typeof window.cordova !== 'undefined')
|
|
{
|
|
device.cordova = true;
|
|
}
|
|
|
|
if (typeof process !== 'undefined' && typeof require !== 'undefined')
|
|
{
|
|
device.node = true;
|
|
}
|
|
|
|
if (device.node && typeof process.versions === 'object')
|
|
{
|
|
device.nodeWebkit = !!process.versions['node-webkit'];
|
|
|
|
device.electron = !!process.versions.electron;
|
|
}
|
|
|
|
if (navigator['isCocoonJS'])
|
|
{
|
|
device.cocoonJS = true;
|
|
}
|
|
|
|
if (device.cocoonJS)
|
|
{
|
|
try {
|
|
device.cocoonJSApp = (typeof CocoonJS !== 'undefined');
|
|
}
|
|
catch(error)
|
|
{
|
|
device.cocoonJSApp = false;
|
|
}
|
|
}
|
|
|
|
if (typeof window.ejecta !== 'undefined')
|
|
{
|
|
device.ejecta = true;
|
|
}
|
|
|
|
if (/Crosswalk/.test(ua))
|
|
{
|
|
device.crosswalk = true;
|
|
}
|
|
|
|
}
|
|
|
|
/**
|
|
* Check video support.
|
|
*/
|
|
function _checkVideo () {
|
|
|
|
var videoElement = document.createElement("video");
|
|
var result = false;
|
|
|
|
try {
|
|
if (result = !!videoElement.canPlayType)
|
|
{
|
|
if (videoElement.canPlayType('video/ogg; codecs="theora"').replace(/^no$/, ''))
|
|
{
|
|
device.oggVideo = true;
|
|
}
|
|
|
|
if (videoElement.canPlayType('video/mp4; codecs="avc1.42E01E"').replace(/^no$/, ''))
|
|
{
|
|
// Without QuickTime, this value will be `undefined`. github.com/Modernizr/Modernizr/issues/546
|
|
device.h264Video = true;
|
|
device.mp4Video = true;
|
|
}
|
|
|
|
if (videoElement.canPlayType('video/webm; codecs="vp8, vorbis"').replace(/^no$/, ''))
|
|
{
|
|
device.webmVideo = true;
|
|
}
|
|
|
|
if (videoElement.canPlayType('video/webm; codecs="vp9"').replace(/^no$/, ''))
|
|
{
|
|
device.vp9Video = true;
|
|
}
|
|
|
|
if (videoElement.canPlayType('application/x-mpegURL; codecs="avc1.42E01E"').replace(/^no$/, ''))
|
|
{
|
|
device.hlsVideo = true;
|
|
}
|
|
}
|
|
} catch (e) {}
|
|
}
|
|
|
|
/**
|
|
* Check audio support.
|
|
*/
|
|
function _checkAudio () {
|
|
|
|
device.audioData = !!(window['Audio']);
|
|
device.webAudio = !!(window['AudioContext'] || window['webkitAudioContext']);
|
|
var audioElement = document.createElement('audio');
|
|
var result = false;
|
|
|
|
try {
|
|
if (result = !!audioElement.canPlayType)
|
|
{
|
|
if (audioElement.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/, ''))
|
|
{
|
|
device.ogg = true;
|
|
}
|
|
|
|
if (audioElement.canPlayType('audio/ogg; codecs="opus"').replace(/^no$/, '') || audioElement.canPlayType('audio/opus;').replace(/^no$/, ''))
|
|
{
|
|
device.opus = true;
|
|
}
|
|
|
|
if (audioElement.canPlayType('audio/mpeg;').replace(/^no$/, ''))
|
|
{
|
|
device.mp3 = true;
|
|
}
|
|
|
|
// Mimetypes accepted:
|
|
// developer.mozilla.org/En/Media_formats_supported_by_the_audio_and_video_elements
|
|
// bit.ly/iphoneoscodecs
|
|
if (audioElement.canPlayType('audio/wav; codecs="1"').replace(/^no$/, ''))
|
|
{
|
|
device.wav = true;
|
|
}
|
|
|
|
if (audioElement.canPlayType('audio/x-m4a;') || audioElement.canPlayType('audio/aac;').replace(/^no$/, ''))
|
|
{
|
|
device.m4a = true;
|
|
}
|
|
|
|
if (audioElement.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/, ''))
|
|
{
|
|
device.webm = true;
|
|
}
|
|
|
|
if (audioElement.canPlayType('audio/mp4;codecs="ec-3"') !== '')
|
|
{
|
|
if (device.edge)
|
|
{
|
|
device.dolby = true;
|
|
}
|
|
else if (device.safari && device.safariVersion >= 9)
|
|
{
|
|
if (/Mac OS X (\d+)_(\d+)/.test(navigator.userAgent))
|
|
{
|
|
var major = parseInt(RegExp.$1, 10);
|
|
var minor = parseInt(RegExp.$2, 10);
|
|
|
|
if ((major === 10 && minor >= 11) || major > 10)
|
|
{
|
|
device.dolby = true;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
} catch (e) {
|
|
}
|
|
|
|
}
|
|
|
|
/**
|
|
* Check Little or Big Endian system.
|
|
*
|
|
* @author Matt DesLauriers (@mattdesl)
|
|
*/
|
|
function _checkIsLittleEndian () {
|
|
|
|
var a = new ArrayBuffer(4);
|
|
var b = new Uint8Array(a);
|
|
var c = new Uint32Array(a);
|
|
|
|
b[0] = 0xa1;
|
|
b[1] = 0xb2;
|
|
b[2] = 0xc3;
|
|
b[3] = 0xd4;
|
|
|
|
if (c[0] === 0xd4c3b2a1)
|
|
{
|
|
return true;
|
|
}
|
|
|
|
if (c[0] === 0xa1b2c3d4)
|
|
{
|
|
return false;
|
|
}
|
|
else
|
|
{
|
|
// Could not determine endianness
|
|
return null;
|
|
}
|
|
|
|
}
|
|
|
|
/**
|
|
* Test to see if ImageData uses CanvasPixelArray or Uint8ClampedArray.
|
|
*
|
|
* @author Matt DesLauriers (@mattdesl)
|
|
*/
|
|
function _checkIsUint8ClampedImageData () {
|
|
|
|
if (Uint8ClampedArray === undefined)
|
|
{
|
|
return false;
|
|
}
|
|
|
|
var elem = Phaser.CanvasPool.create(this, 1, 1);
|
|
var ctx = elem.getContext('2d');
|
|
|
|
if (!ctx)
|
|
{
|
|
return false;
|
|
}
|
|
|
|
var image = ctx.createImageData(1, 1);
|
|
|
|
Phaser.CanvasPool.remove(this);
|
|
|
|
return image.data instanceof Uint8ClampedArray;
|
|
|
|
}
|
|
|
|
/**
|
|
* Check PixelRatio, iOS device, Vibration API, ArrayBuffers and endianess.
|
|
*/
|
|
function _checkDevice () {
|
|
|
|
device.pixelRatio = window['devicePixelRatio'] || 1;
|
|
device.iPhone = navigator.userAgent.toLowerCase().indexOf('iphone') !== -1;
|
|
device.iPhone4 = (device.pixelRatio === 2 && device.iPhone);
|
|
device.iPad = navigator.userAgent.toLowerCase().indexOf('ipad') !== -1;
|
|
|
|
if (typeof Int8Array !== 'undefined')
|
|
{
|
|
device.typedArray = true;
|
|
}
|
|
else
|
|
{
|
|
device.typedArray = false;
|
|
}
|
|
|
|
if (typeof ArrayBuffer !== 'undefined' && typeof Uint8Array !== 'undefined' && typeof Uint32Array !== 'undefined')
|
|
{
|
|
device.LITTLE_ENDIAN = _checkIsLittleEndian();
|
|
}
|
|
|
|
device.support32bit = (typeof ArrayBuffer !== 'undefined' && typeof Uint8ClampedArray !== 'undefined' && typeof Int32Array !== 'undefined' && device.LITTLE_ENDIAN !== null && _checkIsUint8ClampedImageData());
|
|
|
|
navigator.vibrate = navigator.vibrate || navigator.webkitVibrate || navigator.mozVibrate || navigator.msVibrate;
|
|
|
|
if (navigator.vibrate)
|
|
{
|
|
device.vibration = true;
|
|
}
|
|
|
|
}
|
|
|
|
// Run the checks
|
|
_checkOS();
|
|
_checkBrowser();
|
|
_checkAudio();
|
|
_checkVideo();
|
|
_checkDevice();
|
|
_checkFeatures();
|
|
_checkCanvasFeatures();
|
|
_checkFullScreenSupport();
|
|
_checkInput();
|
|
|
|
};
|
|
|
|
/**
|
|
* Check whether the host environment can play audio.
|
|
*
|
|
* @method canPlayAudio
|
|
* @memberof Phaser.Device.prototype
|
|
* @param {string} type - One of 'mp3, 'ogg', 'm4a', 'wav', 'webm' or 'opus'.
|
|
* @return {boolean} True if the given file type is supported by the browser, otherwise false.
|
|
*/
|
|
Phaser.Device.canPlayAudio = function (type) {
|
|
|
|
if (type === 'mp3' && this.mp3)
|
|
{
|
|
return true;
|
|
}
|
|
else if (type === 'ogg' && (this.ogg || this.opus))
|
|
{
|
|
return true;
|
|
}
|
|
else if (type === 'm4a' && this.m4a)
|
|
{
|
|
return true;
|
|
}
|
|
else if (type === 'opus' && this.opus)
|
|
{
|
|
return true;
|
|
}
|
|
else if (type === 'wav' && this.wav)
|
|
{
|
|
return true;
|
|
}
|
|
else if (type === 'webm' && this.webm)
|
|
{
|
|
return true;
|
|
}
|
|
else if (type === 'mp4' && this.dolby)
|
|
{
|
|
return true;
|
|
}
|
|
|
|
return false;
|
|
|
|
};
|
|
|
|
/**
|
|
* Check whether the host environment can play video files.
|
|
*
|
|
* @method canPlayVideo
|
|
* @memberof Phaser.Device.prototype
|
|
* @param {string} type - One of 'mp4, 'ogg', 'webm' or 'mpeg'.
|
|
* @return {boolean} True if the given file type is supported by the browser, otherwise false.
|
|
*/
|
|
Phaser.Device.canPlayVideo = function (type) {
|
|
|
|
if (type === 'webm' && (this.webmVideo || this.vp9Video))
|
|
{
|
|
return true;
|
|
}
|
|
else if (type === 'mp4' && (this.mp4Video || this.h264Video))
|
|
{
|
|
return true;
|
|
}
|
|
else if ((type === 'ogg' || type === 'ogv') && this.oggVideo)
|
|
{
|
|
return true;
|
|
}
|
|
else if (type === 'mpeg' && this.hlsVideo)
|
|
{
|
|
return true;
|
|
}
|
|
|
|
return false;
|
|
|
|
};
|
|
|
|
/**
|
|
* Detect if the host is a an Android Stock browser.
|
|
* This is available before the device "ready" event.
|
|
*
|
|
* Authors might want to scale down on effects and switch to the CANVAS rendering method on those devices.
|
|
*
|
|
* @example
|
|
* var defaultRenderingMode = Phaser.Device.isAndroidStockBrowser() ? Phaser.CANVAS : Phaser.AUTO;
|
|
*
|
|
* @method isAndroidStockBrowser
|
|
* @memberof Phaser.Device.prototype
|
|
*/
|
|
Phaser.Device.isAndroidStockBrowser = function () {
|
|
|
|
var matches = window.navigator.userAgent.match(/Android.*AppleWebKit\/([\d.]+)/);
|
|
|
|
return matches && matches[1] < 537;
|
|
|
|
};
|