wassname/phaser
1
0
Fork 0
mirror of https://github.com/wassname/phaser.git synced 2026-06-27 16:10:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

Phaser.Game constructor can now be passed a single object containing game settings + Stage settings, useful for advanced configurations.

Browse Source
This commit is contained in:
photonstorm
2013-12-24 03:18:55 +00:00
parent 0acef49a7c
commit 167a498a5e
7 changed files with 254 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+3
View File
@@ -53,6 +53,8 @@ Significant API changes:
New features:
* Phaser.Game constructor can now be passed a single object containing game settings + Stage settings, useful for advanced configurations.
* The width/height given to Phaser.Game can now be percentages, i.e. "100%" will set the width to the maximum window innerWidth.
* Added a stage.fullScreenScaleMode property to determine scaling when fullscreen (thanks oysterCrusher)
* Added support for margin and spacing around a frame in Loader.spritesheet.
* Added Device.vibration to check if the Vibration API is available or not.
@@ -63,6 +65,7 @@ New features:
* You can now load any binary file via the Loader: game.load.binary(key, url, callback) - the optional callback allows for post-load processing before entering the Cache.
* Group.set will let you deep set a new propery on a single child of the Group.
* Stage.display property added. A direct reference to the root Pixi Stage object (very useful for RenderTexture manipulation)
* Added Ejecta detection to Device (thanks endel)
New Examples:
examples/wip/rendertexture1.js
+17 -6
View File
@@ -1,5 +1,16 @@
var game = new Phaser.Game(800, 600, Phaser.WEBGL, 'phaser-example', { preload: preload, create: create, update: update });
var config = {
width: "100%",
height: "100%",
renderer: Phaser.WEBGL,
parent: 'phaser-example',
state: { preload: preload, create: create, update: update },
backgroundColor: '#ff0000'
};
var game = new Phaser.Game(config);
function preload() {
@@ -24,20 +35,20 @@ var count = 0;
function create() {
// create two render textures.. these dynamic textures will be used to draw the scene into itself
renderTexture = game.add.renderTexture('texture1', 800, 600);
renderTexture2 = game.add.renderTexture('textur2e', 800, 600);
renderTexture = game.add.renderTexture('texture1', game.width, game.height);
renderTexture2 = game.add.renderTexture('textur2e', game.width, game.height);
currentTexture = renderTexture;
// create a new sprite that uses the render texture we created above
outputSprite = game.add.sprite(400, 300, currentTexture);
outputSprite = game.add.sprite(game.width/2, game.height/2, currentTexture);
// align the sprite
outputSprite.anchor.x = 0.5;
outputSprite.anchor.y = 0.5;
stuffContainer = game.add.group();
stuffContainer.x = 800/2;
stuffContainer.y = 600/2
stuffContainer.x = game.width/2;
stuffContainer.y = game.height/2;
// now create some items and randomly position them in the stuff container
for (var i = 0; i < 20; i++)
src/core/Game.js
+157 -22
View File
@@ -24,55 +24,61 @@
*/
Phaser.Game = function (width, height, renderer, parent, state, transparent, antialias) {
width = width || 800;
height = height || 600;
renderer = renderer || Phaser.AUTO;
parent = parent || '';
state = state || null;
if (typeof transparent === 'undefined') { transparent = false; }
if (typeof antialias === 'undefined') { antialias = true; }
/**
* @property {number} id - Phaser Game ID (for when Pixi supports multiple instances).
*/
this.id = Phaser.GAMES.push(this) - 1;
/**
* @property {HTMLElement} parent - The Games DOM parent.
* @property {object} config - The Phaser.Game configuration object.
*/
this.parent = parent;
this.config = null;
/**
* @property {HTMLElement} parent - The Games DOM parent.
* @default
*/
this.parent = '';
/**
* @property {number} width - The Game width (in pixels).
* @default
*/
this.width = width;
this.width = 800;
/**
* @property {number} height - The Game height (in pixels).
* @default
*/
this.height = height;
this.height = 600;
/**
* @property {boolean} transparent - Use a transparent canvas background or not.
* @default
*/
this.transparent = transparent;
this.transparent = false;
/**
* @property {boolean} antialias - Anti-alias graphics (in WebGL this helps with edges, in Canvas2D it retains pixel-art quality).
* @default
*/
this.antialias = antialias;
this.antialias = true;
/**
* @property {number} renderer - The Pixi Renderer
* @default
*/
this.renderer = null;
this.renderer = Phaser.AUTO;
/**
* @property {number} renderType - The Renderer this Phaser.Game will use. Either Phaser.RENDERER_AUTO, Phaser.RENDERER_CANVAS or Phaser.RENDERER_WEBGL.
*/
this.renderType = Phaser.AUTO;
/**
* @property {number} state - The StateManager.
*/
this.state = new Phaser.StateManager(this, state);
this.state = null;
/**
* @property {boolean} _paused - Is game paused?
@@ -81,11 +87,6 @@ Phaser.Game = function (width, height, renderer, parent, state, transparent, ant
*/
this._paused = false;
/**
* @property {number} renderType - The Renderer this Phaser.Game will use. Either Phaser.RENDERER_AUTO, Phaser.RENDERER_CANVAS or Phaser.RENDERER_WEBGL.
*/
this.renderType = renderer;
/**
* @property {boolean} _loadComplete - Whether load complete loading or not.
* @private
@@ -225,6 +226,47 @@ Phaser.Game = function (width, height, renderer, parent, state, transparent, ant
*/
this.particles = null;
// Parse the configuration object (if any)
if (arguments.length === 1 && typeof arguments[0] === 'object')
{
this.parseConfig(arguments[0]);
}
else
{
if (typeof width !== 'undefined')
{
this.width = width;
}
if (typeof height !== 'undefined')
{
this.height = height;
}
if (typeof renderer !== 'undefined')
{
this.renderer = renderer;
this.renderType = renderer;
}
if (typeof parent !== 'undefined')
{
this.parent = parent;
}
if (typeof transparent !== 'undefined')
{
this.transparent = transparent;
}
if (typeof antialias !== 'undefined')
{
this.antialias = antialias;
}
this.state = new Phaser.StateManager(this, state);
}
var _this = this;
this._onBoot = function () {
@@ -247,6 +289,99 @@ Phaser.Game = function (width, height, renderer, parent, state, transparent, ant
Phaser.Game.prototype = {
/**
* Parses a Game configuration object.
*
* @method Phaser.Game#parseConfig
* @protected
*/
parseConfig: function (config) {
this.config = config;
if (config['width'])
{
this.width = this.parseDimension(config['width'], 0);
}
if (config['height'])
{
this.height = this.parseDimension(config['height'], 1);
}
if (config['renderer'])
{
this.renderer = config['renderer'];
this.renderType = config['renderer'];
}
if (config['parent'])
{
this.parent = config['parent'];
}
if (config['transparent'])
{
this.transparent = config['transparent'];
}
if (config['antialias'])
{
this.antialias = config['antialias'];
}
var state = null;
if (config['state'])
{
state = config['state'];
}
this.state = new Phaser.StateManager(this, state);
},
/**
* Get dimension.
*
* @method Phaser.Game#parseDimension
* @protected
*/
parseDimension: function (size, dimension) {
var f = 0;
var px = 0;
if (typeof size === 'string')
{
// %?
if (size.substr(-1) === '%')
{
f = parseInt(size, 10) / 100;
if (dimension === 0)
{
px = window.innerWidth * f;
}
else
{
px = window.innerHeight * f;
}
}
else
{
px = parseInt(size, 10);
}
}
else
{
px = size;
}
return px;
},
/**
* Initialize engine sub modules and start the game.
*
src/core/Stage.js
+65 -4
View File
@@ -24,7 +24,6 @@ Phaser.Stage = function (game, width, height) {
/**
* @property {string} game - Background color of the stage (defaults to black). Set via the public backgroundColor property.
* @private
* @default 'rgb(0,0,0)'
*/
this._backgroundColor = 'rgb(0,0,0)';
@@ -34,10 +33,9 @@ Phaser.Stage = function (game, width, height) {
this.offset = new Phaser.Point();
/**
* @property {HTMLCanvasElement} canvas - Reference to the newly created &lt;canvas&gt; element.
* @property {HTMLCanvasElement} canvas - Reference to the newly created `canvas` element.
*/
this.canvas = Phaser.Canvas.create(width, height);
this.canvas.style['-webkit-full-screen'] = 'width: 100%; height: 100%';
this.canvas = null;
/**
* @property {PIXI.Stage} _stage - The Pixi Stage which is hooked to the renderer.
@@ -90,10 +88,73 @@ Phaser.Stage = function (game, width, height) {
*/
this.checkOffsetInterval = 2500;
if (game.config)
{
this.parseConfig(game.config);
}
else
{
this.canvas = Phaser.Canvas.create(width, height);
this.canvas.style['-webkit-full-screen'] = 'width: 100%; height: 100%';
}
};
Phaser.Stage.prototype = {
/**
* Parses a Game configuration object.
*
* @method Phaser.Stage#parseConfig
* @protected
*/
parseConfig: function (config) {
if (config['canvasID'])
{
this.canvas = Phaser.Canvas.create(this.game.width, this.game.height, config['canvasID']);
}
else
{
this.canvas = Phaser.Canvas.create(this.game.width, this.game.height);
}
if (config['canvasStyle'])
{
this.canvas.stlye = config['canvasStyle'];
}
else
{
this.canvas.style['-webkit-full-screen'] = 'width: 100%; height: 100%';
}
if (config['checkOffsetInterval'])
{
this.checkOffsetInterval = config['checkOffsetInterval'];
}
if (config['disableVisibilityChange'])
{
this.disableVisibilityChange = config['disableVisibilityChange'];
}
if (config['fullScreenScaleMode'])
{
this.fullScreenScaleMode = config['fullScreenScaleMode'];
}
if (config['scaleMode'])
{
this.scaleMode = config['scaleMode'];
}
if (config['backgroundColor'])
{
this.backgroundColor = config['backgroundColor'];
}
},
/**
* Initialises the stage and adds the event listeners.
* @method Phaser.Stage#boot
src/core/StateManager.js
+1 -1
View File
@@ -32,7 +32,7 @@ Phaser.StateManager = function (game, pendingState) {
*/
this._pendingState = null;
if (pendingState !== null)
if (typeof pendingState !== 'undefined' && pendingState !== null)
{
this._pendingState = pendingState;
}
src/loader/Loader.js
-35
View File
@@ -411,35 +411,6 @@ Phaser.Loader.prototype = {
},
/**
* Add a new tile set to the loader. These are used in the rendering of tile maps.
*
* @method Phaser.Loader#tileset
* @param {string} key - Unique asset key of the tileset file.
* @param {string} url - URL of the tileset.
* @param {number} tileWidth - Width of each single tile in pixels.
* @param {number} tileHeight - Height of each single tile in pixels.
* @param {number} [tileMargin=0] - If the tiles have been drawn with a margin, specify the amount here.
* @param {number} [tileSpacing=0] - If the tiles have been drawn with spacing between them, specify the amount here.
* @param {number} [rows=-1] - How many tiles are placed horizontally in each row? If -1 it will calculate rows by dividing the image width by tileWidth.
* @param {number} [columns=-1] - How many tiles are placed vertically in each column? If -1 it will calculate columns by dividing the image height by tileHeight.
* @param {number} [total=-1] - The maximum number of tiles to extract from the image. If -1 it will extract `rows * columns` worth. You can also set a value lower than the actual number of tiles.
* @return {Phaser.Loader} This Loader instance.
*/
tileset: function (key, url, tileWidth, tileHeight, tileMargin, tileSpacing, rows, columns, total) {
if (typeof tileMargin === "undefined") { tileMargin = 0; }
if (typeof tileSpacing === "undefined") { tileSpacing = 0; }
if (typeof rows === "undefined") { rows = -1; }
if (typeof columns === "undefined") { columns = -1; }
if (typeof total === "undefined") { total = -1; }
this.addToFileList('tileset', key, url, { tileWidth: tileWidth, tileHeight: tileHeight, tileMargin: tileMargin, tileSpacing: tileSpacing, rows: rows, columns: columns, total: total });
return this;
},
/**
* Add a new audio file to the loader.
*
@@ -786,7 +757,6 @@ Phaser.Loader.prototype = {
case 'spritesheet':
case 'textureatlas':
case 'bitmapfont':
case 'tileset':
file.data = new Image();
file.data.name = file.key;
file.data.onload = function () {
@@ -983,11 +953,6 @@ Phaser.Loader.prototype = {
this.game.cache.addSpriteSheet(file.key, file.url, file.data, file.frameWidth, file.frameHeight, file.frameMax, file.margin, file.spacing);
break;
case 'tileset':
this.game.cache.addTileset(file.key, file.url, file.data, file.tileWidth, file.tileHeight, file.tileMargin, file.tileSpacing, file.rows, file.columns, file.total);
break;
case 'textureatlas':
if (file.atlasURL == null)
src/system/Device.js
+11
View File
@@ -40,6 +40,12 @@ Phaser.Device = function () {
*/
this.cocoonJS = false;
/**
* @property {boolean} ejecta - Is the game running under Ejecta?
* @default
*/
this.ejecta = false;
/**
* @property {boolean} android - Is running on android?
* @default
@@ -478,6 +484,11 @@ Phaser.Device.prototype = {
this.cocoonJS = true;
}
if (typeof window.ejecta !== "undefined")
{
this.ejecta = true;
}
},
/**