diff --git a/Phaser/components/Transform.ts b/Phaser/components/Transform.ts index 4f3976ae..1112529a 100644 --- a/Phaser/components/Transform.ts +++ b/Phaser/components/Transform.ts @@ -10,8 +10,8 @@ module Phaser.Components { export class Transform { /** - * Creates a new Sprite Transform component - * @param parent The Sprite using this transform + * Creates a new Transform component + * @param parent The game object using this transform */ constructor(parent) { @@ -57,14 +57,39 @@ module Phaser.Components { private _distance: number; private _prevRotation: number; + /** + * The center of the Sprite in world coordinates, after taking scaling and rotation into consideration + */ public center: Phaser.Point; + + /** + * The upper-left corner of the Sprite in world coordinates, after taking scaling and rotation into consideration + */ public upperLeft: Phaser.Point; + + /** + * The upper-right corner of the Sprite in world coordinates, after taking scaling and rotation into consideration + */ public upperRight: Phaser.Point; + + /** + * The bottom-left corner of the Sprite in world coordinates, after taking scaling and rotation into consideration + */ public bottomLeft: Phaser.Point; + + /** + * The bottom-right corner of the Sprite in world coordinates, after taking scaling and rotation into consideration + */ public bottomRight: Phaser.Point; + /** + * The local transform matrix + */ public local: Mat3; + /** + * Populates the transform cache. Called by the parent object on creation. + */ public setCache() { this._pos.x = this.parent.x; @@ -96,14 +121,22 @@ module Phaser.Components { this._sc.y = 1; } - this.center.setTo(this.center.x, this.center.y); + this.center.x = this.parent.x + this._distance * this._scA.y; + this.center.y = this.parent.y + this._distance * this._scA.x; + this.upperLeft.setTo(this.center.x - this._halfSize.x * this._sc.y + this._halfSize.y * this._sc.x, this.center.y - this._halfSize.y * this._sc.y - this._halfSize.x * this._sc.x); this.upperRight.setTo(this.center.x + this._halfSize.x * this._sc.y + this._halfSize.y * this._sc.x, this.center.y - this._halfSize.y * this._sc.y + this._halfSize.x * this._sc.x); this.bottomLeft.setTo(this.center.x - this._halfSize.x * this._sc.y - this._halfSize.y * this._sc.x, this.center.y + this._halfSize.y * this._sc.y - this._halfSize.x * this._sc.x); this.bottomRight.setTo(this.center.x + this._halfSize.x * this._sc.y - this._halfSize.y * this._sc.x, this.center.y + this._halfSize.y * this._sc.y + this._halfSize.x * this._sc.x); + this._pos.x = this.parent.x; + this._pos.y = this.parent.y; + } + /** + * Updates the local transform matrix and the cache values if anything has changed in the parent. + */ public update() { // Check cache @@ -156,8 +189,6 @@ module Phaser.Components { this.center.x = this.parent.x + this._distance * this._scA.y; this.center.y = this.parent.y + this._distance * this._scA.x; - this.center.setTo(this.center.x, this.center.y); - this.upperLeft.setTo(this.center.x - this._halfSize.x * this._sc.y + this._halfSize.y * this._sc.x, this.center.y - this._halfSize.y * this._sc.y - this._halfSize.x * this._sc.x); this.upperRight.setTo(this.center.x + this._halfSize.x * this._sc.y + this._halfSize.y * this._sc.x, this.center.y - this._halfSize.y * this._sc.y + this._halfSize.x * this._sc.x); this.bottomLeft.setTo(this.center.x - this._halfSize.x * this._sc.y - this._halfSize.y * this._sc.x, this.center.y + this._halfSize.y * this._sc.y - this._halfSize.x * this._sc.x); @@ -282,23 +313,15 @@ module Phaser.Components { } /** - * The center of the Sprite in world coordinates, after taking scaling and rotation into consideration + * The equivalent of Math.sin(rotation + rotationOffset) */ - //public get centerX(): number { - // return this.center.x; - //} - - /** - * The center of the Sprite in world coordinates, after taking scaling and rotation into consideration - */ - //public get centerY(): number { - // return this.center.y; - //} - public get sin(): number { return this._sc.x; } + /** + * The equivalent of Math.cos(rotation + rotationOffset) + */ public get cos(): number { return this._sc.y; } diff --git a/Phaser/renderers/CanvasRenderer.ts b/Phaser/renderers/CanvasRenderer.ts index 2c61a60e..c3558af4 100644 --- a/Phaser/renderers/CanvasRenderer.ts +++ b/Phaser/renderers/CanvasRenderer.ts @@ -221,8 +221,7 @@ module Phaser { return true; } - return true; - //return RectangleUtils.intersects(sprite.cameraView, camera.screenView); + return RectangleUtils.intersects(sprite.cameraView, camera.screenView); } diff --git a/Phaser/utils/SpriteUtils.ts b/Phaser/utils/SpriteUtils.ts index 73605f2a..28b597d1 100644 --- a/Phaser/utils/SpriteUtils.ts +++ b/Phaser/utils/SpriteUtils.ts @@ -60,42 +60,11 @@ module Phaser { } else { - //var left:Number = Math.min(topLeft.x, topRight.x, bottomRight.x, bottomLeft.x); - //var top:Number = Math.min(topLeft.y, topRight.y, bottomRight.y, bottomLeft.y); - //var right:Number = Math.max(topLeft.x, topRight.x, bottomRight.x, bottomLeft.x); - //var bottom:Number = Math.max(topLeft.y, topRight.y, bottomRight.y, bottomLeft.y); - //return new Rectangle(left, top, right - left, bottom - top); - - var minX: number = Math.min(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); - var minY: number = Math.min(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); - var maxX: number = Math.max(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); - var maxY: number = Math.max(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); - - // (min_x,min_y), (min_x,max_y), (max_x,max_y), (max_x,min_y) - - sprite.cameraView.x = minX; - sprite.cameraView.y = minY; - sprite.cameraView.width = maxX - minX; - sprite.cameraView.height = maxY - minY; - - /* - // Useful to get the maximum AABB size of any given rect - - If you want a single box that covers all angles, just take the half-diagonal of your existing box as the radius of a circle. - The new box has to contain this circle, so it should be a square with side-length equal to twice the radius - (equiv. the diagonal of the original AABB) and with the same center as the original. - */ - + sprite.cameraView.x = Math.min(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); + sprite.cameraView.y = Math.min(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); + sprite.cameraView.width = Math.max(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x) - sprite.cameraView.x; + sprite.cameraView.height = Math.max(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y) - sprite.cameraView.y; } - - } - - if (sprite.animations.currentFrame !== null && sprite.animations.currentFrame.trimmed) - { - //sprite.cameraView.x += sprite.animations.currentFrame.spriteSourceSizeX; - //sprite.cameraView.y += sprite.animations.currentFrame.spriteSourceSizeY; - //this._dw = sprite.animations.currentFrame.spriteSourceSizeW; - //this._dh = sprite.animations.currentFrame.spriteSourceSizeH; } return sprite.cameraView; @@ -174,92 +143,60 @@ module Phaser { } */ - /** - * Checks to see if this GameObject were located at the given position, would it overlap the GameObject or Group? - * This is distinct from overlapsPoint(), which just checks that point, rather than taking the object's size numbero account. - * WARNING: Currently tilemaps do NOT support screen space overlap checks! - * - * @param X {number} The X position you want to check. Pretends this object (the caller, not the parameter) is located here. - * @param Y {number} The Y position you want to check. Pretends this object (the caller, not the parameter) is located here. - * @param objectOrGroup {object} The object or group being tested. - * @param inScreenSpace {boolean} Whether to take scroll factors numbero account when checking for overlap. Default is false, or "only compare in world space." - * @param camera {Camera} Specify which game camera you want. If null getScreenXY() will just grab the first global camera. - * - * @return {boolean} Whether or not the two objects overlap. - */ - /* - static overlapsAt(X: number, Y: number, objectOrGroup, inScreenSpace: bool = false, camera: Camera = null): bool { - - if (objectOrGroup.isGroup) - { - var results: bool = false; - var basic; - var i: number = 0; - var members = objectOrGroup.members; - - while (i < length) - { - if (this.overlapsAt(X, Y, members[i++], inScreenSpace, camera)) - { - results = true; - } - } - - return results; - } - - if (!inScreenSpace) - { - return (objectOrGroup.x + objectOrGroup.width > X) && (objectOrGroup.x < X + this.width) && - (objectOrGroup.y + objectOrGroup.height > Y) && (objectOrGroup.y < Y + this.height); - } - - if (camera == null) - { - camera = this._game.camera; - } - - var objectScreenPos: Point = objectOrGroup.getScreenXY(null, Camera); - - this._point.x = X - camera.scroll.x * this.transform.scrollFactor.x; //copied from getScreenXY() - this._point.y = Y - camera.scroll.y * this.transform.scrollFactor.y; - this._point.x += (this._point.x > 0) ? 0.0000001 : -0.0000001; - this._point.y += (this._point.y > 0) ? 0.0000001 : -0.0000001; - - return (objectScreenPos.x + objectOrGroup.width > this._point.x) && (objectScreenPos.x < this._point.x + this.width) && - (objectScreenPos.y + objectOrGroup.height > this._point.y) && (objectScreenPos.y < this._point.y + this.height); - } - */ /** - * Checks to see if a point in 2D world space overlaps this GameObject. + * Checks to see if the given x and y coordinates overlaps this Sprite, taking scaling and rotation into account. + * The coordinates must be given in world space, not local or camera space. * - * @param point {Point} The point in world space you want to check. - * @param inScreenSpace {boolean} Whether to take scroll factors into account when checking for overlap. - * @param camera {Camera} Specify which game camera you want. If null getScreenXY() will just grab the first global camera. + * @param sprite {Sprite} The Sprite to check. It will take scaling and rotation into account. + * @param x {Number} The x coordinate in world space. + * @param y {Number} The y coordinate in world space. * * @return Whether or not the point overlaps this object. */ - static overlapsPoint(sprite: Sprite, point: Point, inScreenSpace: bool = false, camera: Camera = null): bool { + static overlapsXY(sprite: Phaser.Sprite, x: number, y: number): bool { - if (!inScreenSpace) + // if rotation == 0 then just do a rect check instead! + if (sprite.transform.rotation == 0) { - return Phaser.RectangleUtils.containsPoint(sprite.body.bounds, point); - //return (point.x > sprite.x) && (point.x < sprite.x + sprite.width) && (point.y > sprite.y) && (point.y < sprite.y + sprite.height); + return Phaser.RectangleUtils.contains(sprite.cameraView, x, y); } - if (camera == null) + if ((x - sprite.transform.upperLeft.x) * (sprite.transform.upperRight.x - sprite.transform.upperLeft.x) + (y - sprite.transform.upperLeft.y) * (sprite.transform.upperRight.y - sprite.transform.upperLeft.y) < 0) { - camera = sprite.game.camera; + return false; } - //var x: number = point.x - camera.scroll.x; - //var y: number = point.y - camera.scroll.y; + if ((x - sprite.transform.upperRight.x) * (sprite.transform.upperRight.x - sprite.transform.upperLeft.x) + (y - sprite.transform.upperRight.y) * (sprite.transform.upperRight.y - sprite.transform.upperLeft.y) > 0) + { + return false; + } - //this.getScreenXY(this._point, camera); + if ((x - sprite.transform.upperLeft.x) * (sprite.transform.bottomLeft.x - sprite.transform.upperLeft.x) + (y - sprite.transform.upperLeft.y) * (sprite.transform.bottomLeft.y - sprite.transform.upperLeft.y) < 0) + { + return false; + } - //return (x > this._point.x) && (X < this._point.x + this.width) && (Y > this._point.y) && (Y < this._point.y + this.height); + if ((x - sprite.transform.bottomLeft.x) * (sprite.transform.bottomLeft.x - sprite.transform.upperLeft.x) + (y - sprite.transform.bottomLeft.y) * (sprite.transform.bottomLeft.y - sprite.transform.upperLeft.y) > 0) + { + return false; + } + return true; + + } + + /** + * Checks to see if the given point overlaps this Sprite, taking scaling and rotation into account. + * The point must be given in world space, not local or camera space. + * + * @param sprite {Sprite} The Sprite to check. It will take scaling and rotation into account. + * @param point {Point} The point in world space you want to check. + * + * @return Whether or not the point overlaps this object. + */ + static overlapsPoint(sprite: Sprite, point: Point): bool { + return overlapsXY(sprite, point.x, point.y); } /** @@ -346,19 +283,6 @@ module Phaser { } - static setOriginToCenter(sprite: Sprite, fromFrameBounds: bool = true, fromBody?: bool = false) { - - if (fromFrameBounds) - { - sprite.transform.origin.setTo(sprite.width / 2, sprite.height / 2); - } - else if (fromBody) - { - sprite.transform.origin.setTo(sprite.body.bounds.halfWidth, sprite.body.bounds.halfHeight); - } - - } - /** * Set the world bounds that this GameObject can exist within. By default a GameObject can exist anywhere * in the world. But by setting the bounds (which are given in world dimensions, not screen dimensions) diff --git a/README.md b/README.md index 3abe1513..bdc6655a 100644 --- a/README.md +++ b/README.md @@ -26,30 +26,28 @@ TODO: * Investigate why tweens don't restart after the game pauses * Fix bug in Tween yoyo + loop combo * Apply Sprite scaling to Body.bounds -* When you modify the sprite x/y directly the body position doesn't update, which leads to weird results. Need to work out who controls who. * Check that tween pausing works with the new performance.now * Game.Time should monitor pause duration * Investigate bug re: tilemap collision and animation frames * Update tests that use arrow keys and include touch/mouse support (FlxControlHandler style) -* Polygon geom primitive * If the Camera is larger than the Stage size then the rotation offset isn't correct * Texture Repeat doesn't scroll, because it's part of the camera not the world, need to think about this more * Bug: Sprite x/y gets shifted if dynamic from the original value * Input CSS cursor those little 4-way arrows on drag? * Stage CSS3 transforms!!! Color tints, sepia, greyscale, all of those cool things :) -* Cameras should have option to be input disabled + Pointers should check which camera they are over before doing Sprite selection -* Added JSON Texture Atlas object support. -* RenderOrderID won't work across cameras - but then neither do Pointers yet anyway +* Add JSON Texture Atlas object support. * Swap to using time based motion (like the tweens) rather than delta timer - it just doesn't work well on slow phones * Pointer.getWorldX(camera) needs to take camera scale into consideration * Add a 'click to bring to top' demo (+ Group feature?) * If stage.clear set to false and game pauses, when it unpauses you still see the pause arrow - resolve this - * Add clip support + shape options to Texture Component. +* Make sure I'm using Point and not Vec2 when it's not a directional vector I need +* Bug with setting scale or anything on a Sprite inside a Group, or maybe group.addNewSprite issue -Make sure I'm using Point and not Vec2 when it's not a directional vector I need - - +* Make input check use the rotated sprite check +* Sprite collision events +* See which functions in the input component can move elsewhere (utils) +* Move all of the renderDebugInfo methods to the DebugUtils class V1.0.0 @@ -98,7 +96,7 @@ V1.0.0 * Added optional frame parameter to Phaser.Sprite (and game.add.sprite) so you can set a frame ID or frame name on construction. * Fixed bug where passing a texture atlas string would incorrectly skip the frames array. * Added AnimationManager.autoUpdateBounds to control if a new frame should change the physics bounds of a sprite body or not. -* Added StageScaleMode.pageAlignHorizontally and pageAlignVertically booleans. When on Phaser will set the margin-left and top of the canvas element so that it is positioned in the middle of the page (based on window.innerWidth). +* Added StageScaleMode.pageAlignHorizontally and pageAlignVertically booleans. When true Phaser will set the margin-left and top of the canvas element so that it is positioned in the middle of the page (based only on window.innerWidth). * Added support for globalCompositeOperation, opaque and backgroundColor to the Sprite.Texture and Camera.Texture components. * Added ability for a Camera to skew and rotate around an origin. * Moved the Camera rendering into CanvasRenderer to keep things consistent. @@ -109,8 +107,12 @@ V1.0.0 * Added CameraManager.swap and CameraManager.sort methods and added a z-index property to Camera to control render order. * Added World.postUpdate loop + Group and Camera postUpdate methods. * Fixed issue stopping Pointer from working in world coordinates and fixed the world drag example. -* For consistency renamed input.scaledX/Y = input.scale. +* For consistency renamed input.scaledX/Y to input.scale. * Added input.activePointer which contains a reference to the most recently active pointer. +* Sprite.Transform now has upperLeft, upperRight, bottomLeft and bottomRight Point properties and lots of useful coordinate related methods. +* Camera.inCamera check now uses the Sprite.worldView which finally accurately updates regardless of scale, rotation or rotation origin. +* Added Math.Mat3 for Matrix3 operations (which Sprite.Transform uses) and Math.Mat3Utils for lots of use Mat3 related methods. +* Added SpriteUtils.overlapsXY and overlapsPoint to check if a point is within a sprite, taking scale and rotation into account. diff --git a/Tests/Tests.csproj b/Tests/Tests.csproj index 405475d7..7d503fff 100644 --- a/Tests/Tests.csproj +++ b/Tests/Tests.csproj @@ -117,6 +117,10 @@ + + + point in rotated sprite.ts + snap 1.ts diff --git a/Tests/input/point in rotated sprite.js b/Tests/input/point in rotated sprite.js new file mode 100644 index 00000000..70fb46e0 --- /dev/null +++ b/Tests/input/point in rotated sprite.js @@ -0,0 +1,39 @@ +/// +(function () { + var game = new Phaser.Game(this, 'game', 800, 600, init, create, update, render); + function init() { + game.load.image('sprite', 'assets/sprites/atari130xe.png'); + game.load.start(); + } + var sprite; + var rotate = false; + function create() { + sprite = game.add.sprite(200, 200, 'sprite'); + game.input.onTap.add(rotateIt, this); + } + function rotateIt() { + if(rotate == false) { + rotate = true; + } else { + rotate = false; + } + } + var inPoint = false; + function update() { + if(rotate) { + sprite.rotation++; + } + inPoint = Phaser.SpriteUtils.overlapsXY(sprite, game.input.x, game.input.y); + } + function render() { + game.stage.context.save(); + game.stage.context.fillStyle = 'rgb(255,0,255)'; + game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperLeft.x) + ' y: ' + Math.round(sprite.transform.upperLeft.y), sprite.transform.upperLeft.x, sprite.transform.upperLeft.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperRight.x) + ' y: ' + Math.round(sprite.transform.upperRight.y), sprite.transform.upperRight.x, sprite.transform.upperRight.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomLeft.x) + ' y: ' + Math.round(sprite.transform.bottomLeft.y), sprite.transform.bottomLeft.x, sprite.transform.bottomLeft.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomRight.x) + ' y: ' + Math.round(sprite.transform.bottomRight.y), sprite.transform.bottomRight.x, sprite.transform.bottomRight.y); + game.input.renderDebugInfo(32, 32); + game.stage.context.fillText('in: ' + inPoint, 300, 32); + game.stage.context.restore(); + } +})(); diff --git a/Tests/input/point in rotated sprite.ts b/Tests/input/point in rotated sprite.ts new file mode 100644 index 00000000..d3d1792f --- /dev/null +++ b/Tests/input/point in rotated sprite.ts @@ -0,0 +1,60 @@ +/// + +(function () { + + var game = new Phaser.Game(this, 'game', 800, 600, init, create, update, render); + + function init() { + + game.load.image('sprite', 'assets/sprites/atari130xe.png'); + game.load.start(); + + } + + var sprite: Phaser.Sprite; + var rotate: bool = false; + + function create() { + + sprite = game.add.sprite(200, 200, 'sprite'); + + game.input.onTap.add(rotateIt, this); + + } + + function rotateIt() { + if (rotate == false) { rotate = true; } else { rotate = false; } + } + + var inPoint: bool = false; + + function update() { + + if (rotate) + { + sprite.rotation++; + } + + inPoint = Phaser.SpriteUtils.overlapsXY(sprite, game.input.x, game.input.y); + + } + + function render() { + + game.stage.context.save(); + game.stage.context.fillStyle = 'rgb(255,0,255)'; + + game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperLeft.x) + ' y: ' + Math.round(sprite.transform.upperLeft.y), sprite.transform.upperLeft.x, sprite.transform.upperLeft.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperRight.x) + ' y: ' + Math.round(sprite.transform.upperRight.y), sprite.transform.upperRight.x, sprite.transform.upperRight.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomLeft.x) + ' y: ' + Math.round(sprite.transform.bottomLeft.y), sprite.transform.bottomLeft.x, sprite.transform.bottomLeft.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomRight.x) + ' y: ' + Math.round(sprite.transform.bottomRight.y), sprite.transform.bottomRight.x, sprite.transform.bottomRight.y); + + game.input.renderDebugInfo(32, 32); + + game.stage.context.fillText('in: ' + inPoint, 300, 32); + + game.stage.context.restore(); + + } + +})(); diff --git a/Tests/misc/point1.js b/Tests/misc/point1.js index e78fa486..6b2b2b83 100644 --- a/Tests/misc/point1.js +++ b/Tests/misc/point1.js @@ -3,8 +3,8 @@ var game = new Phaser.Game(this, 'game', 800, 600, init, create, update, render); function init() { game.load.image('box2', 'assets/tests/320x200.png'); - game.load.image('box', 'assets/sprites/oz_pov_melting_disk.png'); - game.load.image('box1', 'assets/sprites/bunny.png'); + game.load.image('box1', 'assets/sprites/oz_pov_melting_disk.png'); + game.load.image('box', 'assets/sprites/bunny.png'); game.load.start(); } var sprite; @@ -13,7 +13,7 @@ game.stage.backgroundColor = 'rgb(0,0,0)'; sprite = game.add.sprite(game.stage.centerX, game.stage.centerY, 'box'); //sprite.transform.scale.setTo(0.5, 0.5); - sprite.transform.origin.setTo(0, 0); + sprite.transform.origin.setTo(1, 1); //sprite.transform.origin.setTo(0.5, 0.5); game.input.onTap.add(rotateIt, this); //game.add.tween(sprite.transform.scale).to({ x: 0.5, y: 0.5 }, 2000, Phaser.Easing.Linear.None, true, 0, true); @@ -37,14 +37,6 @@ game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperRight.x) + ' y: ' + Math.round(sprite.transform.upperRight.y), sprite.transform.upperRight.x, sprite.transform.upperRight.y); game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomLeft.x) + ' y: ' + Math.round(sprite.transform.bottomLeft.y), sprite.transform.bottomLeft.x, sprite.transform.bottomLeft.y); game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomRight.x) + ' y: ' + Math.round(sprite.transform.bottomRight.y), sprite.transform.bottomRight.x, sprite.transform.bottomRight.y); - var minX = Math.min(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); - var minY = Math.min(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); - var maxX = Math.max(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); - var maxY = Math.max(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); - var width = maxX - minX; - var height = maxY - minY; - game.stage.context.fillText('minX: ' + minX + ' minY: ' + minY, 32, 32); - game.stage.context.fillText('maxX: ' + maxX + ' maxY: ' + maxY, 32, 64); game.stage.context.fillRect(sprite.transform.center.x, sprite.transform.center.y, 2, 2); game.stage.context.fillRect(sprite.transform.upperLeft.x, sprite.transform.upperLeft.y, 2, 2); game.stage.context.fillRect(sprite.transform.upperRight.x, sprite.transform.upperRight.y, 2, 2); @@ -52,7 +44,6 @@ game.stage.context.fillRect(sprite.transform.bottomRight.x, sprite.transform.bottomRight.y, 2, 2); game.stage.context.strokeStyle = 'rgb(255,255,0)'; game.stage.context.strokeRect(sprite.cameraView.x, sprite.cameraView.y, sprite.cameraView.width, sprite.cameraView.height); - //game.stage.context.strokeRect(minX, minY, width, height); game.stage.context.restore(); } })(); diff --git a/Tests/misc/point1.ts b/Tests/misc/point1.ts index 904d7d39..1dcfb0b0 100644 --- a/Tests/misc/point1.ts +++ b/Tests/misc/point1.ts @@ -7,8 +7,8 @@ function init() { game.load.image('box2', 'assets/tests/320x200.png'); - game.load.image('box', 'assets/sprites/oz_pov_melting_disk.png'); - game.load.image('box1', 'assets/sprites/bunny.png'); + game.load.image('box1', 'assets/sprites/oz_pov_melting_disk.png'); + game.load.image('box', 'assets/sprites/bunny.png'); game.load.start(); } @@ -23,7 +23,7 @@ sprite = game.add.sprite(game.stage.centerX, game.stage.centerY, 'box'); //sprite.transform.scale.setTo(0.5, 0.5); - sprite.transform.origin.setTo(0, 0); + sprite.transform.origin.setTo(1, 1); //sprite.transform.origin.setTo(0.5, 0.5); game.input.onTap.add(rotateIt, this); @@ -55,17 +55,6 @@ game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomLeft.x) + ' y: ' + Math.round(sprite.transform.bottomLeft.y), sprite.transform.bottomLeft.x, sprite.transform.bottomLeft.y); game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomRight.x) + ' y: ' + Math.round(sprite.transform.bottomRight.y), sprite.transform.bottomRight.x, sprite.transform.bottomRight.y); - var minX: number = Math.min(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); - var minY: number = Math.min(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); - var maxX: number = Math.max(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); - var maxY: number = Math.max(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); - - var width = maxX - minX; - var height = maxY - minY; - - game.stage.context.fillText('minX: ' + minX + ' minY: ' + minY, 32, 32); - game.stage.context.fillText('maxX: ' + maxX + ' maxY: ' + maxY, 32, 64); - game.stage.context.fillRect(sprite.transform.center.x, sprite.transform.center.y, 2, 2); game.stage.context.fillRect(sprite.transform.upperLeft.x, sprite.transform.upperLeft.y, 2, 2); game.stage.context.fillRect(sprite.transform.upperRight.x, sprite.transform.upperRight.y, 2, 2); @@ -74,7 +63,6 @@ game.stage.context.strokeStyle = 'rgb(255,255,0)'; game.stage.context.strokeRect(sprite.cameraView.x, sprite.cameraView.y, sprite.cameraView.width, sprite.cameraView.height); - //game.stage.context.strokeRect(minX, minY, width, height); game.stage.context.restore(); diff --git a/Tests/misc/point2.js b/Tests/misc/point2.js index 2b16e544..72448870 100644 --- a/Tests/misc/point2.js +++ b/Tests/misc/point2.js @@ -2,16 +2,17 @@ (function () { var game = new Phaser.Game(this, 'game', 800, 600, init, create, update, render); function init() { - game.load.image('box', 'assets/tests/320x200.png'); + game.load.spritesheet('mummy', 'assets/sprites/metalslug_mummy37x45.png', 37, 45, 18); game.load.start(); } var sprite; var rotate = false; function create() { game.stage.backgroundColor = 'rgb(0,0,0)'; - game.stage.disablePauseScreen = true; - sprite = game.add.sprite(game.stage.centerX, game.stage.centerY, 'box'); - sprite.transform.origin.setTo(0, 0); + sprite = game.add.sprite(game.stage.centerX, game.stage.centerY, 'mummy'); + sprite.animations.add('walk'); + sprite.animations.play('walk', 20, true); + sprite.transform.scale.setTo(4, 4); game.input.onTap.add(rotateIt, this); } function rotateIt() { @@ -27,30 +28,19 @@ } } function render() { - var originX = sprite.transform.origin.x * sprite.width; - var originY = sprite.transform.origin.y * sprite.height; - var centerX = 0.5 * sprite.width; - var centerY = 0.5 * sprite.height; - var distanceX = originX - centerX; - var distanceY = originY - centerY; - var distance = Math.sqrt(((originX - centerX) * (originX - centerX)) + ((originY - centerY) * (originY - centerY))); - var px = sprite.x + distance * Math.cos(sprite.transform.rotation + 45 * Math.PI / 180); - var py = sprite.y + distance * Math.sin(sprite.transform.rotation + 45 * Math.PI / 180); game.stage.context.save(); - game.stage.context.fillStyle = 'rgb(255,255,0)'; - game.stage.context.fillText('rect width: ' + originX + ' height: ' + originY, 32, 32); - game.stage.context.fillText('center x: ' + centerX + ' centerY: ' + centerY, 32, 52); - game.stage.context.fillText('angle: ' + sprite.rotation, 32, 72); - game.stage.context.fillText('point of rotation x: ' + sprite.transform.origin.x + ' y: ' + sprite.transform.origin.y, 32, 92); - game.stage.context.fillText('x: ' + sprite.x + ' y: ' + sprite.y, sprite.x + 4, sprite.y); - game.stage.context.restore(); - game.stage.context.save(); - game.stage.context.fillStyle = 'rgba(255,255,255,0.1)'; - game.stage.context.beginPath(); - game.stage.context.moveTo(sprite.x, sprite.y); - game.stage.context.arc(sprite.x, sprite.y, distance, 0, Math.PI * 2); - game.stage.context.closePath(); - game.stage.context.fill(); + game.stage.context.fillStyle = 'rgb(255,0,255)'; + game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperLeft.x) + ' y: ' + Math.round(sprite.transform.upperLeft.y), sprite.transform.upperLeft.x, sprite.transform.upperLeft.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperRight.x) + ' y: ' + Math.round(sprite.transform.upperRight.y), sprite.transform.upperRight.x, sprite.transform.upperRight.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomLeft.x) + ' y: ' + Math.round(sprite.transform.bottomLeft.y), sprite.transform.bottomLeft.x, sprite.transform.bottomLeft.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomRight.x) + ' y: ' + Math.round(sprite.transform.bottomRight.y), sprite.transform.bottomRight.x, sprite.transform.bottomRight.y); + game.stage.context.fillRect(sprite.transform.center.x, sprite.transform.center.y, 2, 2); + game.stage.context.fillRect(sprite.transform.upperLeft.x, sprite.transform.upperLeft.y, 2, 2); + game.stage.context.fillRect(sprite.transform.upperRight.x, sprite.transform.upperRight.y, 2, 2); + game.stage.context.fillRect(sprite.transform.bottomLeft.x, sprite.transform.bottomLeft.y, 2, 2); + game.stage.context.fillRect(sprite.transform.bottomRight.x, sprite.transform.bottomRight.y, 2, 2); + game.stage.context.strokeStyle = 'rgb(255,255,0)'; + game.stage.context.strokeRect(sprite.cameraView.x, sprite.cameraView.y, sprite.cameraView.width, sprite.cameraView.height); game.stage.context.restore(); } })(); diff --git a/Tests/misc/point2.ts b/Tests/misc/point2.ts index ba3161e4..499f63d6 100644 --- a/Tests/misc/point2.ts +++ b/Tests/misc/point2.ts @@ -6,7 +6,7 @@ function init() { - game.load.image('box', 'assets/tests/320x200.png'); + game.load.spritesheet('mummy', 'assets/sprites/metalslug_mummy37x45.png', 37, 45, 18); game.load.start(); } @@ -17,11 +17,13 @@ function create() { game.stage.backgroundColor = 'rgb(0,0,0)'; - game.stage.disablePauseScreen = true; - sprite = game.add.sprite(game.stage.centerX, game.stage.centerY, 'box'); + sprite = game.add.sprite(game.stage.centerX, game.stage.centerY, 'mummy'); - sprite.transform.origin.setTo(0, 0); + sprite.animations.add('walk'); + sprite.animations.play('walk', 20, true); + + sprite.transform.scale.setTo(4, 4); game.input.onTap.add(rotateIt, this); @@ -42,33 +44,23 @@ function render() { - var originX: number = sprite.transform.origin.x * sprite.width; - var originY: number = sprite.transform.origin.y * sprite.height; - var centerX: number = 0.5 * sprite.width; - var centerY: number = 0.5 * sprite.height; - var distanceX: number = originX - centerX; - var distanceY: number = originY - centerY; - var distance: number = Math.sqrt(((originX - centerX) * (originX - centerX)) + ((originY - centerY) * (originY - centerY))); - - var px = sprite.x + distance * Math.cos(sprite.transform.rotation + 45 * Math.PI / 180); - var py = sprite.y + distance * Math.sin(sprite.transform.rotation + 45 * Math.PI / 180); - game.stage.context.save(); - game.stage.context.fillStyle = 'rgb(255,255,0)'; - game.stage.context.fillText('rect width: ' + originX + ' height: ' + originY, 32, 32); - game.stage.context.fillText('center x: ' + centerX + ' centerY: ' + centerY, 32, 52); - game.stage.context.fillText('angle: ' + sprite.rotation , 32, 72); - game.stage.context.fillText('point of rotation x: ' + sprite.transform.origin.x + ' y: ' + sprite.transform.origin.y, 32, 92); - game.stage.context.fillText('x: ' + sprite.x + ' y: ' + sprite.y, sprite.x + 4, sprite.y); - game.stage.context.restore(); + game.stage.context.fillStyle = 'rgb(255,0,255)'; + + game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperLeft.x) + ' y: ' + Math.round(sprite.transform.upperLeft.y), sprite.transform.upperLeft.x, sprite.transform.upperLeft.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperRight.x) + ' y: ' + Math.round(sprite.transform.upperRight.y), sprite.transform.upperRight.x, sprite.transform.upperRight.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomLeft.x) + ' y: ' + Math.round(sprite.transform.bottomLeft.y), sprite.transform.bottomLeft.x, sprite.transform.bottomLeft.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomRight.x) + ' y: ' + Math.round(sprite.transform.bottomRight.y), sprite.transform.bottomRight.x, sprite.transform.bottomRight.y); + + game.stage.context.fillRect(sprite.transform.center.x, sprite.transform.center.y, 2, 2); + game.stage.context.fillRect(sprite.transform.upperLeft.x, sprite.transform.upperLeft.y, 2, 2); + game.stage.context.fillRect(sprite.transform.upperRight.x, sprite.transform.upperRight.y, 2, 2); + game.stage.context.fillRect(sprite.transform.bottomLeft.x, sprite.transform.bottomLeft.y, 2, 2); + game.stage.context.fillRect(sprite.transform.bottomRight.x, sprite.transform.bottomRight.y, 2, 2); + + game.stage.context.strokeStyle = 'rgb(255,255,0)'; + game.stage.context.strokeRect(sprite.cameraView.x, sprite.cameraView.y, sprite.cameraView.width, sprite.cameraView.height); - game.stage.context.save(); - game.stage.context.fillStyle = 'rgba(255,255,255,0.1)'; - game.stage.context.beginPath(); - game.stage.context.moveTo(sprite.x, sprite.y); - game.stage.context.arc(sprite.x, sprite.y, distance, 0, Math.PI * 2); - game.stage.context.closePath(); - game.stage.context.fill(); game.stage.context.restore(); } diff --git a/Tests/misc/point3.js b/Tests/misc/point3.js index 5a0ce273..923e4ce0 100644 --- a/Tests/misc/point3.js +++ b/Tests/misc/point3.js @@ -2,16 +2,17 @@ (function () { var game = new Phaser.Game(this, 'game', 800, 600, init, create, update, render); function init() { - game.load.image('box', 'assets/tests/320x200.png'); + game.load.atlas('bot', 'assets/sprites/running_bot.png', null, botData); game.load.start(); } var sprite; var rotate = false; function create() { game.stage.backgroundColor = 'rgb(0,0,0)'; - game.stage.disablePauseScreen = true; - sprite = game.add.sprite(game.stage.centerX, game.stage.centerY, 'box'); - sprite.transform.origin.setTo(0.3, 0.8); + sprite = game.add.sprite(game.stage.centerX, game.stage.centerY, 'bot'); + sprite.animations.add('run', null, 10, true); + sprite.animations.play('run'); + //sprite.transform.scale.setTo(4, 4); game.input.onTap.add(rotateIt, this); } function rotateIt() { @@ -27,31 +28,20 @@ } } function render() { - var originX = sprite.transform.origin.x * sprite.width; - var originY = sprite.transform.origin.y * sprite.height; - var centerX = 0.5 * sprite.width; - var centerY = 0.5 * sprite.height; - var distanceX = originX - centerX; - var distanceY = originY - centerY; - var distance = Math.sqrt(((originX - centerX) * (originX - centerX)) + ((originY - centerY) * (originY - centerY))); - var px = sprite.x + distance * Math.cos(sprite.transform.rotation + 45 * Math.PI / 180); - var py = sprite.y + distance * Math.sin(sprite.transform.rotation + 45 * Math.PI / 180); game.stage.context.save(); - game.stage.context.fillStyle = 'rgb(255,255,0)'; - game.stage.context.fillText('rect width: ' + originX + ' height: ' + originY, 32, 32); - game.stage.context.fillText('center x: ' + centerX + ' centerY: ' + centerY, 32, 52); - game.stage.context.fillText('angle: ' + sprite.rotation, 32, 72); - game.stage.context.fillText('point of rotation x: ' + sprite.transform.origin.x + ' y: ' + sprite.transform.origin.y, 32, 92); - game.stage.context.fillText('sprite x: ' + sprite.x + ' sprite y: ' + sprite.y, 32, 112); - game.stage.context.fillRect(sprite.x, sprite.y, 2, 2); - game.stage.context.restore(); - game.stage.context.save(); - game.stage.context.fillStyle = 'rgba(255,255,255,0.1)'; - game.stage.context.beginPath(); - game.stage.context.moveTo(sprite.x, sprite.y); - game.stage.context.arc(sprite.x, sprite.y, distance, 0, Math.PI * 2); - game.stage.context.closePath(); - game.stage.context.fill(); + game.stage.context.fillStyle = 'rgb(255,0,255)'; + game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperLeft.x) + ' y: ' + Math.round(sprite.transform.upperLeft.y), sprite.transform.upperLeft.x, sprite.transform.upperLeft.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperRight.x) + ' y: ' + Math.round(sprite.transform.upperRight.y), sprite.transform.upperRight.x, sprite.transform.upperRight.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomLeft.x) + ' y: ' + Math.round(sprite.transform.bottomLeft.y), sprite.transform.bottomLeft.x, sprite.transform.bottomLeft.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomRight.x) + ' y: ' + Math.round(sprite.transform.bottomRight.y), sprite.transform.bottomRight.x, sprite.transform.bottomRight.y); + game.stage.context.fillRect(sprite.transform.center.x, sprite.transform.center.y, 2, 2); + game.stage.context.fillRect(sprite.transform.upperLeft.x, sprite.transform.upperLeft.y, 2, 2); + game.stage.context.fillRect(sprite.transform.upperRight.x, sprite.transform.upperRight.y, 2, 2); + game.stage.context.fillRect(sprite.transform.bottomLeft.x, sprite.transform.bottomLeft.y, 2, 2); + game.stage.context.fillRect(sprite.transform.bottomRight.x, sprite.transform.bottomRight.y, 2, 2); + game.stage.context.strokeStyle = 'rgb(255,255,0)'; + game.stage.context.strokeRect(sprite.cameraView.x, sprite.cameraView.y, sprite.cameraView.width, sprite.cameraView.height); game.stage.context.restore(); } + var botData = '{"frames": [{"filename": "running bot.swf/0000","frame": { "x": 34, "y": 128, "w": 56, "h": 60 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 0, "y": 2, "w": 56, "h": 60 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0001","frame": { "x": 54, "y": 0, "w": 56, "h": 58 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 0, "y": 3, "w": 56, "h": 58 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0002","frame": { "x": 54, "y": 58, "w": 56, "h": 58 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 0, "y": 3, "w": 56, "h": 58 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0003","frame": { "x": 0, "y": 192, "w": 34, "h": 64 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 11, "y": 0, "w": 34, "h": 64 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0004","frame": { "x": 0, "y": 64, "w": 54, "h": 64 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 1, "y": 0, "w": 54, "h": 64 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0005","frame": { "x": 196, "y": 0, "w": 56, "h": 58 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 0, "y": 3, "w": 56, "h": 58 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0006","frame": { "x": 0, "y": 0, "w": 54, "h": 64 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 1, "y": 0, "w": 54, "h": 64 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0007","frame": { "x": 140, "y": 0, "w": 56, "h": 58 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 0, "y": 3, "w": 56, "h": 58 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0008","frame": { "x": 34, "y": 188, "w": 50, "h": 60 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 3, "y": 2, "w": 50, "h": 60 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0009","frame": { "x": 0, "y": 128, "w": 34, "h": 64 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 11, "y": 0, "w": 34, "h": 64 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0010","frame": { "x": 84, "y": 188, "w": 56, "h": 58 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 0, "y": 3, "w": 56, "h": 58 },"sourceSize": { "w": 56, "h": 64 }}]}'; })(); diff --git a/Tests/misc/point3.ts b/Tests/misc/point3.ts index 388acec8..3fd9752f 100644 --- a/Tests/misc/point3.ts +++ b/Tests/misc/point3.ts @@ -6,7 +6,7 @@ function init() { - game.load.image('box', 'assets/tests/320x200.png'); + game.load.atlas('bot', 'assets/sprites/running_bot.png', null, botData); game.load.start(); } @@ -17,11 +17,14 @@ function create() { game.stage.backgroundColor = 'rgb(0,0,0)'; - game.stage.disablePauseScreen = true; - sprite = game.add.sprite(game.stage.centerX, game.stage.centerY, 'box'); + sprite = game.add.sprite(game.stage.centerX, game.stage.centerY, 'bot'); - sprite.transform.origin.setTo(0.3, 0.8); + sprite.animations.add('run', null, 10, true); + + sprite.animations.play('run'); + + //sprite.transform.scale.setTo(4, 4); game.input.onTap.add(rotateIt, this); @@ -42,36 +45,27 @@ function render() { - var originX: number = sprite.transform.origin.x * sprite.width; - var originY: number = sprite.transform.origin.y * sprite.height; - var centerX: number = 0.5 * sprite.width; - var centerY: number = 0.5 * sprite.height; - var distanceX: number = originX - centerX; - var distanceY: number = originY - centerY; - var distance: number = Math.sqrt(((originX - centerX) * (originX - centerX)) + ((originY - centerY) * (originY - centerY))); - - var px = sprite.x + distance * Math.cos(sprite.transform.rotation + 45 * Math.PI / 180); - var py = sprite.y + distance * Math.sin(sprite.transform.rotation + 45 * Math.PI / 180); - game.stage.context.save(); - game.stage.context.fillStyle = 'rgb(255,255,0)'; - game.stage.context.fillText('rect width: ' + originX + ' height: ' + originY, 32, 32); - game.stage.context.fillText('center x: ' + centerX + ' centerY: ' + centerY, 32, 52); - game.stage.context.fillText('angle: ' + sprite.rotation , 32, 72); - game.stage.context.fillText('point of rotation x: ' + sprite.transform.origin.x + ' y: ' + sprite.transform.origin.y, 32, 92); - game.stage.context.fillText('sprite x: ' + sprite.x + ' sprite y: ' + sprite.y, 32, 112); - game.stage.context.fillRect(sprite.x, sprite.y, 2, 2); - game.stage.context.restore(); + game.stage.context.fillStyle = 'rgb(255,0,255)'; + + game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperLeft.x) + ' y: ' + Math.round(sprite.transform.upperLeft.y), sprite.transform.upperLeft.x, sprite.transform.upperLeft.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.upperRight.x) + ' y: ' + Math.round(sprite.transform.upperRight.y), sprite.transform.upperRight.x, sprite.transform.upperRight.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomLeft.x) + ' y: ' + Math.round(sprite.transform.bottomLeft.y), sprite.transform.bottomLeft.x, sprite.transform.bottomLeft.y); + game.stage.context.fillText('x: ' + Math.round(sprite.transform.bottomRight.x) + ' y: ' + Math.round(sprite.transform.bottomRight.y), sprite.transform.bottomRight.x, sprite.transform.bottomRight.y); + + game.stage.context.fillRect(sprite.transform.center.x, sprite.transform.center.y, 2, 2); + game.stage.context.fillRect(sprite.transform.upperLeft.x, sprite.transform.upperLeft.y, 2, 2); + game.stage.context.fillRect(sprite.transform.upperRight.x, sprite.transform.upperRight.y, 2, 2); + game.stage.context.fillRect(sprite.transform.bottomLeft.x, sprite.transform.bottomLeft.y, 2, 2); + game.stage.context.fillRect(sprite.transform.bottomRight.x, sprite.transform.bottomRight.y, 2, 2); + + game.stage.context.strokeStyle = 'rgb(255,255,0)'; + game.stage.context.strokeRect(sprite.cameraView.x, sprite.cameraView.y, sprite.cameraView.width, sprite.cameraView.height); - game.stage.context.save(); - game.stage.context.fillStyle = 'rgba(255,255,255,0.1)'; - game.stage.context.beginPath(); - game.stage.context.moveTo(sprite.x, sprite.y); - game.stage.context.arc(sprite.x, sprite.y, distance, 0, Math.PI * 2); - game.stage.context.closePath(); - game.stage.context.fill(); game.stage.context.restore(); } + var botData = '{"frames": [{"filename": "running bot.swf/0000","frame": { "x": 34, "y": 128, "w": 56, "h": 60 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 0, "y": 2, "w": 56, "h": 60 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0001","frame": { "x": 54, "y": 0, "w": 56, "h": 58 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 0, "y": 3, "w": 56, "h": 58 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0002","frame": { "x": 54, "y": 58, "w": 56, "h": 58 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 0, "y": 3, "w": 56, "h": 58 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0003","frame": { "x": 0, "y": 192, "w": 34, "h": 64 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 11, "y": 0, "w": 34, "h": 64 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0004","frame": { "x": 0, "y": 64, "w": 54, "h": 64 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 1, "y": 0, "w": 54, "h": 64 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0005","frame": { "x": 196, "y": 0, "w": 56, "h": 58 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 0, "y": 3, "w": 56, "h": 58 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0006","frame": { "x": 0, "y": 0, "w": 54, "h": 64 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 1, "y": 0, "w": 54, "h": 64 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0007","frame": { "x": 140, "y": 0, "w": 56, "h": 58 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 0, "y": 3, "w": 56, "h": 58 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0008","frame": { "x": 34, "y": 188, "w": 50, "h": 60 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 3, "y": 2, "w": 50, "h": 60 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0009","frame": { "x": 0, "y": 128, "w": 34, "h": 64 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 11, "y": 0, "w": 34, "h": 64 },"sourceSize": { "w": 56, "h": 64 }},{"filename": "running bot.swf/0010","frame": { "x": 84, "y": 188, "w": 56, "h": 58 },"rotated": false,"trimmed": true,"spriteSourceSize": { "x": 0, "y": 3, "w": 56, "h": 58 },"sourceSize": { "w": 56, "h": 64 }}]}'; + })(); diff --git a/Tests/phaser.js b/Tests/phaser.js index cc94bbce..5895e09e 100644 --- a/Tests/phaser.js +++ b/Tests/phaser.js @@ -3060,8 +3060,8 @@ var Phaser; (function (Components) { var Transform = (function () { /** - * Creates a new Sprite Transform component - * @param parent The Sprite using this transform + * Creates a new Transform component + * @param parent The game object using this transform */ function Transform(parent) { /** @@ -3096,7 +3096,10 @@ var Phaser; this._sc = new Phaser.Point(); this._scA = new Phaser.Point(); } - Transform.prototype.setCache = function () { + Transform.prototype.setCache = /** + * Populates the transform cache. Called by the parent object on creation. + */ + function () { this._pos.x = this.parent.x; this._pos.y = this.parent.y; this._halfSize.x = this.parent.width / 2; @@ -3121,13 +3124,19 @@ var Phaser; this._sc.x = 0; this._sc.y = 1; } - this.center.setTo(this.center.x, this.center.y); + this.center.x = this.parent.x + this._distance * this._scA.y; + this.center.y = this.parent.y + this._distance * this._scA.x; this.upperLeft.setTo(this.center.x - this._halfSize.x * this._sc.y + this._halfSize.y * this._sc.x, this.center.y - this._halfSize.y * this._sc.y - this._halfSize.x * this._sc.x); this.upperRight.setTo(this.center.x + this._halfSize.x * this._sc.y + this._halfSize.y * this._sc.x, this.center.y - this._halfSize.y * this._sc.y + this._halfSize.x * this._sc.x); this.bottomLeft.setTo(this.center.x - this._halfSize.x * this._sc.y - this._halfSize.y * this._sc.x, this.center.y + this._halfSize.y * this._sc.y - this._halfSize.x * this._sc.x); this.bottomRight.setTo(this.center.x + this._halfSize.x * this._sc.y - this._halfSize.y * this._sc.x, this.center.y + this._halfSize.y * this._sc.y + this._halfSize.x * this._sc.x); + this._pos.x = this.parent.x; + this._pos.y = this.parent.y; }; - Transform.prototype.update = function () { + Transform.prototype.update = /** + * Updates the local transform matrix and the cache values if anything has changed in the parent. + */ + function () { // Check cache var dirty = false; // 1) Height or Width change (also triggered by a change in scale) or an Origin change @@ -3166,7 +3175,6 @@ var Phaser; if(dirty || this.parent.x != this._pos.x || this.parent.y != this._pos.y) { this.center.x = this.parent.x + this._distance * this._scA.y; this.center.y = this.parent.y + this._distance * this._scA.x; - this.center.setTo(this.center.x, this.center.y); this.upperLeft.setTo(this.center.x - this._halfSize.x * this._sc.y + this._halfSize.y * this._sc.x, this.center.y - this._halfSize.y * this._sc.y - this._halfSize.x * this._sc.x); this.upperRight.setTo(this.center.x + this._halfSize.x * this._sc.y + this._halfSize.y * this._sc.x, this.center.y - this._halfSize.y * this._sc.y + this._halfSize.x * this._sc.x); this.bottomLeft.setTo(this.center.x - this._halfSize.x * this._sc.y - this._halfSize.y * this._sc.x, this.center.y + this._halfSize.y * this._sc.y - this._halfSize.x * this._sc.x); @@ -3255,17 +3263,8 @@ var Phaser; }); Object.defineProperty(Transform.prototype, "sin", { get: /** - * The center of the Sprite in world coordinates, after taking scaling and rotation into consideration + * The equivalent of Math.sin(rotation + rotationOffset) */ - //public get centerX(): number { - // return this.center.x; - //} - /** - * The center of the Sprite in world coordinates, after taking scaling and rotation into consideration - */ - //public get centerY(): number { - // return this.center.y; - //} function () { return this._sc.x; }, @@ -3273,7 +3272,10 @@ var Phaser; configurable: true }); Object.defineProperty(Transform.prototype, "cos", { - get: function () { + get: /** + * The equivalent of Math.cos(rotation + rotationOffset) + */ + function () { return this._sc.y; }, enumerable: true, @@ -4681,35 +4683,12 @@ var Phaser; sprite.cameraView.x = Math.round(sprite.x - (camera.worldView.x * sprite.transform.scrollFactor.x) - (sprite.cameraView.width * sprite.transform.origin.x)); sprite.cameraView.y = Math.round(sprite.y - (camera.worldView.y * sprite.transform.scrollFactor.y) - (sprite.cameraView.height * sprite.transform.origin.y)); } else { - //var left:Number = Math.min(topLeft.x, topRight.x, bottomRight.x, bottomLeft.x); - //var top:Number = Math.min(topLeft.y, topRight.y, bottomRight.y, bottomLeft.y); - //var right:Number = Math.max(topLeft.x, topRight.x, bottomRight.x, bottomLeft.x); - //var bottom:Number = Math.max(topLeft.y, topRight.y, bottomRight.y, bottomLeft.y); - //return new Rectangle(left, top, right - left, bottom - top); - var minX = Math.min(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); - var minY = Math.min(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); - var maxX = Math.max(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); - var maxY = Math.max(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); - // (min_x,min_y), (min_x,max_y), (max_x,max_y), (max_x,min_y) - sprite.cameraView.x = minX; - sprite.cameraView.y = minY; - sprite.cameraView.width = maxX - minX; - sprite.cameraView.height = maxY - minY; - /* - // Useful to get the maximum AABB size of any given rect - - If you want a single box that covers all angles, just take the half-diagonal of your existing box as the radius of a circle. - The new box has to contain this circle, so it should be a square with side-length equal to twice the radius - (equiv. the diagonal of the original AABB) and with the same center as the original. - */ - } + sprite.cameraView.x = Math.min(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); + sprite.cameraView.y = Math.min(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); + sprite.cameraView.width = Math.max(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x) - sprite.cameraView.x; + sprite.cameraView.height = Math.max(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y) - sprite.cameraView.y; + } } - if(sprite.animations.currentFrame !== null && sprite.animations.currentFrame.trimmed) { - //sprite.cameraView.x += sprite.animations.currentFrame.spriteSourceSizeX; - //sprite.cameraView.y += sprite.animations.currentFrame.spriteSourceSizeY; - //this._dw = sprite.animations.currentFrame.spriteSourceSizeW; - //this._dh = sprite.animations.currentFrame.spriteSourceSizeH; - } return sprite.cameraView; }; SpriteUtils.getAsPoints = function getAsPoints(sprite) { @@ -4724,7 +4703,7 @@ var Phaser; out.push(new Phaser.Point(sprite.x, sprite.y + sprite.height)); return out; }; - SpriteUtils.overlapsPoint = /** + SpriteUtils.overlapsXY = /** * Checks to see if some GameObject overlaps this GameObject or Group. * If the group has a LOT of things in it, it might be faster to use Collision.overlaps(). * WARNING: Currently tilemaps do NOT support screen space overlap checks! @@ -4777,7 +4756,7 @@ var Phaser; */ /** * Checks to see if this GameObject were located at the given position, would it overlap the GameObject or Group? - * This is distinct from overlapsPoint(), which just checks that point, rather than taking the object's size numbero account. + * This is distinct from overlapsPoint(), which just checks that point, rather than taking the object's size into account. * WARNING: Currently tilemaps do NOT support screen space overlap checks! * * @param X {number} The X position you want to check. Pretends this object (the caller, not the parameter) is located here. @@ -4832,6 +4811,43 @@ var Phaser; } */ /** + * Checks to see if the given x and y coordinates overlaps this Sprite, taking scaling and rotation into account. + * The coordinates must be given in world space, not local or camera space. + * + * @param sprite {Sprite} The Sprite to check. It will take scaling and rotation into account. + * @param x {Number} The x coordinate in world space. + * @param y {Number} The y coordinate in world space. + * + * @return Whether or not the point overlaps this object. + */ + function overlapsXY(sprite, x, y) { + // if rotation == 0 then just do a rect check instead! + if(sprite.transform.rotation == 0) { + return Phaser.RectangleUtils.contains(sprite.cameraView, x, y); + } + //var ex: number = sprite.transform.upperRight.x - sprite.transform.upperLeft.x; + //var ey: number = sprite.transform.upperRight.y - sprite.transform.upperLeft.y; + //var fx: number = sprite.transform.bottomLeft.x - sprite.transform.upperLeft.x; + //var fy: number = sprite.transform.bottomLeft.y - sprite.transform.upperLeft.y; + //if ((x-ax)*ex+(y-ay)*ey<0.0) return false; + if((x - sprite.transform.upperLeft.x) * (sprite.transform.upperRight.x - sprite.transform.upperLeft.x) + (y - sprite.transform.upperLeft.y) * (sprite.transform.upperRight.y - sprite.transform.upperLeft.y) < 0) { + return false; + } + //if ((x-bx)*ex+(y-by)*ey>0.0) return false; + if((x - sprite.transform.upperRight.x) * (sprite.transform.upperRight.x - sprite.transform.upperLeft.x) + (y - sprite.transform.upperRight.y) * (sprite.transform.upperRight.y - sprite.transform.upperLeft.y) > 0) { + return false; + } + //if ((x-ax)*fx+(y-ay)*fy<0.0) return false; + if((x - sprite.transform.upperLeft.x) * (sprite.transform.bottomLeft.x - sprite.transform.upperLeft.x) + (y - sprite.transform.upperLeft.y) * (sprite.transform.bottomLeft.y - sprite.transform.upperLeft.y) < 0) { + return false; + } + //if ((x-dx)*fx+(y-dy)*fy>0.0) return false; + if((x - sprite.transform.bottomLeft.x) * (sprite.transform.bottomLeft.x - sprite.transform.upperLeft.x) + (y - sprite.transform.bottomLeft.y) * (sprite.transform.bottomLeft.y - sprite.transform.upperLeft.y) > 0) { + return false; + } + return true; + }; + SpriteUtils.overlapsPoint = /** * Checks to see if a point in 2D world space overlaps this GameObject. * * @param point {Point} The point in world space you want to check. @@ -16574,9 +16590,8 @@ var Phaser; if(sprite.transform.scrollFactor.equals(0)) { return true; } - return true; - //return RectangleUtils.intersects(sprite.cameraView, camera.screenView); - }; + return Phaser.RectangleUtils.intersects(sprite.cameraView, camera.screenView); + }; CanvasRenderer.prototype.inScreen = function (camera) { return true; }; diff --git a/build/phaser.d.ts b/build/phaser.d.ts index f6229317..768901fe 100644 --- a/build/phaser.d.ts +++ b/build/phaser.d.ts @@ -1892,8 +1892,8 @@ module Phaser { module Phaser.Components { class Transform { /** - * Creates a new Sprite Transform component - * @param parent The Sprite using this transform + * Creates a new Transform component + * @param parent The game object using this transform */ constructor(parent); private _rotation; @@ -1908,13 +1908,37 @@ module Phaser.Components { private _angle; private _distance; private _prevRotation; + /** + * The center of the Sprite in world coordinates, after taking scaling and rotation into consideration + */ public center: Point; + /** + * The upper-left corner of the Sprite in world coordinates, after taking scaling and rotation into consideration + */ public upperLeft: Point; + /** + * The upper-right corner of the Sprite in world coordinates, after taking scaling and rotation into consideration + */ public upperRight: Point; + /** + * The bottom-left corner of the Sprite in world coordinates, after taking scaling and rotation into consideration + */ public bottomLeft: Point; + /** + * The bottom-right corner of the Sprite in world coordinates, after taking scaling and rotation into consideration + */ public bottomRight: Point; + /** + * The local transform matrix + */ public local: Mat3; + /** + * Populates the transform cache. Called by the parent object on creation. + */ public setCache(): void; + /** + * Updates the local transform matrix and the cache values if anything has changed in the parent. + */ public update(): void; /** * Reference to Phaser.Game @@ -1975,7 +1999,13 @@ module Phaser.Components { * Half the height of the parent sprite, taking into consideration scaling */ public halfHeight : number; + /** + * The equivalent of Math.sin(rotation + rotationOffset) + */ public sin : number; + /** + * The equivalent of Math.cos(rotation + rotationOffset) + */ public cos : number; } } @@ -2705,6 +2735,17 @@ module Phaser { static updateCameraView(camera: Camera, sprite: Sprite): Rectangle; static getAsPoints(sprite: Sprite): Point[]; /** + * Checks to see if the given x and y coordinates overlaps this Sprite, taking scaling and rotation into account. + * The coordinates must be given in world space, not local or camera space. + * + * @param sprite {Sprite} The Sprite to check. It will take scaling and rotation into account. + * @param x {Number} The x coordinate in world space. + * @param y {Number} The y coordinate in world space. + * + * @return Whether or not the point overlaps this object. + */ + static overlapsXY(sprite: Sprite, x: number, y: number): bool; + /** * Checks to see if a point in 2D world space overlaps this GameObject. * * @param point {Point} The point in world space you want to check. diff --git a/build/phaser.js b/build/phaser.js index cc94bbce..5895e09e 100644 --- a/build/phaser.js +++ b/build/phaser.js @@ -3060,8 +3060,8 @@ var Phaser; (function (Components) { var Transform = (function () { /** - * Creates a new Sprite Transform component - * @param parent The Sprite using this transform + * Creates a new Transform component + * @param parent The game object using this transform */ function Transform(parent) { /** @@ -3096,7 +3096,10 @@ var Phaser; this._sc = new Phaser.Point(); this._scA = new Phaser.Point(); } - Transform.prototype.setCache = function () { + Transform.prototype.setCache = /** + * Populates the transform cache. Called by the parent object on creation. + */ + function () { this._pos.x = this.parent.x; this._pos.y = this.parent.y; this._halfSize.x = this.parent.width / 2; @@ -3121,13 +3124,19 @@ var Phaser; this._sc.x = 0; this._sc.y = 1; } - this.center.setTo(this.center.x, this.center.y); + this.center.x = this.parent.x + this._distance * this._scA.y; + this.center.y = this.parent.y + this._distance * this._scA.x; this.upperLeft.setTo(this.center.x - this._halfSize.x * this._sc.y + this._halfSize.y * this._sc.x, this.center.y - this._halfSize.y * this._sc.y - this._halfSize.x * this._sc.x); this.upperRight.setTo(this.center.x + this._halfSize.x * this._sc.y + this._halfSize.y * this._sc.x, this.center.y - this._halfSize.y * this._sc.y + this._halfSize.x * this._sc.x); this.bottomLeft.setTo(this.center.x - this._halfSize.x * this._sc.y - this._halfSize.y * this._sc.x, this.center.y + this._halfSize.y * this._sc.y - this._halfSize.x * this._sc.x); this.bottomRight.setTo(this.center.x + this._halfSize.x * this._sc.y - this._halfSize.y * this._sc.x, this.center.y + this._halfSize.y * this._sc.y + this._halfSize.x * this._sc.x); + this._pos.x = this.parent.x; + this._pos.y = this.parent.y; }; - Transform.prototype.update = function () { + Transform.prototype.update = /** + * Updates the local transform matrix and the cache values if anything has changed in the parent. + */ + function () { // Check cache var dirty = false; // 1) Height or Width change (also triggered by a change in scale) or an Origin change @@ -3166,7 +3175,6 @@ var Phaser; if(dirty || this.parent.x != this._pos.x || this.parent.y != this._pos.y) { this.center.x = this.parent.x + this._distance * this._scA.y; this.center.y = this.parent.y + this._distance * this._scA.x; - this.center.setTo(this.center.x, this.center.y); this.upperLeft.setTo(this.center.x - this._halfSize.x * this._sc.y + this._halfSize.y * this._sc.x, this.center.y - this._halfSize.y * this._sc.y - this._halfSize.x * this._sc.x); this.upperRight.setTo(this.center.x + this._halfSize.x * this._sc.y + this._halfSize.y * this._sc.x, this.center.y - this._halfSize.y * this._sc.y + this._halfSize.x * this._sc.x); this.bottomLeft.setTo(this.center.x - this._halfSize.x * this._sc.y - this._halfSize.y * this._sc.x, this.center.y + this._halfSize.y * this._sc.y - this._halfSize.x * this._sc.x); @@ -3255,17 +3263,8 @@ var Phaser; }); Object.defineProperty(Transform.prototype, "sin", { get: /** - * The center of the Sprite in world coordinates, after taking scaling and rotation into consideration + * The equivalent of Math.sin(rotation + rotationOffset) */ - //public get centerX(): number { - // return this.center.x; - //} - /** - * The center of the Sprite in world coordinates, after taking scaling and rotation into consideration - */ - //public get centerY(): number { - // return this.center.y; - //} function () { return this._sc.x; }, @@ -3273,7 +3272,10 @@ var Phaser; configurable: true }); Object.defineProperty(Transform.prototype, "cos", { - get: function () { + get: /** + * The equivalent of Math.cos(rotation + rotationOffset) + */ + function () { return this._sc.y; }, enumerable: true, @@ -4681,35 +4683,12 @@ var Phaser; sprite.cameraView.x = Math.round(sprite.x - (camera.worldView.x * sprite.transform.scrollFactor.x) - (sprite.cameraView.width * sprite.transform.origin.x)); sprite.cameraView.y = Math.round(sprite.y - (camera.worldView.y * sprite.transform.scrollFactor.y) - (sprite.cameraView.height * sprite.transform.origin.y)); } else { - //var left:Number = Math.min(topLeft.x, topRight.x, bottomRight.x, bottomLeft.x); - //var top:Number = Math.min(topLeft.y, topRight.y, bottomRight.y, bottomLeft.y); - //var right:Number = Math.max(topLeft.x, topRight.x, bottomRight.x, bottomLeft.x); - //var bottom:Number = Math.max(topLeft.y, topRight.y, bottomRight.y, bottomLeft.y); - //return new Rectangle(left, top, right - left, bottom - top); - var minX = Math.min(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); - var minY = Math.min(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); - var maxX = Math.max(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); - var maxY = Math.max(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); - // (min_x,min_y), (min_x,max_y), (max_x,max_y), (max_x,min_y) - sprite.cameraView.x = minX; - sprite.cameraView.y = minY; - sprite.cameraView.width = maxX - minX; - sprite.cameraView.height = maxY - minY; - /* - // Useful to get the maximum AABB size of any given rect - - If you want a single box that covers all angles, just take the half-diagonal of your existing box as the radius of a circle. - The new box has to contain this circle, so it should be a square with side-length equal to twice the radius - (equiv. the diagonal of the original AABB) and with the same center as the original. - */ - } + sprite.cameraView.x = Math.min(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x); + sprite.cameraView.y = Math.min(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y); + sprite.cameraView.width = Math.max(sprite.transform.upperLeft.x, sprite.transform.upperRight.x, sprite.transform.bottomLeft.x, sprite.transform.bottomRight.x) - sprite.cameraView.x; + sprite.cameraView.height = Math.max(sprite.transform.upperLeft.y, sprite.transform.upperRight.y, sprite.transform.bottomLeft.y, sprite.transform.bottomRight.y) - sprite.cameraView.y; + } } - if(sprite.animations.currentFrame !== null && sprite.animations.currentFrame.trimmed) { - //sprite.cameraView.x += sprite.animations.currentFrame.spriteSourceSizeX; - //sprite.cameraView.y += sprite.animations.currentFrame.spriteSourceSizeY; - //this._dw = sprite.animations.currentFrame.spriteSourceSizeW; - //this._dh = sprite.animations.currentFrame.spriteSourceSizeH; - } return sprite.cameraView; }; SpriteUtils.getAsPoints = function getAsPoints(sprite) { @@ -4724,7 +4703,7 @@ var Phaser; out.push(new Phaser.Point(sprite.x, sprite.y + sprite.height)); return out; }; - SpriteUtils.overlapsPoint = /** + SpriteUtils.overlapsXY = /** * Checks to see if some GameObject overlaps this GameObject or Group. * If the group has a LOT of things in it, it might be faster to use Collision.overlaps(). * WARNING: Currently tilemaps do NOT support screen space overlap checks! @@ -4777,7 +4756,7 @@ var Phaser; */ /** * Checks to see if this GameObject were located at the given position, would it overlap the GameObject or Group? - * This is distinct from overlapsPoint(), which just checks that point, rather than taking the object's size numbero account. + * This is distinct from overlapsPoint(), which just checks that point, rather than taking the object's size into account. * WARNING: Currently tilemaps do NOT support screen space overlap checks! * * @param X {number} The X position you want to check. Pretends this object (the caller, not the parameter) is located here. @@ -4832,6 +4811,43 @@ var Phaser; } */ /** + * Checks to see if the given x and y coordinates overlaps this Sprite, taking scaling and rotation into account. + * The coordinates must be given in world space, not local or camera space. + * + * @param sprite {Sprite} The Sprite to check. It will take scaling and rotation into account. + * @param x {Number} The x coordinate in world space. + * @param y {Number} The y coordinate in world space. + * + * @return Whether or not the point overlaps this object. + */ + function overlapsXY(sprite, x, y) { + // if rotation == 0 then just do a rect check instead! + if(sprite.transform.rotation == 0) { + return Phaser.RectangleUtils.contains(sprite.cameraView, x, y); + } + //var ex: number = sprite.transform.upperRight.x - sprite.transform.upperLeft.x; + //var ey: number = sprite.transform.upperRight.y - sprite.transform.upperLeft.y; + //var fx: number = sprite.transform.bottomLeft.x - sprite.transform.upperLeft.x; + //var fy: number = sprite.transform.bottomLeft.y - sprite.transform.upperLeft.y; + //if ((x-ax)*ex+(y-ay)*ey<0.0) return false; + if((x - sprite.transform.upperLeft.x) * (sprite.transform.upperRight.x - sprite.transform.upperLeft.x) + (y - sprite.transform.upperLeft.y) * (sprite.transform.upperRight.y - sprite.transform.upperLeft.y) < 0) { + return false; + } + //if ((x-bx)*ex+(y-by)*ey>0.0) return false; + if((x - sprite.transform.upperRight.x) * (sprite.transform.upperRight.x - sprite.transform.upperLeft.x) + (y - sprite.transform.upperRight.y) * (sprite.transform.upperRight.y - sprite.transform.upperLeft.y) > 0) { + return false; + } + //if ((x-ax)*fx+(y-ay)*fy<0.0) return false; + if((x - sprite.transform.upperLeft.x) * (sprite.transform.bottomLeft.x - sprite.transform.upperLeft.x) + (y - sprite.transform.upperLeft.y) * (sprite.transform.bottomLeft.y - sprite.transform.upperLeft.y) < 0) { + return false; + } + //if ((x-dx)*fx+(y-dy)*fy>0.0) return false; + if((x - sprite.transform.bottomLeft.x) * (sprite.transform.bottomLeft.x - sprite.transform.upperLeft.x) + (y - sprite.transform.bottomLeft.y) * (sprite.transform.bottomLeft.y - sprite.transform.upperLeft.y) > 0) { + return false; + } + return true; + }; + SpriteUtils.overlapsPoint = /** * Checks to see if a point in 2D world space overlaps this GameObject. * * @param point {Point} The point in world space you want to check. @@ -16574,9 +16590,8 @@ var Phaser; if(sprite.transform.scrollFactor.equals(0)) { return true; } - return true; - //return RectangleUtils.intersects(sprite.cameraView, camera.screenView); - }; + return Phaser.RectangleUtils.intersects(sprite.cameraView, camera.screenView); + }; CanvasRenderer.prototype.inScreen = function (camera) { return true; };