diff --git a/README.md b/README.md index 45981fa4..e115e584 100644 --- a/README.md +++ b/README.md @@ -83,6 +83,8 @@ Updates: * Debug.renderRectangle has a new parameter: filled. If true it renders as with fillRect, if false strokeRect. * Phaser.AnimationParser now sets the trimmed data directly for Pixi Texture frames. Tested across JSON Hash, JSON Data, Sprite Sheet and XML. +* Game.add.renderTexture now has the addToCache parameter. If set the texture will be stored in Game.Cache and can be retrieved with Cache.getTexture(key). +* Game.add.bitmapData now has the addToCache parameter. If set the texture will be stored in Game.Cache and can be retrieved with Cache.getBitmapData(key). Bug Fixes: diff --git a/build/config.php b/build/config.php index a8f45ea7..5e21cefd 100644 --- a/build/config.php +++ b/build/config.php @@ -99,8 +99,6 @@ - - @@ -144,10 +142,10 @@ + - diff --git a/examples/wip/rendertexture.js b/examples/wip/rendertexture.js index bacc9698..7324c90a 100644 --- a/examples/wip/rendertexture.js +++ b/examples/wip/rendertexture.js @@ -1,5 +1,5 @@ -var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); +var game = new Phaser.Game(800, 600, Phaser.WEBGL, 'phaser-example', { preload: preload, create: create, update: update, render: render }); function preload() { @@ -13,17 +13,14 @@ var image; function create() { - // Here we'll create a renderTexture the same size as our game texture = game.add.renderTexture('mousetrail', 800, 600); - // This is the sprite that will be drawn to the texture, we set it to visible false as we only need its texture data - mushroom = game.add.sprite(0, 0, 'mushroom'); - // mushroom.visible = false; - // mushroom.anchor.setTo(0.5, 0.5); + // We create a sprite (rather than using the factory) so it doesn't get added to the display, as we only need its texture data. + mushroom = new Phaser.Sprite(game, 0, 0, 'mushroom'); + mushroom.anchor.setTo(0.5, 0.5); // This is the sprite that is drawn to the display. We've given it the renderTexture as its texture. - // game.add.image(0, 0, texture); - + image = game.add.image(0, 0, texture); game.input.onDown.add(tint, this); @@ -41,14 +38,11 @@ function update() { { // Here we draw the mushroom sprite to the renderTexture at the pointer coordinates. // The 'false' parameter 2nd from the end tells it not to clear itself, causing the trail effect you see. - // The final 'true' parameter tells it to render sprites even with visible false set. - // texture.render(mushroom, game.input.activePointer.position, false, true); + texture.render(mushroom, game.input.activePointer.position, false); } } function render() { - game.debug.renderText(game.input.x, 32, 32); - } diff --git a/src/gameobjects/BitmapData.js b/src/gameobjects/BitmapData.js index ec0c678f..3c783ab1 100644 --- a/src/gameobjects/BitmapData.js +++ b/src/gameobjects/BitmapData.js @@ -17,13 +17,14 @@ * * @constructor * @param {Phaser.Game} game - A reference to the currently running game. -* @param {number} [width=256] - The width of the BitmapData in pixels. -* @param {number} [height=256] - The height of the BitmapData in pixels. +* @param {string} key - Internal Phaser reference key for the render texture. +* @param {number} [width=100] - The width of the BitmapData in pixels. +* @param {number} [height=100] - The height of the BitmapData in pixels. */ -Phaser.BitmapData = function (game, width, height) { +Phaser.BitmapData = function (game, key, width, height) { - if (typeof width === 'undefined') { width = 256; } - if (typeof height === 'undefined') { height = 256; } + if (typeof width === 'undefined') { width = 100; } + if (typeof height === 'undefined') { height = 100; } /** * @property {Phaser.Game} game - A reference to the currently running game. @@ -31,9 +32,9 @@ Phaser.BitmapData = function (game, width, height) { this.game = game; /** - * @property {string} name - The name of the BitmapData. + * @property {string} key - The key of the BitmapData in the Cache, if stored there. */ - this.name = ''; + this.key = key; /** * @property {number} width - The width of the BitmapData in pixels. diff --git a/src/gameobjects/GameObjectFactory.js b/src/gameobjects/GameObjectFactory.js index 955d7cd0..0077ee4e 100644 --- a/src/gameobjects/GameObjectFactory.js +++ b/src/gameobjects/GameObjectFactory.js @@ -288,32 +288,51 @@ Phaser.GameObjectFactory.prototype = { * A dynamic initially blank canvas to which images can be drawn. * * @method Phaser.GameObjectFactory#renderTexture - * @param {string} key - Asset key for the render texture. - * @param {number} width - the width of the render texture. - * @param {number} height - the height of the render texture. - * @return {Phaser.RenderTexture} The newly created renderTexture object. + * @param {number} [width=100] - the width of the RenderTexture. + * @param {number} [height=100] - the height of the RenderTexture. + * @param {string} [key=''] - Asset key for the RenderTexture when stored in the Cache (see addToCache parameter). + * @param {boolean} [addToCache=false] - Should this RenderTexture be added to the Game.Cache? If so you can retrieve it with Cache.getTexture(key) + * @return {Phaser.RenderTexture} The newly created RenderTexture object. */ - renderTexture: function (key, width, height) { + renderTexture: function (width, height, key, addToCache) { + + if (typeof addToCache === 'undefined') { addToCache = false; } + if (typeof key === 'undefined' || key === '') { key = this.game.rnd.uuid(); } var texture = new Phaser.RenderTexture(this.game, key, width, height); - this.game.cache.addRenderTexture(key, texture); + if (addToCache) + { + this.game.cache.addRenderTexture(key, texture); + } return texture; }, /** - * Experimental: A BitmapData object which can be manipulated and drawn to like a traditional Canvas object and used to texture Sprites. + * A BitmapData object which can be manipulated and drawn to like a traditional Canvas object and used to texture Sprites. * * @method Phaser.GameObjectFactory#bitmapData - * @param {number} [width=256] - The width of the BitmapData in pixels. - * @param {number} [height=256] - The height of the BitmapData in pixels. + * @param {number} [width=100] - The width of the BitmapData in pixels. + * @param {number} [height=100] - The height of the BitmapData in pixels. + * @param {string} [key=''] - Asset key for the BitmapData when stored in the Cache (see addToCache parameter). + * @param {boolean} [addToCache=false] - Should this BitmapData be added to the Game.Cache? If so you can retrieve it with Cache.getBitmapData(key) * @return {Phaser.BitmapData} The newly created BitmapData object. */ - bitmapData: function (width, height) { + bitmapData: function (width, height, addToCache) { - return new Phaser.BitmapData(this.game, width, height); + if (typeof addToCache === 'undefined') { addToCache = false; } + if (typeof key === 'undefined' || key === '') { key = this.game.rnd.uuid(); } + + var texture = new Phaser.BitmapData(this.game, key, width, height); + + if (addToCache) + { + this.game.cache.addBitmapData(key, texture); + } + + return texture; }, diff --git a/src/gameobjects/Image.js b/src/gameobjects/Image.js index 3dcf7e8b..68b8d736 100644 --- a/src/gameobjects/Image.js +++ b/src/gameobjects/Image.js @@ -64,8 +64,7 @@ Phaser.Image = function (game, x, y, key, frame) { this.loadTexture(key, frame); - this.position.x = x; - this.position.y = y; + this.position.set(x, y); /** * @property {Phaser.Point} world - The world coordinates of this Sprite. This differs from the x/y coordinates which are relative to the Sprites container. @@ -90,6 +89,12 @@ Phaser.Image = function (game, x, y, key, frame) { */ this.fixedToCamera = false; + /** + * @property {array} _cache - A small cache for previous step values. + * @private + */ + this._cache = [0, 0, 0]; + }; Phaser.Image.prototype = Object.create(PIXI.Sprite.prototype); @@ -103,6 +108,10 @@ Phaser.Image.prototype.constructor = Phaser.Image; */ Phaser.Image.prototype.preUpdate = function() { + this._cache[0] = this.world.x; + this._cache[1] = this.world.y; + this._cache[2] = this.rotation; + if (!this.exists || !this.parent.exists) { return false; @@ -141,32 +150,6 @@ Phaser.Image.prototype.postUpdate = function() { }; -/** -* Checks if the Image bounds are within the game world, otherwise false if fully outside of it. -* -* @method Phaser.Image#inWorld -* @memberof Phaser.Image -* @return {boolean} True if the Image bounds is within the game world, even if only partially. Otherwise false if fully outside of it. -*/ -Phaser.Image.prototype.inWorld = function() { - - return this.game.world.bounds.intersects(this.getBounds()); - -}; - -/** -* Checks if the Image bounds are within the game camera, otherwise false if fully outside of it. -* -* @method Phaser.Image#inCamera -* @memberof Phaser.Image -* @return {boolean} True if the Image bounds is within the game camera, even if only partially. Otherwise false if fully outside of it. -*/ -Phaser.Image.prototype.inCamera = function() { - - return this.game.world.camera.screenView.intersects(this.getBounds()); - -}; - /** * Changes the Texture the Sprite is using entirely. The old texture is removed and the new one is referenced or fetched from the Cache. * This causes a WebGL texture update, so use sparingly or in low-intensity portions of your game. @@ -183,8 +166,8 @@ Phaser.Image.prototype.loadTexture = function (key, frame) { if (key instanceof Phaser.RenderTexture) { - // this.game.cache.getTextureFrame(key.name).clone(this.currentFrame); - // WOKWOKSK + this.key = key.name; + this.setTexture(key); } else if (key instanceof Phaser.BitmapData) { @@ -192,9 +175,7 @@ Phaser.Image.prototype.loadTexture = function (key, frame) { } else if (key instanceof PIXI.Texture) { - // this.currentFrame = frame; - frame.clone(this.currentFrame); - console.log('loadTexture 2'); + this.setTexture(key); } else { @@ -202,21 +183,19 @@ Phaser.Image.prototype.loadTexture = function (key, frame) { { key = '__default'; this.key = key; + this.setTexture(PIXI.TextureCache[key]); } else if (typeof key === 'string' && this.game.cache.checkImageKey(key) === false) { key = '__missing'; this.key = key; + this.setTexture(PIXI.TextureCache[key]); } if (this.game.cache.isSpriteSheet(key)) { var frameData = this.game.cache.getFrameData(key); - // console.log(frameData); - // console.log(frameData.getFrame(0)); - // console.log(frameData.getFrame(1)); - if (typeof frame === 'string') { this.setTexture(PIXI.TextureCache[frameData.getFrameByName(frame).uuid]); @@ -425,11 +404,100 @@ Phaser.Image.prototype.bringToTop = function(child) { Object.defineProperty(Phaser.Image.prototype, "angle", { get: function() { + return Phaser.Math.wrapAngle(Phaser.Math.radToDeg(this.rotation)); + }, set: function(value) { + this.rotation = Phaser.Math.degToRad(Phaser.Math.wrapAngle(value)); + + } + +}); + +/** +* Returns the delta x value. The difference between world.x now and in the previous step. +* +* @name Phaser.Image#deltaX +* @property {number} deltaX - The delta value. Positive if the motion was to the right, negative if to the left. +* @readonly +*/ +Object.defineProperty(Phaser.Image.prototype, "deltaX", { + + get: function() { + + return this.world.x - this._cache[0]; + + } + +}); + +/** +* Returns the delta y value. The difference between world.y now and in the previous step. +* +* @name Phaser.Image#deltaY +* @property {number} deltaY - The delta value. Positive if the motion was downwards, negative if upwards. +* @readonly +*/ +Object.defineProperty(Phaser.Image.prototype, "deltaY", { + + get: function() { + + return this.world.y - this._cache[1]; + + } + +}); + +/** +* Returns the delta z value. The difference between rotation now and in the previous step. +* +* @name Phaser.Image#deltaZ +* @property {number} deltaZ - The delta value. +* @readonly +*/ +Object.defineProperty(Phaser.Image.prototype, "deltaZ", { + + get: function() { + + return this.rotation - this._cache[2]; + + } + +}); + +/** +* Checks if the Image bounds are within the game world, otherwise false if fully outside of it. +* +* @name Phaser.Image#inWorld +* @property {boolean} inWorld - True if the Image bounds is within the game world, even if only partially. Otherwise false if fully outside of it. +* @readonly +*/ +Object.defineProperty(Phaser.Image.prototype, "inWorld", { + + get: function() { + + return this.game.world.bounds.intersects(this.getBounds()); + + } + +}); + +/** +* Checks if the Image bounds are within the game camera, otherwise false if fully outside of it. +* +* @name Phaser.Image#inCamera +* @property {boolean} inCamera - True if the Image bounds is within the game camera, even if only partially. Otherwise false if fully outside of it. +* @readonly +*/ +Object.defineProperty(Phaser.Image.prototype, "inCamera", { + + get: function() { + + return this.game.world.camera.screenView.intersects(this.getBounds()); + } }); diff --git a/src/gameobjects/RenderTexture.js b/src/gameobjects/RenderTexture.js index 42c608b2..d05cefba 100644 --- a/src/gameobjects/RenderTexture.js +++ b/src/gameobjects/RenderTexture.js @@ -9,9 +9,9 @@ * @class Phaser.RenderTexture * @constructor * @param {Phaser.Game} game - Current game instance. -* @param {string} key - Asset key for the render texture. -* @param {number} width - the width of the render texture. -* @param {number} height - the height of the render texture. +* @param {string} key - Internal Phaser reference key for the render texture. +* @param {number} [width=100] - The width of the render texture. +* @param {number} [height=100] - The height of the render texture. */ Phaser.RenderTexture = function (game, key, width, height) { @@ -21,43 +21,18 @@ Phaser.RenderTexture = function (game, key, width, height) { this.game = game; /** - * @property {string} name - the name of the object. + * @property {string} key - The key of the RenderTexture in the Cache, if stored there. */ - this.name = key; - - /** - * @property {number} width - the width. - */ - this.width = width || 100; - - /** - * @property {number} height - the height. - */ - this.height = height || 100; - - /** - * @property {PIXI.Rectangle} frame - The frame for this texture. - */ - this.frame = new PIXI.Rectangle(0, 0, this.width, this.height); + this.key = key; /** * @property {number} type - Base Phaser object type. */ this.type = Phaser.RENDERTEXTURE; - // this._tempPoint = { x: 0, y: 0 }; - - // if (PIXI.gl) - // { - // this.initWebGL(); - // } - // else - // { - // this.initCanvas(); - // } + PIXI.RenderTexture.call(this, width, height, renderer); }; Phaser.RenderTexture.prototype = Object.create(PIXI.RenderTexture.prototype); Phaser.RenderTexture.prototype.constructor = Phaser.RenderTexture; -