Converted the Device and CanvasPool into page level singletons, that can be shared by all instances of a Phaser Game running in the same page.

This commit is contained in:
Richard Davey 2016-11-26 01:28:53 +00:00
parent 3009a42df4
commit e45096611e
11 changed files with 114 additions and 87 deletions

View file

@ -12,6 +12,7 @@ var DebugHeader = require('./DebugHeader');
var RequestAnimationFrame = require('../dom/RequestAnimationFrame');
var DOMContentLoaded = require('../dom/DOMContentLoaded');
var RandomDataGenerator = require('../math/random-data-generator/RandomDataGenerator');
var CanvasPool = require('../dom/CanvasPool');
var Game = function (config)
{
@ -86,6 +87,9 @@ Game.prototype = {
console.log(CHECKSUM.build);
console.log('pool', CanvasPool.getTotal());
console.log('free', CanvasPool.getFree());
// Add in ability to specify pre-init and post-init callbacks in the config
this.raf.start();

View file

@ -1,4 +1,4 @@
var CHECKSUM = {
build: '7c3f6cb0-b2cd-11e6-b14c-d53f539998e7'
build: '0a915bb0-b376-11e6-8e00-5b1f6d1d763b'
};
module.exports = CHECKSUM;

View file

@ -1,3 +1,6 @@
var OS = require('./OS');
var Browser = require('./Browser');
var Audio = {
/**
@ -57,7 +60,7 @@ var Audio = {
};
function init (OS, Browser)
function init ()
{
Audio.audioData = !!(window['Audio']);
Audio.webAudio = !!(window['AudioContext'] || window['webkitAudioContext']);
@ -133,4 +136,4 @@ function init (OS, Browser)
return Audio;
}
module.exports = init;
module.exports = init();

View file

@ -1,3 +1,5 @@
var OS = require('./OS');
var Browser = {
/**
@ -104,7 +106,7 @@ var Browser = {
};
function init (OS)
function init ()
{
var ua = navigator.userAgent;
@ -168,4 +170,4 @@ function init (OS)
return Browser;
}
module.exports = init;
module.exports = init();

View file

@ -1,3 +1,7 @@
var OS = require('./OS');
var Browser = require('./Browser');
var CanvasPool = require('../dom/CanvasPool');
var Features = {
/**
@ -106,8 +110,10 @@ function checkIsLittleEndian ()
}
}
function init (OS, Browser)
function init ()
{
console.log('Features.init');
Features.canvas = !!window['CanvasRenderingContext2D'] || OS.cocoonJS;
try
@ -130,7 +136,7 @@ function init (OS, Browser)
{
try
{
var canvas = document.createElement('canvas');
var canvas = CanvasPool.create(this, 1, 1);
// cocoon ...
canvas.screencanvas = false;
@ -146,6 +152,8 @@ function init (OS, Browser)
*/
isUint8 = image.data instanceof Uint8ClampedArray;
CanvasPool.removeByCanvas(canvas);
return (ctx !== null);
}
catch (e)
@ -211,4 +219,4 @@ function init (OS, Browser)
return Features;
}
module.exports = init;
module.exports = init();

View file

@ -1,3 +1,6 @@
var OS = require('./OS');
var Browser = require('./Browser');
var Fullscreen = {
/**
@ -86,4 +89,4 @@ function init ()
return Fullscreen;
}
module.exports = init;
module.exports = init();

View file

@ -1,3 +1,6 @@
var OS = require('./OS');
var Browser = require('./Browser');
var Input = {
/**
@ -21,7 +24,7 @@ var Input = {
};
function init (OS, Browser)
function init ()
{
if ('ontouchstart' in document.documentElement || (window.navigator.maxTouchPoints && window.navigator.maxTouchPoints >= 1))
{
@ -56,4 +59,4 @@ function init (OS, Browser)
return Input;
}
module.exports = init;
module.exports = init();

View file

@ -259,4 +259,4 @@ function init ()
return OS;
}
module.exports = init;
module.exports = init();

View file

@ -1,3 +1,6 @@
var OS = require('./OS');
var Browser = require('./Browser');
var Video = {
/**
@ -38,7 +41,7 @@ var Video = {
};
function init (OS, Browser)
function init ()
{
var videoElement = document.createElement('video');
var result = !!videoElement.canPlayType;
@ -83,4 +86,4 @@ function init (OS, Browser)
return Video;
}
module.exports = init;
module.exports = init();

View file

@ -1,3 +1,8 @@
// This singleton is instantiated as soon as Phaser loads,
// before a Phaser.Game instance has even been created.
// Which means all instances of Phaser Games can share it,
// without having to re-poll the device all over again
var OS = require('./OS');
var Browser = require('./Browser');
var Features = require('./Features');
@ -6,18 +11,14 @@ var Audio = require('./Audio');
var Video = require('./Video');
var Fullscreen = require('./Fullscreen');
var os = OS();
var browser = Browser(os);
module.exports = {
// Doing this makes it available under Device.OS
OS: os,
Browser: browser,
Features: Features(os, browser),
Input: Input(os, browser),
Audio: Audio(os, browser),
Video: Video(os, browser),
Fullscreen: Fullscreen()
OS: OS,
Browser: Browser,
Features: Features,
Input: Input,
Audio: Audio,
Video: Video,
Fullscreen: Fullscreen
};

View file

@ -4,27 +4,27 @@
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
/**
* The pool into which the canvas elements are placed.
*
* @property pool
* @type Array
*/
var pool = [];
// This singleton is instantiated as soon as Phaser loads,
// before a Phaser.Game instance has even been created.
// Which means all instances of Phaser Games on the same page
// can share the one single pool
/**
* The CanvasPool is a global static object, that allows Phaser to recycle and pool Canvas DOM elements.
*
* @class Phaser.CanvasPool
* @static
*/
function CanvasPool ()
var CanvasPool = function ()
{
/**
* The pool into which the canvas elements are placed.
*
* @property pool
* @type Array
*/
this.pool = [];
}
CanvasPool.prototype.constructor = CanvasPool;
CanvasPool.prototype = {
/**
* Creates a new Canvas DOM element, or pulls one from the pool if free.
*
@ -35,11 +35,13 @@ CanvasPool.prototype = {
* @param {number} height - The height of the canvas element.
* @return {HTMLCanvasElement} The canvas element.
*/
create: function (parent, width, height)
var create = function (parent, width, height)
{
var idx = this.first();
var idx = first();
var canvas;
console.log('CanvasPool.create', idx);
if (idx === -1)
{
var container = {
@ -47,15 +49,15 @@ CanvasPool.prototype = {
canvas: document.createElement('canvas')
};
this.pool.push(container);
pool.push(container);
canvas = container.canvas;
}
else
{
this.pool[idx].parent = parent;
pool[idx].parent = parent;
canvas = this.pool[idx].canvas;
canvas = pool[idx].canvas;
}
if (width !== undefined)
@ -65,7 +67,7 @@ CanvasPool.prototype = {
}
return canvas;
},
};
/**
* Gets the first free canvas index from the pool.
@ -74,10 +76,8 @@ CanvasPool.prototype = {
* @method Phaser.CanvasPool.getFirst
* @return {number}
*/
first: function ()
var first = function ()
{
var pool = this.pool;
for (var i = 0; i < pool.length; i++)
{
if (!pool[i].parent)
@ -87,7 +87,7 @@ CanvasPool.prototype = {
}
return -1;
},
};
/**
* Looks up a canvas based on its parent, and if found puts it back in the pool, freeing it up for re-use.
@ -97,9 +97,10 @@ CanvasPool.prototype = {
* @method Phaser.CanvasPool.remove
* @param {any} parent - The parent of the canvas element.
*/
remove: function (parent)
var remove = function (parent)
{
var pool = this.pool;
// Check to see if the parent is a canvas object, then do removeByCanvas stuff instead
// CanvasRenderingContext2D
for (var i = 0; i < pool.length; i++)
{
@ -111,7 +112,7 @@ CanvasPool.prototype = {
}
}
},
};
/**
* Looks up a canvas based on its type, and if found puts it back in the pool, freeing it up for re-use.
@ -121,25 +122,23 @@ CanvasPool.prototype = {
* @method Phaser.CanvasPool.removeByCanvas
* @param {HTMLCanvasElement} canvas - The canvas element to remove.
*/
removeByCanvas: function (canvas)
var removeByCanvas = function (canvas)
{
var pool = this.pool;
console.log('removeByCanvas');
for (var i = 0; i < pool.length; i++)
{
if (pool[i].canvas === canvas)
{
console.log('found and removed');
pool[i].parent = null;
pool[i].canvas.width = 1;
pool[i].canvas.height = 1;
}
}
},
};
Object.defineProperties(CanvasPool.prototype, {
};
/**
* Gets the total number of used canvas elements in the pool.
@ -148,25 +147,20 @@ Object.defineProperties(CanvasPool.prototype, {
* @method Phaser.CanvasPool.getTotal
* @return {number} The number of in-use (parented) canvas elements in the pool.
*/
total:
var getTotal = function ()
{
enumerable: true,
var c = 0;
get: function ()
for (var i = 0; i < pool.length; i++)
{
var c = 0;
for (var i = 0; i < this.pool.length; i++)
if (pool[i].parent)
{
if (this.pool[i].parent)
{
c++;
}
c++;
}
return c;
}
},
return c;
};
/**
* Gets the total number of free canvas elements in the pool.
@ -175,26 +169,32 @@ Object.defineProperties(CanvasPool.prototype, {
* @method Phaser.CanvasPool.getFree
* @return {number} The number of free (un-parented) canvas elements in the pool.
*/
free:
var getFree = function ()
{
enumerable: true,
var c = 0;
get: function ()
for (var i = 0; i < pool.length; i++)
{
var c = 0;
for (var i = 0; i < this.pool.length; i++)
if (!pool[i].parent)
{
if (!this.pool[i].parent)
{
c++;
}
c++;
}
return c;
}
}
});
return c;
};
module.exports = CanvasPool;
return {
create: create,
first: first,
remove: remove,
removeByCanvas: removeByCanvas,
getTotal: getTotal,
getFree: getFree,
pool: pool
};
};
// If we export the called function here, it'll only be invoked once (not every time it's required).
// This function must return something though
module.exports = CanvasPool();