From 6cabb03a825c7e937df96a53197401e4ce71a704 Mon Sep 17 00:00:00 2001 From: photonstorm Date: Thu, 6 Feb 2014 23:13:39 +0000 Subject: [PATCH] Sprite.crop() now takes a Phaser.Rectangle instead of explicit parameters. Phaser.Image is a brand new display object perfect for logos, backgrounds, etc. You can scale, rotate, tint and blend and Image, but it has no animation, physics body or input events. Previously if you used Sprite.crop() it would crop all Sprites using the same base image. It now takes a local copy of the texture data and crops just that. --- README.md | 3 +++ examples/wip/image2.js | 19 ++++++++++++++++-- src/gameobjects/Image.js | 43 +++++++++++++++++++++++++++++++++++----- 3 files changed, 58 insertions(+), 7 deletions(-) diff --git a/README.md b/README.md index 9b3aec4e..0b8f4598 100644 --- a/README.md +++ b/README.md @@ -68,10 +68,12 @@ Significant API changes: * PIXI.Rectangle is now aliased to Phaser.Rectangle - saves on code duplication and works exactly the same. * PIXI.Circle is now aliased to Phaser.Circle - saves on code duplication and works exactly the same. * Sprite.deltaX and deltaY swapped to functions: Sprite.deltaX() and Sprite.deltaY() +* Sprite.crop() now takes a Phaser.Rectangle instead of explicit parameters. New features: +* Phaser.Image is a brand new display object perfect for logos, backgrounds, etc. You can scale, rotate, tint and blend and Image, but it has no animation, physics body or input events. New Examples: @@ -84,6 +86,7 @@ Bug Fixes: * Explicitly paused Timer continues if you un-focus and focus the browser window (thanks georgiee) * Added TimerEvent.pendingDelete and checks in Timer.update, so that removing an event in a callback no longer throws an exception (thanks georgiee) * Fixed TypeScript defs on lines 1741-1748 (thanks wombatbuddy) +* Previously if you used Sprite.crop() it would crop all Sprites using the same base image. It now takes a local copy of the texture data and crops just that. You can view the Change Log for all previous versions at https://github.com/photonstorm/phaser/changelog.md diff --git a/examples/wip/image2.js b/examples/wip/image2.js index 15560680..b289ac4f 100644 --- a/examples/wip/image2.js +++ b/examples/wip/image2.js @@ -1,4 +1,5 @@ +// var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update, render: render }); var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); function preload() { @@ -9,6 +10,7 @@ function preload() { var image; var image2; +var r; function create() { @@ -16,6 +18,10 @@ function create() { image2 = game.add.image(32, 250, 'pic'); + r = new Phaser.Rectangle(0, 0, 100, 100); + + image2.crop(r); + game.input.onDown.add(tint, this); } @@ -28,12 +34,21 @@ function tint() { function update() { - // image.angle += 1; + if (r && r.width < 300) + { + r.width += 1; + image2.crop(r); + } + else + { + image2.crop(); + r = null; + } } function render() { - // game.debug.renderText(sprite.position.y, 32, 32); + game.debug.renderText(image2.width, 32, 32); } diff --git a/src/gameobjects/Image.js b/src/gameobjects/Image.js index 3ee0d82b..d56b6db7 100644 --- a/src/gameobjects/Image.js +++ b/src/gameobjects/Image.js @@ -90,6 +90,8 @@ Phaser.Image = function (game, x, y, key, frame) { */ this.fixedToCamera = false; + + }; Phaser.Image.prototype = Object.create(PIXI.Sprite.prototype); @@ -243,13 +245,44 @@ Phaser.Image.prototype.loadTexture = function (key, frame) { * * @method Phaser.Image#crop * @memberof Phaser.Image -* @param {number} frame - If this Sprite is using part of a sprite sheet or texture atlas you can specify the exact frame to use by giving a string or numeric index. +* @param {Phaser.Rectangle} rect - The Rectangle to crop the Image to. Pass as null to clear any previously set crop. */ -Phaser.Image.prototype.crop = function(x, y, width, height) { +Phaser.Image.prototype.crop = function(rect) { - // this.crop = new Phaser.Rectangle(0, 0, this._cache.width, this._cache.height); - // this.texture.setFrame(this.crop); - // this.cropEnabled = false; + if (typeof rect === 'undefined' || rect === null) + { + // Clear any crop that may be set + if (this.texture.hasOwnProperty('sourceWidth')) + { + this.texture.setFrame(new Phaser.Rectangle(0, 0, this.texture.sourceWidth, this.texture.sourceHeight)); + } + } + else + { + // Do we need to clone the PIXI.Texture object? + if (this.texture instanceof PIXI.Texture) + { + // Yup, let's rock it ... + var local = {}; + + Phaser.Utils.extend(true, local, this.texture); + + local.sourceWidth = local.width; + local.sourceHeight = local.height; + local.frame = rect; + local.width = rect.width; + local.height = rect.height; + + this.texture = local; + + this.texture.updateFrame = true; + PIXI.Texture.frameUpdates.push(this.texture); + } + else + { + this.texture.setFrame(rect); + } + } };