From c904475ae623897526c52512c9c70d2b134c3276 Mon Sep 17 00:00:00 2001 From: Richard Davey Date: Mon, 9 Sep 2013 12:35:09 +0100 Subject: [PATCH] Added in the game scaling handler and updated Stage --- examples/button1.php | 4 +++- examples/js.php | 1 + src/core/Game.js | 7 ++++--- src/core/LinkedList.js | 18 ++++++++++++++++++ src/core/Stage.js | 36 +++++++++++++++++++++++++++++++++--- src/core/World.js | 29 +++++++++++------------------ src/input/Input.js | 14 +------------- src/system/Canvas.js | 23 ++++++++++++++++++----- 8 files changed, 89 insertions(+), 43 deletions(-) diff --git a/examples/button1.php b/examples/button1.php index 1074da182..08d7b7d29 100644 --- a/examples/button1.php +++ b/examples/button1.php @@ -12,7 +12,7 @@ (function () { - var game = new Phaser.Game(800, 600, Phaser.CANVAS, '', { preload: preload, create: create, render: render }); + var game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create, render: render }); function preload() { @@ -26,6 +26,8 @@ function create() { + game.stage.backgroundColor = 0xefefef; + // This is just an image that we'll toggle the display of when you click the button image = game.add.sprite(game.world.centerX, 0, 'beast'); image.anchor.setTo(0.5, 0); diff --git a/examples/js.php b/examples/js.php index ba6533c0b..be0dd6464 100644 --- a/examples/js.php +++ b/examples/js.php @@ -65,6 +65,7 @@ + diff --git a/src/core/Game.js b/src/core/Game.js index 80692e57f..e37f42e4f 100644 --- a/src/core/Game.js +++ b/src/core/Game.js @@ -286,10 +286,11 @@ Phaser.Game.prototype = { this.math = Phaser.Math; this.rnd = new Phaser.RandomDataGenerator([(Date.now() * Math.random()).toString()]); + this.stage = new Phaser.Stage(this, this.width, this.height); + this.setUpRenderer(); this.world = new Phaser.World(this); - this.stage = new Phaser.Stage(this); this.add = new Phaser.GameObjectFactory(this); this.cache = new Phaser.Cache(this); this.load = new Phaser.Loader(this); @@ -334,7 +335,7 @@ Phaser.Game.prototype = { if (this.device.canvas) { this.renderType = Phaser.CANVAS; - this.renderer = new PIXI.CanvasRenderer(this.width, this.height, null, this.transparent); + this.renderer = new PIXI.CanvasRenderer(this.width, this.height, this.stage.canvas, this.transparent); Phaser.Canvas.setSmoothingEnabled(this.renderer.context, this.antialias); this.canvas = this.renderer.view; this.context = this.renderer.context; @@ -387,7 +388,7 @@ Phaser.Game.prototype = { this.state.update(); this.plugins.update(); - this.renderer.render(this.world._stage); + this.renderer.render(this.stage._stage); this.state.render(); this.plugins.postRender(); diff --git a/src/core/LinkedList.js b/src/core/LinkedList.js index 84e3d0a35..4a7577144 100644 --- a/src/core/LinkedList.js +++ b/src/core/LinkedList.js @@ -68,6 +68,24 @@ Phaser.LinkedList.prototype = { childPrev.next = child.next; + }, + + callAll: function (callback) { + + var entity = this.first; + + do + { + if (entity[callback]) + { + entity[callback].call(entity); + } + + entity = entity.next; + + } + while(entity != this.last.next) + }, dump: function () { diff --git a/src/core/Stage.js b/src/core/Stage.js index 372186ba8..d4a28a11c 100644 --- a/src/core/Stage.js +++ b/src/core/Stage.js @@ -9,18 +9,33 @@ * @copyright 2013 Photon Storm Ltd. * @license https://github.com/photonstorm/phaser/blob/master/license.txt MIT License */ -Phaser.Stage = function (game) { +Phaser.Stage = function (game, width, height) { this.game = game; - this.canvas = game.renderer.view; + + /** + * Background color of the stage (defaults to black). Set via the public backgroundColor property. + * @type {string} + */ + this._backgroundColor = 'rgb(0,0,0)'; // Get the offset values (for input and other things) this.offset = new Phaser.Point; + this.canvas = Phaser.Canvas.create(width, height); + + // The Pixi Stage which is hooked to the renderer + this._stage = new PIXI.Stage(0x000000, false); + this._stage.name = '_stage_root'; + Phaser.Canvas.getOffset(this.canvas, this.offset); this.bounds = new Phaser.Rectangle(this.offset.x, this.offset.y, this.game.width, this.game.height); + this.scaleMode = Phaser.StageScaleMode.NO_SCALE; + this.scale = new Phaser.StageScaleMode(this.game, width, height); + this.aspectRatio = width / height; + var _this = this; this._onChange = function (event) { @@ -68,4 +83,19 @@ Phaser.Stage.prototype = { }, -}; \ No newline at end of file +}; + +Object.defineProperty(Phaser.Stage.prototype, "backgroundColor", { + + get: function () { + return this._backgroundColor; + }, + + set: function (color) { + this._stage.setBackgroundColor(color); + this._backgroundColor = color; + }, + + enumerable: true, + configurable: true +}); diff --git a/src/core/World.js b/src/core/World.js index 5d29dcdf3..8bb583556 100644 --- a/src/core/World.js +++ b/src/core/World.js @@ -2,19 +2,12 @@ Phaser.World = function (game) { this.game = game; - this._stage = new PIXI.Stage(0x000000); - this._stage.name = '_stage_root'; - this.bounds = new Phaser.Rectangle(0, 0, game.width, game.height); }; Phaser.World.prototype = { - _stage: null, - _stage: null, - _length: 0, - bounds: null, camera: null, @@ -29,27 +22,27 @@ Phaser.World.prototype = { add: function (gameobject) { - this._stage.addChild(gameobject); + this.game.stage._stage.addChild(gameobject); return gameobject; }, addAt: function (gameobject, index) { - this._stage.addChildAt(gameobject, index); + this.game.stage._stage.addChildAt(gameobject, index); return gameobject; }, getAt: function (index) { - return this._stage.getChildAt(index); + return this.game.stage._stage.getChildAt(index); }, remove: function (gameobject) { - this._stage.removeChild(gameobject); + this.game.stage._stage.removeChild(gameobject); return gameobject; }, @@ -60,9 +53,9 @@ Phaser.World.prototype = { this.currentRenderOrderID = 0; - if (this._stage.first._iNext) + if (this.game.stage._stage.first._iNext) { - var currentNode = this._stage.first._iNext; + var currentNode = this.game.stage._stage.first._iNext; do { @@ -73,7 +66,7 @@ Phaser.World.prototype = { currentNode = currentNode._iNext; } - while (currentNode != this._stage.last._iNext) + while (currentNode != this.game.stage._stage.last._iNext) } }, @@ -93,9 +86,9 @@ Phaser.World.prototype = { bringToTop: function (child) { - if (child !== this._stage.last) + if (child !== this.game.stage._stage.last) { - this.swapChildren(child, this._stage.last); + this.swapChildren(child, this.game.stage._stage.last); } return child; @@ -116,8 +109,8 @@ Phaser.World.prototype = { var child2Prev = child2._iPrev; var child2Next = child2._iNext; - var endNode = this._stage.last._iNext; - var currentNode = this._stage.first; + var endNode = this.game.stage._stage.last._iNext; + var currentNode = this.game.stage._stage.first; do { diff --git a/src/input/Input.js b/src/input/Input.js index 450772340..91e520ca0 100644 --- a/src/input/Input.js +++ b/src/input/Input.js @@ -7,9 +7,6 @@ Phaser.Input = function (game) { this.game = game; - - // this.inputObjects = []; - // this.totalTrackedObjects = 0; }; @@ -397,16 +394,7 @@ Phaser.Input.prototype = { this.onTap = new Phaser.Signal(); this.onHold = new Phaser.Signal(); - for (var i = 0; i < this.totalTrackedObjects; i++) - { - if (this.inputObjects[i] && this.inputObjects[i].input) - { - this.inputObjects[i].input.reset(); - } - } - - this.inputObjects.length = 0; - this.totalTrackedObjects = 0; + this.interactiveItems.callAll('reset'); } this._pollCounter = 0; diff --git a/src/system/Canvas.js b/src/system/Canvas.js index b6c8f7d2a..25b9b1e00 100644 --- a/src/system/Canvas.js +++ b/src/system/Canvas.js @@ -7,12 +7,25 @@ Phaser.Canvas = { + create: function (width, height) { + + width = width || 256; + height = height || 256; + + var canvas = document.createElement('canvas'); + canvas.width = width; + canvas.height = height; + + return canvas; + + }, + /** * Get the DOM offset values of any given element */ getOffset: function (element, point) { - if (typeof point === "undefined") { point = new Phaser.Point; } + point = point || new Phaser.Point; var box = element.getBoundingClientRect(); var clientTop = element.clientTop || document.body.clientTop || 0; @@ -48,7 +61,7 @@ Phaser.Canvas = { */ setBackgroundColor: function (canvas, color) { - if (typeof color === "undefined") { color = 'rgb(0,0,0)'; } + color = color || 'rgb(0,0,0)'; canvas.style.backgroundColor = color; @@ -66,7 +79,7 @@ Phaser.Canvas = { */ setTouchAction: function (canvas, value) { - if (typeof value === "undefined") { value = 'none'; } + value = value || 'none'; canvas.style.msTouchAction = value; canvas.style['ms-touch-action'] = value; @@ -88,8 +101,8 @@ Phaser.Canvas = { */ addToDOM: function (canvas, parent, overflowHidden) { - if (typeof parent === "undefined") { parent = ''; } - if (typeof overflowHidden === "undefined") { overflowHidden = true; } + parent = parent || ''; + overflowHidden = overflowHidden || true; if ((parent !== '' || parent !== null) && document.getElementById(parent)) {