wassname/phaser
1
0
Fork 0
mirror of https://github.com/wassname/phaser.git synced 2026-06-27 16:10:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

Added the new Button game object and various other input and tilemap fixes.

Browse Source
This commit is contained in:
Richard Davey
2013-07-12 03:28:46 +01:00
parent c81cf0c882
commit dcce99ec60
42 changed files with 1898 additions and 363 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Phaser/Game.ts
+54 -5
View File
@@ -130,17 +130,35 @@ module Phaser {
public onCreateCallback = null;
/**
* This will be called when update states.
* This will be called when State is updated, this doesn't happen during load (see onLoadUpdateCallback)
* @type {function}
*/
public onUpdateCallback = null;
/**
* This will be called when render states.
* This will be called when the State is rendered, this doesn't happen during load (see onLoadRenderCallback)
* @type {function}
*/
public onRenderCallback = null;
/**
* This will be called before the State is rendered and before the stage is cleared
* @type {function}
*/
public onPreRenderCallback = null;
/**
* This will be called when the State is updated but only during the load process
* @type {function}
*/
public onLoadUpdateCallback = null;
/**
* This will be called when the State is rendered but only during the load process
* @type {function}
*/
public onLoadRenderCallback = null;
/**
* This will be called when states paused.
* @type {function}
@@ -351,9 +369,7 @@ module Phaser {
* Called when the load has finished after init was run.
*/
private loadComplete() {
this._loadComplete = true;
}
/**
@@ -398,15 +414,28 @@ module Phaser {
{
this.onUpdateCallback.call(this.callbackContext);
}
else if (this._loadComplete == false && this.onLoadUpdateCallback)
{
this.onLoadUpdateCallback.call(this.callbackContext);
}
this.world.postUpdate();
if (this._loadComplete && this.onPreRenderCallback)
{
this.onPreRenderCallback.call(this.callbackContext);
}
this.renderer.render();
if (this._loadComplete && this.onRenderCallback)
{
this.onRenderCallback.call(this.callbackContext);
}
else if (this._loadComplete == false && this.onLoadRenderCallback)
{
this.onLoadRenderCallback.call(this.callbackContext);
}
}
@@ -446,7 +475,7 @@ module Phaser {
}
/**
* Set all state callbacks (init, create, update, render).
* Set the most common state callbacks (init, create, update, render).
* @param initCallback {function} Init callback invoked when init state.
* @param createCallback {function} Create callback invoked when create state.
* @param updateCallback {function} Update callback invoked when update state.
@@ -497,9 +526,12 @@ module Phaser {
this.callbackContext = this.state;
this.onInitCallback = null;
this.onLoadRenderCallback = null;
this.onLoadUpdateCallback = null;
this.onCreateCallback = null;
this.onUpdateCallback = null;
this.onRenderCallback = null;
this.onPreRenderCallback = null;
this.onPausedCallback = null;
this.onDestroyCallback = null;
@@ -509,6 +541,16 @@ module Phaser {
this.onInitCallback = this.state['init'];
}
if (this.state['loadRender'])
{
this.onLoadRenderCallback = this.state['loadRender'];
}
if (this.state['loadUpdate'])
{
this.onLoadUpdateCallback = this.state['loadUpdate'];
}
if (this.state['create'])
{
this.onCreateCallback = this.state['create'];
@@ -519,6 +561,11 @@ module Phaser {
this.onUpdateCallback = this.state['update'];
}
if (this.state['preRender'])
{
this.onPreRenderCallback = this.state['preRender'];
}
if (this.state['render'])
{
this.onRenderCallback = this.state['render'];
@@ -562,6 +609,8 @@ module Phaser {
this.callbackContext = null;
this.onInitCallback = null;
this.onLoadRenderCallback = null;
this.onLoadUpdateCallback = null;
this.onCreateCallback = null;
this.onUpdateCallback = null;
this.onRenderCallback = null;
Phaser/Phaser.csproj
+4
View File
@@ -92,6 +92,10 @@
<DependentUpon>CameraFX.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="components\ScrollRegion.ts" />
<TypeScriptCompile Include="gameobjects\Button.ts" />
<Content Include="gameobjects\Button.js">
<DependentUpon>Button.ts</DependentUpon>
</Content>
<Content Include="gameobjects\DynamicTexture.js">
<DependentUpon>DynamicTexture.ts</DependentUpon>
</Content>
Phaser/Statics.ts
+1
View File
@@ -17,6 +17,7 @@ module Phaser {
static EMITTER: number = 4;
static TILEMAP: number = 5;
static SCROLLZONE: number = 6;
static BUTTON: number = 7;
static GEOM_POINT: number = 0;
static GEOM_CIRCLE: number = 1;
Phaser/cameras/Camera.ts
+3
View File
@@ -36,6 +36,9 @@ module Phaser {
this.ID = id;
this.z = id;
width = this.game.math.clamp(width, this.game.stage.width, 1);
height = this.game.math.clamp(height, this.game.stage.height, 1);
// 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);
Phaser/components/animation/Animation.ts
+8 -1
View File
@@ -171,8 +171,13 @@ module Phaser {
this._timeNextFrame = this._game.time.now + this.delay;
this._frameIndex = 0;
this.currentFrame = this._frameData.getFrame(this._frames[this._frameIndex]);
this._parent.events.onAnimationStart.dispatch(this._parent, this);
return this;
}
/**
@@ -216,6 +221,7 @@ module Phaser {
{
this._frameIndex = 0;
this.currentFrame = this._frameData.getFrame(this._frames[this._frameIndex]);
this._parent.events.onAnimationLoop.dispatch(this._parent, this);
}
else
{
@@ -258,7 +264,8 @@ module Phaser {
this.isPlaying = false;
this.isFinished = true;
// callback goes here
this._parent.events.onAnimationComplete.dispatch(this._parent, this);
}
Phaser/components/animation/AnimationManager.ts
+18 -10
View File
@@ -25,18 +25,18 @@ module Phaser.Components {
constructor(parent: Phaser.Sprite) {
this._parent = parent;
this._game = parent.game;
this.game = parent.game;
this._anims = {};
}
/**
* Local private reference to game.
* Reference to Phaser.Game
*/
private _game: Game;
public game: Game;
/**
* Local private reference to its owner sprite.
* Local private reference to its parent game object.
*/
private _parent: Phaser.Sprite;
@@ -103,6 +103,14 @@ module Phaser.Components {
return;
}
// Create the signals the AnimationManager will emit
if (this._parent.events.onAnimationStart == null)
{
this._parent.events.onAnimationStart = new Phaser.Signal;
this._parent.events.onAnimationComplete = new Phaser.Signal;
this._parent.events.onAnimationLoop = new Phaser.Signal;
}
if (frames == null)
{
frames = this._frameData.getFrameIndexes();
@@ -121,7 +129,7 @@ module Phaser.Components {
frames = this._frameData.getFrameIndexesByName(frames);
}
this._anims[name] = new Animation(this._game, this._parent, this._frameData, name, frames, frameRate, loop);
this._anims[name] = new Animation(this.game, this._parent, this._frameData, name, frames, frameRate, loop);
this.currentAnim = this._anims[name];
this.currentFrame = this.currentAnim.currentFrame;
@@ -166,7 +174,7 @@ module Phaser.Components {
* @param frameRate {number} FrameRate you want to specify instead of using default.
* @param loop {boolean} Whether or not the animation is looped or just plays once.
*/
public play(name: string, frameRate?: number = null, loop?: bool) {
public play(name: string, frameRate?: number = null, loop?: bool): Animation {
if (this._anims[name])
{
@@ -174,13 +182,13 @@ module Phaser.Components {
{
if (this.currentAnim.isPlaying == false)
{
this.currentAnim.play(frameRate, loop);
return this.currentAnim.play(frameRate, loop);
}
}
else
{
this.currentAnim = this._anims[name];
this.currentAnim.play(frameRate, loop);
return this.currentAnim.play(frameRate, loop);
}
}
@@ -236,7 +244,7 @@ module Phaser.Components {
public set frame(value: number) {
if (this._frameData.getFrame(value) !== null)
if (this._frameData && this._frameData.getFrame(value) !== null)
{
this.currentFrame = this._frameData.getFrame(value);
@@ -260,7 +268,7 @@ module Phaser.Components {
public set frameName(value: string) {
if (this._frameData.getFrameByName(value) !== null)
if (this._frameData.getFrameByName(value))
{
this.currentFrame = this._frameData.getFrameByName(value);
Phaser/components/sprite/Events.ts
+18 -13
View File
@@ -11,27 +11,19 @@ module Phaser.Components.Sprite {
export class Events {
/**
* 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
* The Events component is a collection of events fired by the parent game object and its components.
* @param parent The game object using this Input component
*/
constructor(parent: Phaser.Sprite) {
this.game = parent.game;
this.sprite = parent;
this._parent = parent;
this.onAddedToGroup = new Phaser.Signal;
this.onRemovedFromGroup = new Phaser.Signal;
this.onKilled = new Phaser.Signal;
this.onRevived = new Phaser.Signal;
// Only create these if Sprite input is enabled?
this.onInputOver = new Phaser.Signal;
this.onInputOut = new Phaser.Signal;
this.onInputDown = new Phaser.Signal;
this.onInputUp = new Phaser.Signal;
this.onDragStart = new Phaser.Signal;
this.onDragStop = new Phaser.Signal;
}
/**
@@ -40,9 +32,9 @@ module Phaser.Components.Sprite {
public game: Game;
/**
* Reference to the Image stored in the Game.Cache that is used as the texture for the Sprite.
* Local private reference to its parent game object.
*/
private sprite: Phaser.Sprite;
private _parent: Phaser.Sprite;
/**
* Dispatched by the Group this Sprite is added to.
@@ -94,7 +86,20 @@ module Phaser.Components.Sprite {
*/
public onDragStop: Phaser.Signal;
/**
* Dispatched by the Animation component when the Sprite starts being animated
*/
public onAnimationStart: Phaser.Signal;
/**
* Dispatched by the Animation component when the Sprite animation completes
*/
public onAnimationComplete: Phaser.Signal;
/**
* Dispatched by the Animation component when the Sprite animation loops
*/
public onAnimationLoop: Phaser.Signal;
public onOutOfBounds: Phaser.Signal;
Phaser/components/sprite/Input.ts
+87 -61
View File
@@ -20,7 +20,7 @@ module Phaser.Components.Sprite {
constructor(parent: Phaser.Sprite) {
this.game = parent.game;
this.sprite = parent;
this._parent = parent;
this.enabled = false;
}
@@ -31,9 +31,9 @@ module Phaser.Components.Sprite {
public game: Game;
/**
* Reference to the Image stored in the Game.Cache that is used as the texture for the Sprite.
* Local private reference to its parent game object.
*/
private sprite: Phaser.Sprite;
private _parent: Phaser.Sprite;
private _pointerData;
@@ -104,6 +104,13 @@ module Phaser.Components.Sprite {
*/
public useHandCursor: bool;
/**
* If this object is set to consume the pointer event then it will stop all propogation from this object on.
* For example if you had a stack of 6 sprites with the same priority IDs and one consumed the event, none of the others would receive it.
* @type {Boolean}
*/
public consumePointerEvent: bool = false;
/**
* The x coordinate of the Input pointer, relative to the top-left of the parent Sprite.
* This value is only set when the pointer is over this Sprite.
@@ -222,10 +229,22 @@ module Phaser.Components.Sprite {
this.snapOffset = new Point;
this.enabled = true;
this.game.input.addGameObject(this.sprite);
this.game.input.addGameObject(this._parent);
// Create the signals the Input component will emit
if (this._parent.events.onInputOver == null)
{
this._parent.events.onInputOver = new Phaser.Signal;
this._parent.events.onInputOut = new Phaser.Signal;
this._parent.events.onInputDown = new Phaser.Signal;
this._parent.events.onInputUp = new Phaser.Signal;
this._parent.events.onDragStart = new Phaser.Signal;
this._parent.events.onDragStop = new Phaser.Signal;
}
}
return this.sprite;
return this._parent;
}
@@ -274,13 +293,13 @@ module Phaser.Components.Sprite {
*/
public checkPointerOver(pointer: Phaser.Pointer): bool {
if (this.enabled == false || this.sprite.visible == false)
if (this.enabled == false || this._parent.visible == false)
{
return false;
}
else
{
return SpriteUtils.overlapsXY(this.sprite, pointer.worldX(), pointer.worldY());
return SpriteUtils.overlapsXY(this._parent, pointer.worldX(), pointer.worldY());
}
}
@@ -290,7 +309,7 @@ module Phaser.Components.Sprite {
*/
public update(pointer: Phaser.Pointer): bool {
if (this.enabled == false || this.sprite.visible == false)
if (this.enabled == false || this._parent.visible == false)
{
return false;
}
@@ -301,10 +320,10 @@ module Phaser.Components.Sprite {
}
else if (this._pointerData[pointer.id].isOver == true)
{
if (SpriteUtils.overlapsXY(this.sprite, pointer.worldX(), pointer.worldY()))
if (SpriteUtils.overlapsXY(this._parent, pointer.worldX(), pointer.worldY()))
{
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._parent.x;
this._pointerData[pointer.id].y = pointer.y - this._parent.y;
return true;
}
else
@@ -325,15 +344,15 @@ module Phaser.Components.Sprite {
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._parent.x;
this._pointerData[pointer.id].y = pointer.y - this._parent.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._parent.events.onInputOver.dispatch(this._parent, pointer);
}
}
@@ -349,12 +368,10 @@ module Phaser.Components.Sprite {
this.game.stage.canvas.style.cursor = "default";
}
this.sprite.events.onInputOut.dispatch(this.sprite, pointer);
this._parent.events.onInputOut.dispatch(this._parent, pointer);
}
public consumePointerEvent: bool = false;
public _touchedHandler(pointer: Pointer): bool {
if (this._pointerData[pointer.id].isDown == false && this._pointerData[pointer.id].isOver == true)
@@ -363,7 +380,7 @@ module Phaser.Components.Sprite {
this._pointerData[pointer.id].isUp = false;
this._pointerData[pointer.id].timeDown = this.game.time.now;
this.sprite.events.onInputDown.dispatch(this.sprite, pointer);
this._parent.events.onInputDown.dispatch(this._parent, pointer);
// Start drag
//if (this.draggable && this.isDragged == false && pointer.targetObject == null)
@@ -374,7 +391,7 @@ module Phaser.Components.Sprite {
if (this.bringToTop)
{
this.sprite.group.bringToTop(this.sprite);
this._parent.group.bringToTop(this._parent);
}
}
@@ -386,7 +403,7 @@ module Phaser.Components.Sprite {
public _releasedHandler(pointer: Pointer) {
// If was previously touched by this Pointer, check if still is
// If was previously touched by this Pointer, check if still is AND still over this item
if (this._pointerData[pointer.id].isDown && pointer.isUp)
{
this._pointerData[pointer.id].isDown = false;
@@ -394,7 +411,19 @@ module Phaser.Components.Sprite {
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);
// Only release the InputUp signal if the pointer is still over this sprite
if (SpriteUtils.overlapsXY(this._parent, pointer.worldX(), pointer.worldY()))
{
this._parent.events.onInputUp.dispatch(this._parent, pointer);
}
else
{
// Pointer outside the sprite? Reset the cursor
if (this.useHandCursor)
{
this.game.stage.canvas.style.cursor = "default";
}
}
// Stop drag
if (this.draggable && this.isDragged && this._draggedPointerID == pointer.id)
@@ -402,10 +431,6 @@ module Phaser.Components.Sprite {
this.stopDrag(pointer);
}
if (this.useHandCursor)
{
this.game.stage.canvas.style.cursor = "default";
}
}
}
@@ -423,12 +448,12 @@ module Phaser.Components.Sprite {
if (this.allowHorizontalDrag)
{
this.sprite.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
this._parent.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
}
if (this.allowVerticalDrag)
{
this.sprite.y = pointer.y + this._dragPoint.y + this.dragOffset.y;
this._parent.y = pointer.y + this._dragPoint.y + this.dragOffset.y;
}
if (this.boundsRect)
@@ -443,8 +468,8 @@ module Phaser.Components.Sprite {
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._parent.x = Math.floor(this._parent.x / this.snapX) * this.snapX;
this._parent.y = Math.floor(this._parent.y / this.snapY) * this.snapY;
}
return true;
@@ -579,23 +604,23 @@ module Phaser.Components.Sprite {
if (this.dragFromCenter)
{
// Move the sprite to the middle of the pointer
//this._dragPoint.setTo(-this.sprite.worldView.halfWidth, -this.sprite.worldView.halfHeight);
//this._dragPoint.setTo(this.sprite.transform.center.x, this.sprite.transform.center.y);
this._dragPoint.setTo(this.sprite.x - pointer.x, this.sprite.y - pointer.y);
//this._dragPoint.setTo(-this._parent.worldView.halfWidth, -this._parent.worldView.halfHeight);
//this._dragPoint.setTo(this._parent.transform.center.x, this._parent.transform.center.y);
this._dragPoint.setTo(this._parent.x - pointer.x, this._parent.y - pointer.y);
}
else
{
this._dragPoint.setTo(this.sprite.x - pointer.x, this.sprite.y - pointer.y);
this._dragPoint.setTo(this._parent.x - pointer.x, this._parent.y - pointer.y);
}
this.updateDrag(pointer);
if (this.bringToTop)
{
this.sprite.group.bringToTop(this.sprite);
this._parent.group.bringToTop(this._parent);
}
this.sprite.events.onDragStart.dispatch(this.sprite, pointer);
this._parent.events.onDragStart.dispatch(this._parent, pointer);
}
@@ -610,11 +635,12 @@ module Phaser.Components.Sprite {
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._parent.x = Math.floor(this._parent.x / this.snapX) * this.snapX;
this._parent.y = Math.floor(this._parent.y / this.snapY) * this.snapY;
}
this.sprite.events.onDragStop.dispatch(this.sprite, pointer);
this._parent.events.onDragStop.dispatch(this._parent, pointer);
this._parent.events.onInputUp.dispatch(this._parent, pointer);
}
/**
@@ -660,22 +686,22 @@ module Phaser.Components.Sprite {
*/
private checkBoundsRect():void
{
if (this.sprite.x < this.boundsRect.left)
if (this._parent.x < this.boundsRect.left)
{
this.sprite.x = this.boundsRect.x;
this._parent.x = this.boundsRect.x;
}
else if ((this.sprite.x + this.sprite.width) > this.boundsRect.right)
else if ((this._parent.x + this._parent.width) > this.boundsRect.right)
{
this.sprite.x = this.boundsRect.right - this.sprite.width;
this._parent.x = this.boundsRect.right - this._parent.width;
}
if (this.sprite.y < this.boundsRect.top)
if (this._parent.y < this.boundsRect.top)
{
this.sprite.y = this.boundsRect.top;
this._parent.y = this.boundsRect.top;
}
else if ((this.sprite.y + this.sprite.height) > this.boundsRect.bottom)
else if ((this._parent.y + this._parent.height) > this.boundsRect.bottom)
{
this.sprite.y = this.boundsRect.bottom - this.sprite.height;
this._parent.y = this.boundsRect.bottom - this._parent.height;
}
}
@@ -684,22 +710,22 @@ module Phaser.Components.Sprite {
*/
private checkBoundsSprite():void
{
if (this.sprite.x < this.boundsSprite.x)
if (this._parent.x < this.boundsSprite.x)
{
this.sprite.x = this.boundsSprite.x;
this._parent.x = this.boundsSprite.x;
}
else if ((this.sprite.x + this.sprite.width) > (this.boundsSprite.x + this.boundsSprite.width))
else if ((this._parent.x + this._parent.width) > (this.boundsSprite.x + this.boundsSprite.width))
{
this.sprite.x = (this.boundsSprite.x + this.boundsSprite.width) - this.sprite.width;
this._parent.x = (this.boundsSprite.x + this.boundsSprite.width) - this._parent.width;
}
if (this.sprite.y < this.boundsSprite.y)
if (this._parent.y < this.boundsSprite.y)
{
this.sprite.y = this.boundsSprite.y;
this._parent.y = this.boundsSprite.y;
}
else if ((this.sprite.y + this.sprite.height) > (this.boundsSprite.y + this.boundsSprite.height))
else if ((this._parent.y + this._parent.height) > (this.boundsSprite.y + this.boundsSprite.height))
{
this.sprite.y = (this.boundsSprite.y + this.boundsSprite.height) - this.sprite.height;
this._parent.y = (this.boundsSprite.y + this.boundsSprite.height) - this._parent.height;
}
}
@@ -711,13 +737,13 @@ module Phaser.Components.Sprite {
*/
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.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);
this._parent.texture.context.font = '14px Courier';
this._parent.texture.context.fillStyle = color;
this._parent.texture.context.fillText('Sprite Input: (' + this._parent.worldView.width + ' x ' + this._parent.worldView.height + ')', x, y);
this._parent.texture.context.fillText('x: ' + this.pointerX().toFixed(1) + ' y: ' + this.pointerY().toFixed(1), x, y + 14);
this._parent.texture.context.fillText('over: ' + this.pointerOver() + ' duration: ' + this.overDuration().toFixed(0), x, y + 28);
this._parent.texture.context.fillText('down: ' + this.pointerDown() + ' duration: ' + this.downDuration().toFixed(0), x, y + 42);
this._parent.texture.context.fillText('just over: ' + this.justOver() + ' just out: ' + this.justOut(), x, y + 56);
}
Phaser/gameobjects/Button.ts
+211
View File
@@ -0,0 +1,211 @@
/// <reference path="../Game.ts" />
/// <reference path="../math/Vec2.ts" />
/// <reference path="../geom/Rectangle.ts" />
/// <reference path="../components/animation/AnimationManager.ts" />
/// <reference path="../components/Texture.ts" />
/// <reference path="../components/Transform.ts" />
/// <reference path="../components/sprite/Input.ts" />
/// <reference path="../components/sprite/Events.ts" />
/**
* Phaser - Button
*/
module Phaser {
export class Button extends Sprite {
/**
* Create a new <code>Button</code> object.
*
* @param game {Phaser.Game} Current game instance.
* @param [x] {number} the initial x position of the button.
* @param [y] {number} the initial y position of the button.
* @param [key] {string} Key of the graphic you want to load for this button.
*/
constructor(game: Game, x?: number = 0, y?: number = 0, key?: string = null, callback? = null, callbackContext? = null, overFrame? = null, outFrame? = null, downFrame? = null) {
super(game, x, y, key, outFrame);
this.type = Phaser.Types.BUTTON;
if (typeof overFrame == 'string')
{
this._onOverFrameName = overFrame;
}
else
{
this._onOverFrameID = overFrame;
}
if (typeof outFrame == 'string')
{
this._onOutFrameName = outFrame;
this._onUpFrameName = outFrame;
}
else
{
this._onOutFrameID = outFrame;
this._onUpFrameID = outFrame;
}
if (typeof downFrame == 'string')
{
this._onDownFrameName = downFrame;
}
else
{
this._onDownFrameID = downFrame;
}
// These are the signals the game will subscribe to
this.onInputOver = new Phaser.Signal;
this.onInputOut = new Phaser.Signal;
this.onInputDown = new Phaser.Signal;
this.onInputUp = new Phaser.Signal;
// Set a default signal for them
if (callback)
{
this.onInputUp.add(callback, callbackContext);
}
this.input.start(0, false, true);
// Redirect the input events to here so we can handle animation updates, etc
this.events.onInputOver.add(this.onInputOverHandler, this);
this.events.onInputOut.add(this.onInputOutHandler, this);
this.events.onInputDown.add(this.onInputDownHandler, this);
this.events.onInputUp.add(this.onInputUpHandler, this);
// By default we'll position it using screen space, not world space.
this.transform.scrollFactor.setTo(0, 0);
}
private _onOverFrameName = null;
private _onOutFrameName = null;
private _onDownFrameName = null;
private _onUpFrameName = null;
private _onOverFrameID = null;
private _onOutFrameID = null;
private _onDownFrameID = null;
private _onUpFrameID = null;
/**
* Dispatched when a pointer moves over an Input enabled sprite.
*/
public onInputOver: Phaser.Signal;
/**
* Dispatched when a pointer moves out of an Input enabled sprite.
*/
public onInputOut: Phaser.Signal;
/**
* Dispatched when a pointer is pressed down on an Input enabled sprite.
*/
public onInputDown: Phaser.Signal;
/**
* Dispatched when a pointer is released over an Input enabled sprite
*/
public onInputUp: Phaser.Signal;
// TODO
//public tabIndex: number;
//public tabEnabled: bool;
// ENTER or SPACE can activate this button if it has focus
private onInputOverHandler(pointer:Phaser.Pointer) {
if (this._onOverFrameName != null)
{
this.frameName = this._onOverFrameName;
}
else if (this._onOverFrameID != null)
{
this.frame = this._onOverFrameID;
}
if (this.onInputOver)
{
this.onInputOver.dispatch(this, pointer);
}
}
private onInputOutHandler(pointer:Phaser.Pointer) {
if (this._onOutFrameName != null)
{
this.frameName = this._onOutFrameName;
}
else if (this._onOutFrameID != null)
{
this.frame = this._onOutFrameID;
}
if (this.onInputOut)
{
this.onInputOut.dispatch(this, pointer);
}
}
private onInputDownHandler(pointer:Phaser.Pointer) {
if (this._onDownFrameName != null)
{
this.frameName = this._onDownFrameName;
}
else if (this._onDownFrameID != null)
{
this.frame = this._onDownFrameID;
}
if (this.onInputDown)
{
this.onInputDown.dispatch(this, pointer);
}
}
private onInputUpHandler(pointer:Phaser.Pointer) {
if (this._onUpFrameName != null)
{
this.frameName = this._onUpFrameName;
}
else if (this._onUpFrameID != null)
{
this.frame = this._onUpFrameID;
}
if (this.onInputUp)
{
this.onInputUp.dispatch(this, pointer);
}
}
public set priorityID(value: number) {
this.input.priorityID = value;
}
public get priorityID(): number {
return this.input.priorityID;
}
public set useHandCursor(value: bool) {
this.input.useHandCursor = value;
}
public get useHandCursor(): bool {
return this.input.useHandCursor;
}
}
}
Phaser/gameobjects/DynamicTexture.ts
+27 -3
View File
@@ -77,6 +77,14 @@ module Phaser {
*/
public context: CanvasRenderingContext2D;
/**
* 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;
/**
* Get a color of a specific pixel.
* @param x {number} X position of the pixel in this texture.
@@ -252,12 +260,15 @@ module Phaser {
* Given an array of Sprites it will update each of them so that their canvas/contexts reference this DynamicTexture
* @param objects {Array} An array of GameObjects, or objects that inherit from it such as Sprites
*/
public assignCanvasToGameObjects(objects: IGameObject[]) {
public assignCanvasToGameObjects(objects) {
for (var i = 0; i < objects.length; i++)
{
objects[i].texture.canvas = this.canvas;
objects[i].texture.context = this.context;
if (objects[i].texture)
{
objects[i].texture.canvas = this.canvas;
objects[i].texture.context = this.context;
}
}
}
@@ -278,7 +289,20 @@ module Phaser {
* @param y {number} The Y coordinate to render on the stage to (given in screen coordinates, not world)
*/
public render(x?: number = 0, y?: number = 0) {
if (this.globalCompositeOperation)
{
this.game.stage.context.save();
this.game.stage.context.globalCompositeOperation = this.globalCompositeOperation;
}
this.game.stage.context.drawImage(this.canvas, x, y);
if (this.globalCompositeOperation)
{
this.game.stage.context.restore();
}
}
public get width(): number {
Phaser/gameobjects/GameObjectFactory.ts
+18
View File
@@ -3,6 +3,7 @@
/// <reference path="../gameobjects/Emitter.ts" />
/// <reference path="../gameobjects/Particle.ts" />
/// <reference path="../gameobjects/Sprite.ts" />
/// <reference path="../gameobjects/Button.ts" />
/// <reference path="../gameobjects/ScrollZone.ts" />
/// <reference path="../gameobjects/DynamicTexture.ts" />
/// <reference path="../gameobjects/Tilemap.ts" />
@@ -62,6 +63,23 @@ module Phaser {
// return <GeomSprite> this._world.group.add(new GeomSprite(this._game, x, y));
//}
/**
* Create a new Button game object.
*
* @param [x] {number} X position of the button.
* @param [y] {number} Y position of the button.
* @param [key] {string} The image key as defined in the Game.Cache to use as the texture for this button.
* @param [callback] {function} The function to call when this button is pressed
* @param [callbackContext] {object} The context in which the callback will be called (usually 'this')
* @param [overFrame] {string|number} This is the frame or frameName that will be set when this button is in an over state. Give either a number to use a frame ID or a string for a frame name.
* @param [outFrame] {string|number} This is the frame or frameName that will be set when this button is in an out state. Give either a number to use a frame ID or a string for a frame name.
* @param [downFrame] {string|number} This is the frame or frameName that will be set when this button is in a down state. Give either a number to use a frame ID or a string for a frame name.
* @returns {Button} The newly created button object.
*/
public button(x?: number = 0, y?: number = 0, key?: string = null, callback? = null, callbackContext? = null, overFrame? = null, outFrame? = null, downFrame? = null): Button {
return <Button> this._world.group.add(new Button(this._game, x, y, key, callback, callbackContext, overFrame, outFrame, downFrame));
}
/**
* Create a new Sprite with specific position and sprite sheet key.
*
Phaser/gameobjects/IGameObject.ts
+15
View File
@@ -54,6 +54,21 @@ module Phaser {
*/
visible: bool;
/**
* The animation manager component
*/
animations: Phaser.Components.AnimationManager;
/**
* Associated events
*/
events;
/**
* The input component
*/
input;
/**
* The texture used to render.
*/
Phaser/gameobjects/Sprite.ts
+15 -6
View File
@@ -42,9 +42,9 @@ module Phaser {
this.group = null;
this.name = '';
this.events = new Phaser.Components.Sprite.Events(this);
this.animations = new Phaser.Components.AnimationManager(this);
this.input = new Phaser.Components.Sprite.Input(this);
this.events = new Phaser.Components.Sprite.Events(this);
this.texture = new Phaser.Components.Texture(this);
this.transform = new Phaser.Components.Transform(this);
@@ -224,17 +224,26 @@ module Phaser {
*/
public scale: Phaser.Vec2;
/**
* The alpha of the Sprite between 0 and 1, a value of 1 being fully opaque.
*/
public alpha: number;
/**
* The origin of the Sprite around which rotation and positioning takes place.
* This is a reference to Sprite.transform.origin
*/
public origin: Phaser.Vec2;
/**
* The alpha of the Sprite between 0 and 1, a value of 1 being fully opaque.
*/
public set alpha(value: number) {
this.texture.alpha = value;
}
/**
* The alpha of the Sprite between 0 and 1, a value of 1 being fully opaque.
*/
public get alpha(): number {
return this.texture.alpha;
}
/**
* Set the animation frame by frame number.
*/
Phaser/gameobjects/Tilemap.ts
+3
View File
@@ -206,6 +206,9 @@ module Phaser {
public postUpdate() {
}
public destroy() {
}
/**
* Parset csv map data and generate tiles.
* @param data {string} CSV map data.
Phaser/input/Input.ts
+4 -2
View File
@@ -507,7 +507,6 @@ module Phaser {
if (this.inputObjects[index])
{
console.log('object removed from the input manager', index);
this.inputObjects[index] = null;
}
@@ -580,7 +579,10 @@ module Phaser {
for (var i = 0; i < this.totalTrackedObjects; i++)
{
this.inputObjects[i].input.reset();
if (this.inputObjects[i] && this.inputObjects[i].input)
{
this.inputObjects[i].input.reset();
}
}
this.inputObjects.length = 0;
Phaser/input/Pointer.ts
+61 -19
View File
@@ -371,6 +371,10 @@ module Phaser {
}
private _highestRenderOrderID: number;
private _highestRenderObject: number;
private _highestInputPriorityID: number;
/**
* Called when the Pointer is moved on the touchscreen
* @method move
@@ -407,35 +411,73 @@ module Phaser {
this.game.input.circle.y = this.game.input.y;
}
if (this.targetObject !== null)
// Easy out if we're dragging something and it still exists
if (this.targetObject !== null && this.targetObject.input && this.targetObject.input.isDragged == true)
{
if (this.targetObject.input.update(this) == false)
{
this.targetObject = null;
}
return this;
}
// Work out which object is on the top
this._highestRenderOrderID = -1;
this._highestRenderObject = -1;
this._highestInputPriorityID = -1;
for (var i = 0; i < this.game.input.totalTrackedObjects; i++)
{
if (this.game.input.inputObjects[i] && this.game.input.inputObjects[i].input && this.game.input.inputObjects[i].input.checkPointerOver(this))
{
// If the object has a higher Input.PriorityID OR if the priority ID is the same as the current highest AND it has a higher renderOrderID, then set it to the top
if (this.game.input.inputObjects[i].input.priorityID > this._highestInputPriorityID || (this.game.input.inputObjects[i].input.priorityID == this._highestInputPriorityID && this.game.input.inputObjects[i].renderOrderID > this._highestRenderOrderID))
{
this._highestRenderOrderID = this.game.input.inputObjects[i].renderOrderID;
this._highestRenderObject = i;
this._highestInputPriorityID = this.game.input.inputObjects[i].input.priorityID;
}
}
}
if (this._highestRenderObject == -1)
{
// The pointer isn't over anything, check if we've got a lingering previous target
if (this.targetObject !== null)
{
this.targetObject.input._pointerOutHandler(this);
this.targetObject = null;
}
}
else
{
// Build our temporary click stack
var _highestRenderID = -1;
var _highestRenderObject: number = -1;
for (var i = 0; i < this.game.input.totalTrackedObjects; i++)
if (this.targetObject == null)
{
if (this.game.input.inputObjects[i] !== null && this.game.input.inputObjects[i].input.checkPointerOver(this) && this.game.input.inputObjects[i].renderOrderID > _highestRenderID)
{
_highestRenderID = this.game.input.inputObjects[i].renderOrderID;
_highestRenderObject = i;
}
}
if (_highestRenderObject !== -1)
{
//console.log('setting target');
this.targetObject = this.game.input.inputObjects[_highestRenderObject];
// And now set the new one
this.targetObject = this.game.input.inputObjects[this._highestRenderObject];
this.targetObject.input._pointerOverHandler(this);
}
else
{
// We've got a target from the last update
if (this.targetObject == this.game.input.inputObjects[this._highestRenderObject])
{
// Same target as before, so update it
if (this.targetObject.input.update(this) == false)
{
this.targetObject = null;
}
}
else
{
// The target has changed, so tell the old one we've left it
this.targetObject.input._pointerOutHandler(this);
// And now set the new one
this.targetObject = this.game.input.inputObjects[this._highestRenderObject];
this.targetObject.input._pointerOverHandler(this);
}
}
}
return this;
@@ -510,7 +552,7 @@ module Phaser {
for (var i = 0; i < this.game.input.totalTrackedObjects; i++)
{
if (this.game.input.inputObjects[i] !== null && this.game.input.inputObjects[i].input.enabled)
if (this.game.input.inputObjects[i] && this.game.input.inputObjects[i].input && this.game.input.inputObjects[i].input.enabled)
{
this.game.input.inputObjects[i].input._releasedHandler(this);
}
@@ -584,7 +626,7 @@ module Phaser {
this._history.length = 0;
this._stateReset = true;
if (this.targetObject)
if (this.targetObject && this.targetObject.input)
{
this.targetObject.input._releasedHandler(this);
}
Phaser/loader/AnimationLoader.ts
+1
View File
@@ -44,6 +44,7 @@ module Phaser {
// Zero or smaller than frame sizes?
if (width == 0 || height == 0 || width < frameWidth || height < frameHeight || total === 0)
{
throw new Error("AnimationLoader.parseSpriteSheet: width/height zero or width/height < given frameWidth/frameHeight");
return null;
}
Phaser/loader/Cache.ts
+16
View File
@@ -312,6 +312,22 @@ module Phaser {
}
public removeCanvas(key: string) {
delete this._canvases[key];
}
public removeImage(key: string) {
delete this._images[key];
}
public removeSound(key: string) {
delete this._sounds[key];
}
public removeText(key: string) {
delete this._text[key];
}
/**
* Clean up cache memory.
*/
Phaser/loader/Loader.ts
+4 -6
View File
@@ -71,7 +71,7 @@ module Phaser {
public hasLoaded: bool;
/**
* Loading progress (from 0 to 1)
* Loading progress (from 0 to 100)
* @type {number}
*/
public progress: number;
@@ -97,9 +97,7 @@ module Phaser {
}
public get queueSize(): number {
return this._queueSize;
}
/**
@@ -107,9 +105,9 @@ module Phaser {
* @param key {string} Unique asset key of this image file.
* @param url {string} URL of image file.
*/
public image(key: string, url: string) {
public image(key: string, url: string, overwrite: bool = false) {
if (this.checkKeyExists(key) === false)
if (overwrite == true || this.checkKeyExists(key) == false)
{
this._queueSize++;
this._fileList[key] = { type: 'image', key: key, url: url, data: null, error: false, loaded: false };
@@ -294,7 +292,7 @@ module Phaser {
}
else
{
this.progress = 1;
this.progress = 100;
this.hasLoaded = true;
this._gameCreateComplete.call(this._game);
Phaser/renderers/CanvasRenderer.ts
+1 -1
View File
@@ -72,7 +72,7 @@ module Phaser {
public renderGameObject(object) {
if (object.type == Types.SPRITE)
if (object.type == Types.SPRITE || object.type == Types.BUTTON)
{
this.renderSprite(this._camera, object);
}
README.md
+12 -6
View File
@@ -30,12 +30,9 @@ TODO:
* Game.Time should monitor pause duration
* Investigate bug re: tilemap collision and animation frames
* Update tests that use arrow keys and include touch/mouse support (FlxControlHandler style)
* If the Camera is larger than the Stage size then the rotation offset isn't correct
* Texture Repeat doesn't scroll, because it's part of the camera not the world, need to think about this more
* Bug: Sprite x/y gets shifted if dynamic from the original value
* Stage CSS3 transforms!!! Color tints, sepia, greyscale, all of those cool things :)
* Add JSON Texture Atlas object support.
* Swap to using time based motion (like the tweens) rather than delta timer - it just doesn't work well on slow phones
* Pointer.getWorldX(camera) needs to take camera scale into consideration
* If stage.clear set to false and game pauses, when it unpauses you still see the pause arrow - resolve this
* Add clip support + shape options to Texture Component.
@@ -54,13 +51,12 @@ TODO:
* QuadTree.physics.checkHullIntersection
* Fix the Motion methods for the new physics system
* Move findShapeByPoint etc from Space to Manager (or at least add a proxy to them)
* Make onInput events created only if input component is started
* Add button mode linked to sprite frames
* Add visible toggle if tween property is alpha <> 01
* Camera.isHidden uses an array and length check, faster to swap for a single counter, also try to remove indexOf check
* Tilemap.render - move layers length to var
* Camera control method (touch/keyboard)
* Tilemap.destroy needs doing
* Look at the input targetObject - it doesn't seem to get cleared down all the time, maybe just a priority/alpha issue (check vis/alpha?)
V1.0.0
@@ -136,6 +132,16 @@ V1.0.0
* Moved 'facing' property from Sprite.body to Sprite.texture (may move to Sprite core)
* Added Sprite.events.onDragStart and onDragStop
* A tilemap can now be loaded without a tile sheet, should you just want to get the tile data from it and not render.
* Added new Sprite.events: onAnimationStart, onAnimationComplete, onAnimationLoop
* Added in support for the Input component PriorityID value and refactored Input.Pointer to respect it. Rollovers are perfect now :)
* Added 2 new State functions: loadRender and loadUpdate, are called the same as render and update but only during the load process
* Fixed Input.stopDrag so it fires an onInputUp event as well from the sprite.
* Added support for a preRender state - very useful for certain types of special effects.
* Cameras are now limited so they can never be larger than the Game.Stage size.
* Added a new Button Game Object for easily creating in-game UI and menu systems.
* Fixed bug where Sprite.alpha wasn't properly reflecting Sprite.texture.alpha.
* Fixed bug where the hand cursor would be reset on input up, even if the mouse was still over the sprite.
* Fixed bug where pressing down then moving out of the sprite area wouldn't properly reset the input state next time you moved over the sprite.
V0.9.6
Tests/Tests.csproj
+16
View File
@@ -54,6 +54,18 @@
</PropertyGroup>
<ItemGroup>
<TypeScriptCompile Include="cameras\basic camera 1.ts" />
<TypeScriptCompile Include="buttons\basic button.ts" />
<TypeScriptCompile Include="buttons\basic button 2.ts" />
<Content Include="buttons\basic button 2.js">
<DependentUpon>basic button 2.ts</DependentUpon>
</Content>
<Content Include="buttons\basic button.js">
<DependentUpon>basic button.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="buttons\rotated buttons.ts" />
<Content Include="buttons\rotated buttons.js">
<DependentUpon>rotated buttons.ts</DependentUpon>
</Content>
<Content Include="cameras\basic camera 1.js">
<DependentUpon>basic camera 1.ts</DependentUpon>
</Content>
@@ -206,6 +218,10 @@
<DependentUpon>skewed scroller.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="sprites\atlas 1.ts" />
<TypeScriptCompile Include="sprites\alpha.ts" />
<Content Include="sprites\alpha.js">
<DependentUpon>alpha.ts</DependentUpon>
</Content>
<Content Include="sprites\atlas 1.js">
<DependentUpon>atlas 1.ts</DependentUpon>
</Content>
Tests/assets/buttons/button_sprite_sheet.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 30 KiB

Tests/assets/buttons/button_texture_atlas.json
+36
View File
@@ -0,0 +1,36 @@
{"frames": [
{
"filename": "down",
"frame": {"x":0,"y":142,"w":193,"h":71},
"rotated": false,
"trimmed": false,
"spriteSourceSize": {"x":0,"y":0,"w":193,"h":71},
"sourceSize": {"w":193,"h":71}
},
{
"filename": "out",
"frame": {"x":0,"y":71,"w":193,"h":71},
"rotated": false,
"trimmed": false,
"spriteSourceSize": {"x":0,"y":0,"w":193,"h":71},
"sourceSize": {"w":193,"h":71}
},
{
"filename": "over",
"frame": {"x":0,"y":0,"w":193,"h":71},
"rotated": false,
"trimmed": false,
"spriteSourceSize": {"x":0,"y":0,"w":193,"h":71},
"sourceSize": {"w":193,"h":71}
}],
"meta": {
"app": "http://www.texturepacker.com",
"version": "1.0",
"image": "button_texture_atlas.png",
"format": "RGBA8888",
"size": {"w":193,"h":213},
"scale": "1",
"smartupdate": "$TexturePacker:SmartUpdate:94df81041404a206a4e9cd597a1e3495$"
}
}
Tests/assets/buttons/button_texture_atlas.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 32 KiB

Tests/assets/psds/button.psd
BIN
View File
Binary file not shown.
Tests/assets/psds/down.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.6 KiB

Tests/assets/psds/out.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

Tests/assets/psds/over.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

Tests/buttons/basic button 2.js
+33
View File
@@ -0,0 +1,33 @@
/// <reference path="../../Phaser/Game.ts" />
/// <reference path="../../Phaser/gameobjects/Button.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, init, create);
function init() {
game.load.image('beast', 'assets/pics/shadow_of_the_beast2_other_world.png');
game.load.atlas('button', 'assets/buttons/button_texture_atlas.png', 'assets/buttons/button_texture_atlas.json');
game.load.start();
}
image:
Phaser.Sprite
button:
Phaser.Button
function create() {
// This is just an image that we'll toggle the display of when you click the button
this.image = game.add.sprite(game.stage.centerX, 0, 'beast');
this.image.transform.origin.setTo(0.5, 0);
// This button is created from a texture atlas.
// Instead of frame IDs (like with a sprite sheet) we can tell it to use frame names instead.
// In this case our atlast frame names were called 'over', 'out' and 'down', but they could be anything you want.
// The function "clickedIt" will be called when the button is clicked or touched
this.button = game.add.button(game.stage.centerX, 400, 'button', clickedIt, this, 'over', 'out', 'down');
// Just makes the button origin set to the middle, we only do this to center the button on-screen, no other reason
this.button.transform.origin.setTo(0.5, 0.5);
}
function clickedIt() {
if(this.image.visible == true) {
this.image.visible = false;
} else {
this.image.visible = true;
}
}
})();
Tests/buttons/basic button 2.ts
+49
View File
@@ -0,0 +1,49 @@
/// <reference path="../../Phaser/Game.ts" />
/// <reference path="../../Phaser/gameobjects/Button.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, init, create);
function init() {
game.load.image('beast', 'assets/pics/shadow_of_the_beast2_other_world.png');
game.load.atlas('button', 'assets/buttons/button_texture_atlas.png', 'assets/buttons/button_texture_atlas.json');
game.load.start();
}
image: Phaser.Sprite;
button: Phaser.Button;
function create() {
// This is just an image that we'll toggle the display of when you click the button
this.image = game.add.sprite(game.stage.centerX, 0, 'beast');
this.image.transform.origin.setTo(0.5, 0);
// This button is created from a texture atlas.
// Instead of frame IDs (like with a sprite sheet) we can tell it to use frame names instead.
// In this case our atlast frame names were called 'over', 'out' and 'down', but they could be anything you want.
// The function "clickedIt" will be called when the button is clicked or touched
this.button = game.add.button(game.stage.centerX, 400, 'button', clickedIt, this, 'over', 'out', 'down');
// Just makes the button origin set to the middle, we only do this to center the button on-screen, no other reason
this.button.transform.origin.setTo(0.5, 0.5);
}
function clickedIt() {
if (this.image.visible == true)
{
this.image.visible = false;
}
else
{
this.image.visible = true;
}
}
})();
Tests/buttons/basic button.js
+34
View File
@@ -0,0 +1,34 @@
/// <reference path="../../Phaser/Game.ts" />
/// <reference path="../../Phaser/gameobjects/Button.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, init, create);
function init() {
game.load.image('beast', 'assets/pics/shadow_of_the_beast2_karamoon.png');
game.load.spritesheet('button', 'assets/buttons/button_sprite_sheet.png', 193, 71);
game.load.start();
}
image:
Phaser.Sprite
button:
Phaser.Button
function create() {
// This is just an image that we'll toggle the display of when you click the button
this.image = game.add.sprite(game.stage.centerX, 0, 'beast');
this.image.transform.origin.setTo(0.5, 0);
// This button is created from a sprite sheet.
// Frame 0 = the 'down' state
// Frame 1 = the 'out' state
// Frame 2 = the 'over' state
// The function "clickedIt" will be called when the button is clicked or touched
this.button = game.add.button(game.stage.centerX, 400, 'button', clickedIt, this, 2, 1, 0);
// Just makes the button origin set to the middle, we only do this to center the button on-screen, no other reason
this.button.transform.origin.setTo(0.5, 0.5);
}
function clickedIt() {
if(this.image.visible == true) {
this.image.visible = false;
} else {
this.image.visible = true;
}
}
})();
Tests/buttons/basic button.ts
+50
View File
@@ -0,0 +1,50 @@
/// <reference path="../../Phaser/Game.ts" />
/// <reference path="../../Phaser/gameobjects/Button.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, init, create);
function init() {
game.load.image('beast', 'assets/pics/shadow_of_the_beast2_karamoon.png');
game.load.spritesheet('button', 'assets/buttons/button_sprite_sheet.png', 193, 71);
game.load.start();
}
image: Phaser.Sprite;
button: Phaser.Button;
function create() {
// This is just an image that we'll toggle the display of when you click the button
this.image = game.add.sprite(game.stage.centerX, 0, 'beast');
this.image.transform.origin.setTo(0.5, 0);
// This button is created from a sprite sheet.
// Frame 0 = the 'down' state
// Frame 1 = the 'out' state
// Frame 2 = the 'over' state
// The function "clickedIt" will be called when the button is clicked or touched
this.button = game.add.button(game.stage.centerX, 400, 'button', clickedIt, this, 2, 1, 0);
// Just makes the button origin set to the middle, we only do this to center the button on-screen, no other reason
this.button.transform.origin.setTo(0.5, 0.5);
}
function clickedIt() {
if (this.image.visible == true)
{
this.image.visible = false;
}
else
{
this.image.visible = true;
}
}
})();
Tests/buttons/rotated buttons.js
+37
View File
@@ -0,0 +1,37 @@
/// <reference path="../../Phaser/Game.ts" />
/// <reference path="../../Phaser/gameobjects/Button.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, init, create, update);
function init() {
game.load.image('beast', 'assets/pics/shadow_of_the_beast2_other_world.png');
game.load.atlas('button', 'assets/buttons/button_texture_atlas.png', 'assets/buttons/button_texture_atlas.json');
game.load.start();
}
image:
Phaser.Sprite
button:
Phaser.Button
function create() {
// This is just an image that we'll toggle the display of when you click the button
this.image = game.add.sprite(game.stage.centerX, 0, 'beast');
this.image.transform.origin.setTo(0.5, 0);
// This button is created from a texture atlas.
// Instead of frame IDs (like with a sprite sheet) we can tell it to use frame names instead.
// In this case our atlast frame names were called 'over', 'out' and 'down', but they could be anything you want.
// The function "clickedIt" will be called when the button is clicked or touched
this.button = game.add.button(game.stage.centerX, 400, 'button', clickedIt, this, 'over', 'out', 'down');
// Makes the button origin set to the middle
this.button.transform.origin.setTo(0.5, 0.5);
}
function update() {
// Rotate the button each frame, the button states will still work and respond.
this.button.rotation += 1;
}
function clickedIt() {
if(this.image.visible == true) {
this.image.visible = false;
} else {
this.image.visible = true;
}
}
})();
Tests/buttons/rotated buttons.ts
+56
View File
@@ -0,0 +1,56 @@
/// <reference path="../../Phaser/Game.ts" />
/// <reference path="../../Phaser/gameobjects/Button.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, init, create, update);
function init() {
game.load.image('beast', 'assets/pics/shadow_of_the_beast2_other_world.png');
game.load.atlas('button', 'assets/buttons/button_texture_atlas.png', 'assets/buttons/button_texture_atlas.json');
game.load.start();
}
image: Phaser.Sprite;
button: Phaser.Button;
function create() {
// This is just an image that we'll toggle the display of when you click the button
this.image = game.add.sprite(game.stage.centerX, 0, 'beast');
this.image.transform.origin.setTo(0.5, 0);
// This button is created from a texture atlas.
// Instead of frame IDs (like with a sprite sheet) we can tell it to use frame names instead.
// In this case our atlast frame names were called 'over', 'out' and 'down', but they could be anything you want.
// The function "clickedIt" will be called when the button is clicked or touched
this.button = game.add.button(game.stage.centerX, 400, 'button', clickedIt, this, 'over', 'out', 'down');
// Makes the button origin set to the middle
this.button.transform.origin.setTo(0.5, 0.5);
}
function update() {
// Rotate the button each frame, the button states will still work and respond.
this.button.rotation += 1;
}
function clickedIt() {
if (this.image.visible == true)
{
this.image.visible = false;
}
else
{
this.image.visible = true;
}
}
})();
Tests/phaser.js
+410 -102
View File
@@ -1274,6 +1274,7 @@ var Phaser;
Types.EMITTER = 4;
Types.TILEMAP = 5;
Types.SCROLLZONE = 6;
Types.BUTTON = 7;
Types.GEOM_POINT = 0;
Types.GEOM_CIRCLE = 1;
Types.GEOM_Rectangle = 2;
@@ -1987,6 +1988,13 @@ var Phaser;
this._dy = 0;
this._dw = 0;
this._dh = 0;
/**
* 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.
*/
this.globalCompositeOperation = null;
this.game = game;
this.type = Phaser.Types.GEOMSPRITE;
this.canvas = document.createElement('canvas');
@@ -2133,8 +2141,10 @@ var Phaser;
*/
function (objects) {
for(var i = 0; i < objects.length; i++) {
objects[i].texture.canvas = this.canvas;
objects[i].texture.context = this.context;
if(objects[i].texture) {
objects[i].texture.canvas = this.canvas;
objects[i].texture.context = this.context;
}
}
};
DynamicTexture.prototype.clear = /**
@@ -2152,7 +2162,14 @@ var Phaser;
function (x, y) {
if (typeof x === "undefined") { x = 0; }
if (typeof y === "undefined") { y = 0; }
if(this.globalCompositeOperation) {
this.game.stage.context.save();
this.game.stage.context.globalCompositeOperation = this.globalCompositeOperation;
}
this.game.stage.context.drawImage(this.canvas, x, y);
if(this.globalCompositeOperation) {
this.game.stage.context.restore();
}
};
Object.defineProperty(DynamicTexture.prototype, "width", {
get: function () {
@@ -2206,6 +2223,7 @@ var Phaser;
}
// Zero or smaller than frame sizes?
if(width == 0 || height == 0 || width < frameWidth || height < frameHeight || total === 0) {
throw new Error("AnimationLoader.parseSpriteSheet: width/height zero or width/height < given frameWidth/frameHeight");
return null;
}
// Let's create some frames then
@@ -2345,6 +2363,8 @@ var Phaser;
this._timeNextFrame = this._game.time.now + this.delay;
this._frameIndex = 0;
this.currentFrame = this._frameData.getFrame(this._frames[this._frameIndex]);
this._parent.events.onAnimationStart.dispatch(this._parent, this);
return this;
};
Animation.prototype.restart = /**
* Play this animation from the first frame.
@@ -2374,6 +2394,7 @@ var Phaser;
if(this.looped) {
this._frameIndex = 0;
this.currentFrame = this._frameData.getFrame(this._frames[this._frameIndex]);
this._parent.events.onAnimationLoop.dispatch(this._parent, this);
} else {
this.onComplete();
}
@@ -2403,8 +2424,8 @@ var Phaser;
function () {
this.isPlaying = false;
this.isFinished = true;
// callback goes here
};
this._parent.events.onAnimationComplete.dispatch(this._parent, this);
};
return Animation;
})();
Phaser.Animation = Animation;
@@ -2657,7 +2678,7 @@ var Phaser;
*/
this.currentFrame = null;
this._parent = parent;
this._game = parent.game;
this.game = parent.game;
this._anims = {
};
}
@@ -2686,6 +2707,12 @@ var Phaser;
if(this._frameData == null) {
return;
}
// Create the signals the AnimationManager will emit
if(this._parent.events.onAnimationStart == null) {
this._parent.events.onAnimationStart = new Phaser.Signal();
this._parent.events.onAnimationComplete = new Phaser.Signal();
this._parent.events.onAnimationLoop = new Phaser.Signal();
}
if(frames == null) {
frames = this._frameData.getFrameIndexes();
} else {
@@ -2697,7 +2724,7 @@ var Phaser;
if(useNumericIndex == false) {
frames = this._frameData.getFrameIndexesByName(frames);
}
this._anims[name] = new Phaser.Animation(this._game, this._parent, this._frameData, name, frames, frameRate, loop);
this._anims[name] = new Phaser.Animation(this.game, this._parent, this._frameData, name, frames, frameRate, loop);
this.currentAnim = this._anims[name];
this.currentFrame = this.currentAnim.currentFrame;
return this._anims[name];
@@ -2733,11 +2760,11 @@ var Phaser;
if(this._anims[name]) {
if(this.currentAnim == this._anims[name]) {
if(this.currentAnim.isPlaying == false) {
this.currentAnim.play(frameRate, loop);
return this.currentAnim.play(frameRate, loop);
}
} else {
this.currentAnim = this._anims[name];
this.currentAnim.play(frameRate, loop);
return this.currentAnim.play(frameRate, loop);
}
}
};
@@ -2784,7 +2811,7 @@ var Phaser;
return this._frameIndex;
},
set: function (value) {
if(this._frameData.getFrame(value) !== null) {
if(this._frameData && this._frameData.getFrame(value) !== null) {
this.currentFrame = this._frameData.getFrame(value);
this._parent.texture.width = this.currentFrame.width;
this._parent.texture.height = this.currentFrame.height;
@@ -2803,7 +2830,7 @@ var Phaser;
return this.currentFrame.name;
},
set: function (value) {
if(this._frameData.getFrameByName(value) !== null) {
if(this._frameData.getFrameByName(value)) {
this.currentFrame = this._frameData.getFrameByName(value);
this._parent.texture.width = this.currentFrame.width;
this._parent.texture.height = this.currentFrame.height;
@@ -3372,9 +3399,14 @@ var Phaser;
* @default null
*/
this.boundsSprite = null;
/**
* If this object is set to consume the pointer event then it will stop all propogation from this object on.
* For example if you had a stack of 6 sprites with the same priority IDs and one consumed the event, none of the others would receive it.
* @type {Boolean}
*/
this.consumePointerEvent = false;
this.game = parent.game;
this.sprite = parent;
this._parent = parent;
this.enabled = false;
}
Input.prototype.pointerX = /**
@@ -3505,9 +3537,18 @@ var Phaser;
}
this.snapOffset = new Phaser.Point();
this.enabled = true;
this.game.input.addGameObject(this.sprite);
this.game.input.addGameObject(this._parent);
// Create the signals the Input component will emit
if(this._parent.events.onInputOver == null) {
this._parent.events.onInputOver = new Phaser.Signal();
this._parent.events.onInputOut = new Phaser.Signal();
this._parent.events.onInputDown = new Phaser.Signal();
this._parent.events.onInputUp = new Phaser.Signal();
this._parent.events.onDragStart = new Phaser.Signal();
this._parent.events.onDragStop = new Phaser.Signal();
}
}
return this.sprite;
return this._parent;
};
Input.prototype.reset = function () {
this.enabled = false;
@@ -3552,25 +3593,25 @@ var Phaser;
* Checks if the given pointer is over this Sprite. All checks are done in world coordinates.
*/
function (pointer) {
if(this.enabled == false || this.sprite.visible == false) {
if(this.enabled == false || this._parent.visible == false) {
return false;
} else {
return Phaser.SpriteUtils.overlapsXY(this.sprite, pointer.worldX(), pointer.worldY());
return Phaser.SpriteUtils.overlapsXY(this._parent, pointer.worldX(), pointer.worldY());
}
};
Input.prototype.update = /**
* Update
*/
function (pointer) {
if(this.enabled == false || this.sprite.visible == false) {
if(this.enabled == false || this._parent.visible == false) {
return false;
}
if(this.draggable && this._draggedPointerID == pointer.id) {
return this.updateDrag(pointer);
} else if(this._pointerData[pointer.id].isOver == true) {
if(Phaser.SpriteUtils.overlapsXY(this.sprite, pointer.worldX(), pointer.worldY())) {
this._pointerData[pointer.id].x = pointer.x - this.sprite.x;
this._pointerData[pointer.id].y = pointer.y - this.sprite.y;
if(Phaser.SpriteUtils.overlapsXY(this._parent, pointer.worldX(), pointer.worldY())) {
this._pointerData[pointer.id].x = pointer.x - this._parent.x;
this._pointerData[pointer.id].y = pointer.y - this._parent.y;
return true;
} else {
this._pointerOutHandler(pointer);
@@ -3584,12 +3625,12 @@ var Phaser;
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._parent.x;
this._pointerData[pointer.id].y = pointer.y - this._parent.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._parent.events.onInputOver.dispatch(this._parent, pointer);
}
};
Input.prototype._pointerOutHandler = function (pointer) {
@@ -3599,41 +3640,46 @@ var Phaser;
if(this.useHandCursor && this._pointerData[pointer.id].isDragged == false) {
this.game.stage.canvas.style.cursor = "default";
}
this.sprite.events.onInputOut.dispatch(this.sprite, pointer);
this._parent.events.onInputOut.dispatch(this._parent, pointer);
};
Input.prototype._touchedHandler = function (pointer) {
if(this._pointerData[pointer.id].isDown == false && this._pointerData[pointer.id].isOver == true) {
this._pointerData[pointer.id].isDown = true;
this._pointerData[pointer.id].isUp = false;
this._pointerData[pointer.id].timeDown = this.game.time.now;
this.sprite.events.onInputDown.dispatch(this.sprite, pointer);
this._parent.events.onInputDown.dispatch(this._parent, pointer);
// Start drag
//if (this.draggable && this.isDragged == false && pointer.targetObject == null)
if(this.draggable && this.isDragged == false) {
this.startDrag(pointer);
}
if(this.bringToTop) {
this.sprite.group.bringToTop(this.sprite);
this._parent.group.bringToTop(this._parent);
}
}
// Consume the event?
return this.consumePointerEvent;
};
Input.prototype._releasedHandler = function (pointer) {
// If was previously touched by this Pointer, check if still is
// If was previously touched by this Pointer, check if still is AND still over this item
if(this._pointerData[pointer.id].isDown && pointer.isUp) {
this._pointerData[pointer.id].isDown = false;
this._pointerData[pointer.id].isUp = true;
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);
// Only release the InputUp signal if the pointer is still over this sprite
if(Phaser.SpriteUtils.overlapsXY(this._parent, pointer.worldX(), pointer.worldY())) {
this._parent.events.onInputUp.dispatch(this._parent, pointer);
} else {
// Pointer outside the sprite? Reset the cursor
if(this.useHandCursor) {
this.game.stage.canvas.style.cursor = "default";
}
}
// Stop drag
if(this.draggable && this.isDragged && this._draggedPointerID == pointer.id) {
this.stopDrag(pointer);
}
if(this.useHandCursor) {
this.game.stage.canvas.style.cursor = "default";
}
}
};
Input.prototype.updateDrag = /**
@@ -3645,10 +3691,10 @@ var Phaser;
return false;
}
if(this.allowHorizontalDrag) {
this.sprite.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
this._parent.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
}
if(this.allowVerticalDrag) {
this.sprite.y = pointer.y + this._dragPoint.y + this.dragOffset.y;
this._parent.y = pointer.y + this._dragPoint.y + this.dragOffset.y;
}
if(this.boundsRect) {
this.checkBoundsRect();
@@ -3657,8 +3703,8 @@ var Phaser;
this.checkBoundsSprite();
}
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._parent.x = Math.floor(this._parent.x / this.snapX) * this.snapX;
this._parent.y = Math.floor(this._parent.y / this.snapY) * this.snapY;
}
return true;
};
@@ -3777,17 +3823,17 @@ var Phaser;
this._pointerData[pointer.id].isDragged = true;
if(this.dragFromCenter) {
// Move the sprite to the middle of the pointer
//this._dragPoint.setTo(-this.sprite.worldView.halfWidth, -this.sprite.worldView.halfHeight);
//this._dragPoint.setTo(this.sprite.transform.center.x, this.sprite.transform.center.y);
this._dragPoint.setTo(this.sprite.x - pointer.x, this.sprite.y - pointer.y);
//this._dragPoint.setTo(-this._parent.worldView.halfWidth, -this._parent.worldView.halfHeight);
//this._dragPoint.setTo(this._parent.transform.center.x, this._parent.transform.center.y);
this._dragPoint.setTo(this._parent.x - pointer.x, this._parent.y - pointer.y);
} else {
this._dragPoint.setTo(this.sprite.x - pointer.x, this.sprite.y - pointer.y);
this._dragPoint.setTo(this._parent.x - pointer.x, this._parent.y - pointer.y);
}
this.updateDrag(pointer);
if(this.bringToTop) {
this.sprite.group.bringToTop(this.sprite);
this._parent.group.bringToTop(this._parent);
}
this.sprite.events.onDragStart.dispatch(this.sprite, pointer);
this._parent.events.onDragStart.dispatch(this._parent, pointer);
};
Input.prototype.stopDrag = /**
* Called by Pointer when drag is stopped on this Sprite. Should not usually be called directly.
@@ -3797,10 +3843,11 @@ var Phaser;
this._draggedPointerID = -1;
this._pointerData[pointer.id].isDragged = false;
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._parent.x = Math.floor(this._parent.x / this.snapX) * this.snapX;
this._parent.y = Math.floor(this._parent.y / this.snapY) * this.snapY;
}
this.sprite.events.onDragStop.dispatch(this.sprite, pointer);
this._parent.events.onDragStop.dispatch(this._parent, pointer);
this._parent.events.onInputUp.dispatch(this._parent, pointer);
};
Input.prototype.setDragLock = /**
* Restricts this sprite to drag movement only on the given axis. Note: If both are set to false the sprite will never move!
@@ -3842,30 +3889,30 @@ var Phaser;
* Bounds Rect check for the sprite drag
*/
function () {
if(this.sprite.x < this.boundsRect.left) {
this.sprite.x = this.boundsRect.x;
} else if((this.sprite.x + this.sprite.width) > this.boundsRect.right) {
this.sprite.x = this.boundsRect.right - this.sprite.width;
if(this._parent.x < this.boundsRect.left) {
this._parent.x = this.boundsRect.x;
} else if((this._parent.x + this._parent.width) > this.boundsRect.right) {
this._parent.x = this.boundsRect.right - this._parent.width;
}
if(this.sprite.y < this.boundsRect.top) {
this.sprite.y = this.boundsRect.top;
} else if((this.sprite.y + this.sprite.height) > this.boundsRect.bottom) {
this.sprite.y = this.boundsRect.bottom - this.sprite.height;
if(this._parent.y < this.boundsRect.top) {
this._parent.y = this.boundsRect.top;
} else if((this._parent.y + this._parent.height) > this.boundsRect.bottom) {
this._parent.y = this.boundsRect.bottom - this._parent.height;
}
};
Input.prototype.checkBoundsSprite = /**
* Parent Sprite Bounds check for the sprite drag
*/
function () {
if(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)) {
this.sprite.x = (this.boundsSprite.x + this.boundsSprite.width) - this.sprite.width;
if(this._parent.x < this.boundsSprite.x) {
this._parent.x = this.boundsSprite.x;
} else if((this._parent.x + this._parent.width) > (this.boundsSprite.x + this.boundsSprite.width)) {
this._parent.x = (this.boundsSprite.x + this.boundsSprite.width) - this._parent.width;
}
if(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)) {
this.sprite.y = (this.boundsSprite.y + this.boundsSprite.height) - this.sprite.height;
if(this._parent.y < this.boundsSprite.y) {
this._parent.y = this.boundsSprite.y;
} else if((this._parent.y + this._parent.height) > (this.boundsSprite.y + this.boundsSprite.height)) {
this._parent.y = (this.boundsSprite.y + this.boundsSprite.height) - this._parent.height;
}
};
Input.prototype.renderDebugInfo = /**
@@ -3876,13 +3923,13 @@ var Phaser;
*/
function (x, y, color) {
if (typeof color === "undefined") { color = '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.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);
this._parent.texture.context.font = '14px Courier';
this._parent.texture.context.fillStyle = color;
this._parent.texture.context.fillText('Sprite Input: (' + this._parent.worldView.width + ' x ' + this._parent.worldView.height + ')', x, y);
this._parent.texture.context.fillText('x: ' + this.pointerX().toFixed(1) + ' y: ' + this.pointerY().toFixed(1), x, y + 14);
this._parent.texture.context.fillText('over: ' + this.pointerOver() + ' duration: ' + this.overDuration().toFixed(0), x, y + 28);
this._parent.texture.context.fillText('down: ' + this.pointerDown() + ' duration: ' + this.downDuration().toFixed(0), x, y + 42);
this._parent.texture.context.fillText('just over: ' + this.justOver() + ' just out: ' + this.justOut(), x, y + 56);
};
return Input;
})();
@@ -3904,23 +3951,16 @@ var Phaser;
(function (Sprite) {
var Events = (function () {
/**
* 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
* The Events component is a collection of events fired by the parent game object and its components.
* @param parent The game object using this Input component
*/
function Events(parent) {
this.game = parent.game;
this.sprite = parent;
this._parent = parent;
this.onAddedToGroup = new Phaser.Signal();
this.onRemovedFromGroup = new Phaser.Signal();
this.onKilled = new Phaser.Signal();
this.onRevived = new Phaser.Signal();
// Only create these if Sprite input is enabled?
this.onInputOver = new Phaser.Signal();
this.onInputOut = new Phaser.Signal();
this.onInputDown = new Phaser.Signal();
this.onInputUp = new Phaser.Signal();
this.onDragStart = new Phaser.Signal();
this.onDragStop = new Phaser.Signal();
}
return Events;
})();
@@ -7168,9 +7208,9 @@ var Phaser;
this.z = -1;
this.group = null;
this.name = '';
this.events = new Phaser.Components.Sprite.Events(this);
this.animations = new Phaser.Components.AnimationManager(this);
this.input = new Phaser.Components.Sprite.Input(this);
this.events = new Phaser.Components.Sprite.Events(this);
this.texture = new Phaser.Components.Texture(this);
this.transform = new Phaser.Components.Transform(this);
if(key !== null) {
@@ -7218,6 +7258,22 @@ var Phaser;
enumerable: true,
configurable: true
});
Object.defineProperty(Sprite.prototype, "alpha", {
get: /**
* The alpha of the Sprite between 0 and 1, a value of 1 being fully opaque.
*/
function () {
return this.texture.alpha;
},
set: /**
* The alpha of the Sprite between 0 and 1, a value of 1 being fully opaque.
*/
function (value) {
this.texture.alpha = value;
},
enumerable: true,
configurable: true
});
Object.defineProperty(Sprite.prototype, "frame", {
get: /**
* Get the animation frame number.
@@ -7658,7 +7714,7 @@ var Phaser;
*/
this.loaded = false;
/**
* Whether the Sprite background is opaque or not. If set to true the Sprite is filled with
* Whether the texture background is opaque or not. If set to true the object 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}
@@ -8957,8 +9013,9 @@ var Phaser;
* @param key {string} Unique asset key of this image file.
* @param url {string} URL of image file.
*/
function (key, url) {
if(this.checkKeyExists(key) === false) {
function (key, url, overwrite) {
if (typeof overwrite === "undefined") { overwrite = false; }
if(overwrite == true || this.checkKeyExists(key) == false) {
this._queueSize++;
this._fileList[key] = {
type: 'image',
@@ -9154,7 +9211,7 @@ var Phaser;
this._progressChunk = 100 / this._keys.length;
this.loadFile();
} else {
this.progress = 1;
this.progress = 100;
this.hasLoaded = true;
this._gameCreateComplete.call(this._game);
if(this._onComplete !== null) {
@@ -9580,6 +9637,18 @@ var Phaser;
}
return output;
};
Cache.prototype.removeCanvas = function (key) {
delete this._canvases[key];
};
Cache.prototype.removeImage = function (key) {
delete this._images[key];
};
Cache.prototype.removeSound = function (key) {
delete this._sounds[key];
};
Cache.prototype.removeText = function (key) {
delete this._text[key];
};
Cache.prototype.destroy = /**
* Clean up cache memory.
*/
@@ -10959,6 +11028,8 @@ var Phaser;
this.game = game;
this.ID = id;
this.z = id;
width = this.game.math.clamp(width, this.game.stage.width, 1);
height = this.game.math.clamp(height, this.game.stage.height, 1);
// 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 Phaser.Rectangle(0, 0, width, height);
@@ -12413,6 +12484,151 @@ var Phaser;
Phaser.Emitter = Emitter;
})(Phaser || (Phaser = {}));
/// <reference path="../Game.ts" />
/// <reference path="../math/Vec2.ts" />
/// <reference path="../geom/Rectangle.ts" />
/// <reference path="../components/animation/AnimationManager.ts" />
/// <reference path="../components/Texture.ts" />
/// <reference path="../components/Transform.ts" />
/// <reference path="../components/sprite/Input.ts" />
/// <reference path="../components/sprite/Events.ts" />
/**
* Phaser - Button
*/
var Phaser;
(function (Phaser) {
var Button = (function (_super) {
__extends(Button, _super);
/**
* Create a new <code>Button</code> object.
*
* @param game {Phaser.Game} Current game instance.
* @param [x] {number} the initial x position of the button.
* @param [y] {number} the initial y position of the button.
* @param [key] {string} Key of the graphic you want to load for this button.
*/
function Button(game, x, y, key, callback, callbackContext, overFrame, outFrame, downFrame) {
if (typeof x === "undefined") { x = 0; }
if (typeof y === "undefined") { y = 0; }
if (typeof key === "undefined") { key = null; }
if (typeof callback === "undefined") { callback = null; }
if (typeof callbackContext === "undefined") { callbackContext = null; }
if (typeof overFrame === "undefined") { overFrame = null; }
if (typeof outFrame === "undefined") { outFrame = null; }
if (typeof downFrame === "undefined") { downFrame = null; }
_super.call(this, game, x, y, key, outFrame);
this._onOverFrameName = null;
this._onOutFrameName = null;
this._onDownFrameName = null;
this._onUpFrameName = null;
this._onOverFrameID = null;
this._onOutFrameID = null;
this._onDownFrameID = null;
this._onUpFrameID = null;
this.type = Phaser.Types.BUTTON;
if(typeof overFrame == 'string') {
this._onOverFrameName = overFrame;
} else {
this._onOverFrameID = overFrame;
}
if(typeof outFrame == 'string') {
this._onOutFrameName = outFrame;
this._onUpFrameName = outFrame;
} else {
this._onOutFrameID = outFrame;
this._onUpFrameID = outFrame;
}
if(typeof downFrame == 'string') {
this._onDownFrameName = downFrame;
} else {
this._onDownFrameID = downFrame;
}
// These are the signals the game will subscribe to
this.onInputOver = new Phaser.Signal();
this.onInputOut = new Phaser.Signal();
this.onInputDown = new Phaser.Signal();
this.onInputUp = new Phaser.Signal();
// Set a default signal for them
if(callback) {
this.onInputUp.add(callback, callbackContext);
}
this.input.start(0, false, true);
// Redirect the input events to here so we can handle animation updates, etc
this.events.onInputOver.add(this.onInputOverHandler, this);
this.events.onInputOut.add(this.onInputOutHandler, this);
this.events.onInputDown.add(this.onInputDownHandler, this);
this.events.onInputUp.add(this.onInputUpHandler, this);
// By default we'll position it using screen space, not world space.
this.transform.scrollFactor.setTo(0, 0);
}
Button.prototype.onInputOverHandler = // TODO
//public tabIndex: number;
//public tabEnabled: bool;
// ENTER or SPACE can activate this button if it has focus
function (pointer) {
if(this._onOverFrameName != null) {
this.frameName = this._onOverFrameName;
} else if(this._onOverFrameID != null) {
this.frame = this._onOverFrameID;
}
if(this.onInputOver) {
this.onInputOver.dispatch(this, pointer);
}
};
Button.prototype.onInputOutHandler = function (pointer) {
if(this._onOutFrameName != null) {
this.frameName = this._onOutFrameName;
} else if(this._onOutFrameID != null) {
this.frame = this._onOutFrameID;
}
if(this.onInputOut) {
this.onInputOut.dispatch(this, pointer);
}
};
Button.prototype.onInputDownHandler = function (pointer) {
if(this._onDownFrameName != null) {
this.frameName = this._onDownFrameName;
} else if(this._onDownFrameID != null) {
this.frame = this._onDownFrameID;
}
if(this.onInputDown) {
this.onInputDown.dispatch(this, pointer);
}
};
Button.prototype.onInputUpHandler = function (pointer) {
if(this._onUpFrameName != null) {
this.frameName = this._onUpFrameName;
} else if(this._onUpFrameID != null) {
this.frame = this._onUpFrameID;
}
if(this.onInputUp) {
this.onInputUp.dispatch(this, pointer);
}
};
Object.defineProperty(Button.prototype, "priorityID", {
get: function () {
return this.input.priorityID;
},
set: function (value) {
this.input.priorityID = value;
},
enumerable: true,
configurable: true
});
Object.defineProperty(Button.prototype, "useHandCursor", {
get: function () {
return this.input.useHandCursor;
},
set: function (value) {
this.input.useHandCursor = value;
},
enumerable: true,
configurable: true
});
return Button;
})(Phaser.Sprite);
Phaser.Button = Button;
})(Phaser || (Phaser = {}));
/// <reference path="../Game.ts" />
/// <reference path="../geom/Rectangle.ts" />
/// <reference path="../math/Vec2.ts" />
/**
@@ -13247,6 +13463,8 @@ var Phaser;
};
Tilemap.prototype.postUpdate = function () {
};
Tilemap.prototype.destroy = function () {
};
Tilemap.prototype.parseCSV = /**
* Parset csv map data and generate tiles.
* @param data {string} CSV map data.
@@ -13497,6 +13715,7 @@ var Phaser;
/// <reference path="../gameobjects/Emitter.ts" />
/// <reference path="../gameobjects/Particle.ts" />
/// <reference path="../gameobjects/Sprite.ts" />
/// <reference path="../gameobjects/Button.ts" />
/// <reference path="../gameobjects/ScrollZone.ts" />
/// <reference path="../gameobjects/DynamicTexture.ts" />
/// <reference path="../gameobjects/Tilemap.ts" />
@@ -13528,7 +13747,7 @@ var Phaser;
function (x, y, width, height) {
return this._world.cameras.addCamera(x, y, width, height);
};
GameObjectFactory.prototype.sprite = /**
GameObjectFactory.prototype.button = /**
* Create a new GeomSprite with specific position.
*
* @param x {number} X position of the new geom sprite.
@@ -13539,6 +13758,30 @@ var Phaser;
// return <GeomSprite> this._world.group.add(new GeomSprite(this._game, x, y));
//}
/**
* Create a new Button game object.
*
* @param [x] {number} X position of the button.
* @param [y] {number} Y position of the button.
* @param [key] {string} The image key as defined in the Game.Cache to use as the texture for this button.
* @param [callback] {function} The function to call when this button is pressed
* @param [callbackContext] {object} The context in which the callback will be called (usually 'this')
* @param [overFrame] {string|number} This is the frame or frameName that will be set when this button is in an over state. Give either a number to use a frame ID or a string for a frame name.
* @param [outFrame] {string|number} This is the frame or frameName that will be set when this button is in an out state. Give either a number to use a frame ID or a string for a frame name.
* @param [downFrame] {string|number} This is the frame or frameName that will be set when this button is in a down state. Give either a number to use a frame ID or a string for a frame name.
* @returns {Button} The newly created button object.
*/
function (x, y, key, callback, callbackContext, overFrame, outFrame, downFrame) {
if (typeof x === "undefined") { x = 0; }
if (typeof y === "undefined") { y = 0; }
if (typeof key === "undefined") { key = null; }
if (typeof callback === "undefined") { callback = null; }
if (typeof callbackContext === "undefined") { callbackContext = null; }
if (typeof overFrame === "undefined") { overFrame = null; }
if (typeof outFrame === "undefined") { outFrame = null; }
if (typeof downFrame === "undefined") { downFrame = null; }
return this._world.group.add(new Phaser.Button(this._game, x, y, key, callback, callbackContext, overFrame, outFrame, downFrame));
};
GameObjectFactory.prototype.sprite = /**
* Create a new Sprite with specific position and sprite sheet key.
*
* @param x {number} X position of the new sprite.
@@ -16533,24 +16776,52 @@ var Phaser;
this.game.input.circle.x = this.game.input.x;
this.game.input.circle.y = this.game.input.y;
}
if(this.targetObject !== null) {
// Easy out if we're dragging something and it still exists
if(this.targetObject !== null && this.targetObject.input && this.targetObject.input.isDragged == true) {
if(this.targetObject.input.update(this) == false) {
this.targetObject = null;
}
} else {
// Build our temporary click stack
var _highestRenderID = -1;
var _highestRenderObject = -1;
for(var i = 0; i < this.game.input.totalTrackedObjects; i++) {
if(this.game.input.inputObjects[i] !== null && this.game.input.inputObjects[i].input.checkPointerOver(this) && this.game.input.inputObjects[i].renderOrderID > _highestRenderID) {
_highestRenderID = this.game.input.inputObjects[i].renderOrderID;
_highestRenderObject = i;
return this;
}
// Work out which object is on the top
this._highestRenderOrderID = -1;
this._highestRenderObject = -1;
this._highestInputPriorityID = -1;
for(var i = 0; i < this.game.input.totalTrackedObjects; i++) {
if(this.game.input.inputObjects[i] && this.game.input.inputObjects[i].input && this.game.input.inputObjects[i].input.checkPointerOver(this)) {
// If the object has a higher Input.PriorityID OR if the priority ID is the same as the current highest AND it has a higher renderOrderID, then set it to the top
if(this.game.input.inputObjects[i].input.priorityID > this._highestInputPriorityID || (this.game.input.inputObjects[i].input.priorityID == this._highestInputPriorityID && this.game.input.inputObjects[i].renderOrderID > this._highestRenderOrderID)) {
this._highestRenderOrderID = this.game.input.inputObjects[i].renderOrderID;
this._highestRenderObject = i;
this._highestInputPriorityID = this.game.input.inputObjects[i].input.priorityID;
}
}
if(_highestRenderObject !== -1) {
//console.log('setting target');
this.targetObject = this.game.input.inputObjects[_highestRenderObject];
}
if(this._highestRenderObject == -1) {
// The pointer isn't over anything, check if we've got a lingering previous target
if(this.targetObject !== null) {
this.targetObject.input._pointerOutHandler(this);
this.targetObject = null;
}
} else {
if(this.targetObject == null) {
// And now set the new one
this.targetObject = this.game.input.inputObjects[this._highestRenderObject];
this.targetObject.input._pointerOverHandler(this);
} else {
// We've got a target from the last update
if(this.targetObject == this.game.input.inputObjects[this._highestRenderObject]) {
// Same target as before, so update it
if(this.targetObject.input.update(this) == false) {
this.targetObject = null;
}
} else {
// The target has changed, so tell the old one we've left it
this.targetObject.input._pointerOutHandler(this);
// And now set the new one
this.targetObject = this.game.input.inputObjects[this._highestRenderObject];
this.targetObject.input._pointerOverHandler(this);
}
}
}
return this;
@@ -16601,7 +16872,7 @@ var Phaser;
this.game.input.currentPointers--;
}
for(var i = 0; i < this.game.input.totalTrackedObjects; i++) {
if(this.game.input.inputObjects[i] !== null && this.game.input.inputObjects[i].input.enabled) {
if(this.game.input.inputObjects[i] && this.game.input.inputObjects[i].input && this.game.input.inputObjects[i].input.enabled) {
this.game.input.inputObjects[i].input._releasedHandler(this);
}
}
@@ -16654,7 +16925,7 @@ var Phaser;
this._holdSent = false;
this._history.length = 0;
this._stateReset = true;
if(this.targetObject) {
if(this.targetObject && this.targetObject.input) {
this.targetObject.input._releasedHandler(this);
}
this.targetObject = null;
@@ -17675,7 +17946,6 @@ var Phaser;
**/
function (index) {
if(this.inputObjects[index]) {
console.log('object removed from the input manager', index);
this.inputObjects[index] = null;
}
};
@@ -17750,7 +18020,9 @@ var Phaser;
this.onTap = new Phaser.Signal();
this.onHold = new Phaser.Signal();
for(var i = 0; i < this.totalTrackedObjects; i++) {
this.inputObjects[i].input.reset();
if(this.inputObjects[i] && this.inputObjects[i].input) {
this.inputObjects[i].input.reset();
}
}
this.inputObjects.length = 0;
this.totalTrackedObjects = 0;
@@ -18103,7 +18375,7 @@ var Phaser;
this.renderTotal = this._count;
};
CanvasRenderer.prototype.renderGameObject = function (object) {
if(object.type == Phaser.Types.SPRITE) {
if(object.type == Phaser.Types.SPRITE || object.type == Phaser.Types.BUTTON) {
this.renderSprite(this._camera, object);
} else if(object.type == Phaser.Types.SCROLLZONE) {
this.renderScrollZone(this._camera, object);
@@ -18826,16 +19098,31 @@ var Phaser;
*/
this.onCreateCallback = null;
/**
* This will be called when update states.
* This will be called when State is updated, this doesn't happen during load (see onLoadUpdateCallback)
* @type {function}
*/
this.onUpdateCallback = null;
/**
* This will be called when render states.
* This will be called when the State is rendered, this doesn't happen during load (see onLoadRenderCallback)
* @type {function}
*/
this.onRenderCallback = null;
/**
* This will be called before the State is rendered and before the stage is cleared
* @type {function}
*/
this.onPreRenderCallback = null;
/**
* This will be called when the State is updated but only during the load process
* @type {function}
*/
this.onLoadUpdateCallback = null;
/**
* This will be called when the State is rendered but only during the load process
* @type {function}
*/
this.onLoadRenderCallback = null;
/**
* This will be called when states paused.
* @type {function}
*/
@@ -18978,11 +19265,18 @@ var Phaser;
this.world.update();
if(this._loadComplete && this.onUpdateCallback) {
this.onUpdateCallback.call(this.callbackContext);
} else if(this._loadComplete == false && this.onLoadUpdateCallback) {
this.onLoadUpdateCallback.call(this.callbackContext);
}
this.world.postUpdate();
if(this._loadComplete && this.onPreRenderCallback) {
this.onPreRenderCallback.call(this.callbackContext);
}
this.renderer.render();
if(this._loadComplete && this.onRenderCallback) {
this.onRenderCallback.call(this.callbackContext);
} else if(this._loadComplete == false && this.onLoadRenderCallback) {
this.onLoadRenderCallback.call(this.callbackContext);
}
};
Game.prototype.startState = /**
@@ -19008,7 +19302,7 @@ var Phaser;
}
};
Game.prototype.setCallbacks = /**
* Set all state callbacks (init, create, update, render).
* Set the most common state callbacks (init, create, update, render).
* @param initCallback {function} Init callback invoked when init state.
* @param createCallback {function} Create callback invoked when create state.
* @param updateCallback {function} Update callback invoked when update state.
@@ -19053,21 +19347,33 @@ var Phaser;
if(this.state['create'] || this.state['update']) {
this.callbackContext = this.state;
this.onInitCallback = null;
this.onLoadRenderCallback = null;
this.onLoadUpdateCallback = null;
this.onCreateCallback = null;
this.onUpdateCallback = null;
this.onRenderCallback = null;
this.onPreRenderCallback = null;
this.onPausedCallback = null;
this.onDestroyCallback = null;
// Bingo, let's set them up
if(this.state['init']) {
this.onInitCallback = this.state['init'];
}
if(this.state['loadRender']) {
this.onLoadRenderCallback = this.state['loadRender'];
}
if(this.state['loadUpdate']) {
this.onLoadUpdateCallback = this.state['loadUpdate'];
}
if(this.state['create']) {
this.onCreateCallback = this.state['create'];
}
if(this.state['update']) {
this.onUpdateCallback = this.state['update'];
}
if(this.state['preRender']) {
this.onPreRenderCallback = this.state['preRender'];
}
if(this.state['render']) {
this.onRenderCallback = this.state['render'];
}
@@ -19095,6 +19401,8 @@ var Phaser;
function () {
this.callbackContext = null;
this.onInitCallback = null;
this.onLoadRenderCallback = null;
this.onLoadUpdateCallback = null;
this.onCreateCallback = null;
this.onUpdateCallback = null;
this.onRenderCallback = null;
Tests/sprites/alpha.js
+15
View File
@@ -0,0 +1,15 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, init, create);
function init() {
// Using Phasers asset loader we load up a PNG from the assets folder
game.load.image('bunny', 'assets/sprites/bunny.png');
game.load.start();
}
var bunny;
function create() {
// Here we'll assign the new sprite to the local smallBunny variable
bunny = game.add.sprite(0, 0, 'bunny');
bunny.alpha = 0.5;
}
})();
Tests/sprites/alpha.ts
+25
View File
@@ -0,0 +1,25 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, init, create);
function init() {
// Using Phasers asset loader we load up a PNG from the assets folder
game.load.image('bunny', 'assets/sprites/bunny.png');
game.load.start();
}
function create() {
// Here we'll assign the new sprite to the local bunny variable
var bunny = game.add.sprite(0, 0, 'bunny');
// And this sets the alpha of the sprite to 0.5, which is 50% opaque
bunny.alpha = 0.5;
}
})();
Tests/sprites/create sprite 1.js
-1
View File
@@ -10,6 +10,5 @@
// 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.camera.texture.alpha = 0.5;
}
})();
Tests/sprites/create sprite 1.ts
-2
View File
@@ -18,8 +18,6 @@
// Try changing the 0, 0 values
game.add.sprite(0, 0, 'bunny');
game.camera.texture.alpha = 0.5;
}
})();
build/phaser.d.ts
Vendored
+146 -23
View File
@@ -268,6 +268,18 @@ module Phaser {
*/
visible: bool;
/**
* The animation manager component
*/
animations: Components.AnimationManager;
/**
* Associated events
*/
events;
/**
* The input component
*/
input;
/**
* The texture used to render.
*/
texture: Components.Texture;
@@ -834,6 +846,7 @@ module Phaser {
static EMITTER: number;
static TILEMAP: number;
static SCROLLZONE: number;
static BUTTON: number;
static GEOM_POINT: number;
static GEOM_CIRCLE: number;
static GEOM_Rectangle: number;
@@ -1324,6 +1337,13 @@ module Phaser {
*/
public context: CanvasRenderingContext2D;
/**
* 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;
/**
* Get a color of a specific pixel.
* @param x {number} X position of the pixel in this texture.
* @param y {number} Y position of the pixel in this texture.
@@ -1384,7 +1404,7 @@ module Phaser {
* Given an array of Sprites it will update each of them so that their canvas/contexts reference this DynamicTexture
* @param objects {Array} An array of GameObjects, or objects that inherit from it such as Sprites
*/
public assignCanvasToGameObjects(objects: IGameObject[]): void;
public assignCanvasToGameObjects(objects): void;
/**
* Clear the whole canvas.
*/
@@ -1515,7 +1535,7 @@ module Phaser {
* @param frameRate {number} FrameRate you want to specify instead of using default.
* @param loop {boolean} Whether or not the animation is looped or just plays once.
*/
public play(frameRate?: number, loop?: bool): void;
public play(frameRate?: number, loop?: bool): Animation;
/**
* Play this animation from the first frame.
*/
@@ -1738,11 +1758,11 @@ module Phaser.Components {
*/
constructor(parent: Sprite);
/**
* Local private reference to game.
* Reference to Phaser.Game
*/
private _game;
public game: Game;
/**
* Local private reference to its owner sprite.
* Local private reference to its parent game object.
*/
private _parent;
/**
@@ -1802,7 +1822,7 @@ module Phaser.Components {
* @param frameRate {number} FrameRate you want to specify instead of using default.
* @param loop {boolean} Whether or not the animation is looped or just plays once.
*/
public play(name: string, frameRate?: number, loop?: bool): void;
public play(name: string, frameRate?: number, loop?: bool): Animation;
/**
* Stop animation by name.
* Current animation will be automatically set to the stopped one.
@@ -2044,9 +2064,9 @@ module Phaser.Components.Sprite {
*/
public game: Game;
/**
* Reference to the Image stored in the Game.Cache that is used as the texture for the Sprite.
* Local private reference to its parent game object.
*/
private sprite;
private _parent;
private _pointerData;
/**
* If enabled the Input component will be updated by the parent Sprite
@@ -2104,6 +2124,12 @@ module Phaser.Components.Sprite {
*/
public useHandCursor: bool;
/**
* If this object is set to consume the pointer event then it will stop all propogation from this object on.
* For example if you had a stack of 6 sprites with the same priority IDs and one consumed the event, none of the others would receive it.
* @type {Boolean}
*/
public consumePointerEvent: bool;
/**
* The x coordinate of the Input pointer, relative to the top-left of the parent Sprite.
* This value is only set when the pointer is over this Sprite.
* @type {number}
@@ -2185,7 +2211,6 @@ module Phaser.Components.Sprite {
public update(pointer: Pointer): bool;
public _pointerOverHandler(pointer: Pointer): void;
public _pointerOutHandler(pointer: Pointer): void;
public consumePointerEvent: bool;
public _touchedHandler(pointer: Pointer): bool;
public _releasedHandler(pointer: Pointer): void;
/**
@@ -2295,8 +2320,8 @@ module Phaser.Components.Sprite {
module Phaser.Components.Sprite {
class Events {
/**
* 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
* The Events component is a collection of events fired by the parent game object and its components.
* @param parent The game object using this Input component
*/
constructor(parent: Sprite);
/**
@@ -2304,9 +2329,9 @@ module Phaser.Components.Sprite {
*/
public game: Game;
/**
* Reference to the Image stored in the Game.Cache that is used as the texture for the Sprite.
* Local private reference to its parent game object.
*/
private sprite;
private _parent;
/**
* Dispatched by the Group this Sprite is added to.
*/
@@ -2347,6 +2372,18 @@ module Phaser.Components.Sprite {
* Dispatched by the Input component when the Sprite stops being dragged
*/
public onDragStop: Signal;
/**
* Dispatched by the Animation component when the Sprite starts being animated
*/
public onAnimationStart: Signal;
/**
* Dispatched by the Animation component when the Sprite animation completes
*/
public onAnimationComplete: Signal;
/**
* Dispatched by the Animation component when the Sprite animation loops
*/
public onAnimationLoop: Signal;
public onOutOfBounds: Signal;
}
}
@@ -3283,15 +3320,18 @@ module Phaser {
*/
public scale: Vec2;
/**
* The alpha of the Sprite between 0 and 1, a value of 1 being fully opaque.
*/
public alpha: number;
/**
* The origin of the Sprite around which rotation and positioning takes place.
* This is a reference to Sprite.transform.origin
*/
public origin: Vec2;
/**
* The alpha of the Sprite between 0 and 1, a value of 1 being fully opaque.
*/
/**
* The alpha of the Sprite between 0 and 1, a value of 1 being fully opaque.
*/
public alpha : number;
/**
* Get the animation frame number.
*/
/**
@@ -3464,7 +3504,7 @@ module Phaser.Components {
*/
public cameraBlacklist: number[];
/**
* Whether the Sprite background is opaque or not. If set to true the Sprite is filled with
* Whether the texture background is opaque or not. If set to true the object 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}
@@ -4191,7 +4231,7 @@ module Phaser {
*/
public hasLoaded: bool;
/**
* Loading progress (from 0 to 1)
* Loading progress (from 0 to 100)
* @type {number}
*/
public progress: number;
@@ -4216,7 +4256,7 @@ module Phaser {
* @param key {string} Unique asset key of this image file.
* @param url {string} URL of image file.
*/
public image(key: string, url: string): void;
public image(key: string, url: string, overwrite?: bool): void;
/**
* Add a new sprite sheet loading request.
* @param key {string} Unique asset key of the sheet file.
@@ -4447,6 +4487,10 @@ module Phaser {
* @return {Array} The string based keys in the Cache.
*/
public getTextKeys(): any[];
public removeCanvas(key: string): void;
public removeImage(key: string): void;
public removeSound(key: string): void;
public removeText(key: string): void;
/**
* Clean up cache memory.
*/
@@ -5946,6 +5990,52 @@ module Phaser {
}
}
/**
* Phaser - Button
*/
module Phaser {
class Button extends Sprite {
/**
* Create a new <code>Button</code> object.
*
* @param game {Phaser.Game} Current game instance.
* @param [x] {number} the initial x position of the button.
* @param [y] {number} the initial y position of the button.
* @param [key] {string} Key of the graphic you want to load for this button.
*/
constructor(game: Game, x?: number, y?: number, key?: string, callback?, callbackContext?, overFrame?, outFrame?, downFrame?);
private _onOverFrameName;
private _onOutFrameName;
private _onDownFrameName;
private _onUpFrameName;
private _onOverFrameID;
private _onOutFrameID;
private _onDownFrameID;
private _onUpFrameID;
/**
* Dispatched when a pointer moves over an Input enabled sprite.
*/
public onInputOver: Signal;
/**
* Dispatched when a pointer moves out of an Input enabled sprite.
*/
public onInputOut: Signal;
/**
* Dispatched when a pointer is pressed down on an Input enabled sprite.
*/
public onInputDown: Signal;
/**
* Dispatched when a pointer is released over an Input enabled sprite
*/
public onInputUp: Signal;
private onInputOverHandler(pointer);
private onInputOutHandler(pointer);
private onInputDownHandler(pointer);
private onInputUpHandler(pointer);
public priorityID : number;
public useHandCursor : bool;
}
}
/**
* Phaser - ScrollRegion
*
* Creates a scrolling region within a ScrollZone.
@@ -6530,6 +6620,7 @@ module Phaser {
public preUpdate(): void;
public update(): void;
public postUpdate(): void;
public destroy(): void;
/**
* Parset csv map data and generate tiles.
* @param data {string} CSV map data.
@@ -6665,6 +6756,20 @@ module Phaser {
*/
public camera(x: number, y: number, width: number, height: number): Camera;
/**
* Create a new Button game object.
*
* @param [x] {number} X position of the button.
* @param [y] {number} Y position of the button.
* @param [key] {string} The image key as defined in the Game.Cache to use as the texture for this button.
* @param [callback] {function} The function to call when this button is pressed
* @param [callbackContext] {object} The context in which the callback will be called (usually 'this')
* @param [overFrame] {string|number} This is the frame or frameName that will be set when this button is in an over state. Give either a number to use a frame ID or a string for a frame name.
* @param [outFrame] {string|number} This is the frame or frameName that will be set when this button is in an out state. Give either a number to use a frame ID or a string for a frame name.
* @param [downFrame] {string|number} This is the frame or frameName that will be set when this button is in a down state. Give either a number to use a frame ID or a string for a frame name.
* @returns {Button} The newly created button object.
*/
public button(x?: number, y?: number, key?: string, callback?, callbackContext?, overFrame?, outFrame?, downFrame?): Button;
/**
* Create a new Sprite with specific position and sprite sheet key.
*
* @param x {number} X position of the new sprite.
@@ -8469,6 +8574,9 @@ module Phaser {
*/
public start(event): Pointer;
public update(): void;
private _highestRenderOrderID;
private _highestRenderObject;
private _highestInputPriorityID;
/**
* Called when the Pointer is moved on the touchscreen
* @method move
@@ -9524,16 +9632,31 @@ module Phaser {
*/
public onCreateCallback;
/**
* This will be called when update states.
* This will be called when State is updated, this doesn't happen during load (see onLoadUpdateCallback)
* @type {function}
*/
public onUpdateCallback;
/**
* This will be called when render states.
* This will be called when the State is rendered, this doesn't happen during load (see onLoadRenderCallback)
* @type {function}
*/
public onRenderCallback;
/**
* This will be called before the State is rendered and before the stage is cleared
* @type {function}
*/
public onPreRenderCallback;
/**
* This will be called when the State is updated but only during the load process
* @type {function}
*/
public onLoadUpdateCallback;
/**
* This will be called when the State is rendered but only during the load process
* @type {function}
*/
public onLoadRenderCallback;
/**
* This will be called when states paused.
* @type {function}
*/
@@ -9657,7 +9780,7 @@ module Phaser {
*/
private startState();
/**
* Set all state callbacks (init, create, update, render).
* Set the most common state callbacks (init, create, update, render).
* @param initCallback {function} Init callback invoked when init state.
* @param createCallback {function} Create callback invoked when create state.
* @param updateCallback {function} Update callback invoked when update state.
build/phaser.js
+410 -102
View File
@@ -1274,6 +1274,7 @@ var Phaser;
Types.EMITTER = 4;
Types.TILEMAP = 5;
Types.SCROLLZONE = 6;
Types.BUTTON = 7;
Types.GEOM_POINT = 0;
Types.GEOM_CIRCLE = 1;
Types.GEOM_Rectangle = 2;
@@ -1987,6 +1988,13 @@ var Phaser;
this._dy = 0;
this._dw = 0;
this._dh = 0;
/**
* 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.
*/
this.globalCompositeOperation = null;
this.game = game;
this.type = Phaser.Types.GEOMSPRITE;
this.canvas = document.createElement('canvas');
@@ -2133,8 +2141,10 @@ var Phaser;
*/
function (objects) {
for(var i = 0; i < objects.length; i++) {
objects[i].texture.canvas = this.canvas;
objects[i].texture.context = this.context;
if(objects[i].texture) {
objects[i].texture.canvas = this.canvas;
objects[i].texture.context = this.context;
}
}
};
DynamicTexture.prototype.clear = /**
@@ -2152,7 +2162,14 @@ var Phaser;
function (x, y) {
if (typeof x === "undefined") { x = 0; }
if (typeof y === "undefined") { y = 0; }
if(this.globalCompositeOperation) {
this.game.stage.context.save();
this.game.stage.context.globalCompositeOperation = this.globalCompositeOperation;
}
this.game.stage.context.drawImage(this.canvas, x, y);
if(this.globalCompositeOperation) {
this.game.stage.context.restore();
}
};
Object.defineProperty(DynamicTexture.prototype, "width", {
get: function () {
@@ -2206,6 +2223,7 @@ var Phaser;
}
// Zero or smaller than frame sizes?
if(width == 0 || height == 0 || width < frameWidth || height < frameHeight || total === 0) {
throw new Error("AnimationLoader.parseSpriteSheet: width/height zero or width/height < given frameWidth/frameHeight");
return null;
}
// Let's create some frames then
@@ -2345,6 +2363,8 @@ var Phaser;
this._timeNextFrame = this._game.time.now + this.delay;
this._frameIndex = 0;
this.currentFrame = this._frameData.getFrame(this._frames[this._frameIndex]);
this._parent.events.onAnimationStart.dispatch(this._parent, this);
return this;
};
Animation.prototype.restart = /**
* Play this animation from the first frame.
@@ -2374,6 +2394,7 @@ var Phaser;
if(this.looped) {
this._frameIndex = 0;
this.currentFrame = this._frameData.getFrame(this._frames[this._frameIndex]);
this._parent.events.onAnimationLoop.dispatch(this._parent, this);
} else {
this.onComplete();
}
@@ -2403,8 +2424,8 @@ var Phaser;
function () {
this.isPlaying = false;
this.isFinished = true;
// callback goes here
};
this._parent.events.onAnimationComplete.dispatch(this._parent, this);
};
return Animation;
})();
Phaser.Animation = Animation;
@@ -2657,7 +2678,7 @@ var Phaser;
*/
this.currentFrame = null;
this._parent = parent;
this._game = parent.game;
this.game = parent.game;
this._anims = {
};
}
@@ -2686,6 +2707,12 @@ var Phaser;
if(this._frameData == null) {
return;
}
// Create the signals the AnimationManager will emit
if(this._parent.events.onAnimationStart == null) {
this._parent.events.onAnimationStart = new Phaser.Signal();
this._parent.events.onAnimationComplete = new Phaser.Signal();
this._parent.events.onAnimationLoop = new Phaser.Signal();
}
if(frames == null) {
frames = this._frameData.getFrameIndexes();
} else {
@@ -2697,7 +2724,7 @@ var Phaser;
if(useNumericIndex == false) {
frames = this._frameData.getFrameIndexesByName(frames);
}
this._anims[name] = new Phaser.Animation(this._game, this._parent, this._frameData, name, frames, frameRate, loop);
this._anims[name] = new Phaser.Animation(this.game, this._parent, this._frameData, name, frames, frameRate, loop);
this.currentAnim = this._anims[name];
this.currentFrame = this.currentAnim.currentFrame;
return this._anims[name];
@@ -2733,11 +2760,11 @@ var Phaser;
if(this._anims[name]) {
if(this.currentAnim == this._anims[name]) {
if(this.currentAnim.isPlaying == false) {
this.currentAnim.play(frameRate, loop);
return this.currentAnim.play(frameRate, loop);
}
} else {
this.currentAnim = this._anims[name];
this.currentAnim.play(frameRate, loop);
return this.currentAnim.play(frameRate, loop);
}
}
};
@@ -2784,7 +2811,7 @@ var Phaser;
return this._frameIndex;
},
set: function (value) {
if(this._frameData.getFrame(value) !== null) {
if(this._frameData && this._frameData.getFrame(value) !== null) {
this.currentFrame = this._frameData.getFrame(value);
this._parent.texture.width = this.currentFrame.width;
this._parent.texture.height = this.currentFrame.height;
@@ -2803,7 +2830,7 @@ var Phaser;
return this.currentFrame.name;
},
set: function (value) {
if(this._frameData.getFrameByName(value) !== null) {
if(this._frameData.getFrameByName(value)) {
this.currentFrame = this._frameData.getFrameByName(value);
this._parent.texture.width = this.currentFrame.width;
this._parent.texture.height = this.currentFrame.height;
@@ -3372,9 +3399,14 @@ var Phaser;
* @default null
*/
this.boundsSprite = null;
/**
* If this object is set to consume the pointer event then it will stop all propogation from this object on.
* For example if you had a stack of 6 sprites with the same priority IDs and one consumed the event, none of the others would receive it.
* @type {Boolean}
*/
this.consumePointerEvent = false;
this.game = parent.game;
this.sprite = parent;
this._parent = parent;
this.enabled = false;
}
Input.prototype.pointerX = /**
@@ -3505,9 +3537,18 @@ var Phaser;
}
this.snapOffset = new Phaser.Point();
this.enabled = true;
this.game.input.addGameObject(this.sprite);
this.game.input.addGameObject(this._parent);
// Create the signals the Input component will emit
if(this._parent.events.onInputOver == null) {
this._parent.events.onInputOver = new Phaser.Signal();
this._parent.events.onInputOut = new Phaser.Signal();
this._parent.events.onInputDown = new Phaser.Signal();
this._parent.events.onInputUp = new Phaser.Signal();
this._parent.events.onDragStart = new Phaser.Signal();
this._parent.events.onDragStop = new Phaser.Signal();
}
}
return this.sprite;
return this._parent;
};
Input.prototype.reset = function () {
this.enabled = false;
@@ -3552,25 +3593,25 @@ var Phaser;
* Checks if the given pointer is over this Sprite. All checks are done in world coordinates.
*/
function (pointer) {
if(this.enabled == false || this.sprite.visible == false) {
if(this.enabled == false || this._parent.visible == false) {
return false;
} else {
return Phaser.SpriteUtils.overlapsXY(this.sprite, pointer.worldX(), pointer.worldY());
return Phaser.SpriteUtils.overlapsXY(this._parent, pointer.worldX(), pointer.worldY());
}
};
Input.prototype.update = /**
* Update
*/
function (pointer) {
if(this.enabled == false || this.sprite.visible == false) {
if(this.enabled == false || this._parent.visible == false) {
return false;
}
if(this.draggable && this._draggedPointerID == pointer.id) {
return this.updateDrag(pointer);
} else if(this._pointerData[pointer.id].isOver == true) {
if(Phaser.SpriteUtils.overlapsXY(this.sprite, pointer.worldX(), pointer.worldY())) {
this._pointerData[pointer.id].x = pointer.x - this.sprite.x;
this._pointerData[pointer.id].y = pointer.y - this.sprite.y;
if(Phaser.SpriteUtils.overlapsXY(this._parent, pointer.worldX(), pointer.worldY())) {
this._pointerData[pointer.id].x = pointer.x - this._parent.x;
this._pointerData[pointer.id].y = pointer.y - this._parent.y;
return true;
} else {
this._pointerOutHandler(pointer);
@@ -3584,12 +3625,12 @@ var Phaser;
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._parent.x;
this._pointerData[pointer.id].y = pointer.y - this._parent.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._parent.events.onInputOver.dispatch(this._parent, pointer);
}
};
Input.prototype._pointerOutHandler = function (pointer) {
@@ -3599,41 +3640,46 @@ var Phaser;
if(this.useHandCursor && this._pointerData[pointer.id].isDragged == false) {
this.game.stage.canvas.style.cursor = "default";
}
this.sprite.events.onInputOut.dispatch(this.sprite, pointer);
this._parent.events.onInputOut.dispatch(this._parent, pointer);
};
Input.prototype._touchedHandler = function (pointer) {
if(this._pointerData[pointer.id].isDown == false && this._pointerData[pointer.id].isOver == true) {
this._pointerData[pointer.id].isDown = true;
this._pointerData[pointer.id].isUp = false;
this._pointerData[pointer.id].timeDown = this.game.time.now;
this.sprite.events.onInputDown.dispatch(this.sprite, pointer);
this._parent.events.onInputDown.dispatch(this._parent, pointer);
// Start drag
//if (this.draggable && this.isDragged == false && pointer.targetObject == null)
if(this.draggable && this.isDragged == false) {
this.startDrag(pointer);
}
if(this.bringToTop) {
this.sprite.group.bringToTop(this.sprite);
this._parent.group.bringToTop(this._parent);
}
}
// Consume the event?
return this.consumePointerEvent;
};
Input.prototype._releasedHandler = function (pointer) {
// If was previously touched by this Pointer, check if still is
// If was previously touched by this Pointer, check if still is AND still over this item
if(this._pointerData[pointer.id].isDown && pointer.isUp) {
this._pointerData[pointer.id].isDown = false;
this._pointerData[pointer.id].isUp = true;
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);
// Only release the InputUp signal if the pointer is still over this sprite
if(Phaser.SpriteUtils.overlapsXY(this._parent, pointer.worldX(), pointer.worldY())) {
this._parent.events.onInputUp.dispatch(this._parent, pointer);
} else {
// Pointer outside the sprite? Reset the cursor
if(this.useHandCursor) {
this.game.stage.canvas.style.cursor = "default";
}
}
// Stop drag
if(this.draggable && this.isDragged && this._draggedPointerID == pointer.id) {
this.stopDrag(pointer);
}
if(this.useHandCursor) {
this.game.stage.canvas.style.cursor = "default";
}
}
};
Input.prototype.updateDrag = /**
@@ -3645,10 +3691,10 @@ var Phaser;
return false;
}
if(this.allowHorizontalDrag) {
this.sprite.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
this._parent.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
}
if(this.allowVerticalDrag) {
this.sprite.y = pointer.y + this._dragPoint.y + this.dragOffset.y;
this._parent.y = pointer.y + this._dragPoint.y + this.dragOffset.y;
}
if(this.boundsRect) {
this.checkBoundsRect();
@@ -3657,8 +3703,8 @@ var Phaser;
this.checkBoundsSprite();
}
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._parent.x = Math.floor(this._parent.x / this.snapX) * this.snapX;
this._parent.y = Math.floor(this._parent.y / this.snapY) * this.snapY;
}
return true;
};
@@ -3777,17 +3823,17 @@ var Phaser;
this._pointerData[pointer.id].isDragged = true;
if(this.dragFromCenter) {
// Move the sprite to the middle of the pointer
//this._dragPoint.setTo(-this.sprite.worldView.halfWidth, -this.sprite.worldView.halfHeight);
//this._dragPoint.setTo(this.sprite.transform.center.x, this.sprite.transform.center.y);
this._dragPoint.setTo(this.sprite.x - pointer.x, this.sprite.y - pointer.y);
//this._dragPoint.setTo(-this._parent.worldView.halfWidth, -this._parent.worldView.halfHeight);
//this._dragPoint.setTo(this._parent.transform.center.x, this._parent.transform.center.y);
this._dragPoint.setTo(this._parent.x - pointer.x, this._parent.y - pointer.y);
} else {
this._dragPoint.setTo(this.sprite.x - pointer.x, this.sprite.y - pointer.y);
this._dragPoint.setTo(this._parent.x - pointer.x, this._parent.y - pointer.y);
}
this.updateDrag(pointer);
if(this.bringToTop) {
this.sprite.group.bringToTop(this.sprite);
this._parent.group.bringToTop(this._parent);
}
this.sprite.events.onDragStart.dispatch(this.sprite, pointer);
this._parent.events.onDragStart.dispatch(this._parent, pointer);
};
Input.prototype.stopDrag = /**
* Called by Pointer when drag is stopped on this Sprite. Should not usually be called directly.
@@ -3797,10 +3843,11 @@ var Phaser;
this._draggedPointerID = -1;
this._pointerData[pointer.id].isDragged = false;
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._parent.x = Math.floor(this._parent.x / this.snapX) * this.snapX;
this._parent.y = Math.floor(this._parent.y / this.snapY) * this.snapY;
}
this.sprite.events.onDragStop.dispatch(this.sprite, pointer);
this._parent.events.onDragStop.dispatch(this._parent, pointer);
this._parent.events.onInputUp.dispatch(this._parent, pointer);
};
Input.prototype.setDragLock = /**
* Restricts this sprite to drag movement only on the given axis. Note: If both are set to false the sprite will never move!
@@ -3842,30 +3889,30 @@ var Phaser;
* Bounds Rect check for the sprite drag
*/
function () {
if(this.sprite.x < this.boundsRect.left) {
this.sprite.x = this.boundsRect.x;
} else if((this.sprite.x + this.sprite.width) > this.boundsRect.right) {
this.sprite.x = this.boundsRect.right - this.sprite.width;
if(this._parent.x < this.boundsRect.left) {
this._parent.x = this.boundsRect.x;
} else if((this._parent.x + this._parent.width) > this.boundsRect.right) {
this._parent.x = this.boundsRect.right - this._parent.width;
}
if(this.sprite.y < this.boundsRect.top) {
this.sprite.y = this.boundsRect.top;
} else if((this.sprite.y + this.sprite.height) > this.boundsRect.bottom) {
this.sprite.y = this.boundsRect.bottom - this.sprite.height;
if(this._parent.y < this.boundsRect.top) {
this._parent.y = this.boundsRect.top;
} else if((this._parent.y + this._parent.height) > this.boundsRect.bottom) {
this._parent.y = this.boundsRect.bottom - this._parent.height;
}
};
Input.prototype.checkBoundsSprite = /**
* Parent Sprite Bounds check for the sprite drag
*/
function () {
if(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)) {
this.sprite.x = (this.boundsSprite.x + this.boundsSprite.width) - this.sprite.width;
if(this._parent.x < this.boundsSprite.x) {
this._parent.x = this.boundsSprite.x;
} else if((this._parent.x + this._parent.width) > (this.boundsSprite.x + this.boundsSprite.width)) {
this._parent.x = (this.boundsSprite.x + this.boundsSprite.width) - this._parent.width;
}
if(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)) {
this.sprite.y = (this.boundsSprite.y + this.boundsSprite.height) - this.sprite.height;
if(this._parent.y < this.boundsSprite.y) {
this._parent.y = this.boundsSprite.y;
} else if((this._parent.y + this._parent.height) > (this.boundsSprite.y + this.boundsSprite.height)) {
this._parent.y = (this.boundsSprite.y + this.boundsSprite.height) - this._parent.height;
}
};
Input.prototype.renderDebugInfo = /**
@@ -3876,13 +3923,13 @@ var Phaser;
*/
function (x, y, color) {
if (typeof color === "undefined") { color = '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.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);
this._parent.texture.context.font = '14px Courier';
this._parent.texture.context.fillStyle = color;
this._parent.texture.context.fillText('Sprite Input: (' + this._parent.worldView.width + ' x ' + this._parent.worldView.height + ')', x, y);
this._parent.texture.context.fillText('x: ' + this.pointerX().toFixed(1) + ' y: ' + this.pointerY().toFixed(1), x, y + 14);
this._parent.texture.context.fillText('over: ' + this.pointerOver() + ' duration: ' + this.overDuration().toFixed(0), x, y + 28);
this._parent.texture.context.fillText('down: ' + this.pointerDown() + ' duration: ' + this.downDuration().toFixed(0), x, y + 42);
this._parent.texture.context.fillText('just over: ' + this.justOver() + ' just out: ' + this.justOut(), x, y + 56);
};
return Input;
})();
@@ -3904,23 +3951,16 @@ var Phaser;
(function (Sprite) {
var Events = (function () {
/**
* 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
* The Events component is a collection of events fired by the parent game object and its components.
* @param parent The game object using this Input component
*/
function Events(parent) {
this.game = parent.game;
this.sprite = parent;
this._parent = parent;
this.onAddedToGroup = new Phaser.Signal();
this.onRemovedFromGroup = new Phaser.Signal();
this.onKilled = new Phaser.Signal();
this.onRevived = new Phaser.Signal();
// Only create these if Sprite input is enabled?
this.onInputOver = new Phaser.Signal();
this.onInputOut = new Phaser.Signal();
this.onInputDown = new Phaser.Signal();
this.onInputUp = new Phaser.Signal();
this.onDragStart = new Phaser.Signal();
this.onDragStop = new Phaser.Signal();
}
return Events;
})();
@@ -7168,9 +7208,9 @@ var Phaser;
this.z = -1;
this.group = null;
this.name = '';
this.events = new Phaser.Components.Sprite.Events(this);
this.animations = new Phaser.Components.AnimationManager(this);
this.input = new Phaser.Components.Sprite.Input(this);
this.events = new Phaser.Components.Sprite.Events(this);
this.texture = new Phaser.Components.Texture(this);
this.transform = new Phaser.Components.Transform(this);
if(key !== null) {
@@ -7218,6 +7258,22 @@ var Phaser;
enumerable: true,
configurable: true
});
Object.defineProperty(Sprite.prototype, "alpha", {
get: /**
* The alpha of the Sprite between 0 and 1, a value of 1 being fully opaque.
*/
function () {
return this.texture.alpha;
},
set: /**
* The alpha of the Sprite between 0 and 1, a value of 1 being fully opaque.
*/
function (value) {
this.texture.alpha = value;
},
enumerable: true,
configurable: true
});
Object.defineProperty(Sprite.prototype, "frame", {
get: /**
* Get the animation frame number.
@@ -7658,7 +7714,7 @@ var Phaser;
*/
this.loaded = false;
/**
* Whether the Sprite background is opaque or not. If set to true the Sprite is filled with
* Whether the texture background is opaque or not. If set to true the object 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}
@@ -8957,8 +9013,9 @@ var Phaser;
* @param key {string} Unique asset key of this image file.
* @param url {string} URL of image file.
*/
function (key, url) {
if(this.checkKeyExists(key) === false) {
function (key, url, overwrite) {
if (typeof overwrite === "undefined") { overwrite = false; }
if(overwrite == true || this.checkKeyExists(key) == false) {
this._queueSize++;
this._fileList[key] = {
type: 'image',
@@ -9154,7 +9211,7 @@ var Phaser;
this._progressChunk = 100 / this._keys.length;
this.loadFile();
} else {
this.progress = 1;
this.progress = 100;
this.hasLoaded = true;
this._gameCreateComplete.call(this._game);
if(this._onComplete !== null) {
@@ -9580,6 +9637,18 @@ var Phaser;
}
return output;
};
Cache.prototype.removeCanvas = function (key) {
delete this._canvases[key];
};
Cache.prototype.removeImage = function (key) {
delete this._images[key];
};
Cache.prototype.removeSound = function (key) {
delete this._sounds[key];
};
Cache.prototype.removeText = function (key) {
delete this._text[key];
};
Cache.prototype.destroy = /**
* Clean up cache memory.
*/
@@ -10959,6 +11028,8 @@ var Phaser;
this.game = game;
this.ID = id;
this.z = id;
width = this.game.math.clamp(width, this.game.stage.width, 1);
height = this.game.math.clamp(height, this.game.stage.height, 1);
// 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 Phaser.Rectangle(0, 0, width, height);
@@ -12413,6 +12484,151 @@ var Phaser;
Phaser.Emitter = Emitter;
})(Phaser || (Phaser = {}));
/// <reference path="../Game.ts" />
/// <reference path="../math/Vec2.ts" />
/// <reference path="../geom/Rectangle.ts" />
/// <reference path="../components/animation/AnimationManager.ts" />
/// <reference path="../components/Texture.ts" />
/// <reference path="../components/Transform.ts" />
/// <reference path="../components/sprite/Input.ts" />
/// <reference path="../components/sprite/Events.ts" />
/**
* Phaser - Button
*/
var Phaser;
(function (Phaser) {
var Button = (function (_super) {
__extends(Button, _super);
/**
* Create a new <code>Button</code> object.
*
* @param game {Phaser.Game} Current game instance.
* @param [x] {number} the initial x position of the button.
* @param [y] {number} the initial y position of the button.
* @param [key] {string} Key of the graphic you want to load for this button.
*/
function Button(game, x, y, key, callback, callbackContext, overFrame, outFrame, downFrame) {
if (typeof x === "undefined") { x = 0; }
if (typeof y === "undefined") { y = 0; }
if (typeof key === "undefined") { key = null; }
if (typeof callback === "undefined") { callback = null; }
if (typeof callbackContext === "undefined") { callbackContext = null; }
if (typeof overFrame === "undefined") { overFrame = null; }
if (typeof outFrame === "undefined") { outFrame = null; }
if (typeof downFrame === "undefined") { downFrame = null; }
_super.call(this, game, x, y, key, outFrame);
this._onOverFrameName = null;
this._onOutFrameName = null;
this._onDownFrameName = null;
this._onUpFrameName = null;
this._onOverFrameID = null;
this._onOutFrameID = null;
this._onDownFrameID = null;
this._onUpFrameID = null;
this.type = Phaser.Types.BUTTON;
if(typeof overFrame == 'string') {
this._onOverFrameName = overFrame;
} else {
this._onOverFrameID = overFrame;
}
if(typeof outFrame == 'string') {
this._onOutFrameName = outFrame;
this._onUpFrameName = outFrame;
} else {
this._onOutFrameID = outFrame;
this._onUpFrameID = outFrame;
}
if(typeof downFrame == 'string') {
this._onDownFrameName = downFrame;
} else {
this._onDownFrameID = downFrame;
}
// These are the signals the game will subscribe to
this.onInputOver = new Phaser.Signal();
this.onInputOut = new Phaser.Signal();
this.onInputDown = new Phaser.Signal();
this.onInputUp = new Phaser.Signal();
// Set a default signal for them
if(callback) {
this.onInputUp.add(callback, callbackContext);
}
this.input.start(0, false, true);
// Redirect the input events to here so we can handle animation updates, etc
this.events.onInputOver.add(this.onInputOverHandler, this);
this.events.onInputOut.add(this.onInputOutHandler, this);
this.events.onInputDown.add(this.onInputDownHandler, this);
this.events.onInputUp.add(this.onInputUpHandler, this);
// By default we'll position it using screen space, not world space.
this.transform.scrollFactor.setTo(0, 0);
}
Button.prototype.onInputOverHandler = // TODO
//public tabIndex: number;
//public tabEnabled: bool;
// ENTER or SPACE can activate this button if it has focus
function (pointer) {
if(this._onOverFrameName != null) {
this.frameName = this._onOverFrameName;
} else if(this._onOverFrameID != null) {
this.frame = this._onOverFrameID;
}
if(this.onInputOver) {
this.onInputOver.dispatch(this, pointer);
}
};
Button.prototype.onInputOutHandler = function (pointer) {
if(this._onOutFrameName != null) {
this.frameName = this._onOutFrameName;
} else if(this._onOutFrameID != null) {
this.frame = this._onOutFrameID;
}
if(this.onInputOut) {
this.onInputOut.dispatch(this, pointer);
}
};
Button.prototype.onInputDownHandler = function (pointer) {
if(this._onDownFrameName != null) {
this.frameName = this._onDownFrameName;
} else if(this._onDownFrameID != null) {
this.frame = this._onDownFrameID;
}
if(this.onInputDown) {
this.onInputDown.dispatch(this, pointer);
}
};
Button.prototype.onInputUpHandler = function (pointer) {
if(this._onUpFrameName != null) {
this.frameName = this._onUpFrameName;
} else if(this._onUpFrameID != null) {
this.frame = this._onUpFrameID;
}
if(this.onInputUp) {
this.onInputUp.dispatch(this, pointer);
}
};
Object.defineProperty(Button.prototype, "priorityID", {
get: function () {
return this.input.priorityID;
},
set: function (value) {
this.input.priorityID = value;
},
enumerable: true,
configurable: true
});
Object.defineProperty(Button.prototype, "useHandCursor", {
get: function () {
return this.input.useHandCursor;
},
set: function (value) {
this.input.useHandCursor = value;
},
enumerable: true,
configurable: true
});
return Button;
})(Phaser.Sprite);
Phaser.Button = Button;
})(Phaser || (Phaser = {}));
/// <reference path="../Game.ts" />
/// <reference path="../geom/Rectangle.ts" />
/// <reference path="../math/Vec2.ts" />
/**
@@ -13247,6 +13463,8 @@ var Phaser;
};
Tilemap.prototype.postUpdate = function () {
};
Tilemap.prototype.destroy = function () {
};
Tilemap.prototype.parseCSV = /**
* Parset csv map data and generate tiles.
* @param data {string} CSV map data.
@@ -13497,6 +13715,7 @@ var Phaser;
/// <reference path="../gameobjects/Emitter.ts" />
/// <reference path="../gameobjects/Particle.ts" />
/// <reference path="../gameobjects/Sprite.ts" />
/// <reference path="../gameobjects/Button.ts" />
/// <reference path="../gameobjects/ScrollZone.ts" />
/// <reference path="../gameobjects/DynamicTexture.ts" />
/// <reference path="../gameobjects/Tilemap.ts" />
@@ -13528,7 +13747,7 @@ var Phaser;
function (x, y, width, height) {
return this._world.cameras.addCamera(x, y, width, height);
};
GameObjectFactory.prototype.sprite = /**
GameObjectFactory.prototype.button = /**
* Create a new GeomSprite with specific position.
*
* @param x {number} X position of the new geom sprite.
@@ -13539,6 +13758,30 @@ var Phaser;
// return <GeomSprite> this._world.group.add(new GeomSprite(this._game, x, y));
//}
/**
* Create a new Button game object.
*
* @param [x] {number} X position of the button.
* @param [y] {number} Y position of the button.
* @param [key] {string} The image key as defined in the Game.Cache to use as the texture for this button.
* @param [callback] {function} The function to call when this button is pressed
* @param [callbackContext] {object} The context in which the callback will be called (usually 'this')
* @param [overFrame] {string|number} This is the frame or frameName that will be set when this button is in an over state. Give either a number to use a frame ID or a string for a frame name.
* @param [outFrame] {string|number} This is the frame or frameName that will be set when this button is in an out state. Give either a number to use a frame ID or a string for a frame name.
* @param [downFrame] {string|number} This is the frame or frameName that will be set when this button is in a down state. Give either a number to use a frame ID or a string for a frame name.
* @returns {Button} The newly created button object.
*/
function (x, y, key, callback, callbackContext, overFrame, outFrame, downFrame) {
if (typeof x === "undefined") { x = 0; }
if (typeof y === "undefined") { y = 0; }
if (typeof key === "undefined") { key = null; }
if (typeof callback === "undefined") { callback = null; }
if (typeof callbackContext === "undefined") { callbackContext = null; }
if (typeof overFrame === "undefined") { overFrame = null; }
if (typeof outFrame === "undefined") { outFrame = null; }
if (typeof downFrame === "undefined") { downFrame = null; }
return this._world.group.add(new Phaser.Button(this._game, x, y, key, callback, callbackContext, overFrame, outFrame, downFrame));
};
GameObjectFactory.prototype.sprite = /**
* Create a new Sprite with specific position and sprite sheet key.
*
* @param x {number} X position of the new sprite.
@@ -16533,24 +16776,52 @@ var Phaser;
this.game.input.circle.x = this.game.input.x;
this.game.input.circle.y = this.game.input.y;
}
if(this.targetObject !== null) {
// Easy out if we're dragging something and it still exists
if(this.targetObject !== null && this.targetObject.input && this.targetObject.input.isDragged == true) {
if(this.targetObject.input.update(this) == false) {
this.targetObject = null;
}
} else {
// Build our temporary click stack
var _highestRenderID = -1;
var _highestRenderObject = -1;
for(var i = 0; i < this.game.input.totalTrackedObjects; i++) {
if(this.game.input.inputObjects[i] !== null && this.game.input.inputObjects[i].input.checkPointerOver(this) && this.game.input.inputObjects[i].renderOrderID > _highestRenderID) {
_highestRenderID = this.game.input.inputObjects[i].renderOrderID;
_highestRenderObject = i;
return this;
}
// Work out which object is on the top
this._highestRenderOrderID = -1;
this._highestRenderObject = -1;
this._highestInputPriorityID = -1;
for(var i = 0; i < this.game.input.totalTrackedObjects; i++) {
if(this.game.input.inputObjects[i] && this.game.input.inputObjects[i].input && this.game.input.inputObjects[i].input.checkPointerOver(this)) {
// If the object has a higher Input.PriorityID OR if the priority ID is the same as the current highest AND it has a higher renderOrderID, then set it to the top
if(this.game.input.inputObjects[i].input.priorityID > this._highestInputPriorityID || (this.game.input.inputObjects[i].input.priorityID == this._highestInputPriorityID && this.game.input.inputObjects[i].renderOrderID > this._highestRenderOrderID)) {
this._highestRenderOrderID = this.game.input.inputObjects[i].renderOrderID;
this._highestRenderObject = i;
this._highestInputPriorityID = this.game.input.inputObjects[i].input.priorityID;
}
}
if(_highestRenderObject !== -1) {
//console.log('setting target');
this.targetObject = this.game.input.inputObjects[_highestRenderObject];
}
if(this._highestRenderObject == -1) {
// The pointer isn't over anything, check if we've got a lingering previous target
if(this.targetObject !== null) {
this.targetObject.input._pointerOutHandler(this);
this.targetObject = null;
}
} else {
if(this.targetObject == null) {
// And now set the new one
this.targetObject = this.game.input.inputObjects[this._highestRenderObject];
this.targetObject.input._pointerOverHandler(this);
} else {
// We've got a target from the last update
if(this.targetObject == this.game.input.inputObjects[this._highestRenderObject]) {
// Same target as before, so update it
if(this.targetObject.input.update(this) == false) {
this.targetObject = null;
}
} else {
// The target has changed, so tell the old one we've left it
this.targetObject.input._pointerOutHandler(this);
// And now set the new one
this.targetObject = this.game.input.inputObjects[this._highestRenderObject];
this.targetObject.input._pointerOverHandler(this);
}
}
}
return this;
@@ -16601,7 +16872,7 @@ var Phaser;
this.game.input.currentPointers--;
}
for(var i = 0; i < this.game.input.totalTrackedObjects; i++) {
if(this.game.input.inputObjects[i] !== null && this.game.input.inputObjects[i].input.enabled) {
if(this.game.input.inputObjects[i] && this.game.input.inputObjects[i].input && this.game.input.inputObjects[i].input.enabled) {
this.game.input.inputObjects[i].input._releasedHandler(this);
}
}
@@ -16654,7 +16925,7 @@ var Phaser;
this._holdSent = false;
this._history.length = 0;
this._stateReset = true;
if(this.targetObject) {
if(this.targetObject && this.targetObject.input) {
this.targetObject.input._releasedHandler(this);
}
this.targetObject = null;
@@ -17675,7 +17946,6 @@ var Phaser;
**/
function (index) {
if(this.inputObjects[index]) {
console.log('object removed from the input manager', index);
this.inputObjects[index] = null;
}
};
@@ -17750,7 +18020,9 @@ var Phaser;
this.onTap = new Phaser.Signal();
this.onHold = new Phaser.Signal();
for(var i = 0; i < this.totalTrackedObjects; i++) {
this.inputObjects[i].input.reset();
if(this.inputObjects[i] && this.inputObjects[i].input) {
this.inputObjects[i].input.reset();
}
}
this.inputObjects.length = 0;
this.totalTrackedObjects = 0;
@@ -18103,7 +18375,7 @@ var Phaser;
this.renderTotal = this._count;
};
CanvasRenderer.prototype.renderGameObject = function (object) {
if(object.type == Phaser.Types.SPRITE) {
if(object.type == Phaser.Types.SPRITE || object.type == Phaser.Types.BUTTON) {
this.renderSprite(this._camera, object);
} else if(object.type == Phaser.Types.SCROLLZONE) {
this.renderScrollZone(this._camera, object);
@@ -18826,16 +19098,31 @@ var Phaser;
*/
this.onCreateCallback = null;
/**
* This will be called when update states.
* This will be called when State is updated, this doesn't happen during load (see onLoadUpdateCallback)
* @type {function}
*/
this.onUpdateCallback = null;
/**
* This will be called when render states.
* This will be called when the State is rendered, this doesn't happen during load (see onLoadRenderCallback)
* @type {function}
*/
this.onRenderCallback = null;
/**
* This will be called before the State is rendered and before the stage is cleared
* @type {function}
*/
this.onPreRenderCallback = null;
/**
* This will be called when the State is updated but only during the load process
* @type {function}
*/
this.onLoadUpdateCallback = null;
/**
* This will be called when the State is rendered but only during the load process
* @type {function}
*/
this.onLoadRenderCallback = null;
/**
* This will be called when states paused.
* @type {function}
*/
@@ -18978,11 +19265,18 @@ var Phaser;
this.world.update();
if(this._loadComplete && this.onUpdateCallback) {
this.onUpdateCallback.call(this.callbackContext);
} else if(this._loadComplete == false && this.onLoadUpdateCallback) {
this.onLoadUpdateCallback.call(this.callbackContext);
}
this.world.postUpdate();
if(this._loadComplete && this.onPreRenderCallback) {
this.onPreRenderCallback.call(this.callbackContext);
}
this.renderer.render();
if(this._loadComplete && this.onRenderCallback) {
this.onRenderCallback.call(this.callbackContext);
} else if(this._loadComplete == false && this.onLoadRenderCallback) {
this.onLoadRenderCallback.call(this.callbackContext);
}
};
Game.prototype.startState = /**
@@ -19008,7 +19302,7 @@ var Phaser;
}
};
Game.prototype.setCallbacks = /**
* Set all state callbacks (init, create, update, render).
* Set the most common state callbacks (init, create, update, render).
* @param initCallback {function} Init callback invoked when init state.
* @param createCallback {function} Create callback invoked when create state.
* @param updateCallback {function} Update callback invoked when update state.
@@ -19053,21 +19347,33 @@ var Phaser;
if(this.state['create'] || this.state['update']) {
this.callbackContext = this.state;
this.onInitCallback = null;
this.onLoadRenderCallback = null;
this.onLoadUpdateCallback = null;
this.onCreateCallback = null;
this.onUpdateCallback = null;
this.onRenderCallback = null;
this.onPreRenderCallback = null;
this.onPausedCallback = null;
this.onDestroyCallback = null;
// Bingo, let's set them up
if(this.state['init']) {
this.onInitCallback = this.state['init'];
}
if(this.state['loadRender']) {
this.onLoadRenderCallback = this.state['loadRender'];
}
if(this.state['loadUpdate']) {
this.onLoadUpdateCallback = this.state['loadUpdate'];
}
if(this.state['create']) {
this.onCreateCallback = this.state['create'];
}
if(this.state['update']) {
this.onUpdateCallback = this.state['update'];
}
if(this.state['preRender']) {
this.onPreRenderCallback = this.state['preRender'];
}
if(this.state['render']) {
this.onRenderCallback = this.state['render'];
}
@@ -19095,6 +19401,8 @@ var Phaser;
function () {
this.callbackContext = null;
this.onInitCallback = null;
this.onLoadRenderCallback = null;
this.onLoadUpdateCallback = null;
this.onCreateCallback = null;
this.onUpdateCallback = null;
this.onRenderCallback = null;