diff --git a/examples/js.php b/examples/js.php index 7f8081cf..f7f68c74 100644 --- a/examples/js.php +++ b/examples/js.php @@ -45,6 +45,7 @@ + @@ -54,6 +55,7 @@ + diff --git a/examples/rect1.php b/examples/rect1.php new file mode 100644 index 00000000..f88d102d --- /dev/null +++ b/examples/rect1.php @@ -0,0 +1,22 @@ + + + + phaser.js - a new beginning + + + + + + + + \ No newline at end of file diff --git a/examples/stage 1.php b/examples/stage 1.php index 4e121757..689513c9 100644 --- a/examples/stage 1.php +++ b/examples/stage 1.php @@ -12,12 +12,14 @@ (function () { - // In this approach we're simply using functions in the current scope to do what we need - var game = new Phaser.Game(800, 600, Phaser.RENDERER_AUTO, '', { preload: preload, create: create }); + // var game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create, update: update }); + var game = new Phaser.Game(800, 600, Phaser.CANVAS, '', { preload: preload, create: create, update: update }); + + var bunny; function preload() { - console.log('*** preload called'); + console.log('***> preload called'); game.load.image('cockpit', 'assets/pics/cockpit.png'); game.load.image('overdose', 'assets/pics/lance-overdose-loader_eye.png'); @@ -25,8 +27,33 @@ function create() { - console.log('*** create called'); - document.body.appendChild(game.cache.getImage('cockpit')); + console.log('***> create called'); + + // Create a basetexture + var base = new PIXI.BaseTexture(game.cache.getImage('overdose')); + var texture = new PIXI.Texture(base); + bunny = new PIXI.Sprite(texture); + + // center the sprites anchor point + bunny.anchor.x = 0.5; + bunny.anchor.y = 0.5; + + // move the sprite t the center of the screen + bunny.position.x = 200; + bunny.position.y = 150; + + game.stage._s.addChild(bunny); + + } + + function update() { + + if (game.paused == false) + { + bunny.rotation += 0.1; + bunny.scale.x += 0.01; + bunny.scale.y += 0.01; + } } diff --git a/src/Game.js b/src/Game.js index a1126e7b..4da146a9 100644 --- a/src/Game.js +++ b/src/Game.js @@ -28,7 +28,7 @@ Phaser.Game = function (width, height, renderer, parent, state, transparent, ant if (typeof width === "undefined") { width = 800; } if (typeof height === "undefined") { height = 600; } - if (typeof renderer === "undefined") { renderer = Phaser.RENDERER_AUTO; } + if (typeof renderer === "undefined") { renderer = Phaser.AUTO; } if (typeof parent === "undefined") { parent = ''; } if (typeof state === "undefined") { state = null; } if (typeof transparent === "undefined") { transparent = false; } @@ -43,9 +43,6 @@ Phaser.Game = function (width, height, renderer, parent, state, transparent, ant this.transparent = transparent; this.antialias = antialias; this.renderType = renderer; - // this.renderer = renderer; - - console.log('Phaser.Game', width, height, renderer, parent, transparent, antialias); this.state = new Phaser.StateManager(this, state); @@ -246,8 +243,6 @@ Phaser.Game.prototype = { return; } - console.log('Phaser.Game boot'); - if (!document.body) { window.setTimeout(this._onBoot, 20); } @@ -287,13 +282,13 @@ Phaser.Game.prototype = { this.stage.boot(); // this.input.boot(); - if (this.renderType == Phaser.RENDERER_CANVAS) + if (this.renderType == Phaser.CANVAS) { - console.log('Phaser', Phaser.VERSION, 'initialized. Rendering to Canvas'); + console.log('%cPhaser ' + Phaser.VERSION + ' initialized. Rendering to Canvas', 'color: #ffff33; background: #000000'); } else { - console.log('Phaser', Phaser.VERSION, 'initialized. Rendering to WebGL'); + console.log('%cPhaser ' + Phaser.VERSION + ' initialized. Rendering to WebGL', 'color: #ffff33; background: #000000'); } this.isRunning = true; @@ -308,11 +303,11 @@ Phaser.Game.prototype = { setUpRenderer: function () { - if (this.renderType == Phaser.RENDERER_CANVAS || (this.renderer == Phaser.RENDERER_AUTO && this.device.webGL == false)) + if (this.renderType == Phaser.CANVAS || (this.renderer == Phaser.AUTO && this.device.webGL == false)) { if (this.device.canvas) { - this.renderType = Phaser.RENDERER_CANVAS; + this.renderType = Phaser.CANVAS; this.renderer = new PIXI.CanvasRenderer(this.width, this.height, null, this.transparent); Phaser.Canvas.setSmoothingEnabled(this.renderer.view, this.antialias); } @@ -373,7 +368,8 @@ Phaser.Game.prototype = { this.state.preRender(); - // this.renderer.render(); + this.renderer.render(this.stage._s); + this.plugins.render(); this.state.render(); @@ -389,7 +385,7 @@ Phaser.Game.prototype = { this.plugins.postUpdate(); this.plugins.preRender(); - // this.renderer.render(); + this.renderer.render(this.stage._s); this.plugins.render(); this.state.loadRender(); this.plugins.postRender(); diff --git a/src/Phaser.js b/src/Phaser.js index 78c1c4ff..8cc02f62 100644 --- a/src/Phaser.js +++ b/src/Phaser.js @@ -27,8 +27,8 @@ var Phaser = Phaser || { VERSION: '1.0.0', GAMES: [], - RENDERER_AUTO: 0, - RENDERER_CANVAS: 1, - RENDERER_WEBGL: 2 + AUTO: 0, + CANVAS: 1, + WEBGL: 2 }; diff --git a/src/Stage.js b/src/Stage.js index 70a015e5..4ee7c27c 100644 --- a/src/Stage.js +++ b/src/Stage.js @@ -13,9 +13,6 @@ Phaser.Stage = function (game) { this.game = game; - this.bounds = new Phaser.Rectangle; - this.offset = new Phaser.Point; - }; Phaser.Stage.prototype = { @@ -29,8 +26,9 @@ Phaser.Stage.prototype = { boot: function () { // Get the offset values (for input and other things) + this.offset = new Phaser.Point; Phaser.Canvas.getOffset(this.game.renderer.view, this.offset); - this.bounds.setTo(this.offset.x, this.offset.y, this.game.width, this.game.height); + this.bounds = new Phaser.Rectangle(this.offset.x, this.offset.y, this.game.width, this.game.height); this._s = new PIXI.Stage(0x000000); @@ -62,12 +60,12 @@ Phaser.Stage.prototype = { if (event.type == 'pagehide' || event.type == 'blur' || document['hidden'] == true || document['webkitHidden'] == true) { - console.log('visibilityChange - hidden', event); + // console.log('visibilityChange - hidden', event); this.game.paused = true; } else { - console.log('visibilityChange - shown', event); + // console.log('visibilityChange - shown', event); this.game.paused = false; } diff --git a/src/core/StateManager.js b/src/core/StateManager.js index e901a8b2..08d546b4 100644 --- a/src/core/StateManager.js +++ b/src/core/StateManager.js @@ -6,7 +6,6 @@ Phaser.StateManager = function (game, pendingState) { if (pendingState !== null) { - console.log('StartManager constructor', pendingState); this._pendingState = pendingState; } @@ -99,7 +98,7 @@ Phaser.StateManager.prototype = { boot: function () { - console.log('Phaser.StateManager.boot'); + // console.log('Phaser.StateManager.boot'); if (this._pendingState !== null) { diff --git a/src/geom/Rectangle.js b/src/geom/Rectangle.js index 957a4529..cc452ffc 100644 --- a/src/geom/Rectangle.js +++ b/src/geom/Rectangle.js @@ -11,38 +11,71 @@ **/ Phaser.Rectangle = function (x, y, width, height) { + if (typeof x === "undefined") { x = 0; } + if (typeof y === "undefined") { y = 0; } + if (typeof width === "undefined") { width = 0; } + if (typeof height === "undefined") { height = 0; } + /** * @property x * @type Number * @default 0 */ - this.x = x || 0; + this.x = x; /** * @property y * @type Number * @default 0 */ - this.y = y || 0; + this.y = y; /** * @property width * @type Number * @default 0 */ - this.width = width || 0; + this.width = width; /** * @property height * @type Number * @default 0 */ - this.height = height || 0; + this.height = height; }; Phaser.Rectangle.prototype = { + /** + * @property x + * @type Number + * @default 0 + */ + x: 0, + + /** + * @property y + * @type Number + * @default 0 + */ + y: 0, + + /** + * @property width + * @type Number + * @default 0 + */ + width: 0, + + /** + * @property height + * @type Number + * @default 0 + */ + height: 0, + /** * Adjusts the location of the Rectangle object, as determined by its top-left corner, by the specified amounts. * @method offset @@ -146,7 +179,7 @@ Phaser.Rectangle.prototype = { */ size: function (output) { return Phaser.Rectangle.size(this, output); - }; + }, /** * Returns a new Rectangle object with the same values for the x, y, width, and height properties as the original Rectangle object. @@ -502,7 +535,7 @@ Object.defineProperty(Phaser.Rectangle.prototype, "empty", { * @param {Number} dy The amount to be added to the bottom side of the Rectangle. * @return {Phaser.Rectangle} This Rectangle object. */ -Phaser.Rectangle.inflate = function inflate(a, dx, dy) { +Phaser.Rectangle.inflate = function (a, dx, dy) { a.x -= dx; a.width += 2 * dx; a.y -= dy; @@ -517,7 +550,7 @@ Phaser.Rectangle.inflate = function inflate(a, dx, dy) { * @param {Phaser.Point} point The x property of this Point object is used to increase the horizontal dimension of the Rectangle object. The y property is used to increase the vertical dimension of the Rectangle object. * @return {Phaser.Rectangle} The Rectangle object. */ -Phaser.Rectangle.inflatePoint = function inflatePoint(a, point) { +Phaser.Rectangle.inflatePoint = function (a, point) { return Phaser.Phaser.Rectangle.inflate(a, point.x, point.y); }; @@ -528,7 +561,7 @@ Phaser.Rectangle.inflatePoint = function inflatePoint(a, point) { * @param {Phaser.Point} output Optional Point object. If given the values will be set into the object, otherwise a brand new Point object will be created and returned. * @return {Phaser.Point} The size of the Rectangle object */ -Phaser.Rectangle.size = function size(a, output) { +Phaser.Rectangle.size = function (a, output) { if (typeof output === "undefined") { output = new Phaser.Point(); } return output.setTo(a.width, a.height); }; @@ -540,7 +573,7 @@ Phaser.Rectangle.size = function size(a, output) { * @param {Phaser.Rectangle} output Optional Rectangle object. If given the values will be set into the object, otherwise a brand new Rectangle object will be created and returned. * @return {Phaser.Rectangle} */ -Phaser.Rectangle.clone = function clone(a, output) { +Phaser.Rectangle.clone = function (a, output) { if (typeof output === "undefined") { output = new Phaser.Rectangle(); } return output.setTo(a.x, a.y, a.width, a.height); }; @@ -553,7 +586,7 @@ Phaser.Rectangle.clone = function clone(a, output) { * @param {Number} y The y coordinate of the point to test. * @return {bool} A value of true if the Rectangle object contains the specified point; otherwise false. */ -Phaser.Rectangle.contains = function contains(a, x, y) { +Phaser.Rectangle.contains = function (a, x, y) { return (x >= a.x && x <= a.right && y >= a.y && y <= a.bottom); }; @@ -564,7 +597,7 @@ Phaser.Rectangle.contains = function contains(a, x, y) { * @param {Phaser.Point} point The point object being checked. Can be Point or any object with .x and .y values. * @return {bool} A value of true if the Rectangle object contains the specified point; otherwise false. */ -Phaser.Rectangle.containsPoint = function containsPoint(a, point) { +Phaser.Rectangle.containsPoint = function (a, point) { return Phaser.Phaser.Rectangle.contains(a, point.x, point.y); }; @@ -576,7 +609,7 @@ Phaser.Rectangle.containsPoint = function containsPoint(a, point) { * @param {Phaser.Rectangle} b The second Rectangle object. * @return {bool} A value of true if the Rectangle object contains the specified point; otherwise false. */ -Phaser.Rectangle.containsRect = function containsRect(a, b) { +Phaser.Rectangle.containsRect = function (a, b) { // If the given rect has a larger volume than this one then it can never contain it if(a.volume > b.volume) { return false; @@ -592,7 +625,7 @@ Phaser.Rectangle.containsRect = function containsRect(a, b) { * @param {Phaser.Rectangle} b The second Rectangle object. * @return {bool} A value of true if the two Rectangles have exactly the same values for the x, y, width and height properties; otherwise false. */ -Phaser.Rectangle.equals = function equals(a, b) { +Phaser.Rectangle.equals = function (a, b) { return (a.x == b.x && a.y == b.y && a.width == b.width && a.height == b.height); }; @@ -604,15 +637,19 @@ Phaser.Rectangle.equals = function equals(a, b) { * @param {Phaser.Rectangle} output Optional Rectangle object. If given the intersection values will be set into this object, otherwise a brand new Rectangle object will be created and returned. * @return {Phaser.Rectangle} A Rectangle object that equals the area of intersection. If the Rectangles do not intersect, this method returns an empty Rectangle object; that is, a Rectangle with its x, y, width, and height properties set to 0. */ -Phaser.Rectangle.intersection = function intersection(a, b, out) { +Phaser.Rectangle.intersection = function (a, b, out) { + if (typeof out === "undefined") { out = new Phaser.Rectangle(); } - if(Phaser.Phaser.Rectangle.intersects(a, b)) { + + if (Phaser.Rectangle.intersects(a, b)) { out.x = Math.max(a.x, b.x); out.y = Math.max(a.y, b.y); out.width = Math.min(a.right, b.right) - out.x; out.height = Math.min(a.bottom, b.bottom) - out.y; } + return out; + }; /** @@ -624,9 +661,12 @@ Phaser.Rectangle.intersection = function intersection(a, b, out) { * @param {Number} tolerance A tolerance value to allow for an intersection test with padding, default to 0 * @return {bool} A value of true if the specified object intersects with this Rectangle object; otherwise false. */ -Phaser.Rectangle.intersects = function intersects(a, b, tolerance) { +Phaser.Rectangle.intersects = function (a, b, tolerance) { + if (typeof tolerance === "undefined") { tolerance = 0; } + return !(a.left > b.right + tolerance || a.right < b.left - tolerance || a.top > b.bottom + tolerance || a.bottom < b.top - tolerance); + }; /** @@ -639,9 +679,12 @@ Phaser.Rectangle.intersects = function intersects(a, b, tolerance) { * @param {Number} tolerance A tolerance value to allow for an intersection test with padding, default to 0 * @return {bool} A value of true if the specified object intersects with the Rectangle; otherwise false. */ -Phaser.Rectangle.intersectsRaw = function intersectsRaw(a, left, right, top, bottom, tolerance) { +Phaser.Rectangle.intersectsRaw = function (a, left, right, top, bottom, tolerance) { + if (typeof tolerance === "undefined") { tolerance = 0; } + return !(left > a.right + tolerance || right < a.left - tolerance || top > a.bottom + tolerance || bottom < a.top - tolerance); + }; /** @@ -652,7 +695,10 @@ Phaser.Rectangle.intersectsRaw = function intersectsRaw(a, left, right, top, bot * @param {Phaser.Rectangle} output Optional Rectangle object. If given the new values will be set into this object, otherwise a brand new Rectangle object will be created and returned. * @return {Phaser.Rectangle} A Rectangle object that is the union of the two Rectangles. */ -Phaser.Rectangle.union = function union(a, b, out) { +Phaser.Rectangle.union = function (a, b, out) { + if (typeof out === "undefined") { out = new Phaser.Rectangle(); } + return out.setTo(Math.min(a.x, b.x), Math.min(a.y, b.y), Math.max(a.right, b.right), Math.max(a.bottom, b.bottom)); + };