wassname/phaser
1
0
Fork 0
mirror of https://github.com/wassname/phaser.git synced 2026-08-12 12:20:38 +08:00
Code Issues Packages Projects Releases Wiki Activity

New Texture and Transform components which are now used by Sprite, Group and Camera.

Browse Source
This commit is contained in:
Richard Davey
2013-06-06 02:47:08 +01:00
parent 2f03f5fc43
commit 730594835a
89 changed files with 11304 additions and 10111 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Phaser/Motion.ts
+8 -8
View File
@@ -210,8 +210,8 @@ module Phaser {
* @return {number} Distance (in pixels)
*/
public distanceToPoint(a: Sprite, target: Point): number {
var dx: number = (a.x + a.origin.x) - (target.x);
var dy: number = (a.y + a.origin.y) - (target.y);
var dx: number = (a.x + a.transform.origin.x) - (target.x);
var dy: number = (a.y + a.transform.origin.y) - (target.y);
return this.game.math.vectorLength(dx, dy);
}
@@ -223,8 +223,8 @@ module Phaser {
* @return {number} The distance between the given sprite and the mouse coordinates
*/
public distanceToMouse(a: Sprite): number {
var dx: number = (a.x + a.origin.x) - this.game.input.x;
var dy: number = (a.y + a.origin.y) - this.game.input.y;
var dx: number = (a.x + a.transform.origin.x) - this.game.input.x;
var dy: number = (a.y + a.transform.origin.y) - this.game.input.y;
return this.game.math.vectorLength(dx, dy);
}
@@ -240,8 +240,8 @@ module Phaser {
* @return {number} The angle (in radians unless asDegrees is true)
*/
public angleBetweenPoint(a: Sprite, target: Point, asDegrees: bool = false): number {
var dx: number = (target.x) - (a.x + a.origin.x);
var dy: number = (target.y) - (a.y + a.origin.y);
var dx: number = (target.x) - (a.x + a.transform.origin.x);
var dy: number = (target.y) - (a.y + a.transform.origin.y);
if (asDegrees)
{
@@ -265,8 +265,8 @@ module Phaser {
*/
public angleBetween(a: Sprite, b: Sprite, asDegrees: bool = false): number {
var dx: number = (b.x + b.origin.x) - (a.x + a.origin.x);
var dy: number = (b.y + b.origin.y) - (a.y + a.origin.y);
var dx: number = (b.x + b.transform.origin.x) - (a.x + a.transform.origin.x);
var dy: number = (b.y + b.transform.origin.y) - (a.y + a.transform.origin.y);
if (asDegrees)
{
Phaser/Phaser.csproj
+8 -4
View File
@@ -74,22 +74,26 @@
<Content Include="components\sprite\Input.js">
<DependentUpon>Input.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="components\Texture.ts" />
<Content Include="components\Texture.js">
<DependentUpon>Texture.ts</DependentUpon>
</Content>
<Content Include="components\Tile.ts" />
<Content Include="components\TilemapLayer.ts" />
<TypeScriptCompile Include="components\Transform.ts" />
<Content Include="components\Transform.js">
<DependentUpon>Transform.ts</DependentUpon>
</Content>
<Content Include="Game.js">
<DependentUpon>Game.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="core\Rectangle.ts" />
<TypeScriptCompile Include="core\Point.ts" />
<TypeScriptCompile Include="components\sprite\Texture.ts" />
<TypeScriptCompile Include="components\camera\CameraFX.ts" />
<Content Include="components\camera\CameraFX.js">
<DependentUpon>CameraFX.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="components\ScrollRegion.ts" />
<Content Include="components\sprite\Texture.js">
<DependentUpon>Texture.ts</DependentUpon>
</Content>
<Content Include="core\Point.js">
<DependentUpon>Point.ts</DependentUpon>
</Content>
Phaser/Stage.ts
+10 -1
View File
@@ -53,7 +53,7 @@ module Phaser {
this.context = this.canvas.getContext('2d');
this.scaleMode = StageScaleMode.NO_SCALE;
this.scale = new StageScaleMode(this._game);
this.scale = new StageScaleMode(this._game, width, height);
this.getOffset(this.canvas);
this.bounds = new Rectangle(this.offset.x, this.offset.y, width, height);
@@ -167,6 +167,8 @@ module Phaser {
this.pauseScreen = new PauseScreen(this._game, this.width, this.height);
this.orientationScreen = new OrientationScreen(this._game);
this.scale.setScreenSize(true);
}
/**
@@ -253,6 +255,13 @@ module Phaser {
}
public setImageRenderingCrisp() {
this.canvas.style['image-rendering'] = 'crisp-edges';
this.canvas.style['image-rendering'] = '-moz-crisp-edges';
this.canvas.style['image-rendering'] = '-webkit-optimize-contrast';
this.canvas.style['-ms-interpolation-mode'] = 'nearest-neighbor';
}
public pauseGame() {
if (this.disablePauseScreen == false && this.pauseScreen)
Phaser/Statics.ts
+1 -1
View File
@@ -20,7 +20,7 @@ module Phaser {
static GEOM_POINT: number = 0;
static GEOM_CIRCLE: number = 1;
static GEOM_RECTANGLE: number = 2;
static GEOM_Rectangle: number = 2;
static GEOM_LINE: number = 3;
static GEOM_POLYGON: number = 4;
Phaser/cameras/Camera.ts
+140 -267
View File
@@ -1,9 +1,11 @@
/// <reference path="../Game.ts" />
/// <reference path="../core/Point.ts" />
/// <reference path="../core/Rectangle.ts" />
/// <reference path="../core/Vec2.ts" />
/// <reference path="../gameobjects/Sprite.ts" />
/// <reference path="../Game.ts" />
/// <reference path="../components/camera/CameraFX.ts" />
/// <reference path="../components/Texture.ts" />
/// <reference path="../components/Transform.ts" />
/// <reference path="../gameobjects/Sprite.ts" />
/**
* Phaser - Camera
@@ -29,37 +31,45 @@ module Phaser {
*/
constructor(game: Game, id: number, x: number, y: number, width: number, height: number) {
this._game = game;
this.game = game;
this.ID = id;
this._stageX = x;
this._stageY = y;
this.scaledX = x;
this.scaledY = y;
this.fx = new CameraFX(this._game, this);
this.z = id;
// The view into the world canvas we wish to render
// The view into the world we wish to render (by default the full game world size)
// The size of this Rect is the same as screenView, but the values are all in world coordinates instead of screen coordinates
this.worldView = new Rectangle(0, 0, width, height);
// The rect of the area being rendered in stage/screen coordinates
this.screenView = new Rectangle(x, y, width, height);
this.fx = new CameraFX(this.game, this);
this.transform = new Phaser.Components.Transform(this);
this.texture = new Phaser.Components.Texture(this);
this.texture.opaque = false;
this.checkClip();
}
private _target: Sprite = null;
/**
* Local private reference to Game.
*/
private _game: Game;
public game: Game;
private _clip: bool = false;
private _stageX: number;
private _stageY: number;
private _rotation: number = 0;
private _target: Sprite = null;
//private _sx: number = 0;
//private _sy: number = 0;
/**
* Optional texture used in the background of the Camera.
*/
public texture: Phaser.Components.Texture;
public scaledX: number;
public scaledY: number;
/**
* The transform component.
*/
public transform: Phaser.Components.Transform;
/**
* Camera "follow" style preset: camera has no deadzone, just tracks the focus object directly.
@@ -91,31 +101,35 @@ module Phaser {
public ID: number;
/**
* Camera view rectangle in world coordinate.
* Controls if this camera is clipped or not when rendering. You shouldn't usually set this value directly.
*/
public clip: bool = false;
/**
* Camera view Rectangle in world coordinate.
* @type {Rectangle}
*/
public worldView: Rectangle;
/**
* Scale factor of the camera.
* @type {Vec2}
*/
public scale: Vec2 = new Vec2(1, 1);
/**
* Scrolling factor.
* @type {MicroPoint}
*/
public scroll: Vec2 = new Vec2(0, 0);
/**
* Camera bounds.
* Visible / renderable area (changes if the camera resizes/moves around the stage)
* @type {Rectangle}
*/
public bounds: Rectangle = null;
public screenView: Rectangle;
/**
* Sprite moving inside this rectangle will not cause camera moving.
* Camera worldBounds.
* @type {Rectangle}
*/
public worldBounds: Rectangle = null;
/**
* A boolean representing if the Camera has been modified in any way via a scale, rotate, flip or skew.
*/
public modified: bool = false;
/**
* Sprite moving inside this Rectangle will not cause camera moving.
* @type {Rectangle}
*/
public deadzone: Rectangle = null;
@@ -127,44 +141,15 @@ module Phaser {
public disableClipping: bool = false;
/**
* Whether the camera background is opaque or not. If set to true the Camera is filled with
* the value of Camera.backgroundColor every frame. Normally you wouldn't enable this if the
* Camera is the full Stage size, as the Stage.backgroundColor has the same effect. But for
* multiple or mini cameras it can be very useful.
* @type {boolean}
*/
public opaque: bool = false;
/**
* The Background Color of the camera in css color string format, i.e. 'rgb(0,0,0)' or '#ff0000'.
* Not used if the Camera.opaque property is false.
* @type {string}
*/
public backgroundColor: string = 'rgb(0,0,0)';
/**
* Whether this camera visible or not. (default is true)
* Whether this camera is visible or not. (default is true)
* @type {boolean}
*/
public visible: bool = true;
/**
* Alpha of the camera. (everything rendered to this camera will be affected)
* @type {number}
* The z value of this Camera. Cameras are rendered in z-index order by the Renderer.
*/
public alpha: number = 1;
/**
* The x position of the current input event in world coordinates.
* @type {number}
*/
public inputX: number = 0;
/**
* The y position of the current input event in world coordinates.
* @type {number}
*/
public inputY: number = 0;
public z: number = -1;
/**
* Effects manager.
@@ -182,7 +167,7 @@ module Phaser {
if (this.isHidden(object) == false)
{
object['cameraBlacklist'].push(this.ID);
object.texture['cameraBlacklist'].push(this.ID);
}
}
@@ -193,9 +178,7 @@ module Phaser {
* @param object {Sprite/Group} The object to check.
*/
public isHidden(object): bool {
return (object['cameraBlacklist'] && object['cameraBlacklist'].length > 0 && object['cameraBlacklist'].indexOf(this.ID) == -1);
return (object.texture['cameraBlacklist'] && object.texture['cameraBlacklist'].length > 0 && object.texture['cameraBlacklist'].indexOf(this.ID) == -1);
}
/**
@@ -208,7 +191,7 @@ module Phaser {
if (this.isHidden(object) == true)
{
object['cameraBlacklist'].slice(object['cameraBlacklist'].indexOf(this.ID), 1);
object.texture['cameraBlacklist'].slice(object.texture['cameraBlacklist'].indexOf(this.ID), 1);
}
}
@@ -257,8 +240,8 @@ module Phaser {
x += (x > 0) ? 0.0000001 : -0.0000001;
y += (y > 0) ? 0.0000001 : -0.0000001;
this.scroll.x = Math.round(x - this.worldView.halfWidth);
this.scroll.y = Math.round(y - this.worldView.halfHeight);
this.worldView.x = Math.round(x - this.worldView.halfWidth);
this.worldView.y = Math.round(y - this.worldView.halfHeight);
}
@@ -271,8 +254,8 @@ module Phaser {
point.x += (point.x > 0) ? 0.0000001 : -0.0000001;
point.y += (point.y > 0) ? 0.0000001 : -0.0000001;
this.scroll.x = Math.round(point.x - this.worldView.halfWidth);
this.scroll.y = Math.round(point.y - this.worldView.halfHeight);
this.worldView.x = Math.round(point.x - this.worldView.halfWidth);
this.worldView.y = Math.round(point.y - this.worldView.halfHeight);
}
@@ -286,14 +269,15 @@ module Phaser {
*/
public setBounds(x: number = 0, y: number = 0, width: number = 0, height: number = 0) {
if (this.bounds == null)
if (this.worldBounds == null)
{
this.bounds = new Rectangle();
this.worldBounds = new Rectangle;
}
this.bounds.setTo(x, y, width, height);
this.worldBounds.setTo(x, y, width, height);
this.scroll.setTo(0, 0);
this.worldView.x = x;
this.worldView.y = y;
this.update();
}
@@ -303,6 +287,15 @@ module Phaser {
*/
public update() {
if (this.modified == false && (!this.transform.scale.equals(1) || !this.transform.skew.equals(0) || this.transform.rotation != 0 || this.transform.rotationOffset != 0 || this.texture.flippedX || this.texture.flippedY))
{
this.modified = true;
}
else if (this.modified == true && this.transform.scale.equals(1) && this.transform.skew.equals(0) && this.transform.rotation == 0 && this.transform.rotationOffset == 0 && this.texture.flippedX == false && this.texture.flippedY == false)
{
this.modified = false;
}
this.fx.preUpdate();
if (this._target !== null)
@@ -319,206 +312,79 @@ module Phaser {
edge = targetX - this.deadzone.x;
if (this.scroll.x > edge)
if (this.worldView.x > edge)
{
this.scroll.x = edge;
this.worldView.x = edge;
}
edge = targetX + this._target.width - this.deadzone.x - this.deadzone.width;
if (this.scroll.x < edge)
if (this.worldView.x < edge)
{
this.scroll.x = edge;
this.worldView.x = edge;
}
edge = targetY - this.deadzone.y;
if (this.scroll.y > edge)
if (this.worldView.y > edge)
{
this.scroll.y = edge;
this.worldView.y = edge;
}
edge = targetY + this._target.height - this.deadzone.y - this.deadzone.height;
if (this.scroll.y < edge)
if (this.worldView.y < edge)
{
this.scroll.y = edge;
this.worldView.y = edge;
}
}
}
// Make sure we didn't go outside the cameras bounds
if (this.bounds !== null)
// Make sure we didn't go outside the cameras worldBounds
if (this.worldBounds !== null)
{
if (this.scroll.x < this.bounds.left)
if (this.worldView.x < this.worldBounds.left)
{
this.scroll.x = this.bounds.left;
this.worldView.x = this.worldBounds.left;
}
if (this.scroll.x > this.bounds.right - this.width)
if (this.worldView.x > this.worldBounds.right - this.width)
{
this.scroll.x = (this.bounds.right - this.width) + 1;
this.worldView.x = (this.worldBounds.right - this.width) + 1;
}
if (this.scroll.y < this.bounds.top)
if (this.worldView.y < this.worldBounds.top)
{
this.scroll.y = this.bounds.top;
this.worldView.y = this.worldBounds.top;
}
if (this.scroll.y > this.bounds.bottom - this.height)
if (this.worldView.y > this.worldBounds.bottom - this.height)
{
this.scroll.y = (this.bounds.bottom - this.height) + 1;
this.worldView.y = (this.worldBounds.bottom - this.height) + 1;
}
}
this.worldView.x = this.scroll.x;
this.worldView.y = this.scroll.y;
// Input values
this.inputX = this.worldView.x + this._game.input.x;
this.inputY = this.worldView.y + this._game.input.y;
this.fx.postUpdate();
}
/**
* Camera preRender
*/
public preRender() {
if (this.visible === false || this.alpha < 0.1)
{
return;
}
if (this._rotation !== 0 || this._clip || this.scale.x !== 1 || this.scale.y !== 1)
{
this._game.stage.context.save();
}
this.fx.preRender(this, this._stageX, this._stageY, this.worldView.width, this.worldView.height);
if (this.alpha !== 1)
{
this._game.stage.context.globalAlpha = this.alpha;
}
this.scaledX = this._stageX;
this.scaledY = this._stageY;
// Scale on
if (this.scale.x !== 1 || this.scale.y !== 1)
{
this._game.stage.context.scale(this.scale.x, this.scale.y);
this.scaledX = this.scaledX / this.scale.x;
this.scaledY = this.scaledY / this.scale.y;
}
// Rotation - translate to the mid-point of the camera
if (this._rotation !== 0)
{
this._game.stage.context.translate(this.scaledX + this.worldView.halfWidth, this.scaledY + this.worldView.halfHeight);
this._game.stage.context.rotate(this._rotation * (Math.PI / 180));
// now shift back to where that should actually render
this._game.stage.context.translate(-(this.scaledX + this.worldView.halfWidth), -(this.scaledY + this.worldView.halfHeight));
}
// Background
if (this.opaque)
{
this._game.stage.context.fillStyle = this.backgroundColor;
this._game.stage.context.fillRect(this.scaledX, this.scaledY, this.worldView.width, this.worldView.height);
}
this.fx.render(this, this._stageX, this._stageY, this.worldView.width, this.worldView.height);
// Clip the camera so we don't get sprites appearing outside the edges
if (this._clip == true && this.disableClipping == false)
{
this._game.stage.context.beginPath();
this._game.stage.context.rect(this.scaledX, this.scaledY, this.worldView.width, this.worldView.height);
this._game.stage.context.closePath();
this._game.stage.context.clip();
}
}
/**
* Camera postRender
*/
public postRender() {
// Scale off
if (this.scale.x !== 1 || this.scale.y !== 1)
{
this._game.stage.context.scale(1, 1);
}
this.fx.postRender(this, this.scaledX, this.scaledY, this.worldView.width, this.worldView.height);
if (this._rotation !== 0 || (this._clip && this.disableClipping == false))
{
this._game.stage.context.translate(0, 0);
}
if (this._rotation !== 0 || this._clip || this.scale.x !== 1 || this.scale.y !== 1)
{
this._game.stage.context.restore();
}
if (this.alpha !== 1)
{
this._game.stage.context.globalAlpha = 1;
}
}
/**
* Set position of this camera.
* @param x {number} X position.
* @param y {number} Y position.
*/
public setPosition(x: number, y: number) {
this._stageX = x;
this._stageY = y;
this.checkClip();
}
/**
* Give this camera a new size.
* @param width {number} Width of new size.
* @param height {number} Height of new size.
*/
public setSize(width: number, height: number) {
this.worldView.width = width;
this.worldView.height = height;
this.checkClip();
}
/**
* Render debug infos. (including id, position, rotation, scrolling factor, bounds and some other properties)
* Render debug infos. (including id, position, rotation, scrolling factor, worldBounds and some other properties)
* @param x {number} X position of the debug info to be rendered.
* @param y {number} Y position of the debug info to be rendered.
* @param [color] {number} color of the debug info to be rendered. (format is css color string)
*/
public renderDebugInfo(x: number, y: number, color?: string = 'rgb(255,255,255)') {
this._game.stage.context.fillStyle = color;
this._game.stage.context.fillText('Camera ID: ' + this.ID + ' (' + this.worldView.width + ' x ' + this.worldView.height + ')', x, y);
this._game.stage.context.fillText('X: ' + this._stageX + ' Y: ' + this._stageY + ' Rotation: ' + this._rotation, x, y + 14);
this._game.stage.context.fillText('World X: ' + this.scroll.x.toFixed(1) + ' World Y: ' + this.scroll.y.toFixed(1), x, y + 28);
this.game.stage.context.fillStyle = color;
this.game.stage.context.fillText('Camera ID: ' + this.ID + ' (' + this.screenView.width + ' x ' + this.screenView.height + ')', x, y);
this.game.stage.context.fillText('X: ' + this.screenView.x + ' Y: ' + this.screenView.y + ' rotation: ' + this.transform.rotation, x, y + 14);
this.game.stage.context.fillText('World X: ' + this.worldView.x.toFixed(1) + ' World Y: ' + this.worldView.y.toFixed(1), x, y + 28);
if (this.bounds)
if (this.worldBounds)
{
this._game.stage.context.fillText('Bounds: ' + this.bounds.width + ' x ' + this.bounds.height, x, y + 42);
this.game.stage.context.fillText('Bounds: ' + this.worldBounds.width + ' x ' + this.worldBounds.height, x, y + 42);
}
}
@@ -528,75 +394,82 @@ module Phaser {
*/
public destroy() {
this._game.world.cameras.removeCamera(this.ID);
this.game.world.cameras.removeCamera(this.ID);
this.fx.destroy();
}
public get x(): number {
return this._stageX;
}
public set x(value: number) {
this._stageX = value;
this.checkClip();
return this.worldView.x;
}
public get y(): number {
return this._stageY;
return this.worldView.y;
}
public set x(value: number) {
this.worldView.x = value;
}
public set y(value: number) {
this._stageY = value;
this.checkClip();
this.worldView.y = value;
}
public get width(): number {
return this.worldView.width;
}
public set width(value: number) {
if (value > this._game.stage.width)
{
value = this._game.stage.width;
}
this.worldView.width = value;
this.checkClip();
return this.screenView.width;
}
public get height(): number {
return this.worldView.height;
return this.screenView.height;
}
public set width(value: number) {
this.screenView.width = value;
this.worldView.width = value;
}
public set height(value: number) {
if (value > this._game.stage.height)
{
value = this._game.stage.height;
}
this.screenView.height = value;
this.worldView.height = value;
}
public setPosition(x: number, y: number) {
this.screenView.x = x;
this.screenView.y = y;
this.checkClip();
}
public get rotation(): number {
return this._rotation;
public setSize(width: number, height: number) {
this.screenView.width = width * this.transform.scale.x;
this.screenView.height = height * this.transform.scale.y;
this.worldView.width = width;
this.worldView.height = height;
this.checkClip();
}
/**
* The angle of the Camera in degrees. Phaser uses a right-handed coordinate system, where 0 points to the right.
*/
public get rotation(): number {
return this.transform.rotation;
}
/**
* Set the angle of the Camera in degrees. Phaser uses a right-handed coordinate system, where 0 points to the right.
* The value is automatically wrapped to be between 0 and 360.
*/
public set rotation(value: number) {
this._rotation = this._game.math.wrap(value, 360, 0);
this.transform.rotation = this.game.math.wrap(value, 360, 0);
}
private checkClip() {
if (this._stageX !== 0 || this._stageY !== 0 || this.worldView.width < this._game.stage.width || this.worldView.height < this._game.stage.height)
if (this.screenView.x != 0 || this.screenView.y != 0 || this.screenView.width < this.game.stage.width || this.screenView.height < this.game.stage.height)
{
this._clip = true;
this.clip = true;
}
else
{
this._clip = false;
this.clip = false;
}
}
Phaser/cameras/CameraManager.ts
+69
View File
@@ -47,6 +47,16 @@ module Phaser {
*/
private _cameraInstance: number = 0;
/**
* Helper for sort.
*/
private _sortIndex: string = '';
/**
* Helper for sort.
*/
private _sortOrder: number;
public static CAMERA_TYPE_ORTHOGRAPHIC: number = 0;
public static CAMERA_TYPE_ISOMETRIC: number = 1;
@@ -124,6 +134,65 @@ module Phaser {
}
public swap(camera1: Camera, camera2: Camera, sort?: bool = true): bool {
if (camera1.ID == camera2.ID)
{
return false;
}
var tempZ: number = camera1.z;
camera1.z = camera2.z;
camera2.z = tempZ;
if (sort)
{
this.sort();
}
return true;
}
/**
* Call this function to sort the Cameras according to a particular value and order (default is their Z value).
* The order in which they are sorted determines the render order. If sorted on z then Cameras with a lower z-index value render first.
*
* @param {string} index The <code>string</code> name of the Camera variable you want to sort on. Default value is "z".
* @param {number} order A <code>Group</code> constant that defines the sort order. Possible values are <code>Group.ASCENDING</code> and <code>Group.DESCENDING</code>. Default value is <code>Group.ASCENDING</code>.
*/
public sort(index: string = 'z', order: number = Group.ASCENDING) {
this._sortIndex = index;
this._sortOrder = order;
this._cameras.sort((a, b) => this.sortHandler(a, b));
}
/**
* Helper function for the sort process.
*
* @param {Basic} Obj1 The first object being sorted.
* @param {Basic} Obj2 The second object being sorted.
*
* @return {number} An integer value: -1 (Obj1 before Obj2), 0 (same), or 1 (Obj1 after Obj2).
*/
public sortHandler(obj1, obj2): number {
if (obj1[this._sortIndex] < obj2[this._sortIndex])
{
return this._sortOrder;
}
else if (obj1[this._sortIndex] > obj2[this._sortIndex])
{
return -this._sortOrder;
}
return 0;
}
/**
* Clean up memory.
*/
Phaser/components/sprite/Texture.ts → Phaser/components/Texture.ts
+86 -38
View File
@@ -1,11 +1,11 @@
/// <reference path="../../Game.ts" />
/// <reference path="../../gameobjects/DynamicTexture.ts" />
/// <reference path="../../utils/SpriteUtils.ts" />
/// <reference path="../Game.ts" />
/// <reference path="../gameobjects/DynamicTexture.ts" />
/// <reference path="../utils/SpriteUtils.ts" />
/**
* Phaser - Components - Texture
*
* The Texture being used to render the Sprite. Either Image based on a DynamicTexture.
* The Texture being used to render the object (Sprite, Group background, etc). Either Image based on a DynamicTexture.
*/
module Phaser.Components {
@@ -13,14 +13,14 @@ module Phaser.Components {
export class Texture {
/**
* Creates a new Sprite Texture component
* @param parent The Sprite using this Texture to render
* Creates a new Texture component
* @param parent The object using this Texture to render.
* @param key An optional Game.Cache key to load an image from
*/
constructor(parent: Sprite, key?: string = '') {
constructor(parent) {
this.game = parent.game;
this._sprite = parent;
this.parent = parent;
this.canvas = parent.game.stage.canvas;
this.context = parent.game.stage.context;
@@ -28,14 +28,22 @@ module Phaser.Components {
this.flippedX = false;
this.flippedY = false;
if (key !== null)
{
this.cacheKey = key;
this.loadImage(key);
}
this._width = 16;
this._height = 16;
this.cameraBlacklist = [];
}
/**
* Private _width - use the width getter/setter instead
*/
private _width: number;
/**
* Private _height - use the height getter/setter instead
*/
private _height: number;
/**
* Reference to Phaser.Game
@@ -43,9 +51,9 @@ module Phaser.Components {
public game: Game;
/**
* Reference to the parent Sprite
* Reference to the parent object (Sprite, Group, etc)
*/
private _sprite: Sprite;
public parent;
/**
* Reference to the Image stored in the Game.Cache that is used as the texture for the Sprite.
@@ -65,11 +73,40 @@ module Phaser.Components {
public loaded: bool = false;
/**
* Opacity of the Sprite texture where 1 is opaque and 0 is fully transparent.
* An Array of Cameras to which this texture won't render
* @type {Array}
*/
public cameraBlacklist: number[];
/**
* Whether the Sprite background is opaque or not. If set to true the Sprite is filled with
* the value of Texture.backgroundColor every frame. Normally you wouldn't enable this but
* for some effects it can be handy.
* @type {boolean}
*/
public opaque: bool = false;
/**
* Opacity of the Sprite texture where 1 is opaque (default) and 0 is fully transparent.
* @type {number}
*/
public alpha: number;
/**
* The Background Color of the Sprite if Texture.opaque is set to true.
* Given in css color string format, i.e. 'rgb(0,0,0)' or '#ff0000'.
* @type {string}
*/
public backgroundColor: string = 'rgb(255,255,255)';
/**
* You can set a globalCompositeOperation that will be applied before the render method is called on this Sprite.
* This is useful if you wish to apply an effect like 'lighten'.
* If this value is set it will call a canvas context save and restore before and after the render pass, so use it sparingly.
* Set to null to disable.
*/
public globalCompositeOperation: string = null;
/**
* A reference to the Canvas this Sprite renders to.
* @type {HTMLCanvasElement}
@@ -121,7 +158,7 @@ module Phaser.Components {
* Updates the texture being used to render the Sprite.
* Called automatically by SpriteUtils.loadTexture and SpriteUtils.loadDynamicTexture.
*/
public setTo(image = null, dynamic?: DynamicTexture = null): Sprite {
public setTo(image = null, dynamic?: DynamicTexture = null) {
if (dynamic)
{
@@ -134,11 +171,13 @@ module Phaser.Components {
this.isDynamic = false;
this.imageTexture = image;
this.texture = this.imageTexture;
this._width = image.width;
this._height = image.height;
}
this.loaded = true;
return this._sprite;
return this.parent;
}
@@ -147,32 +186,31 @@ module Phaser.Components {
* The graphic can be SpriteSheet or Texture Atlas. If you need to use a DynamicTexture see loadDynamicTexture.
* @param key {string} Key of the graphic you want to load for this sprite.
* @param clearAnimations {boolean} If this Sprite has a set of animation data already loaded you can choose to keep or clear it with this boolean
* @param updateBody {boolean} Update the physics body dimensions to match the newly loaded texture/frame?
*/
public loadImage(key: string, clearAnimations?: bool = true, updateBody?: bool = true) {
if (clearAnimations && this._sprite.animations.frameData !== null)
if (clearAnimations && this.parent['animations'] && this.parent['animations'].frameData !== null)
{
this._sprite.animations.destroy();
this.parent.animations.destroy();
}
if (this.game.cache.getImage(key) !== null)
{
this.setTo(this.game.cache.getImage(key), null);
this.cacheKey = key;
if (this.game.cache.isSpriteSheet(key))
if (this.game.cache.isSpriteSheet(key) && this.parent['animations'])
{
this._sprite.animations.loadFrameData(this._sprite.game.cache.getFrameData(key));
this.parent.animations.loadFrameData(this.parent.game.cache.getFrameData(key));
}
else
{
this._sprite.frameBounds.width = this.width;
this._sprite.frameBounds.height = this.height;
}
if (updateBody)
{
this._sprite.body.bounds.width = this.width;
this._sprite.body.bounds.height = this.height;
if (updateBody && this.parent['body'])
{
this.parent.body.bounds.width = this.width;
this.parent.body.bounds.height = this.height;
}
}
}
@@ -184,19 +222,28 @@ module Phaser.Components {
*/
public loadDynamicTexture(texture: DynamicTexture) {
if (this._sprite.animations.frameData !== null)
if (this.parent.animations.frameData !== null)
{
this._sprite.animations.destroy();
this.parent.animations.destroy();
}
this.setTo(null, texture);
this._sprite.frameBounds.width = this.width;
this._sprite.frameBounds.height = this.height;
this.parent.texture.width = this.width;
this.parent.texture.height = this.height;
}
public set width(value: number) {
this._width = value;
}
public set height(value: number) {
this._height = value;
}
/**
* Getter only. The width of the texture.
* The width of the texture. If an animation it will be the frame width, not the width of the sprite sheet.
* If using a DynamicTexture it will be the width of the dynamic texture itself.
* @type {number}
*/
public get width(): number {
@@ -207,12 +254,13 @@ module Phaser.Components {
}
else
{
return this.imageTexture.width;
return this._width;
}
}
/**
* Getter only. The height of the texture.
* The height of the texture. If an animation it will be the frame height, not the height of the sprite sheet.
* If using a DynamicTexture it will be the height of the dynamic texture itself.
* @type {number}
*/
public get height(): number {
@@ -223,7 +271,7 @@ module Phaser.Components {
}
else
{
return this.imageTexture.height;
return this._height;
}
}
Phaser/components/TilemapLayer.ts
+4 -4
View File
@@ -219,10 +219,10 @@ module Phaser {
* Swap tiles with 2 kinds of indexes.
* @param tileA {number} First tile index.
* @param tileB {number} Second tile index.
* @param [x] {number} specify a rectangle of tiles to operate. The x position in tiles of rectangle's left-top corner.
* @param [y] {number} specify a rectangle of tiles to operate. The y position in tiles of rectangle's left-top corner.
* @param [width] {number} specify a rectangle of tiles to operate. The width in tiles.
* @param [height] {number} specify a rectangle of tiles to operate. The height in tiles.
* @param [x] {number} specify a Rectangle of tiles to operate. The x position in tiles of Rectangle's left-top corner.
* @param [y] {number} specify a Rectangle of tiles to operate. The y position in tiles of Rectangle's left-top corner.
* @param [width] {number} specify a Rectangle of tiles to operate. The width in tiles.
* @param [height] {number} specify a Rectangle of tiles to operate. The height in tiles.
*/
public swapTile(tileA: number, tileB: number, x?: number = 0, y?: number = 0, width?: number = this.widthInTiles, height?: number = this.heightInTiles) {
Phaser/components/Transform.ts
+72
View File
@@ -0,0 +1,72 @@
/// <reference path="../Game.ts" />
/**
* Phaser - Components - Transform
*/
module Phaser.Components {
export class Transform {
/**
* Creates a new Sprite Transform component
* @param parent The Sprite using this transform
*/
constructor(parent) {
this.game = parent.game;
this.parent = parent;
this.scrollFactor = new Phaser.Vec2(1, 1);
this.origin = new Phaser.Vec2;
this.scale = new Phaser.Vec2(1, 1);
this.skew = new Phaser.Vec2;
}
/**
* Reference to Phaser.Game
*/
public game: Game;
/**
* Reference to the parent object (Sprite, Group, etc)
*/
public parent: Phaser.Sprite;
/**
* Scale of the object. A scale of 1.0 is the original size. 0.5 half size. 2.0 double sized.
*/
public scale: Phaser.Vec2;
/**
* Skew the object along the x and y axis. A skew value of 0 is no skew.
*/
public skew: Phaser.Vec2;
/**
* The influence of camera movement upon the object, if supported.
*/
public scrollFactor: Phaser.Vec2;
/**
* The origin is the point around which scale and rotation takes place.
*/
public origin: Phaser.Vec2;
/**
* This value is added to the rotation of the object.
* For example if you had a texture drawn facing straight up then you could set
* rotationOffset to 90 and it would correspond correctly with Phasers right-handed coordinate system.
* @type {number}
*/
public rotationOffset: number = 0;
/**
* The rotation of the object in degrees. Phaser uses a right-handed coordinate system, where 0 points to the right.
*/
public rotation: number = 0;
}
}
Phaser/components/animation/Animation.ts
+2 -2
View File
@@ -140,8 +140,8 @@ module Phaser {
if (this.currentFrame !== null)
{
this._parent.frameBounds.width = this.currentFrame.width;
this._parent.frameBounds.height = this.currentFrame.height;
this._parent.texture.width = this.currentFrame.width;
this._parent.texture.height = this.currentFrame.height;
this._frameIndex = value;
}
Phaser/components/animation/AnimationManager.ts
+24 -10
View File
@@ -22,7 +22,7 @@ module Phaser.Components {
*
* @param parent {Sprite} Owner sprite of this manager.
*/
constructor(parent: Sprite) {
constructor(parent: Phaser.Sprite) {
this._parent = parent;
this._game = parent.game;
@@ -38,7 +38,7 @@ module Phaser.Components {
/**
* Local private reference to its owner sprite.
*/
private _parent: Sprite;
private _parent: Phaser.Sprite;
/**
* Animation key-value container.
@@ -57,6 +57,14 @@ module Phaser.Components {
*/
private _frameData: FrameData = null;
/**
* When an animation frame changes you can choose to automatically update the physics bounds of the parent Sprite
* to the width and height of the new frame. If you've set a specific physics bounds that you don't want changed during
* animation then set this to false, otherwise leave it set to true.
* @type {boolean}
*/
public autoUpdateBounds: bool = true;
/**
* Keeps track of the current animation being played.
*/
@@ -200,8 +208,8 @@ module Phaser.Components {
if (this.currentAnim && this.currentAnim.update() == true)
{
this.currentFrame = this.currentAnim.currentFrame;
this._parent.frameBounds.width = this.currentFrame.width;
this._parent.frameBounds.height = this.currentFrame.height;
this._parent.texture.width = this.currentFrame.width;
this._parent.texture.height = this.currentFrame.height;
}
}
@@ -232,8 +240,15 @@ module Phaser.Components {
{
this.currentFrame = this._frameData.getFrame(value);
this._parent.frameBounds.width = this.currentFrame.width;
this._parent.frameBounds.height = this.currentFrame.height;
this._parent.texture.width = this.currentFrame.width;
this._parent.texture.height = this.currentFrame.height;
if (this.autoUpdateBounds && this._parent['body'])
{
this._parent.body.bounds.width = this.currentFrame.width;
this._parent.body.bounds.height = this.currentFrame.height;
}
this._frameIndex = value;
}
@@ -249,10 +264,9 @@ module Phaser.Components {
{
this.currentFrame = this._frameData.getFrameByName(value);
this._parent.frameBounds.width = this.currentFrame.width;
this._parent.frameBounds.height = this.currentFrame.height;
//this._parent.frameBounds.width = this.currentFrame.sourceSizeW;
//this._parent.frameBounds.height = this.currentFrame.sourceSizeH;
this._parent.texture.width = this.currentFrame.width;
this._parent.texture.height = this.currentFrame.height;
this._frameIndex = this.currentFrame.index;
}
Phaser/components/animation/Frame.ts
+13 -6
View File
@@ -143,14 +143,21 @@ module Phaser {
*/
public setTrim(trimmed: bool, actualWidth: number, actualHeight: number, destX: number, destY: number, destWidth: number, destHeight: number) {
//console.log('setTrim', trimmed, 'aw', actualWidth, 'ah', actualHeight, 'dx', destX, 'dy', destY, 'dw', destWidth, 'dh', destHeight);
this.trimmed = trimmed;
this.sourceSizeW = actualWidth;
this.sourceSizeH = actualHeight;
this.spriteSourceSizeX = destX;
this.spriteSourceSizeY = destY;
this.spriteSourceSizeW = destWidth;
this.spriteSourceSizeH = destHeight;
if (trimmed)
{
this.width = actualWidth;
this.height = actualHeight;
this.sourceSizeW = actualWidth;
this.sourceSizeH = actualHeight;
this.spriteSourceSizeX = destX;
this.spriteSourceSizeY = destY;
this.spriteSourceSizeW = destWidth;
this.spriteSourceSizeH = destHeight;
}
}
Phaser/components/sprite/Events.ts
+4 -4
View File
@@ -6,7 +6,7 @@
* Signals that are dispatched by the Sprite and its various components
*/
module Phaser.Components {
module Phaser.Components.Sprite {
export class Events {
@@ -14,10 +14,10 @@ module Phaser.Components {
* The Events component is a collection of events fired by the parent Sprite and its other components.
* @param parent The Sprite using this Input component
*/
constructor(parent: Sprite) {
constructor(parent: Phaser.Sprite) {
this.game = parent.game;
this._sprite = parent;
this.sprite = parent;
this.onAddedToGroup = new Phaser.Signal;
this.onRemovedFromGroup = new Phaser.Signal;
@@ -39,7 +39,7 @@ module Phaser.Components {
/**
* Reference to the Image stored in the Game.Cache that is used as the texture for the Sprite.
*/
private _sprite: Sprite;
private sprite: Phaser.Sprite;
/**
* Dispatched by the Group this Sprite is added to.
Phaser/components/sprite/Input.ts
+53 -53
View File
@@ -9,7 +9,7 @@
* Input detection component
*/
module Phaser.Components {
module Phaser.Components.Sprite {
export class Input {
@@ -17,10 +17,10 @@ module Phaser.Components {
* Sprite Input component constructor
* @param parent The Sprite using this Input component
*/
constructor(parent: Sprite) {
constructor(parent: Phaser.Sprite) {
this.game = parent.game;
this._sprite = parent;
this.sprite = parent;
this.enabled = false;
}
@@ -33,7 +33,7 @@ module Phaser.Components {
/**
* Reference to the Image stored in the Game.Cache that is used as the texture for the Sprite.
*/
private _sprite: Sprite;
private sprite: Phaser.Sprite;
private _pointerData;
@@ -82,7 +82,7 @@ module Phaser.Components {
* An Sprite the bounds of which this sprite is restricted during drag
* @default null
*/
public boundsSprite: Sprite = null;
public boundsSprite: Phaser.Sprite = null;
/**
* The Input component can monitor either the physics body of the Sprite or the frameBounds
@@ -196,7 +196,7 @@ module Phaser.Components {
return this._pointerData[pointer].isDragged;
}
public start(priority:number = 0, checkBody?:bool = false, useHandCursor?:bool = false): Sprite {
public start(priority:number = 0, checkBody?:bool = false, useHandCursor?:bool = false): Phaser.Sprite {
// Turning on
if (this.enabled == false)
@@ -216,10 +216,10 @@ module Phaser.Components {
this.snapOffset = new Point;
this.enabled = true;
this.game.input.addGameObject(this._sprite);
this.game.input.addGameObject(this.sprite);
}
return this._sprite;
return this.sprite;
}
@@ -245,20 +245,20 @@ module Phaser.Components {
{
// De-register, etc
this.enabled = false;
this.game.input.removeGameObject(this._sprite);
this.game.input.removeGameObject(this.sprite);
}
}
public checkPointerOver(pointer: Phaser.Pointer): bool {
if (this.enabled == false || this._sprite.visible == false)
if (this.enabled == false || this.sprite.visible == false)
{
return false;
}
else
{
return RectangleUtils.contains(this._sprite.frameBounds, pointer.scaledX, pointer.scaledY);
return RectangleUtils.contains(this.sprite.worldView, pointer.scaledX, pointer.scaledY);
}
}
@@ -268,7 +268,7 @@ module Phaser.Components {
*/
public update(pointer: Phaser.Pointer): bool {
if (this.enabled == false || this._sprite.visible == false)
if (this.enabled == false || this.sprite.visible == false)
{
return false;
}
@@ -279,10 +279,10 @@ module Phaser.Components {
}
else if (this._pointerData[pointer.id].isOver == true)
{
if (RectangleUtils.contains(this._sprite.frameBounds, pointer.scaledX, pointer.scaledY))
if (RectangleUtils.contains(this.sprite.worldView, pointer.scaledX, pointer.scaledY))
{
this._pointerData[pointer.id].x = pointer.scaledX - this._sprite.x;
this._pointerData[pointer.id].y = pointer.scaledY - this._sprite.y;
this._pointerData[pointer.id].x = pointer.scaledX - this.sprite.x;
this._pointerData[pointer.id].y = pointer.scaledY - this.sprite.y;
return true;
}
else
@@ -303,15 +303,15 @@ module Phaser.Components {
this._pointerData[pointer.id].isOver = true;
this._pointerData[pointer.id].isOut = false;
this._pointerData[pointer.id].timeOver = this.game.time.now;
this._pointerData[pointer.id].x = pointer.x - this._sprite.x;
this._pointerData[pointer.id].y = pointer.y - this._sprite.y;
this._pointerData[pointer.id].x = pointer.x - this.sprite.x;
this._pointerData[pointer.id].y = pointer.y - this.sprite.y;
if (this.useHandCursor && this._pointerData[pointer.id].isDragged == false)
{
this.game.stage.canvas.style.cursor = "pointer";
}
this._sprite.events.onInputOver.dispatch(this._sprite, pointer);
this.sprite.events.onInputOver.dispatch(this.sprite, pointer);
}
}
@@ -327,7 +327,7 @@ module Phaser.Components {
this.game.stage.canvas.style.cursor = "default";
}
this._sprite.events.onInputOut.dispatch(this._sprite, pointer);
this.sprite.events.onInputOut.dispatch(this.sprite, pointer);
}
@@ -341,7 +341,7 @@ module Phaser.Components {
this._pointerData[pointer.id].isUp = false;
this._pointerData[pointer.id].timeDown = this.game.time.now;
this._sprite.events.onInputDown.dispatch(this._sprite, pointer);
this.sprite.events.onInputDown.dispatch(this.sprite, pointer);
// Start drag
//if (this.draggable && this.isDragged == false && pointer.targetObject == null)
@@ -367,7 +367,7 @@ module Phaser.Components {
this._pointerData[pointer.id].timeUp = this.game.time.now;
this._pointerData[pointer.id].downDuration = this._pointerData[pointer.id].timeUp - this._pointerData[pointer.id].timeDown;
this._sprite.events.onInputUp.dispatch(this._sprite, pointer);
this.sprite.events.onInputUp.dispatch(this.sprite, pointer);
// Stop drag
if (this.draggable && this.isDragged && this._draggedPointerID == pointer.id)
@@ -396,12 +396,12 @@ module Phaser.Components {
if (this.allowHorizontalDrag)
{
this._sprite.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
this.sprite.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
}
if (this.allowVerticalDrag)
{
this._sprite.y = pointer.y + this._dragPoint.y + this.dragOffset.y;
this.sprite.y = pointer.y + this._dragPoint.y + this.dragOffset.y;
}
if (this.boundsRect)
@@ -416,8 +416,8 @@ module Phaser.Components {
if (this.snapOnDrag)
{
this._sprite.x = Math.floor(this._sprite.x / this.snapX) * this.snapX;
this._sprite.y = Math.floor(this._sprite.y / this.snapY) * this.snapY;
this.sprite.x = Math.floor(this.sprite.x / this.snapX) * this.snapX;
this.sprite.y = Math.floor(this.sprite.y / this.snapY) * this.snapY;
}
return true;
@@ -498,7 +498,7 @@ module Phaser.Components {
* @param boundsRect If you want to restrict the drag of this sprite to a specific FlxRect, pass the FlxRect here, otherwise it's free to drag anywhere
* @param boundsSprite If you want to restrict the drag of this sprite to within the bounding box of another sprite, pass it here
*/
public enableDrag(lockCenter:bool = false, pixelPerfect:bool = false, alphaThreshold:number = 255, boundsRect:Rectangle = null, boundsSprite:Sprite = null):void
public enableDrag(lockCenter:bool = false, pixelPerfect:bool = false, alphaThreshold:number = 255, boundsRect:Rectangle = null, boundsSprite:Phaser.Sprite = null):void
{
this._dragPoint = new Point;
@@ -550,11 +550,11 @@ module Phaser.Components {
if (this.dragFromCenter)
{
// Move the sprite to the middle of the pointer
this._dragPoint.setTo(-this._sprite.frameBounds.halfWidth, -this._sprite.frameBounds.halfHeight);
this._dragPoint.setTo(-this.sprite.worldView.halfWidth, -this.sprite.worldView.halfHeight);
}
else
{
this._dragPoint.setTo(this._sprite.x - pointer.x, this._sprite.y - pointer.y);
this._dragPoint.setTo(this.sprite.x - pointer.x, this.sprite.y - pointer.y);
}
this.updateDrag(pointer);
@@ -572,8 +572,8 @@ module Phaser.Components {
if (this.snapOnRelease)
{
this._sprite.x = Math.floor(this._sprite.x / this.snapX) * this.snapX;
this._sprite.y = Math.floor(this._sprite.y / this.snapY) * this.snapY;
this.sprite.x = Math.floor(this.sprite.x / this.snapX) * this.snapX;
this.sprite.y = Math.floor(this.sprite.y / this.snapY) * this.snapY;
}
//pointer.draggedObject = null;
@@ -622,22 +622,22 @@ module Phaser.Components {
*/
private checkBoundsRect():void
{
if (this._sprite.x < this.boundsRect.left)
if (this.sprite.x < this.boundsRect.left)
{
this._sprite.x = this.boundsRect.x;
this.sprite.x = this.boundsRect.x;
}
else if ((this._sprite.x + this._sprite.width) > this.boundsRect.right)
else if ((this.sprite.x + this.sprite.width) > this.boundsRect.right)
{
this._sprite.x = this.boundsRect.right - this._sprite.width;
this.sprite.x = this.boundsRect.right - this.sprite.width;
}
if (this._sprite.y < this.boundsRect.top)
if (this.sprite.y < this.boundsRect.top)
{
this._sprite.y = this.boundsRect.top;
this.sprite.y = this.boundsRect.top;
}
else if ((this._sprite.y + this._sprite.height) > this.boundsRect.bottom)
else if ((this.sprite.y + this.sprite.height) > this.boundsRect.bottom)
{
this._sprite.y = this.boundsRect.bottom - this._sprite.height;
this.sprite.y = this.boundsRect.bottom - this.sprite.height;
}
}
@@ -646,22 +646,22 @@ module Phaser.Components {
*/
private checkBoundsSprite():void
{
if (this._sprite.x < this.boundsSprite.x)
if (this.sprite.x < this.boundsSprite.x)
{
this._sprite.x = this.boundsSprite.x;
this.sprite.x = this.boundsSprite.x;
}
else if ((this._sprite.x + this._sprite.width) > (this.boundsSprite.x + this.boundsSprite.width))
else if ((this.sprite.x + this.sprite.width) > (this.boundsSprite.x + this.boundsSprite.width))
{
this._sprite.x = (this.boundsSprite.x + this.boundsSprite.width) - this._sprite.width;
this.sprite.x = (this.boundsSprite.x + this.boundsSprite.width) - this.sprite.width;
}
if (this._sprite.y < this.boundsSprite.y)
if (this.sprite.y < this.boundsSprite.y)
{
this._sprite.y = this.boundsSprite.y;
this.sprite.y = this.boundsSprite.y;
}
else if ((this._sprite.y + this._sprite.height) > (this.boundsSprite.y + this.boundsSprite.height))
else if ((this.sprite.y + this.sprite.height) > (this.boundsSprite.y + this.boundsSprite.height))
{
this._sprite.y = (this.boundsSprite.y + this.boundsSprite.height) - this._sprite.height;
this.sprite.y = (this.boundsSprite.y + this.boundsSprite.height) - this.sprite.height;
}
}
@@ -673,13 +673,13 @@ module Phaser.Components {
*/
public renderDebugInfo(x: number, y: number, color?: string = 'rgb(255,255,255)') {
this._sprite.texture.context.font = '14px Courier';
this._sprite.texture.context.fillStyle = color;
this._sprite.texture.context.fillText('Sprite Input: (' + this._sprite.frameBounds.width + ' x ' + this._sprite.frameBounds.height + ')', x, y);
this._sprite.texture.context.fillText('x: ' + this.pointerX().toFixed(1) + ' y: ' + this.pointerY().toFixed(1), x, y + 14);
this._sprite.texture.context.fillText('over: ' + this.pointerOver() + ' duration: ' + this.overDuration().toFixed(0), x, y + 28);
this._sprite.texture.context.fillText('down: ' + this.pointerDown() + ' duration: ' + this.downDuration().toFixed(0), x, y + 42);
this._sprite.texture.context.fillText('just over: ' + this.justOver() + ' just out: ' + this.justOut(), x, y + 56);
this.sprite.texture.context.font = '14px Courier';
this.sprite.texture.context.fillStyle = color;
this.sprite.texture.context.fillText('Sprite Input: (' + this.sprite.worldView.width + ' x ' + this.sprite.worldView.height + ')', x, y);
this.sprite.texture.context.fillText('x: ' + this.pointerX().toFixed(1) + ' y: ' + this.pointerY().toFixed(1), x, y + 14);
this.sprite.texture.context.fillText('over: ' + this.pointerOver() + ' duration: ' + this.overDuration().toFixed(0), x, y + 28);
this.sprite.texture.context.fillText('down: ' + this.pointerDown() + ' duration: ' + this.downDuration().toFixed(0), x, y + 42);
this.sprite.texture.context.fillText('just over: ' + this.justOver() + ' just out: ' + this.justOut(), x, y + 56);
}
Phaser/core/Group.ts
+38 -66
View File
@@ -1,5 +1,7 @@
/// <reference path="../Game.ts" />
/// <reference path="../Statics.ts" />
/// <reference path="../components/Texture.ts" />
/// <reference path="../components/Transform.ts" />
/**
* Phaser - Group
@@ -25,10 +27,12 @@ module Phaser {
this._marker = 0;
this._sortIndex = null;
this.cameraBlacklist = [];
this.ID = this.game.world.getNextGroupID();
this.transform = new Phaser.Components.Transform(this);
this.texture = new Phaser.Components.Texture(this);
this.texture.opaque = false;
}
/**
@@ -91,6 +95,21 @@ module Phaser {
*/
public group: Group = null;
/**
* Optional texture used in the background of the Camera.
*/
public texture: Phaser.Components.Texture;
/**
* The transform component.
*/
public transform: Phaser.Components.Transform;
/**
* A boolean representing if the Group has been modified in any way via a scale, rotate, flip or skew.
*/
public modified: bool = false;
/**
* If this Group exists or not. Can be set to false to skip certain loop checks.
*/
@@ -123,27 +142,6 @@ module Phaser {
*/
public length: number;
/**
* You can set a globalCompositeOperation that will be applied before the render method is called on this Groups children.
* This is useful if you wish to apply an effect like 'lighten' to a whole group of children as it saves doing it one-by-one.
* If this value is set it will call a canvas context save and restore before and after the render pass.
* Set to null to disable.
*/
public globalCompositeOperation: string = null;
/**
* You can set an alpha value on this Group that will be applied before the render method is called on this Groups children.
* This is useful if you wish to alpha a whole group of children as it saves doing it one-by-one.
* Set to 0 to disable.
*/
public alpha: number = 0;
/**
* An Array of Cameras to which this Group, or any of its children, won't render
* @type {Array}
*/
public cameraBlacklist: number[];
/**
* Gets the next z index value for children of this Group
*/
@@ -184,6 +182,15 @@ module Phaser {
*/
public update() {
if (this.modified == false && (!this.transform.scale.equals(1) || !this.transform.skew.equals(0) || this.transform.rotation != 0 || this.transform.rotationOffset != 0 || this.texture.flippedX || this.texture.flippedY))
{
this.modified = true;
}
else if (this.modified == true && this.transform.scale.equals(1) && this.transform.skew.equals(0) && this.transform.rotation == 0 && this.transform.rotationOffset == 0 && this.texture.flippedX == false && this.texture.flippedY == false)
{
this.modified = false;
}
this._i = 0;
while (this._i < this.length)
@@ -210,17 +217,7 @@ module Phaser {
return;
}
if (this.globalCompositeOperation)
{
this.game.stage.context.save();
this.game.stage.context.globalCompositeOperation = this.globalCompositeOperation;
}
if (this.alpha > 0)
{
this._prevAlpha = this.game.stage.context.globalAlpha;
this.game.stage.context.globalAlpha = this.alpha;
}
this.game.renderer.preRenderGroup(camera, this);
this._i = 0;
@@ -241,15 +238,7 @@ module Phaser {
}
}
if (this.alpha > 0)
{
this.game.stage.context.globalAlpha = this._prevAlpha;
}
if (this.globalCompositeOperation)
{
this.game.stage.context.restore();
}
this.game.renderer.postRenderGroup(camera, this);
}
@@ -259,17 +248,7 @@ module Phaser {
*/
public directRender(camera: Camera) {
if (this.globalCompositeOperation)
{
this.game.stage.context.save();
this.game.stage.context.globalCompositeOperation = this.globalCompositeOperation;
}
if (this.alpha > 0)
{
this._prevAlpha = this.game.stage.context.globalAlpha;
this.game.stage.context.globalAlpha = this.alpha;
}
this.game.renderer.preRenderGroup(camera, this);
this._i = 0;
@@ -290,15 +269,7 @@ module Phaser {
}
}
if (this.alpha > 0)
{
this.game.stage.context.globalAlpha = this._prevAlpha;
}
if (this.globalCompositeOperation)
{
this.game.stage.context.restore();
}
this.game.renderer.postRenderGroup(camera, this);
}
@@ -426,11 +397,12 @@ module Phaser {
* @param x {number} X position of the new sprite.
* @param y {number} Y position of the new sprite.
* @param [key] {string} The image key as defined in the Game.Cache to use as the texture for this sprite
* @param [frame] {string|number} If the sprite uses an image from a texture atlas or sprite sheet you can pass the frame here. Either a number for a frame ID or a string for a frame name.
* @param [bodyType] {number} The physics body type of the object (defaults to BODY_DISABLED)
* @returns {Sprite} The newly created sprite object.
*/
public addNewSprite(x: number, y: number, key?: string = '', bodyType?: number = Phaser.Types.BODY_DISABLED): Sprite {
return <Sprite> this.add(new Sprite(this.game, x, y, key, bodyType));
public addNewSprite(x: number, y: number, key?: string = '', frame? = null, bodyType?: number = Phaser.Types.BODY_DISABLED): Sprite {
return <Sprite> this.add(new Sprite(this.game, x, y, key, frame, bodyType));
}
/**
@@ -620,7 +592,7 @@ module Phaser {
* <code>State.update()</code> override. To sort all existing objects after
* a big explosion or bomb attack, you might call <code>myGroup.sort("exists",Group.DESCENDING)</code>.
*
* @param {string} index The <code>string</code> name of the member variable you want to sort on. Default value is "y".
* @param {string} index The <code>string</code> name of the member variable you want to sort on. Default value is "z".
* @param {number} order A <code>Group</code> constant that defines the sort order. Possible values are <code>Group.ASCENDING</code> and <code>Group.DESCENDING</code>. Default value is <code>Group.ASCENDING</code>.
*/
public sort(index: string = 'z', order: number = Group.ASCENDING) {
Phaser/core/Rectangle.ts
+18 -18
View File
@@ -14,14 +14,14 @@ module Phaser {
export class Rectangle {
/**
* Creates a new Rectangle object with the top-left corner specified by the x and y parameters and with the specified width and height parameters. If you call this function without parameters, a rectangle with x, y, width, and height properties set to 0 is created.
* Creates a new Rectangle object with the top-left corner specified by the x and y parameters and with the specified width and height parameters. If you call this function without parameters, a Rectangle with x, y, width, and height properties set to 0 is created.
* @class Rectangle
* @constructor
* @param {Number} x The x coordinate of the top-left corner of the rectangle.
* @param {Number} y The y coordinate of the top-left corner of the rectangle.
* @param {Number} width The width of the rectangle in pixels.
* @param {Number} height The height of the rectangle in pixels.
* @return {Rectangle} This rectangle object
* @param {Number} x The x coordinate of the top-left corner of the Rectangle.
* @param {Number} y The y coordinate of the top-left corner of the Rectangle.
* @param {Number} width The width of the Rectangle in pixels.
* @param {Number} height The height of the Rectangle in pixels.
* @return {Rectangle} This Rectangle object
**/
constructor(x: number = 0, y: number = 0, width: number = 0, height: number = 0) {
@@ -33,35 +33,35 @@ module Phaser {
}
/**
* The x coordinate of the top-left corner of the rectangle
* The x coordinate of the top-left corner of the Rectangle
* @property x
* @type Number
**/
x: number;
/**
* The y coordinate of the top-left corner of the rectangle
* The y coordinate of the top-left corner of the Rectangle
* @property y
* @type Number
**/
y: number;
/**
* The width of the rectangle in pixels
* The width of the Rectangle in pixels
* @property width
* @type Number
**/
width: number;
/**
* The height of the rectangle in pixels
* The height of the Rectangle in pixels
* @property height
* @type Number
**/
height: number;
/**
* Half of the width of the rectangle
* Half of the width of the Rectangle
* @property halfWidth
* @type Number
**/
@@ -70,7 +70,7 @@ module Phaser {
}
/**
* Half of the height of the rectangle
* Half of the height of the Rectangle
* @property halfHeight
* @type Number
**/
@@ -248,7 +248,7 @@ module Phaser {
/**
* Sets all of the Rectangle object's properties to 0. A Rectangle object is empty if its width or height is less than or equal to 0.
* @method setEmpty
* @return {Rectangle} This rectangle object
* @return {Rectangle} This Rectangle object
**/
set empty(value: bool) {
return this.setTo(0, 0, 0, 0);
@@ -283,11 +283,11 @@ module Phaser {
/**
* Sets the members of Rectangle to the specified values.
* @method setTo
* @param {Number} x The x coordinate of the top-left corner of the rectangle.
* @param {Number} y The y coordinate of the top-left corner of the rectangle.
* @param {Number} width The width of the rectangle in pixels.
* @param {Number} height The height of the rectangle in pixels.
* @return {Rectangle} This rectangle object
* @param {Number} x The x coordinate of the top-left corner of the Rectangle.
* @param {Number} y The y coordinate of the top-left corner of the Rectangle.
* @param {Number} width The width of the Rectangle in pixels.
* @param {Number} height The height of the Rectangle in pixels.
* @return {Rectangle} This Rectangle object
**/
setTo(x: number, y: number, width: number, height: number): Rectangle {
Phaser/gameobjects/DynamicTexture.ts
+7 -7
View File
@@ -110,8 +110,8 @@ module Phaser {
}
/**
* Get pixels in array in a specific rectangle.
* @param rect {Rectangle} The specific rectangle.
* Get pixels in array in a specific Rectangle.
* @param rect {Rectangle} The specific Rectangle.
* @returns {array} CanvasPixelArray.
*/
public getPixels(rect: Rectangle) {
@@ -147,8 +147,8 @@ module Phaser {
}
/**
* Set image data to a specific rectangle.
* @param rect {Rectangle} Target rectangle.
* Set image data to a specific Rectangle.
* @param rect {Rectangle} Target Rectangle.
* @param input {object} Source image data.
*/
public setPixels(rect: Rectangle, input) {
@@ -158,8 +158,8 @@ module Phaser {
}
/**
* Fill a given rectangle with specific color.
* @param rect {Rectangle} Target rectangle you want to fill.
* Fill a given Rectangle with specific color.
* @param rect {Rectangle} Target Rectangle you want to fill.
* @param color {number} A native number with color value. (format: 0xRRGGBB)
*/
public fillRect(rect: Rectangle, color: number) {
@@ -231,7 +231,7 @@ module Phaser {
/**
* Copy pixel from another DynamicTexture to this texture.
* @param sourceTexture {DynamicTexture} Source texture object.
* @param sourceRect {Rectangle} The specific region rectangle to be copied to this in the source.
* @param sourceRect {Rectangle} The specific region Rectangle to be copied to this in the source.
* @param destPoint {Point} Top-left point the target image data will be paste at.
*/
public copyPixels(sourceTexture: DynamicTexture, sourceRect: Rectangle, destPoint: Point) {
Phaser/gameobjects/Emitter.ts
+2 -2
View File
@@ -250,7 +250,7 @@ module Phaser {
particle.exists = false;
// Center the origin for rotation assistance
particle.origin.setTo(particle.body.bounds.halfWidth, particle.body.bounds.halfHeight);
particle.transform.origin.setTo(particle.body.bounds.halfWidth, particle.body.bounds.halfHeight);
this.add(particle);
@@ -398,7 +398,7 @@ module Phaser {
if (particle.body.angularVelocity != 0)
{
particle.angle = this.game.math.random() * 360 - 180;
particle.rotation = this.game.math.random() * 360 - 180;
}
particle.body.drag.x = this.particleDrag.x;
Phaser/gameobjects/GameObjectFactory.ts
+3 -2
View File
@@ -68,11 +68,12 @@ module Phaser {
* @param x {number} X position of the new sprite.
* @param y {number} Y position of the new sprite.
* @param [key] {string} The image key as defined in the Game.Cache to use as the texture for this sprite
* @param [frame] {string|number} If the sprite uses an image from a texture atlas or sprite sheet you can pass the frame here. Either a number for a frame ID or a string for a frame name.
* @param [bodyType] {number} The physics body type of the object (defaults to BODY_DISABLED)
* @returns {Sprite} The newly created sprite object.
*/
public sprite(x: number, y: number, key?: string = '', bodyType?: number = Phaser.Types.BODY_DISABLED): Sprite {
return <Sprite> this._world.group.add(new Sprite(this._game, x, y, key, bodyType));
public sprite(x: number, y: number, key?: string = '', frame? = null, bodyType?: number = Phaser.Types.BODY_DISABLED): Sprite {
return <Sprite> this._world.group.add(new Sprite(this._game, x, y, key, frame, bodyType));
}
/**
Phaser/gameobjects/IGameObject.ts
+5 -10
View File
@@ -30,7 +30,7 @@ module Phaser {
y: number;
/**
* Z-order value of the object.
* z-index value of the object.
*/
z: number;
@@ -45,24 +45,19 @@ module Phaser {
active: bool;
/**
* Controls if this Sprite is rendered or skipped during the core game loop.
* Controls if this is rendered or skipped during the core game loop.
*/
visible: bool;
/**
* The texture used to render the Sprite.
* The texture used to render.
*/
texture: Phaser.Components.Texture;
/**
* Scale of the Sprite. A scale of 1.0 is the original size. 0.5 half size. 2.0 double sized.
* The transform component.
*/
scale: Phaser.Vec2;
/**
* The influence of camera movement upon the Sprite.
*/
scrollFactor: Phaser.Vec2;
transform: Phaser.Components.Transform;
}
Phaser/gameobjects/Sprite.ts
+58 -85
View File
@@ -2,14 +2,14 @@
/// <reference path="../core/Vec2.ts" />
/// <reference path="../core/Rectangle.ts" />
/// <reference path="../components/animation/AnimationManager.ts" />
/// <reference path="../components/sprite/Texture.ts" />
/// <reference path="../components/Texture.ts" />
/// <reference path="../components/Transform.ts" />
/// <reference path="../components/sprite/Input.ts" />
/// <reference path="../components/sprite/Events.ts" />
/// <reference path="../physics/Body.ts" />
/**
* Phaser - Sprite
*
*/
module Phaser {
@@ -25,7 +25,7 @@ module Phaser {
* @param [key] {string} Key of the graphic you want to load for this sprite.
* @param [bodyType] {number} The physics body type of the object (defaults to BODY_DISABLED)
*/
constructor(game: Game, x?: number = 0, y?: number = 0, key?: string = null, bodyType?: number = Phaser.Types.BODY_DISABLED) {
constructor(game: Game, x?: number = 0, y?: number = 0, key?: string = null, frame? = null, bodyType?: number = Phaser.Types.BODY_DISABLED) {
this.game = game;
this.type = Phaser.Types.SPRITE;
@@ -35,30 +35,41 @@ module Phaser {
this.visible = true;
this.alive = true;
// We give it a default size of 16x16 but when the texture loads (if given) it will reset this
this.frameBounds = new Rectangle(x, y, 16, 16);
this.scrollFactor = new Phaser.Vec2(1, 1);
this.x = x;
this.y = y;
this.z = -1;
this.group = null;
this.screen = new Point;
// If a texture has been given the body will be set to that size, otherwise 16x16
this.body = new Phaser.Physics.Body(this, bodyType);
this.transform = new Phaser.Components.Transform(this);
this.animations = new Phaser.Components.AnimationManager(this);
this.texture = new Phaser.Components.Texture(this, key);
this.input = new Phaser.Components.Input(this);
this.events = new Phaser.Components.Events(this);
this.texture = new Phaser.Components.Texture(this);
this.body = new Phaser.Physics.Body(this, bodyType);
this.input = new Phaser.Components.Sprite.Input(this);
this.events = new Phaser.Components.Sprite.Events(this);
this.cameraBlacklist = [];
if (key !== null)
{
this.texture.loadImage(key, false);
}
else
{
this.texture.opaque = true;
}
if (frame !== null)
{
if (typeof frame == 'string')
{
this.frameName = frame;
}
else
{
this.frame = frame;
}
}
this.worldView = new Rectangle(x, y, this.width, this.height);
// Transform related (if we add any more then move to a component)
this.origin = new Phaser.Vec2(0, 0);
this.scale = new Phaser.Vec2(1, 1);
this.skew = new Phaser.Vec2(0, 0);
}
/**
@@ -92,7 +103,7 @@ module Phaser {
public visible: bool;
/**
*
* A useful state for many game objects. Kill and revive both flip this switch.
*/
public alive: bool;
@@ -106,15 +117,20 @@ module Phaser {
*/
public texture: Phaser.Components.Texture;
/**
* The Sprite transform component.
*/
public transform: Phaser.Components.Transform;
/**
* The Input component
*/
public input: Phaser.Components.Input;
public input: Phaser.Components.Sprite.Input;
/**
* The Events component
*/
public events: Phaser.Components.Events;
public events: Phaser.Components.Sprite.Events;
/**
* This manages animations of the sprite. You can modify animations though it. (see AnimationManager)
@@ -123,50 +139,16 @@ module Phaser {
public animations: Phaser.Components.AnimationManager;
/**
* An Array of Cameras to which this GameObject won't render
* @type {Array}
* A Rectangle that defines the size and placement of the Sprite in the game world,
* after taking into consideration both scrollFactor and scaling.
*/
public cameraBlacklist: number[];
/**
* The frame boundary around this Sprite.
* For non-animated sprites this matches the loaded texture dimensions.
* For animated sprites it will be updated as part of the animation loop, changing to the dimensions of the current animation frame.
*/
public frameBounds: Phaser.Rectangle;
/**
* Scale of the Sprite. A scale of 1.0 is the original size. 0.5 half size. 2.0 double sized.
*/
public scale: Phaser.Vec2;
/**
* Skew the Sprite along the x and y axis. A skew value of 0 is no skew.
*/
public skew: Phaser.Vec2;
public worldView: Phaser.Rectangle;
/**
* A boolean representing if the Sprite has been modified in any way via a scale, rotate, flip or skew.
*/
public modified: bool = false;
/**
* The influence of camera movement upon the Sprite.
*/
public scrollFactor: Phaser.Vec2;
/**
* The Sprite origin is the point around which scale and rotation takes place.
*/
public origin: Phaser.Vec2;
/**
* A Point holding the x/y coordinate of this Sprite relative to the screen. It uses the default created world
* camera to calculate its values. If you have changed the default camera (i.e. resized it, deleted it) this value
* will be incorrect and should be ignored.
*/
public screen: Point;
/**
* x value of the object.
*/
@@ -183,31 +165,23 @@ module Phaser {
public z: number = 0;
/**
* Render iteration
* Render iteration counter
*/
public renderOrderID: number = 0;
/**
* This value is added to the angle of the Sprite.
* For example if you had a sprite graphic drawn facing straight up then you could set
* angleOffset to 90 and it would correspond correctly with Phasers right-handed coordinate system.
* @type {number}
*/
public angleOffset: number = 0;
/**
* The angle of the sprite in degrees. Phaser uses a right-handed coordinate system, where 0 points to the right.
* The rotation of the sprite in degrees. Phaser uses a right-handed coordinate system, where 0 points to the right.
*/
public get angle(): number {
return this.body.angle;
public get rotation(): number {
return this.transform.rotation;
}
/**
* Set the angle of the sprite in degrees. Phaser uses a right-handed coordinate system, where 0 points to the right.
* Set the rotation of the sprite in degrees. Phaser uses a right-handed coordinate system, where 0 points to the right.
* The value is automatically wrapped to be between 0 and 360.
*/
public set angle(value: number) {
this.body.angle = this.game.math.wrap(value, 360, 0);
public set rotation(value: number) {
this.transform.rotation = this.game.math.wrap(value, 360, 0);
}
/**
@@ -239,19 +213,19 @@ module Phaser {
}
public set width(value: number) {
this.frameBounds.width = value;
this.transform.scale.x = value / this.texture.width;
}
public get width(): number {
return this.frameBounds.width;
return this.texture.width * this.transform.scale.x;
}
public set height(value: number) {
this.frameBounds.height = value;
this.transform.scale.y = value / this.texture.height;
}
public get height(): number {
return this.frameBounds.height;
return this.texture.height * this.transform.scale.y;
}
/**
@@ -259,13 +233,12 @@ module Phaser {
*/
public preUpdate() {
this.frameBounds.x = this.x;
this.frameBounds.y = this.y;
this.worldView.x = this.x - (this.game.world.cameras.default.worldView.x * this.transform.scrollFactor.x);
this.worldView.y = this.y - (this.game.world.cameras.default.worldView.y * this.transform.scrollFactor.y);
this.worldView.width = this.width;
this.worldView.height = this.height;
this.screen.x = this.x - (this.game.world.cameras.default.worldView.x * this.scrollFactor.x);
this.screen.y = this.y - (this.game.world.cameras.default.worldView.y * this.scrollFactor.y);
if (this.modified == false && (!this.scale.equals(1) || !this.skew.equals(0) || this.angle != 0 || this.angleOffset != 0 || this.texture.flippedX || this.texture.flippedY))
if (this.modified == false && (!this.transform.scale.equals(1) || !this.transform.skew.equals(0) || this.transform.rotation != 0 || this.transform.rotationOffset != 0 || this.texture.flippedX || this.texture.flippedY))
{
this.modified = true;
}
@@ -319,7 +292,7 @@ module Phaser {
}
*/
if (this.modified == true && this.scale.equals(1) && this.skew.equals(0) && this.angle == 0 && this.angleOffset == 0 && this.texture.flippedX == false && this.texture.flippedY == false)
if (this.modified == true && this.transform.scale.equals(1) && this.transform.skew.equals(0) && this.transform.rotation == 0 && this.transform.rotationOffset == 0 && this.texture.flippedX == false && this.texture.flippedY == false)
{
this.modified = false;
}
Phaser/input/Pointer.ts
+2 -1
View File
@@ -263,7 +263,7 @@ module Phaser {
public targetObject = null;
/**
* Gets the X value of this Pointer in world coordinate space
* Gets the X value of this Pointer in world coordinate space (is it properly scaled?)
* @param {Camera} [camera]
*/
public getWorldX(camera?: Camera = this.game.camera) {
@@ -329,6 +329,7 @@ module Phaser {
this.timeDown = this.game.time.now;
this._holdSent = false;
// x and y are the old values here?
this.positionDown.setTo(this.x, this.y);
this.move(event);
Phaser/loader/AnimationLoader.ts
+1
View File
@@ -81,6 +81,7 @@ module Phaser {
// Malformed?
if (!json['frames'])
{
console.log(json);
throw new Error("Phaser.AnimationLoader.parseJSONData: Invalid Texture Atlas JSON given, missing 'frames' array");
}
Phaser/loader/Loader.ts
+1 -1
View File
@@ -167,7 +167,7 @@ module Phaser {
}
this._queueSize++;
this._fileList[key] = { type: 'textureatlas', key: key, url: textureURL, data: null, atlasURL: null, atlasData: atlasData['frames'], format: format, error: false, loaded: false };
this._fileList[key] = { type: 'textureatlas', key: key, url: textureURL, data: null, atlasURL: null, atlasData: atlasData, format: format, error: false, loaded: false };
this._keys.push(key);
}
else if (format == Loader.TEXTURE_ATLAS_XML_STARLING)
Phaser/math/GameMath.ts
+8 -8
View File
@@ -308,7 +308,7 @@ module Phaser {
/**
* set an angle with in the bounds of -PI to PI
* set an angle within the bounds of -PI to PI
*/
public normalizeAngle(angle: number, radians: bool = true): number {
var rd: number = (radians) ? GameMath.PI : 180;
@@ -1022,20 +1022,20 @@ module Phaser {
}
/**
* Rotates the point around the x/y coordinates given to the desired angle and distance
* Rotates the point around the x/y coordinates given to the desired rotation and distance
* @param point {Object} Any object with exposed x and y properties
* @param x {number} The x coordinate of the anchor point
* @param y {number} The y coordinate of the anchor point
* @param {Number} angle The angle in radians (unless asDegrees is true) to return the point from.
* @param {Boolean} asDegrees Is the given angle in radians (false) or degrees (true)?
* @param {Number} rotation The rotation in radians (unless asDegrees is true) to return the point from.
* @param {Boolean} asDegrees Is the given rotation in radians (false) or degrees (true)?
* @param {Number} distance An optional distance constraint between the point and the anchor
* @return The modified point object
*/
public rotatePoint(point, x1: number, y1: number, angle: number, asDegrees: bool = false, distance?:number = null) {
public rotatePoint(point, x1: number, y1: number, rotation: number, asDegrees: bool = false, distance?:number = null) {
if (asDegrees)
{
angle = angle * GameMath.DEG_TO_RAD;
rotation = rotation * GameMath.DEG_TO_RAD;
}
// Get distance from origin to the point
@@ -1044,8 +1044,8 @@ module Phaser {
distance = Math.sqrt(((x1 - point.x) * (x1 - point.x)) + ((y1 - point.y) * (y1 - point.y)));
}
point.x = x1 + distance * Math.cos(angle);
point.y = y1 + distance * Math.sin(angle);
point.x = x1 + distance * Math.cos(rotation);
point.y = y1 + distance * Math.sin(rotation);
return point;
Phaser/physics/Body.ts
+24 -24
View File
@@ -10,15 +10,15 @@ module Phaser.Physics {
export class Body {
constructor(parent: Sprite, type: number) {
constructor(sprite: Phaser.Sprite, type: number) {
this.parent = parent;
this.game = parent.game;
this.sprite = sprite;
this.game = sprite.game;
this.type = type;
// Fixture properties
// Will extend into its own class at a later date - can move the fixture defs there and add shape support, but this will do for 1.0 release
this.bounds = new Rectangle(parent.x + Math.round(parent.width / 2), parent.y + Math.round(parent.height / 2), parent.width, parent.height);
this.bounds = new Rectangle(sprite.x + Math.round(sprite.width / 2), sprite.y + Math.round(sprite.height / 2), sprite.width, sprite.height);
this.bounce = Vec2Utils.clone(this.game.world.physics.bounce);
// Body properties
@@ -29,7 +29,6 @@ module Phaser.Physics {
this.drag = Vec2Utils.clone(this.game.world.physics.drag);
this.maxVelocity = new Vec2(10000, 10000);
this.angle = 0;
this.angularVelocity = 0;
this.angularAcceleration = 0;
this.angularDrag = 0;
@@ -38,14 +37,21 @@ module Phaser.Physics {
this.wasTouching = Types.NONE;
this.allowCollisions = Types.ANY;
this.position = new Vec2(parent.x + this.bounds.halfWidth, parent.y + this.bounds.halfHeight);
this.oldPosition = new Vec2(parent.x + this.bounds.halfWidth, parent.y + this.bounds.halfHeight);
this.position = new Vec2(sprite.x + this.bounds.halfWidth, sprite.y + this.bounds.halfHeight);
this.oldPosition = new Vec2(sprite.x + this.bounds.halfWidth, sprite.y + this.bounds.halfHeight);
this.offset = new Vec2;
}
/**
* Reference to Phaser.Game
*/
public game: Game;
public parent: Sprite;
/**
* Reference to the sprite Sprite
*/
public sprite: Phaser.Sprite;
/**
* The type of Body (disabled, dynamic, static or kinematic)
@@ -70,12 +76,6 @@ module Phaser.Physics {
public angularDrag: number = 0;
public maxAngular: number = 10000;
/**
* Angle of rotation of this body.
* @type {number}
*/
public angle: number;
/**
* Orientation of the object.
* @type {number}
@@ -102,7 +102,7 @@ module Phaser.Physics {
this.bounds.x = this.position.x - this.bounds.halfWidth;
this.bounds.y = this.position.y - this.bounds.halfHeight;
if (this.parent.scale.equals(1) == false)
if (this.sprite.transform.scale.equals(1) == false)
{
}
@@ -117,8 +117,8 @@ module Phaser.Physics {
{
this.game.world.physics.updateMotion(this);
this.parent.x = (this.position.x - this.bounds.halfWidth) - this.offset.x;
this.parent.y = (this.position.y - this.bounds.halfHeight) - this.offset.y;
this.sprite.x = (this.position.x - this.bounds.halfWidth) - this.offset.x;
this.sprite.y = (this.position.y - this.bounds.halfHeight) - this.offset.y;
this.wasTouching = this.touching;
this.touching = Phaser.Types.NONE;
@@ -267,13 +267,13 @@ module Phaser.Physics {
*/
public renderDebugInfo(x: number, y: number, color?: string = 'rgb(255,255,255)') {
this.parent.texture.context.fillStyle = color;
this.parent.texture.context.fillText('Sprite: (' + this.parent.frameBounds.width + ' x ' + this.parent.frameBounds.height + ')', x, y);
//this.parent.texture.context.fillText('x: ' + this._parent.frameBounds.x.toFixed(1) + ' y: ' + this._parent.frameBounds.y.toFixed(1) + ' rotation: ' + this._parent.rotation.toFixed(1), x, y + 14);
this.parent.texture.context.fillText('x: ' + this.bounds.x.toFixed(1) + ' y: ' + this.bounds.y.toFixed(1) + ' angle: ' + this.angle.toFixed(0), x, y + 14);
this.parent.texture.context.fillText('vx: ' + this.velocity.x.toFixed(1) + ' vy: ' + this.velocity.y.toFixed(1), x, y + 28);
this.parent.texture.context.fillText('acx: ' + this.acceleration.x.toFixed(1) + ' acy: ' + this.acceleration.y.toFixed(1), x, y + 42);
this.parent.texture.context.fillText('angVx: ' + this.angularVelocity.toFixed(1) + ' angAc: ' + this.angularAcceleration.toFixed(1), x, y + 56);
this.sprite.texture.context.fillStyle = color;
this.sprite.texture.context.fillText('Sprite: (' + this.sprite.width + ' x ' + this.sprite.height + ')', x, y);
//this.sprite.texture.context.fillText('x: ' + this._sprite.frameBounds.x.toFixed(1) + ' y: ' + this._sprite.frameBounds.y.toFixed(1) + ' rotation: ' + this._sprite.rotation.toFixed(1), x, y + 14);
this.sprite.texture.context.fillText('x: ' + this.bounds.x.toFixed(1) + ' y: ' + this.bounds.y.toFixed(1) + ' rotation: ' + this.sprite.transform.rotation.toFixed(0), x, y + 14);
this.sprite.texture.context.fillText('vx: ' + this.velocity.x.toFixed(1) + ' vy: ' + this.velocity.y.toFixed(1), x, y + 28);
this.sprite.texture.context.fillText('acx: ' + this.acceleration.x.toFixed(1) + ' acy: ' + this.acceleration.y.toFixed(1), x, y + 42);
this.sprite.texture.context.fillText('angVx: ' + this.angularVelocity.toFixed(1) + ' angAc: ' + this.angularAcceleration.toFixed(1), x, y + 56);
}
Phaser/physics/PhysicsManager.ts
+3 -3
View File
@@ -141,7 +141,7 @@ module Phaser.Physics {
this._velocityDelta = (this.computeVelocity(body.angularVelocity, body.gravity.x, body.angularAcceleration, body.angularDrag, body.maxAngular) - body.angularVelocity) / 2;
body.angularVelocity += this._velocityDelta;
body.angle += body.angularVelocity * this.game.time.elapsed;
body.sprite.transform.rotation += body.angularVelocity * this.game.time.elapsed;
body.angularVelocity += this._velocityDelta;
this._velocityDelta = (this.computeVelocity(body.velocity.x, body.gravity.x, body.acceleration.x, body.drag.x) - body.velocity.x) / 2;
@@ -424,7 +424,7 @@ module Phaser.Physics {
body1.velocity.y = this._obj2Velocity - this._obj1Velocity * body1.bounce.y;
// This is special case code that handles things like horizontal moving platforms you can ride
//if (body2.parent.active && body2.moves && (body1.deltaY > body2.deltaY))
if (body2.parent.active && (body1.deltaY > body2.deltaY))
if (body2.sprite.active && (body1.deltaY > body2.deltaY))
{
body1.position.x += body2.position.x - body2.oldPosition.x;
}
@@ -436,7 +436,7 @@ module Phaser.Physics {
body2.velocity.y = this._obj1Velocity - this._obj2Velocity * body2.bounce.y;
// This is special case code that handles things like horizontal moving platforms you can ride
//if (object1.active && body1.moves && (body1.deltaY < body2.deltaY))
if (body1.parent.active && (body1.deltaY < body2.deltaY))
if (body1.sprite.active && (body1.deltaY < body2.deltaY))
{
body2.position.x += body1.position.x - body1.oldPosition.x;
}
Phaser/renderers/CanvasRenderer.ts
+357 -56
View File
@@ -53,11 +53,11 @@ module Phaser {
{
this._camera = this._cameraList[c];
this._camera.preRender();
this.preRenderCamera(this._camera);
this._game.world.group.render(this._camera);
this._camera.postRender();
this.postRenderCamera(this._camera);
}
this.renderTotal = this._count;
@@ -77,13 +77,148 @@ module Phaser {
}
public preRenderGroup(camera: Camera, group: Group) {
if (camera.transform.scale.x == 0 || camera.transform.scale.y == 0 || camera.texture.alpha < 0.1 || this.inScreen(camera) == false)
{
return false;
}
// Reset our temp vars
this._ga = -1;
this._sx = 0;
this._sy = 0;
this._sw = group.texture.width;
this._sh = group.texture.height;
this._fx = group.transform.scale.x;
this._fy = group.transform.scale.y;
this._sin = 0;
this._cos = 1;
//this._dx = (camera.screenView.x * camera.scrollFactor.x) + camera.frameBounds.x - (camera.worldView.x * camera.scrollFactor.x);
//this._dy = (camera.screenView.y * camera.scrollFactor.y) + camera.frameBounds.y - (camera.worldView.y * camera.scrollFactor.y);
this._dx = 0;
this._dy = 0;
this._dw = group.texture.width;
this._dh = group.texture.height;
// Global Composite Ops
if (group.texture.globalCompositeOperation)
{
group.texture.context.save();
group.texture.context.globalCompositeOperation = group.texture.globalCompositeOperation;
}
// Alpha
if (group.texture.alpha !== 1 && group.texture.context.globalAlpha !== group.texture.alpha)
{
this._ga = group.texture.context.globalAlpha;
group.texture.context.globalAlpha = group.texture.alpha;
}
// Flip X
if (group.texture.flippedX)
{
this._fx = -group.transform.scale.x;
}
// Flip Y
if (group.texture.flippedY)
{
this._fy = -group.transform.scale.y;
}
// Rotation and Flipped
if (group.modified)
{
if (group.transform.rotation !== 0 || group.transform.rotationOffset !== 0)
{
this._sin = Math.sin(group.game.math.degreesToRadians(group.transform.rotationOffset + group.transform.rotation));
this._cos = Math.cos(group.game.math.degreesToRadians(group.transform.rotationOffset + group.transform.rotation));
}
// setTransform(a, b, c, d, e, f);
// a = scale x
// b = skew x
// c = skew y
// d = scale y
// e = translate x
// f = translate y
group.texture.context.save();
group.texture.context.setTransform(this._cos * this._fx, (this._sin * this._fx) + group.transform.skew.x, -(this._sin * this._fy) + group.transform.skew.y, this._cos * this._fy, this._dx, this._dy);
this._dx = -group.transform.origin.x;
this._dy = -group.transform.origin.y;
}
else
{
if (!group.transform.origin.equals(0))
{
this._dx -= group.transform.origin.x;
this._dy -= group.transform.origin.y;
}
}
this._sx = Math.round(this._sx);
this._sy = Math.round(this._sy);
this._sw = Math.round(this._sw);
this._sh = Math.round(this._sh);
this._dx = Math.round(this._dx);
this._dy = Math.round(this._dy);
this._dw = Math.round(this._dw);
this._dh = Math.round(this._dh);
if (group.texture.opaque)
{
group.texture.context.fillStyle = group.texture.backgroundColor;
group.texture.context.fillRect(this._dx, this._dy, this._dw, this._dh);
}
if (group.texture.loaded)
{
group.texture.context.drawImage(
group.texture.texture, // Source Image
this._sx, // Source X (location within the source image)
this._sy, // Source Y
this._sw, // Source Width
this._sh, // Source Height
this._dx, // Destination X (where on the canvas it'll be drawn)
this._dy, // Destination Y
this._dw, // Destination Width (always same as Source Width unless scaled)
this._dh // Destination Height (always same as Source Height unless scaled)
);
}
return true;
}
public postRenderGroup(camera: Camera, group: Group) {
if (group.modified || group.texture.globalCompositeOperation)
{
group.texture.context.restore();
}
// This could have been over-written by a sprite, need to store elsewhere
if (this._ga > -1)
{
group.texture.context.globalAlpha = this._ga;
}
}
/**
* Check whether this object is visible in a specific camera rectangle.
* @param camera {Rectangle} The rectangle you want to check.
* @return {boolean} Return true if bounds of this sprite intersects the given rectangle, otherwise return false.
* Check whether this object is visible in a specific camera Rectangle.
* @param camera {Rectangle} The Rectangle you want to check.
* @return {boolean} Return true if bounds of this sprite intersects the given Rectangle, otherwise return false.
*/
public inCamera(camera: Camera, sprite: Sprite): bool {
return true;
/*
// Object fixed in place regardless of the camera scrolling? Then it's always visible
if (sprite.scrollFactor.x == 0 && sprite.scrollFactor.y == 0)
{
@@ -95,7 +230,162 @@ module Phaser {
this._dw = sprite.frameBounds.width * sprite.scale.x;
this._dh = sprite.frameBounds.height * sprite.scale.y;
return (camera.scaledX + camera.worldView.width > this._dx) && (camera.scaledX < this._dx + this._dw) && (camera.scaledY + camera.worldView.height > this._dy) && (camera.scaledY < this._dy + this._dh);
//return (camera.screenView.x + camera.worldView.width > this._dx) && (camera.screenView.x < this._dx + this._dw) && (camera.screenView.y + camera.worldView.height > this._dy) && (camera.screenView.y < this._dy + this._dh);
*/
}
public inScreen(camera: Camera): bool {
return true;
}
/**
* Render this sprite to specific camera. Called by game loop after update().
* @param camera {Camera} Camera this sprite will be rendered to.
* @return {boolean} Return false if not rendered, otherwise return true.
*/
public preRenderCamera(camera: Camera): bool {
if (camera.transform.scale.x == 0 || camera.transform.scale.y == 0 || camera.texture.alpha < 0.1 || this.inScreen(camera) == false)
{
return false;
}
// Reset our temp vars
this._ga = -1;
this._sx = 0;
this._sy = 0;
this._sw = camera.width;
this._sh = camera.height;
this._fx = camera.transform.scale.x;
this._fy = camera.transform.scale.y;
this._sin = 0;
this._cos = 1;
this._dx = camera.screenView.x;
this._dy = camera.screenView.y;
this._dw = camera.width;
this._dh = camera.height;
// Global Composite Ops
if (camera.texture.globalCompositeOperation)
{
camera.texture.context.save();
camera.texture.context.globalCompositeOperation = camera.texture.globalCompositeOperation;
}
// Alpha
if (camera.texture.alpha !== 1 && camera.texture.context.globalAlpha != camera.texture.alpha)
{
this._ga = camera.texture.context.globalAlpha;
camera.texture.context.globalAlpha = camera.texture.alpha;
}
// Sprite Flip X
if (camera.texture.flippedX)
{
this._fx = -camera.transform.scale.x;
}
// Sprite Flip Y
if (camera.texture.flippedY)
{
this._fy = -camera.transform.scale.y;
}
// Rotation and Flipped
if (camera.modified)
{
if (camera.transform.rotation !== 0 || camera.transform.rotationOffset !== 0)
{
this._sin = Math.sin(camera.game.math.degreesToRadians(camera.transform.rotationOffset + camera.transform.rotation));
this._cos = Math.cos(camera.game.math.degreesToRadians(camera.transform.rotationOffset + camera.transform.rotation));
}
// setTransform(a, b, c, d, e, f);
// a = scale x
// b = skew x
// c = skew y
// d = scale y
// e = translate x
// f = translate y
camera.texture.context.save();
camera.texture.context.setTransform(this._cos * this._fx, (this._sin * this._fx) + camera.transform.skew.x, -(this._sin * this._fy) + camera.transform.skew.y, this._cos * this._fy, this._dx, this._dy);
this._dx = -camera.transform.origin.x;
this._dy = -camera.transform.origin.y;
}
else
{
if (!camera.transform.origin.equals(0))
{
this._dx -= camera.transform.origin.x;
this._dy -= camera.transform.origin.y;
}
}
this._sx = Math.round(this._sx);
this._sy = Math.round(this._sy);
this._sw = Math.round(this._sw);
this._sh = Math.round(this._sh);
this._dx = Math.round(this._dx);
this._dy = Math.round(this._dy);
this._dw = Math.round(this._dw);
this._dh = Math.round(this._dh);
// Clip the camera so we don't get sprites appearing outside the edges
if (camera.clip == true && camera.disableClipping == false)
{
camera.texture.context.beginPath();
camera.texture.context.rect(camera.screenView.x, camera.screenView.x, camera.screenView.width, camera.screenView.height);
camera.texture.context.closePath();
camera.texture.context.clip();
}
if (camera.texture.opaque)
{
camera.texture.context.fillStyle = camera.texture.backgroundColor;
camera.texture.context.fillRect(this._dx, this._dy, this._dw, this._dh);
}
//camera.fx.render(camera);
if (camera.texture.loaded)
{
camera.texture.context.drawImage(
camera.texture.texture, // Source Image
this._sx, // Source X (location within the source image)
this._sy, // Source Y
this._sw, // Source Width
this._sh, // Source Height
this._dx, // Destination X (where on the canvas it'll be drawn)
this._dy, // Destination Y
this._dw, // Destination Width (always same as Source Width unless scaled)
this._dh // Destination Height (always same as Source Height unless scaled)
);
}
return true;
}
public postRenderCamera(camera: Camera) {
//camera.fx.postRender(camera);
if (camera.modified || camera.texture.globalCompositeOperation)
{
camera.texture.context.restore();
}
// This could have been over-written by a sprite, need to store elsewhere
if (this._ga > -1)
{
camera.texture.context.globalAlpha = this._ga;
}
}
@@ -112,8 +402,8 @@ module Phaser {
this._fy = 1;
this._sin = 0;
this._cos = 1;
this._dx = camera.scaledX + circle.x - camera.worldView.x;
this._dy = camera.scaledY + circle.y - camera.worldView.y;
this._dx = camera.screenView.x + circle.x - camera.worldView.x;
this._dy = camera.screenView.y + circle.y - camera.worldView.y;
this._dw = circle.diameter;
this._dh = circle.diameter;
@@ -162,7 +452,7 @@ module Phaser {
*/
public renderSprite(camera: Camera, sprite: Sprite): bool {
if (sprite.scale.x == 0 || sprite.scale.y == 0 || sprite.texture.alpha < 0.1 || this.inCamera(camera, sprite) == false)
if (sprite.transform.scale.x == 0 || sprite.transform.scale.y == 0 || sprite.texture.alpha < 0.1 || this.inCamera(camera, sprite) == false)
{
return false;
}
@@ -175,19 +465,26 @@ module Phaser {
this._ga = -1;
this._sx = 0;
this._sy = 0;
this._sw = sprite.frameBounds.width;
this._sh = sprite.frameBounds.height;
this._fx = sprite.scale.x;
this._fy = sprite.scale.y;
this._sw = sprite.texture.width;
this._sh = sprite.texture.height;
this._fx = sprite.transform.scale.x;
this._fy = sprite.transform.scale.y;
this._sin = 0;
this._cos = 1;
this._dx = (camera.scaledX * sprite.scrollFactor.x) + sprite.frameBounds.x - (camera.worldView.x * sprite.scrollFactor.x);
this._dy = (camera.scaledY * sprite.scrollFactor.y) + sprite.frameBounds.y - (camera.worldView.y * sprite.scrollFactor.y);
this._dw = sprite.frameBounds.width;
this._dh = sprite.frameBounds.height;
this._dx = (camera.screenView.x * sprite.transform.scrollFactor.x) + sprite.x - (camera.worldView.x * sprite.transform.scrollFactor.x);
this._dy = (camera.screenView.y * sprite.transform.scrollFactor.y) + sprite.y - (camera.worldView.y * sprite.transform.scrollFactor.y);
this._dw = sprite.texture.width;
this._dh = sprite.texture.height;
// Global Composite Ops
if (sprite.texture.globalCompositeOperation)
{
sprite.texture.context.save();
sprite.texture.context.globalCompositeOperation = sprite.texture.globalCompositeOperation;
}
// Alpha
if (sprite.texture.alpha !== 1)
if (sprite.texture.alpha !== 1 && sprite.texture.context.globalAlpha != sprite.texture.alpha)
{
this._ga = sprite.texture.context.globalAlpha;
sprite.texture.context.globalAlpha = sprite.texture.alpha;
@@ -196,13 +493,13 @@ module Phaser {
// Sprite Flip X
if (sprite.texture.flippedX)
{
this._fx = -sprite.scale.x;
this._fx = -sprite.transform.scale.x;
}
// Sprite Flip Y
if (sprite.texture.flippedY)
{
this._fy = -sprite.scale.y;
this._fy = -sprite.transform.scale.y;
}
if (sprite.animations.currentFrame !== null)
@@ -214,16 +511,20 @@ module Phaser {
{
this._dx += sprite.animations.currentFrame.spriteSourceSizeX;
this._dy += sprite.animations.currentFrame.spriteSourceSizeY;
this._sw = sprite.animations.currentFrame.spriteSourceSizeW;
this._sh = sprite.animations.currentFrame.spriteSourceSizeH;
this._dw = sprite.animations.currentFrame.spriteSourceSizeW;
this._dh = sprite.animations.currentFrame.spriteSourceSizeH;
}
}
// Rotation and Flipped
if (sprite.modified)
{
if (sprite.texture.renderRotation == true && (sprite.angle !== 0 || sprite.angleOffset !== 0))
if (sprite.texture.renderRotation == true && (sprite.rotation !== 0 || sprite.transform.rotationOffset !== 0))
{
this._sin = Math.sin(sprite.game.math.degreesToRadians(sprite.angleOffset + sprite.angle));
this._cos = Math.cos(sprite.game.math.degreesToRadians(sprite.angleOffset + sprite.angle));
this._sin = Math.sin(sprite.game.math.degreesToRadians(sprite.transform.rotationOffset + sprite.rotation));
this._cos = Math.cos(sprite.game.math.degreesToRadians(sprite.transform.rotationOffset + sprite.rotation));
}
// setTransform(a, b, c, d, e, f);
@@ -235,17 +536,17 @@ module Phaser {
// f = translate y
sprite.texture.context.save();
sprite.texture.context.setTransform(this._cos * this._fx, (this._sin * this._fx) + sprite.skew.x, -(this._sin * this._fy) + sprite.skew.y, this._cos * this._fy, this._dx, this._dy);
sprite.texture.context.setTransform(this._cos * this._fx, (this._sin * this._fx) + sprite.transform.skew.x, -(this._sin * this._fy) + sprite.transform.skew.y, this._cos * this._fy, this._dx, this._dy);
this._dx = -sprite.origin.x;
this._dy = -sprite.origin.y;
this._dx = -sprite.transform.origin.x;
this._dy = -sprite.transform.origin.y;
}
else
{
if (!sprite.origin.equals(0))
if (!sprite.transform.origin.equals(0))
{
this._dx -= sprite.origin.x;
this._dy -= sprite.origin.y;
this._dx -= sprite.transform.origin.x;
this._dy -= sprite.transform.origin.y;
}
}
@@ -258,6 +559,12 @@ module Phaser {
this._dw = Math.round(this._dw);
this._dh = Math.round(this._dh);
if (sprite.texture.opaque)
{
sprite.texture.context.fillStyle = sprite.texture.backgroundColor;
sprite.texture.context.fillRect(this._dx, this._dy, this._dw, this._dh);
}
if (sprite.texture.loaded)
{
sprite.texture.context.drawImage(
@@ -272,14 +579,8 @@ module Phaser {
this._dh // Destination Height (always same as Source Height unless scaled)
);
}
else
{
//sprite.texture.context.fillStyle = this.fillColor;
sprite.texture.context.fillStyle = 'rgb(255,255,255)';
sprite.texture.context.fillRect(this._dx, this._dy, this._dw, this._dh);
}
if (sprite.modified)
if (sprite.modified || sprite.texture.globalCompositeOperation)
{
sprite.texture.context.restore();
}
@@ -295,7 +596,7 @@ module Phaser {
public renderScrollZone(camera: Camera, scrollZone: ScrollZone): bool {
if (scrollZone.scale.x == 0 || scrollZone.scale.y == 0 || scrollZone.texture.alpha < 0.1 || this.inCamera(camera, scrollZone) == false)
if (scrollZone.transform.scale.x == 0 || scrollZone.transform.scale.y == 0 || scrollZone.texture.alpha < 0.1 || this.inCamera(camera, scrollZone) == false)
{
return false;
}
@@ -306,16 +607,16 @@ module Phaser {
this._ga = -1;
this._sx = 0;
this._sy = 0;
this._sw = scrollZone.frameBounds.width;
this._sh = scrollZone.frameBounds.height;
this._fx = scrollZone.scale.x;
this._fy = scrollZone.scale.y;
this._sw = scrollZone.width;
this._sh = scrollZone.height;
this._fx = scrollZone.transform.scale.x;
this._fy = scrollZone.transform.scale.y;
this._sin = 0;
this._cos = 1;
this._dx = (camera.scaledX * scrollZone.scrollFactor.x) + scrollZone.frameBounds.x - (camera.worldView.x * scrollZone.scrollFactor.x);
this._dy = (camera.scaledY * scrollZone.scrollFactor.y) + scrollZone.frameBounds.y - (camera.worldView.y * scrollZone.scrollFactor.y);
this._dw = scrollZone.frameBounds.width;
this._dh = scrollZone.frameBounds.height;
this._dx = (camera.screenView.x * scrollZone.transform.scrollFactor.x) + scrollZone.x - (camera.worldView.x * scrollZone.transform.scrollFactor.x);
this._dy = (camera.screenView.y * scrollZone.transform.scrollFactor.y) + scrollZone.y - (camera.worldView.y * scrollZone.transform.scrollFactor.y);
this._dw = scrollZone.width;
this._dh = scrollZone.height;
// Alpha
if (scrollZone.texture.alpha !== 1)
@@ -327,22 +628,22 @@ module Phaser {
// Sprite Flip X
if (scrollZone.texture.flippedX)
{
this._fx = -scrollZone.scale.x;
this._fx = -scrollZone.transform.scale.x;
}
// Sprite Flip Y
if (scrollZone.texture.flippedY)
{
this._fy = -scrollZone.scale.y;
this._fy = -scrollZone.transform.scale.y;
}
// Rotation and Flipped
if (scrollZone.modified)
{
if (scrollZone.texture.renderRotation == true && (scrollZone.angle !== 0 || scrollZone.angleOffset !== 0))
if (scrollZone.texture.renderRotation == true && (scrollZone.rotation !== 0 || scrollZone.transform.rotationOffset !== 0))
{
this._sin = Math.sin(scrollZone.game.math.degreesToRadians(scrollZone.angleOffset + scrollZone.angle));
this._cos = Math.cos(scrollZone.game.math.degreesToRadians(scrollZone.angleOffset + scrollZone.angle));
this._sin = Math.sin(scrollZone.game.math.degreesToRadians(scrollZone.transform.rotationOffset + scrollZone.rotation));
this._cos = Math.cos(scrollZone.game.math.degreesToRadians(scrollZone.transform.rotationOffset + scrollZone.rotation));
}
// setTransform(a, b, c, d, e, f);
@@ -354,17 +655,17 @@ module Phaser {
// f = translate y
scrollZone.texture.context.save();
scrollZone.texture.context.setTransform(this._cos * this._fx, (this._sin * this._fx) + scrollZone.skew.x, -(this._sin * this._fy) + scrollZone.skew.y, this._cos * this._fy, this._dx, this._dy);
scrollZone.texture.context.setTransform(this._cos * this._fx, (this._sin * this._fx) + scrollZone.transform.skew.x, -(this._sin * this._fy) + scrollZone.transform.skew.y, this._cos * this._fy, this._dx, this._dy);
this._dx = -scrollZone.origin.x;
this._dy = -scrollZone.origin.y;
this._dx = -scrollZone.transform.origin.x;
this._dy = -scrollZone.transform.origin.y;
}
else
{
if (!scrollZone.origin.equals(0))
if (!scrollZone.transform.origin.equals(0))
{
this._dx -= scrollZone.origin.x;
this._dy -= scrollZone.origin.y;
this._dx -= scrollZone.transform.origin.x;
this._dy -= scrollZone.transform.origin.y;
}
}
Phaser/renderers/HeadlessRenderer.ts
+12
View File
@@ -32,6 +32,18 @@ module Phaser {
return true;
}
public preRenderCamera(camera: Camera) {
}
public postRenderCamera(camera: Camera) {
}
public preRenderGroup(camera: Camera, group: Group) {
}
public postRenderGroup(camera: Camera, group: Group) {
}
}
}
Phaser/renderers/IRenderer.ts
+5 -1
View File
@@ -8,8 +8,12 @@ module Phaser {
renderGameObject(object);
renderSprite(camera: Camera, sprite: Sprite): bool;
renderScrollZone(camera: Camera, sprite: ScrollZone): bool;
renderCircle(camera: Camera, circle: Circle, context, outline?: bool, fill?: bool, lineColor?: string, fillColor?: string, lineWidth?: number);
preRenderGroup(camera: Camera, group: Group);
postRenderGroup(camera: Camera, group: Group);
preRenderCamera(camera: Camera);
postRenderCamera(camera: Camera);
}
Phaser/system/StageScaleMode.ts
+64 -19
View File
@@ -15,7 +15,7 @@ module Phaser {
/**
* StageScaleMode constructor
*/
constructor(game: Game) {
constructor(game: Game, width: number, height: number) {
this._game = game;
@@ -40,6 +40,10 @@ module Phaser {
this.scaleFactor = new Vec2(1, 1);
this.aspectRatio = 0;
this.minWidth = width;
this.minHeight = height;
this.maxWidth = width;
this.maxHeight = height;
window.addEventListener('orientationchange', (event) => this.checkOrientation(event), false);
window.addEventListener('resize', (event) => this.checkResize(event), false);
@@ -95,6 +99,22 @@ module Phaser {
*/
public incorrectOrientation: bool = false;
/**
* If you wish to align your game in the middle of the page then you can set this value to true.
* It will place a re-calculated margin-left pixel value onto the canvas element which is updated on orientation/resizing.
* It doesn't care about any other DOM element that may be on the page, it literally just sets the margin.
* @type {Boolean}
*/
public pageAlignHorizontally: bool = false;
/**
* If you wish to align your game in the middle of the page then you can set this value to true.
* It will place a re-calculated margin-left pixel value onto the canvas element which is updated on orientation/resizing.
* It doesn't care about any other DOM element that may be on the page, it literally just sets the margin.
* @type {Boolean}
*/
public pageAlignVeritcally: bool = false;
/**
* Minimum width the canvas should be scaled to (in pixels)
* @type {number}
@@ -354,7 +374,7 @@ module Phaser {
/**
* Set screen size automatically based on the scaleMode.
*/
private setScreenSize() {
public setScreenSize(force: bool = false) {
if (this._game.device.iPad == false && this._game.device.webApp == false && this._game.device.desktop == false)
{
@@ -370,7 +390,7 @@ module Phaser {
this._iterations--;
if (window.innerHeight > this._startHeight || this._iterations < 0)
if (force || window.innerHeight > this._startHeight || this._iterations < 0)
{
// Set minimum height of content to new window height
document.documentElement.style.minHeight = window.innerHeight + 'px';
@@ -400,24 +420,27 @@ module Phaser {
private setSize() {
if (this.maxWidth && this.width > this.maxWidth)
if (this.incorrectOrientation == false)
{
this.width = this.maxWidth;
}
if (this.maxWidth && this.width > this.maxWidth)
{
this.width = this.maxWidth;
}
if (this.maxHeight && this.height > this.maxHeight)
{
this.height = this.maxHeight;
}
if (this.maxHeight && this.height > this.maxHeight)
{
this.height = this.maxHeight;
}
if (this.minWidth && this.width < this.minWidth)
{
this.width = this.minWidth;
}
if (this.minWidth && this.width < this.minWidth)
{
this.width = this.minWidth;
}
if (this.minHeight && this.height < this.minHeight)
{
this.height = this.minHeight;
if (this.minHeight && this.height < this.minHeight)
{
this.height = this.minHeight;
}
}
this._game.stage.canvas.style.width = this.width + 'px';
@@ -426,13 +449,35 @@ module Phaser {
this._game.input.scaleX = this._game.stage.width / this.width;
this._game.input.scaleY = this._game.stage.height / this.height;
if (this.pageAlignHorizontally)
{
if (this.width < window.innerWidth && this.incorrectOrientation == false)
{
this._game.stage.canvas.style.marginLeft = Math.round((window.innerWidth - this.width) / 2) + 'px';
}
else
{
this._game.stage.canvas.style.marginLeft = '0px';
}
}
if (this.pageAlignVeritcally)
{
if (this.height < window.innerHeight && this.incorrectOrientation == false)
{
this._game.stage.canvas.style.marginTop = Math.round((window.innerHeight - this.height) / 2) + 'px';
}
else
{
this._game.stage.canvas.style.marginTop = '0px';
}
}
this._game.stage.getOffset(this._game.stage.canvas);
this.aspectRatio = this.width / this.height;
this.scaleFactor.x = this._game.stage.width / this.width;
this.scaleFactor.y = this._game.stage.height / this.height;
//this.scaleFactor.x = this.width / this._game.stage.width;
//this.scaleFactor.y = this.height / this._game.stage.height;
}
Phaser/utils/DebugUtils.ts
+2 -2
View File
@@ -26,8 +26,8 @@ module Phaser {
static renderSpriteInfo(sprite: Sprite, x: number, y: number, color?: string = 'rgb(255,255,255)') {
DebugUtils.game.stage.context.fillStyle = color;
DebugUtils.game.stage.context.fillText('Sprite: ' + ' (' + sprite.frameBounds.width + ' x ' + sprite.frameBounds.height + ')', x, y);
DebugUtils.game.stage.context.fillText('x: ' + sprite.frameBounds.x.toFixed(1) + ' y: ' + sprite.frameBounds.y.toFixed(1) + ' angle: ' + sprite.angle.toFixed(1), x, y + 14);
DebugUtils.game.stage.context.fillText('Sprite: ' + ' (' + sprite.width + ' x ' + sprite.height + ')', x, y);
DebugUtils.game.stage.context.fillText('x: ' + sprite.x.toFixed(1) + ' y: ' + sprite.y.toFixed(1) + ' rotation: ' + sprite.rotation.toFixed(1), x, y + 14);
//DebugUtils.game.stage.context.fillText('dx: ' + this._dx.toFixed(1) + ' dy: ' + this._dy.toFixed(1) + ' dw: ' + this._dw.toFixed(1) + ' dh: ' + this._dh.toFixed(1), x, y + 28);
//DebugUtils.game.stage.context.fillText('sx: ' + this._sx.toFixed(1) + ' sy: ' + this._sy.toFixed(1) + ' sw: ' + this._sw.toFixed(1) + ' sh: ' + this._sh.toFixed(1), x, y + 42);
Phaser/utils/PointUtils.ts
+2 -2
View File
@@ -180,7 +180,7 @@ module Phaser {
* @param x {number} The x coordinate of the anchor point
* @param y {number} The y coordinate of the anchor point
* @param {Number} angle The angle in radians (unless asDegrees is true) to rotate the Point to.
* @param {Boolean} asDegrees Is the given angle in radians (false) or degrees (true)?
* @param {Boolean} asDegrees Is the given rotation in radians (false) or degrees (true)?
* @param {Number} distance An optional distance constraint between the Point and the anchor.
* @return The modified point object
*/
@@ -208,7 +208,7 @@ module Phaser {
* @param x {number} The x coordinate of the anchor point
* @param y {number} The y coordinate of the anchor point
* @param {Number} angle The angle in radians (unless asDegrees is true) to rotate the Point to.
* @param {Boolean} asDegrees Is the given angle in radians (false) or degrees (true)?
* @param {Boolean} asDegrees Is the given rotation in radians (false) or degrees (true)?
* @param {Number} distance An optional distance constraint between the Point and the anchor.
* @return The modified point object
*/
Phaser/utils/RectangleUtils.ts
+4 -4
View File
@@ -145,12 +145,12 @@ module Phaser {
}
/**
* If the Rectangle object specified in the toIntersect parameter intersects with this Rectangle object, returns the area of intersection as a Rectangle object. If the rectangles do not intersect, this method returns an empty Rectangle object with its properties set to 0.
* If the Rectangle object specified in the toIntersect parameter intersects with this Rectangle object, returns the area of intersection as a Rectangle object. If the Rectangles do not intersect, this method returns an empty Rectangle object with its properties set to 0.
* @method intersection
* @param {Rectangle} a - The first Rectangle object.
* @param {Rectangle} b - The second Rectangle object.
* @param {Rectangle} output Optional Rectangle object. If given the intersection values will be set into this object, otherwise a brand new Rectangle object will be created and returned.
* @return {Rectangle} A Rectangle object that equals the area of intersection. If the rectangles do not intersect, this method returns an empty Rectangle object; that is, a rectangle with its x, y, width, and height properties set to 0.
* @return {Rectangle} A Rectangle object that equals the area of intersection. If the Rectangles do not intersect, this method returns an empty Rectangle object; that is, a Rectangle with its x, y, width, and height properties set to 0.
**/
static intersection(a: Rectangle, b: Rectangle, out?: Rectangle = new Rectangle): Rectangle {
@@ -194,12 +194,12 @@ module Phaser {
}
/**
* Adds two rectangles together to create a new Rectangle object, by filling in the horizontal and vertical space between the two rectangles.
* Adds two Rectangles together to create a new Rectangle object, by filling in the horizontal and vertical space between the two Rectangles.
* @method union
* @param {Rectangle} a - The first Rectangle object.
* @param {Rectangle} b - The second Rectangle object.
* @param {Rectangle} output Optional Rectangle object. If given the new values will be set into this object, otherwise a brand new Rectangle object will be created and returned.
* @return {Rectangle} A Rectangle object that is the union of the two rectangles.
* @return {Rectangle} A Rectangle object that is the union of the two Rectangles.
**/
static union(a: Rectangle, b: Rectangle, out?: Rectangle = new Rectangle): Rectangle {
return out.setTo(Math.min(a.x, b.x), Math.min(a.y, b.y), Math.max(a.right, b.right), Math.max(a.bottom, b.bottom));
Phaser/utils/SpriteUtils.ts
+15 -15
View File
@@ -18,24 +18,24 @@ module Phaser {
static _tempPoint: Point;
/**
* Check whether this object is visible in a specific camera rectangle.
* @param camera {Rectangle} The rectangle you want to check.
* @return {boolean} Return true if bounds of this sprite intersects the given rectangle, otherwise return false.
* Check whether this object is visible in a specific camera Rectangle.
* @param camera {Rectangle} The Rectangle you want to check.
* @return {boolean} Return true if bounds of this sprite intersects the given Rectangle, otherwise return false.
*/
static inCamera(camera: Camera, sprite: Sprite): bool {
// Object fixed in place regardless of the camera scrolling? Then it's always visible
if (sprite.scrollFactor.x == 0 && sprite.scrollFactor.y == 0)
if (sprite.transform.scrollFactor.x == 0 && sprite.transform.scrollFactor.y == 0)
{
return true;
}
var dx = sprite.frameBounds.x - (camera.worldView.x * sprite.scrollFactor.x);
var dy = sprite.frameBounds.y - (camera.worldView.y * sprite.scrollFactor.y);
var dw = sprite.frameBounds.width * sprite.scale.x;
var dh = sprite.frameBounds.height * sprite.scale.y;
var dx = sprite.x - (camera.worldView.x * sprite.transform.scrollFactor.x);
var dy = sprite.y - (camera.worldView.y * sprite.transform.scrollFactor.y);
var dw = sprite.width * sprite.transform.scale.x;
var dh = sprite.height * sprite.transform.scale.y;
return (camera.scaledX + camera.worldView.width > this._dx) && (camera.scaledX < this._dx + this._dw) && (camera.scaledY + camera.worldView.height > this._dy) && (camera.scaledY < this._dy + this._dh);
return (camera.screenView.x + camera.worldView.width > this._dx) && (camera.screenView.x < this._dx + this._dw) && (camera.screenView.y + camera.worldView.height > this._dy) && (camera.screenView.y < this._dy + this._dh);
}
@@ -158,8 +158,8 @@ module Phaser {
var objectScreenPos: Point = objectOrGroup.getScreenXY(null, Camera);
this._point.x = X - camera.scroll.x * this.scrollFactor.x; //copied from getScreenXY()
this._point.y = Y - camera.scroll.y * this.scrollFactor.y;
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;
@@ -239,8 +239,8 @@ module Phaser {
camera = this._game.camera;
}
point.x = sprite.x - camera.scroll.x * sprite.scrollFactor.x;
point.y = sprite.y - camera.scroll.y * sprite.scrollFactor.y;
point.x = sprite.x - camera.x * sprite.transform.scrollFactor.x;
point.y = sprite.y - camera.y * sprite.transform.scrollFactor.y;
point.x += (point.x > 0) ? 0.0000001 : -0.0000001;
point.y += (point.y > 0) ? 0.0000001 : -0.0000001;
@@ -287,11 +287,11 @@ module Phaser {
if (fromFrameBounds)
{
sprite.origin.setTo(sprite.frameBounds.halfWidth, sprite.frameBounds.halfHeight);
sprite.transform.origin.setTo(sprite.width / 2, sprite.height / 2);
}
else if (fromBody)
{
sprite.origin.setTo(sprite.body.bounds.halfWidth, sprite.body.bounds.halfHeight);
sprite.transform.origin.setTo(sprite.body.bounds.halfWidth, sprite.body.bounds.halfHeight);
}
}
README.md
+17 -6
View File
@@ -25,8 +25,6 @@ TODO:
* Dispatch world resize event
* Investigate why tweens don't restart after the game pauses
* Fix bug in Tween yoyo + loop combo
* Copy the setTransform from Sprite to Camera
* Move Camera.scroll.x to just Camera.x/y
* 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
@@ -40,13 +38,15 @@ TODO:
* 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
* Can Cameras be positioned within the world?
* Added JSON Texture Atlas object support.
* Bug in AnimationManager set frame/frameName - the width/height are trimmed and wrong
* RenderOrderID won't work across cameras - but then neither do Pointers yet anyway
* Swap to using time based motion (like the tweens) rather than delta timer - it just doesn't work well on slow phones
* Bug in World drag
* Add clip support + shape options to Texture Component.
V1.0.0
* Massive refactoring across the entire codebase.
@@ -91,7 +91,18 @@ V1.0.0
* Vastly improved orientation detection and response speed.
* Added custom callback support for all Touch and Mouse Events so you can easily hook events to custom APIs.
* Updated Game.loader and its methods. You now load images by: game.load.image() and also: game.load.atlas, game.load.audio, game.load.spritesheet, game.load.text. And you start it with game.load.start().
* 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 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.
* Added Stage.setImageRenderingCrisp to quickly set the canvas image-rendering to crisp-edges (note: poor browser support atm)
* Sprite.width / height now report the scaled width height, setting them adjusts the scale as it does so.
* Created a Transform component containing scale, skew, rotation, scrollFactor, origin and rotationOffset. Added to Sprite, Camera, Group.
* Created a Texture component containing image data, alpha, flippedX, flippedY, etc. Added to Sprite, Camera, Group.
* Added CameraManager.swap and CameraManager.sort methods and added a z-index property to Camera to control render order.
@@ -169,7 +180,7 @@ V0.9.6
* Added Point.rotate to allow you to rotate a point around another point, with optional distance clamping. Also created test cases.
* Added Group.alpha to apply a globalAlpha before the groups children are rendered. Useful to save on alpha calls.
* Added Group.globalCompositeOperation to apply a composite operation before all of the groups children are rendered.
* Added Camera black list support to Group along with Group.showToCamera, Group.hideFromCamera and Group.clearCameraList
* Added Camera black list support to Sprite and Group along with Camera.show, Camera.hide and Camera.isHidden methods to populate them.
* Added GameMath.rotatePoint to allow for point rotation at any angle around a given anchor and distance
* Updated World.setSize() to optionally update the VerletManager dimensions as well
* Added GameObject.setPosition(x, y)
Tests/Tests.csproj
+11 -29
View File
@@ -69,34 +69,6 @@
<TypeScriptCompile Include="particles\graphic emitter.ts" />
<TypeScriptCompile Include="input\over sprite 1.ts" />
<TypeScriptCompile Include="groups\create group 1.ts" />
<TypeScriptCompile Include="demoscene\ballmover.ts" />
<Content Include="demoscene\ballmover.js">
<DependentUpon>ballmover.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="demoscene\scroller1.ts" />
<TypeScriptCompile Include="demoscene\colorwhirl.ts" />
<Content Include="demoscene\colorwhirl.js">
<DependentUpon>colorwhirl.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="demoscene\fujiboink.ts" />
<TypeScriptCompile Include="demoscene\fruitfall.ts" />
<Content Include="demoscene\fruitfall.js">
<DependentUpon>fruitfall.ts</DependentUpon>
</Content>
<Content Include="demoscene\fujiboink.js">
<DependentUpon>fujiboink.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="demoscene\metalslug.ts" />
<Content Include="demoscene\metalslug.js">
<DependentUpon>metalslug.ts</DependentUpon>
</Content>
<Content Include="demoscene\scroller1.js">
<DependentUpon>scroller1.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="demoscene\starray.ts" />
<Content Include="demoscene\starray.js">
<DependentUpon>starray.ts</DependentUpon>
</Content>
<Content Include="groups\create group 1.js">
<DependentUpon>create group 1.ts</DependentUpon>
</Content>
@@ -201,6 +173,14 @@
<Content Include="scrollzones\skewed scroller.js">
<DependentUpon>skewed scroller.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="sprites\atlas 1.ts" />
<Content Include="sprites\atlas 1.js">
<DependentUpon>atlas 1.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="sprites\atlas 2.ts" />
<Content Include="sprites\atlas 2.js">
<DependentUpon>atlas 2.ts</DependentUpon>
</Content>
<Content Include="tweens\tween loop 1.js">
<DependentUpon>tween loop 1.ts</DependentUpon>
</Content>
@@ -262,6 +242,8 @@
<DependentUpon>boot screen.ts</DependentUpon>
</Content>
</ItemGroup>
<ItemGroup />
<ItemGroup>
<Folder Include="demoscene\" />
</ItemGroup>
<Import Project="$(VSToolsPath)\TypeScript\Microsoft.TypeScript.targets" />
</Project>
Tests/assets/sprites/invaderpig.json
+28
View File
@@ -0,0 +1,28 @@
{"frames": [
{
"filename": "invader1",
"frame": {"x":0,"y":0,"w":128,"h":104},
"rotated": false,
"trimmed": true,
"spriteSourceSize": {"x":36,"y":73,"w":128,"h":104},
"sourceSize": {"w":200,"h":250}
},
{
"filename": "tennyson",
"frame": {"x":128,"y":0,"w":120,"h":104},
"rotated": false,
"trimmed": true,
"spriteSourceSize": {"x":0,"y":24,"w":120,"h":104},
"sourceSize": {"w":120,"h":128}
}],
"meta": {
"app": "http://www.texturepacker.com",
"version": "1.0",
"image": "invaderpig.png",
"format": "RGBA8888",
"size": {"w":248,"h":104},
"scale": "1",
"smartupdate": "$TexturePacker:SmartUpdate:aaccbd2de0ca8112964651683164d103$"
}
}
Tests/assets/sprites/invaderpig.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

Tests/cameras/basic camera 1.js
+4 -4
View File
@@ -15,14 +15,14 @@
}
function update() {
if(game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) {
game.camera.scroll.x -= 4;
game.camera.x -= 4;
} else if(game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) {
game.camera.scroll.x += 4;
game.camera.x += 4;
}
if(game.input.keyboard.isDown(Phaser.Keyboard.UP)) {
game.camera.scroll.y -= 4;
game.camera.y -= 4;
} else if(game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) {
game.camera.scroll.y += 4;
game.camera.y += 4;
}
}
function render() {
Tests/cameras/basic camera 1.ts
+4 -4
View File
@@ -30,20 +30,20 @@
if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT))
{
game.camera.scroll.x -= 4;
game.camera.x -= 4;
}
else if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT))
{
game.camera.scroll.x += 4;
game.camera.x += 4;
}
if (game.input.keyboard.isDown(Phaser.Keyboard.UP))
{
game.camera.scroll.y -= 4;
game.camera.y -= 4;
}
else if (game.input.keyboard.isDown(Phaser.Keyboard.DOWN))
{
game.camera.scroll.y += 4;
game.camera.y += 4;
}
}
Tests/cameras/scrollfactor 1.js
+5 -5
View File
@@ -11,19 +11,19 @@
game.add.sprite(0, 0, 'backdrop');
for(var i = 0; i < 400; i++) {
var tempBall = game.add.sprite(game.world.randomX * 2, game.world.randomY * 2, 'ball');
tempBall.scrollFactor.setTo(2, 2);
tempBall.transform.scrollFactor.setTo(2, 2);
}
}
function update() {
if(game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) {
game.camera.scroll.x -= 4;
game.camera.x -= 4;
} else if(game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) {
game.camera.scroll.x += 4;
game.camera.x += 4;
}
if(game.input.keyboard.isDown(Phaser.Keyboard.UP)) {
game.camera.scroll.y -= 4;
game.camera.y -= 4;
} else if(game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) {
game.camera.scroll.y += 4;
game.camera.y += 4;
}
}
function render() {
Tests/cameras/scrollfactor 1.ts
+5 -5
View File
@@ -22,7 +22,7 @@
for (var i = 0; i < 400; i++)
{
var tempBall:Phaser.Sprite = game.add.sprite(game.world.randomX * 2, game.world.randomY * 2, 'ball');
tempBall.scrollFactor.setTo(2, 2);
tempBall.transform.scrollFactor.setTo(2, 2);
}
}
@@ -31,20 +31,20 @@
if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT))
{
game.camera.scroll.x -= 4;
game.camera.x -= 4;
}
else if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT))
{
game.camera.scroll.x += 4;
game.camera.x += 4;
}
if (game.input.keyboard.isDown(Phaser.Keyboard.UP))
{
game.camera.scroll.y -= 4;
game.camera.y -= 4;
}
else if (game.input.keyboard.isDown(Phaser.Keyboard.DOWN))
{
game.camera.scroll.y += 4;
game.camera.y += 4;
}
}
Tests/cameras/scrollfactor 2.js
+5 -5
View File
@@ -9,19 +9,19 @@
function create() {
for(var i = 0; i < 10; i++) {
var temp = game.add.sprite(600 + (10 * i), 200 + (10 * i), 'disk');
temp.scrollFactor.setTo(i / 2, i / 2);
temp.transform.scrollFactor.setTo(i / 2, i / 2);
}
}
function update() {
if(game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) {
game.camera.scroll.x -= 4;
game.camera.x -= 4;
} else if(game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) {
game.camera.scroll.x += 4;
game.camera.x += 4;
}
if(game.input.keyboard.isDown(Phaser.Keyboard.UP)) {
game.camera.scroll.y -= 4;
game.camera.y -= 4;
} else if(game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) {
game.camera.scroll.y += 4;
game.camera.y += 4;
}
}
function render() {
Tests/cameras/scrollfactor 2.ts
+5 -5
View File
@@ -19,7 +19,7 @@
for (var i = 0; i < 10; i++)
{
var temp:Phaser.Sprite = game.add.sprite(600 + (10 * i), 200 + (10 * i), 'disk');
temp.scrollFactor.setTo(i / 2, i / 2);
temp.transform.scrollFactor.setTo(i / 2, i / 2);
}
}
@@ -28,20 +28,20 @@
if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT))
{
game.camera.scroll.x -= 4;
game.camera.x -= 4;
}
else if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT))
{
game.camera.scroll.x += 4;
game.camera.x += 4;
}
if (game.input.keyboard.isDown(Phaser.Keyboard.UP))
{
game.camera.scroll.y -= 4;
game.camera.y -= 4;
}
else if (game.input.keyboard.isDown(Phaser.Keyboard.DOWN))
{
game.camera.scroll.y += 4;
game.camera.y += 4;
}
}
Tests/input/drag sprite 1.js
+1
View File
@@ -18,6 +18,7 @@
}
function render() {
game.input.renderDebugInfo(32, 32);
//game.input.mousePointer.renderDebug(32, 32);
sprite.input.renderDebugInfo(300, 32);
}
})();
Tests/input/world drag.js
+4 -4
View File
@@ -21,14 +21,14 @@
}
function update() {
if(game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) {
game.camera.scroll.x -= 4;
game.camera.x -= 4;
} else if(game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) {
game.camera.scroll.x += 4;
game.camera.x += 4;
}
if(game.input.keyboard.isDown(Phaser.Keyboard.UP)) {
game.camera.scroll.y -= 4;
game.camera.y -= 4;
} else if(game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) {
game.camera.scroll.y += 4;
game.camera.y += 4;
}
}
function render() {
Tests/input/world drag.ts
+4 -4
View File
@@ -40,20 +40,20 @@
if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT))
{
game.camera.scroll.x -= 4;
game.camera.x -= 4;
}
else if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT))
{
game.camera.scroll.x += 4;
game.camera.x += 4;
}
if (game.input.keyboard.isDown(Phaser.Keyboard.UP))
{
game.camera.scroll.y -= 4;
game.camera.y -= 4;
}
else if (game.input.keyboard.isDown(Phaser.Keyboard.DOWN))
{
game.camera.scroll.y += 4;
game.camera.y += 4;
}
}
Tests/particles/mousetrail.js
+1 -1
View File
@@ -14,7 +14,7 @@
scroller.setSpeed(0, -1);
emitter = game.add.emitter(game.stage.centerX, game.stage.centerY);
emitter.makeParticles('jet', 200);
emitter.globalCompositeOperation = 'lighter';
emitter.texture.globalCompositeOperation = 'lighter';
emitter.gravity = 300;
emitter.setXSpeed(-50, 50);
emitter.setYSpeed(-50, -100);
Tests/particles/mousetrail.ts
+1 -1
View File
@@ -25,7 +25,7 @@
emitter = game.add.emitter(game.stage.centerX, game.stage.centerY);
emitter.makeParticles('jet', 200);
emitter.globalCompositeOperation = 'lighter';
emitter.texture.globalCompositeOperation = 'lighter';
emitter.gravity = 300;
emitter.setXSpeed(-50, 50);
Tests/phaser.js
+3927 -3635
View File
File diff suppressed because it is too large Load Diff
Tests/scrollzones/blasteroids.js
+6 -6
View File
@@ -24,13 +24,13 @@
// Looks like a smoke trail!
//emitter.globalCompositeOperation = 'xor';
// Looks way cool :)
emitter.globalCompositeOperation = 'lighter';
emitter.texture.globalCompositeOperation = 'lighter';
bullets = game.add.group(50);
// Create our bullet pool
for(var i = 0; i < 50; i++) {
var tempBullet = new Phaser.Sprite(game, game.stage.centerX, game.stage.centerY, 'bullet');
tempBullet.exists = false;
tempBullet.angleOffset = 90;
tempBullet.transform.rotationOffset = 90;
//tempBullet.setBounds(-100, -100, 900, 700);
//tempBullet.outOfBoundsAction = Phaser.GameObject.OUT_OF_BOUNDS_KILL;
bullets.add(tempBullet);
@@ -38,7 +38,7 @@
ship = game.add.sprite(game.stage.centerX, game.stage.centerY, 'nashwan', Phaser.Types.BODY_DYNAMIC);
Phaser.SpriteUtils.setOriginToCenter(ship);
// We do this because the ship was drawn facing up, but 0 degrees is pointing to the right
ship.angleOffset = 90;
ship.transform.rotationOffset = 90;
game.input.onDown.add(test, this);
}
function test(event) {
@@ -62,7 +62,7 @@
speed = 0;
}
}
shipMotion = game.motion.velocityFromAngle(ship.angle, speed);
shipMotion = game.motion.velocityFromAngle(ship.rotation, speed);
scroller.setSpeed(shipMotion.x, shipMotion.y);
// emit particles
if(speed > 2) {
@@ -89,9 +89,9 @@
var b = bullets.getFirstAvailable();
b.x = ship.x;
b.y = ship.y - 26;
var bulletMotion = game.motion.velocityFromAngle(ship.angle, 400);
var bulletMotion = game.motion.velocityFromAngle(ship.rotation, 400);
b.revive();
b.angle = ship.angle;
b.rotation = ship.rotation;
b.body.velocity.setTo(bulletMotion.x, bulletMotion.y);
fireRate = game.time.now + 100;
}
Tests/scrollzones/blasteroids.ts
+6 -6
View File
@@ -37,7 +37,7 @@
//emitter.globalCompositeOperation = 'xor';
// Looks way cool :)
emitter.globalCompositeOperation = 'lighter';
emitter.texture.globalCompositeOperation = 'lighter';
bullets = game.add.group(50);
@@ -46,7 +46,7 @@
{
var tempBullet = new Phaser.Sprite(game, game.stage.centerX, game.stage.centerY, 'bullet');
tempBullet.exists = false;
tempBullet.angleOffset = 90;
tempBullet.transform.rotationOffset = 90;
//tempBullet.setBounds(-100, -100, 900, 700);
//tempBullet.outOfBoundsAction = Phaser.GameObject.OUT_OF_BOUNDS_KILL;
bullets.add(tempBullet);
@@ -56,7 +56,7 @@
Phaser.SpriteUtils.setOriginToCenter(ship);
// We do this because the ship was drawn facing up, but 0 degrees is pointing to the right
ship.angleOffset = 90;
ship.transform.rotationOffset = 90;
game.input.onDown.add(test, this);
@@ -99,7 +99,7 @@
}
}
shipMotion = game.motion.velocityFromAngle(ship.angle, speed);
shipMotion = game.motion.velocityFromAngle(ship.rotation, speed);
scroller.setSpeed(shipMotion.x, shipMotion.y);
@@ -144,10 +144,10 @@
b.x = ship.x;
b.y = ship.y - 26;
var bulletMotion = game.motion.velocityFromAngle(ship.angle, 400);
var bulletMotion = game.motion.velocityFromAngle(ship.rotation, 400);
b.revive();
b.angle = ship.angle;
b.rotation = ship.rotation;
b.body.velocity.setTo(bulletMotion.x, bulletMotion.y);
fireRate = game.time.now + 100;
Tests/scrollzones/skewed scroller.js
+5 -5
View File
@@ -11,12 +11,12 @@
var topFace;
function create() {
topFace = game.add.scrollZone('balls', 200, 0, 204, 204).setSpeed(0, 2.2);
topFace.skew.setTo(0, Math.tan(game.math.radiansToDegrees(-30)));
topFace.scale.setTo(1, 1.3);
topFace.transform.skew.setTo(0, Math.tan(game.math.radiansToDegrees(-30)));
topFace.transform.scale.setTo(1, 1.3);
leftFace = game.add.scrollZone('balls', 110, 264, 204, 204).setSpeed(0, 2.1);
leftFace.skew.setTo(0, Math.tan(game.math.radiansToDegrees(30)));
leftFace.transform.skew.setTo(0, Math.tan(game.math.radiansToDegrees(30)));
rightFace = game.add.scrollZone('balls', 200, 466, 204, 204).setSpeed(0, 2);
rightFace.skew.setTo(0, Math.tan(game.math.radiansToDegrees(-30)));
rightFace.scale.setTo(1, 0.8);
rightFace.transform.skew.setTo(0, Math.tan(game.math.radiansToDegrees(-30)));
rightFace.transform.scale.setTo(1, 0.8);
}
})();
Tests/scrollzones/skewed scroller.ts
+5 -5
View File
@@ -19,15 +19,15 @@
function create() {
topFace = game.add.scrollZone('balls', 200, 0, 204, 204).setSpeed(0, 2.2);
topFace.skew.setTo(0, Math.tan(game.math.radiansToDegrees(-30)));
topFace.scale.setTo(1, 1.3);
topFace.transform.skew.setTo(0, Math.tan(game.math.radiansToDegrees(-30)));
topFace.transform.scale.setTo(1, 1.3);
leftFace = game.add.scrollZone('balls', 110, 264, 204, 204).setSpeed(0, 2.1);
leftFace.skew.setTo(0, Math.tan(game.math.radiansToDegrees(30)));
leftFace.transform.skew.setTo(0, Math.tan(game.math.radiansToDegrees(30)));
rightFace = game.add.scrollZone('balls', 200, 466, 204, 204).setSpeed(0, 2);
rightFace.skew.setTo(0, Math.tan(game.math.radiansToDegrees(-30)));
rightFace.scale.setTo(1, 0.8);
rightFace.transform.skew.setTo(0, Math.tan(game.math.radiansToDegrees(-30)));
rightFace.transform.scale.setTo(1, 0.8);
}
Tests/sprites/animation 1.js
+1 -1
View File
@@ -18,6 +18,6 @@
// Try changing the 20 value to something low to slow the speed down, or higher to make it play faster.
mummy.animations.play('walk', 20, true);
// This just scales the sprite up so you can see the animation better
mummy.scale.setTo(4, 4);
mummy.transform.scale.setTo(4, 4);
}
})();
Tests/sprites/animation 1.ts
+1 -1
View File
@@ -30,7 +30,7 @@
mummy.animations.play('walk', 20, true);
// This just scales the sprite up so you can see the animation better
mummy.scale.setTo(4, 4);
mummy.transform.scale.setTo(4, 4);
}
Tests/sprites/animation 2.js
+1 -1
View File
@@ -17,6 +17,6 @@
monster.animations.add('walk', null, 30, true);
// Then you can just call 'play' on its own with no other values to start things going
monster.animations.play('walk');
monster.scale.setTo(2, 2);
monster.transform.scale.setTo(2, 2);
}
})();
Tests/sprites/animation 2.ts
+1 -1
View File
@@ -29,7 +29,7 @@
// Then you can just call 'play' on its own with no other values to start things going
monster.animations.play('walk');
monster.scale.setTo(2, 2);
monster.transform.scale.setTo(2, 2);
}
Tests/sprites/atlas 1.js
+17
View File
@@ -0,0 +1,17 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, init, create);
function init() {
game.load.atlas('atlas', 'assets/sprites/invaderpig.png', 'assets/sprites/invaderpig.json');
game.load.start();
}
var pig;
var invader;
function create() {
game.stage.backgroundColor = 'rgb(40, 40, 40)';
pig = game.add.sprite(200, 200, 'atlas', 'tennyson');
invader = game.add.sprite(0, 0, 'atlas', 'invader1');
console.log(pig.width, pig.height, pig.body.bounds.width, pig.body.bounds.height, pig.worldView);
console.log(invader.width, invader.height, invader.body.bounds.width, invader.body.bounds.height, invader.worldView);
}
})();
Tests/sprites/atlas 1.ts
+29
View File
@@ -0,0 +1,29 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, init, create);
function init() {
game.load.atlas('atlas', 'assets/sprites/invaderpig.png', 'assets/sprites/invaderpig.json');
game.load.start();
}
var pig: Phaser.Sprite;
var invader: Phaser.Sprite;
function create() {
game.stage.backgroundColor = 'rgb(40, 40, 40)';
pig = game.add.sprite(200, 200, 'atlas', 'tennyson');
invader = game.add.sprite(0, 0, 'atlas', 'invader1');
console.log(pig.width, pig.height, pig.body.bounds.width, pig.body.bounds.height, pig.worldView);
console.log(invader.width, invader.height, invader.body.bounds.width, invader.body.bounds.height, invader.worldView);
}
})();
Tests/sprites/atlas 2.js
+19
View File
@@ -0,0 +1,19 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, init, create);
function init() {
// Texture Atlas Method 2
//
// In this example we assume that the TexturePacker JSON data is a string of json data stored as a var
// (in this case botData)
game.load.atlas('bot', 'assets/sprites/running_bot.png', null, botData);
game.load.start();
}
var bot;
function create() {
bot = game.add.sprite(400, 300, 'bot');
bot.animations.add('run', null, 20, true);
bot.animations.play('run');
}
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 }}]}';
})();
Tests/sprites/atlas 2.ts
+33
View File
@@ -0,0 +1,33 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, init, create);
function init() {
// Texture Atlas Method 2
//
// In this example we assume that the TexturePacker JSON data is a string of json data stored as a var
// (in this case botData)
game.load.atlas('bot', 'assets/sprites/running_bot.png', null, botData);
game.load.start();
}
var bot: Phaser.Sprite;
function create() {
bot = game.add.sprite(400, 300, 'bot');
bot.animations.add('run', null, 20, true);
bot.animations.play('run');
}
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 }}]}';
})();
Tests/sprites/create sprite 1.js
+6 -2
View File
@@ -9,6 +9,10 @@
function create() {
// This will create a Sprite positioned at the top-left of the game (0,0)
// Try changing the 0, 0 values
game.add.sprite(0, 0, 'bunny');
}
game.add.sprite(200, 100, 'bunny');
game.camera.texture.alpha = 0.5;
//game.world.group.texture.flippedX = true;
//game.world.group.transform.origin.setTo(game.stage.centerX, game.stage.centerY);
//game.world.group.transform.skew.x = 1.2;
}
})();
Tests/sprites/create sprite 1.ts
+6 -1
View File
@@ -16,7 +16,12 @@
// This will create a Sprite positioned at the top-left of the game (0,0)
// Try changing the 0, 0 values
game.add.sprite(0, 0, 'bunny');
game.add.sprite(200, 100, 'bunny');
game.camera.texture.alpha = 0.5;
//game.world.group.texture.flippedX = true;
//game.world.group.transform.origin.setTo(game.stage.centerX, game.stage.centerY);
//game.world.group.transform.skew.x = 1.2;
}
Tests/sprites/scale sprite 1.js
+4 -4
View File
@@ -10,11 +10,11 @@
function create() {
// Here we'll assign the new sprite to the local smallBunny variable
smallBunny = game.add.sprite(0, 0, 'bunny');
// And now let's scale the sprite in half
// And now let's scale the sprite by half
// You can do either:
// smallBunny.scale.x = 0.5;
// smallBunny.scale.y = 0.5;
// smallBunny.transform.scale.x = 0.5;
// smallBunny.transform.scale.y = 0.5;
// Or you can set them both at the same time using setTo:
smallBunny.scale.setTo(0.5, 0.5);
smallBunny.transform.scale.setTo(0.5, 0.5);
}
})();
Tests/sprites/scale sprite 1.ts
+4 -4
View File
@@ -19,14 +19,14 @@
// Here we'll assign the new sprite to the local smallBunny variable
smallBunny = game.add.sprite(0, 0, 'bunny');
// And now let's scale the sprite in half
// And now let's scale the sprite by half
// You can do either:
// smallBunny.scale.x = 0.5;
// smallBunny.scale.y = 0.5;
// smallBunny.transform.scale.x = 0.5;
// smallBunny.transform.scale.y = 0.5;
// Or you can set them both at the same time using setTo:
smallBunny.scale.setTo(0.5, 0.5);
smallBunny.transform.scale.setTo(0.5, 0.5);
}
Tests/sprites/scale sprite 2.js
+3 -3
View File
@@ -12,9 +12,9 @@
bigBunny = game.add.sprite(0, 0, 'bunny');
// And now let's scale the sprite by two
// You can do either:
// smallBunny.scale.x = 2;
// smallBunny.scale.y = 2;
// smallBunny.transform.scale.x = 2;
// smallBunny.transform.scale.y = 2;
// Or you can set them both at the same time using setTo:
bigBunny.scale.setTo(2, 2);
bigBunny.transform.scale.setTo(2, 2);
}
})();
Tests/sprites/scale sprite 2.ts
+3 -3
View File
@@ -22,11 +22,11 @@
// And now let's scale the sprite by two
// You can do either:
// smallBunny.scale.x = 2;
// smallBunny.scale.y = 2;
// smallBunny.transform.scale.x = 2;
// smallBunny.transform.scale.y = 2;
// Or you can set them both at the same time using setTo:
bigBunny.scale.setTo(2, 2);
bigBunny.transform.scale.setTo(2, 2);
}
Tests/sprites/scale sprite 3.js
+1 -1
View File
@@ -12,6 +12,6 @@
bunny = game.add.sprite(0, 0, 'bunny');
// You don't have to use the same values when scaling a sprite,
// here we'll create a short and wide bunny
bunny.scale.setTo(3, 0.7);
bunny.transform.scale.setTo(3, 0.7);
}
})();
Tests/sprites/scale sprite 3.ts
+1 -1
View File
@@ -22,7 +22,7 @@
// You don't have to use the same values when scaling a sprite,
// here we'll create a short and wide bunny
bunny.scale.setTo(3, 0.7);
bunny.transform.scale.setTo(3, 0.7);
}
Tests/sprites/scale sprite 4.js
+2 -2
View File
@@ -12,9 +12,9 @@
function create() {
// Here we'll assign the new sprite to the local bunny variable
bunny = game.add.sprite(0, 0, 'bunny');
bunny.scale.setTo(0.5, 0.5);
bunny.transform.scale.setTo(0.5, 0.5);
// This time let's scale the sprite by a looped tween
game.add.tween(bunny.scale).to({
game.add.tween(bunny.transform.scale).to({
x: 2,
y: 2
}, 2000, Phaser.Easing.Elastic.Out, true, 0, true, true);
Tests/sprites/scale sprite 4.ts
+2 -2
View File
@@ -21,10 +21,10 @@
// Here we'll assign the new sprite to the local bunny variable
bunny = game.add.sprite(0, 0, 'bunny');
bunny.scale.setTo(0.5, 0.5);
bunny.transform.scale.setTo(0.5, 0.5);
// This time let's scale the sprite by a looped tween
game.add.tween(bunny.scale).to({ x: 2, y: 2 }, 2000, Phaser.Easing.Elastic.Out, true, 0, true, true);
game.add.tween(bunny.transform.scale).to({ x: 2, y: 2 }, 2000, Phaser.Easing.Elastic.Out, true, 0, true, true);
}
Tests/sprites/scale sprite 5.js
+2 -2
View File
@@ -13,11 +13,11 @@
// Here we'll assign the new sprite to the local fuji variable
fuji = game.add.sprite(game.stage.centerX, game.stage.centerY, 'fuji');
// sets origin to the center of the sprite (half the width and half the height)
fuji.origin.setTo(160, 100);
fuji.transform.origin.setTo(160, 100);
// We'll tween the scale down to zero (which will make the sprite invisible) and then flip it
// The end result should look like turning over a card
// Create our tween
tween = game.add.tween(fuji.scale);
tween = game.add.tween(fuji.transform.scale);
// Start it going
scaleLeft();
}
Tests/sprites/scale sprite 5.ts
+2 -2
View File
@@ -23,13 +23,13 @@
fuji = game.add.sprite(game.stage.centerX, game.stage.centerY, 'fuji');
// sets origin to the center of the sprite (half the width and half the height)
fuji.origin.setTo(160, 100);
fuji.transform.origin.setTo(160, 100);
// We'll tween the scale down to zero (which will make the sprite invisible) and then flip it
// The end result should look like turning over a card
// Create our tween
tween = game.add.tween(fuji.scale);
tween = game.add.tween(fuji.transform.scale);
// Start it going
scaleLeft();
Tests/sprites/sprite origin 1.js
+1 -1
View File
@@ -14,7 +14,7 @@
// The sprite is 320 x 200 pixels in size
// If we don't set an origin then the sprite will rotate around 0,0 - the top left corner
game.add.tween(fuji).to({
angle: 360
rotation: 360
}, 2000, Phaser.Easing.Linear.None, true, 0, true);
}
})();
Tests/sprites/sprite origin 1.ts
+1 -1
View File
@@ -23,7 +23,7 @@
// The sprite is 320 x 200 pixels in size
// If we don't set an origin then the sprite will rotate around 0,0 - the top left corner
game.add.tween(fuji).to({ angle: 360 }, 2000, Phaser.Easing.Linear.None, true, 0, true);
game.add.tween(fuji).to({ rotation: 360 }, 2000, Phaser.Easing.Linear.None, true, 0, true);
}
Tests/sprites/sprite origin 2.js
+2 -2
View File
@@ -14,9 +14,9 @@
// The sprite is 320 x 200 pixels in size
// Here we set the origin to the center of the sprite (half of its width and height, so 160x100)
// This will cause it to rotate on its center
fuji.origin.setTo(160, 100);
fuji.transform.origin.setTo(160, 100);
game.add.tween(fuji).to({
angle: 360
rotation: 360
}, 2000, Phaser.Easing.Linear.None, true, 0, true);
}
})();
Tests/sprites/sprite origin 2.ts
+2 -2
View File
@@ -24,9 +24,9 @@
// The sprite is 320 x 200 pixels in size
// Here we set the origin to the center of the sprite (half of its width and height, so 160x100)
// This will cause it to rotate on its center
fuji.origin.setTo(160, 100);
fuji.transform.origin.setTo(160, 100);
game.add.tween(fuji).to({ angle: 360 }, 2000, Phaser.Easing.Linear.None, true, 0, true);
game.add.tween(fuji).to({ rotation: 360 }, 2000, Phaser.Easing.Linear.None, true, 0, true);
}
Tests/sprites/sprite origin 3.js
+2 -2
View File
@@ -14,9 +14,9 @@
fuji = game.add.sprite(game.stage.centerX, game.stage.centerY, 'fuji');
// The sprite is 320 x 200 pixels in size
// Here we set the origin to be the bottom-right of the sprite
fuji.origin.setTo(320, 200);
fuji.transform.origin.setTo(320, 200);
game.add.tween(fuji).to({
angle: 360
rotation: 360
}, 2000, Phaser.Easing.Linear.None, true, 0, true);
}
})();
Tests/sprites/sprite origin 3.ts
+2 -2
View File
@@ -24,9 +24,9 @@
// The sprite is 320 x 200 pixels in size
// Here we set the origin to be the bottom-right of the sprite
fuji.origin.setTo(320, 200);
fuji.transform.origin.setTo(320, 200);
game.add.tween(fuji).to({ angle: 360 }, 2000, Phaser.Easing.Linear.None, true, 0, true);
game.add.tween(fuji).to({ rotation: 360 }, 2000, Phaser.Easing.Linear.None, true, 0, true);
}
Tests/sprites/sprite origin 4.js
+4 -4
View File
@@ -15,13 +15,13 @@
fuji = game.add.sprite(game.stage.centerX, game.stage.centerY, 'fuji');
// The sprite is 320 x 200 pixels in size
// Here we set the origin to the center of the sprite again, so we can rotate and scale it at the same time
fuji.origin.setTo(160, 100);
fuji.transform.origin.setTo(160, 100);
game.add.tween(fuji).to({
angle: 360
rotation: 360
}, 2000, Phaser.Easing.Linear.None, true, 0, true);
tweenUp = game.add.tween(fuji.scale);
tweenUp = game.add.tween(fuji.transform.scale);
tweenUp.onComplete.add(scaleDown, this);
tweenDown = game.add.tween(fuji.scale);
tweenDown = game.add.tween(fuji.transform.scale);
tweenDown.onComplete.add(scaleUp, this);
scaleUp();
}
Tests/sprites/sprite origin 4.ts
+4 -4
View File
@@ -25,14 +25,14 @@
// The sprite is 320 x 200 pixels in size
// Here we set the origin to the center of the sprite again, so we can rotate and scale it at the same time
fuji.origin.setTo(160, 100);
fuji.transform.origin.setTo(160, 100);
game.add.tween(fuji).to({ angle: 360 }, 2000, Phaser.Easing.Linear.None, true, 0, true);
game.add.tween(fuji).to({ rotation: 360 }, 2000, Phaser.Easing.Linear.None, true, 0, true);
tweenUp = game.add.tween(fuji.scale);
tweenUp = game.add.tween(fuji.transform.scale);
tweenUp.onComplete.add(scaleDown, this);
tweenDown = game.add.tween(fuji.scale);
tweenDown = game.add.tween(fuji.transform.scale);
tweenDown.onComplete.add(scaleUp, this);
scaleUp();
Tests/tweens/tween loop 1.js
+3 -3
View File
@@ -11,12 +11,12 @@
// Here we'll assign the new sprite to the local swirl variable
swirl = game.add.sprite(game.stage.centerX, game.stage.centerY, 'swirl');
// Increase the size of the sprite a little so it covers the edges of the stage
swirl.scale.setTo(1.4, 1.4);
swirl.transform.scale.setTo(1.4, 1.4);
// Set the origin to the middle of the Sprite to get the effect we need
swirl.origin.setTo(swirl.frameBounds.halfWidth, swirl.frameBounds.halfHeight);
swirl.transform.origin.setTo(swirl.worldView.halfWidth, swirl.worldView.halfHeight);
// Create a tween that rotates a full 306 degrees and then repeats (loop set to true)
game.add.tween(swirl).to({
angle: 360
rotation: 360
}, 2000, Phaser.Easing.Linear.None, true, 0, true);
}
})();
Tests/tweens/tween loop 1.ts
+3 -3
View File
@@ -20,13 +20,13 @@
swirl = game.add.sprite(game.stage.centerX, game.stage.centerY, 'swirl');
// Increase the size of the sprite a little so it covers the edges of the stage
swirl.scale.setTo(1.4, 1.4);
swirl.transform.scale.setTo(1.4, 1.4);
// Set the origin to the middle of the Sprite to get the effect we need
swirl.origin.setTo(swirl.frameBounds.halfWidth, swirl.frameBounds.halfHeight);
swirl.transform.origin.setTo(swirl.worldView.halfWidth, swirl.worldView.halfHeight);
// Create a tween that rotates a full 306 degrees and then repeats (loop set to true)
game.add.tween(swirl).to({ angle: 360 }, 2000, Phaser.Easing.Linear.None, true, 0, true);
game.add.tween(swirl).to({ rotation: 360 }, 2000, Phaser.Easing.Linear.None, true, 0, true);
}
Tests/tweens/tween loop 2.js
+4 -4
View File
@@ -11,14 +11,14 @@
// Here we'll assign the new sprite to the local swirl variable
swirl = game.add.sprite(game.stage.centerX, game.stage.centerY, 'swirl');
// Increase the size of the sprite a little so it covers the edges of the stage
swirl.scale.setTo(1.4, 1.4);
swirl.transform.scale.setTo(1.4, 1.4);
// Set the origin to the middle of the Sprite to get the effect we need
swirl.origin.setTo(swirl.frameBounds.halfWidth, swirl.frameBounds.halfHeight);
swirl.transform.origin.setTo(swirl.worldView.halfWidth, swirl.worldView.halfHeight);
// Create a tween that rotates a full 306 degrees and then repeats (loop set to true)
game.add.tween(swirl).to({
angle: 360
rotation: 360
}, 2000, Phaser.Easing.Linear.None, true, 0, true);
game.add.tween(swirl.scale).to({
game.add.tween(swirl.transform.scale).to({
x: 4,
y: 4
}, 1000, Phaser.Easing.Linear.None, true, 0, true, true);
Tests/tweens/tween loop 2.ts
+4 -4
View File
@@ -20,14 +20,14 @@
swirl = game.add.sprite(game.stage.centerX, game.stage.centerY, 'swirl');
// Increase the size of the sprite a little so it covers the edges of the stage
swirl.scale.setTo(1.4, 1.4);
swirl.transform.scale.setTo(1.4, 1.4);
// Set the origin to the middle of the Sprite to get the effect we need
swirl.origin.setTo(swirl.frameBounds.halfWidth, swirl.frameBounds.halfHeight);
swirl.transform.origin.setTo(swirl.worldView.halfWidth, swirl.worldView.halfHeight);
// Create a tween that rotates a full 306 degrees and then repeats (loop set to true)
game.add.tween(swirl).to({ angle: 360 }, 2000, Phaser.Easing.Linear.None, true, 0, true);
game.add.tween(swirl.scale).to({ x: 4, y: 4 }, 1000, Phaser.Easing.Linear.None, true, 0, true, true);
game.add.tween(swirl).to({ rotation: 360 }, 2000, Phaser.Easing.Linear.None, true, 0, true);
game.add.tween(swirl.transform.scale).to({ x: 4, y: 4 }, 1000, Phaser.Easing.Linear.None, true, 0, true, true);
}
build/phaser.d.ts
Vendored
+2038 -1959
View File
File diff suppressed because it is too large Load Diff
build/phaser.js
+3927 -3635
View File
File diff suppressed because it is too large Load Diff