Added in the game scaling handler and updated Stage

This commit is contained in:
Richard Davey 2013-09-09 12:35:09 +01:00
parent 13d6ab512b
commit c904475ae6
8 changed files with 89 additions and 43 deletions

View file

@ -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);

View file

@ -65,6 +65,7 @@
<script src="../src/gameobjects/Text.js"></script>
<script src="../src/gameobjects/Button.js"></script>
<script src="../src/system/Canvas.js"></script>
<script src="../src/system/StageScaleMode.js"></script>
<script src="../src/system/Device.js"></script>
<script src="../src/system/RequestAnimationFrame.js"></script>
<script src="../src/math/RandomDataGenerator.js"></script>

View file

@ -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();

View file

@ -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 () {

View file

@ -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 = {
},
};
};
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
});

View file

@ -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
{

View file

@ -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;

View file

@ -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))
{