mirror of
https://github.com/wassname/phaser.git
synced 2026-09-09 11:28:47 +08:00
Finish document for Time, Tween, Animation, AnimationLoader, Frame.
This commit is contained in:
+78
-29
@@ -10,6 +10,12 @@ module Phaser {
|
|||||||
|
|
||||||
export class Time {
|
export class Time {
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Time constructor
|
||||||
|
* Create a new <code>Time</code>.
|
||||||
|
*
|
||||||
|
* @param game {Phaser.Game} Current game instance.
|
||||||
|
*/
|
||||||
constructor(game: Game) {
|
constructor(game: Game) {
|
||||||
|
|
||||||
this._started = Date.now();
|
this._started = Date.now();
|
||||||
@@ -18,32 +24,47 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Local private reference to game.
|
||||||
|
*/
|
||||||
private _game: Game;
|
private _game: Game;
|
||||||
|
/**
|
||||||
|
* Time when this object created.
|
||||||
|
* @param {number}
|
||||||
|
*/
|
||||||
private _started: number;
|
private _started: number;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Time scale factor.
|
||||||
|
* Set it to 0.5 for slow motion, to 2.0 makes game twice faster.
|
||||||
|
* @type {number}
|
||||||
|
*/
|
||||||
public timeScale: number = 1.0;
|
public timeScale: number = 1.0;
|
||||||
|
/**
|
||||||
|
* Elapsed since last frame.
|
||||||
|
* @type {number}
|
||||||
|
*/
|
||||||
public elapsed: number = 0;
|
public elapsed: number = 0;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
* Game time counter.
|
||||||
* @property time
|
* @property time
|
||||||
* @type Number
|
* @type {number}
|
||||||
*/
|
*/
|
||||||
public time: number = 0;
|
public time: number = 0;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
* Time of current frame.
|
||||||
* @property now
|
* @property now
|
||||||
* @type Number
|
* @type {number}
|
||||||
*/
|
*/
|
||||||
public now: number = 0;
|
public now: number = 0;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
* Elapsed time since last frame.
|
||||||
* @property delta
|
* @property delta
|
||||||
* @type Number
|
* @type {number}
|
||||||
*/
|
*/
|
||||||
public delta: number = 0;
|
public delta: number = 0;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -57,19 +78,47 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Frames per second.
|
||||||
|
* @type {number}
|
||||||
|
*/
|
||||||
public fps: number = 0;
|
public fps: number = 0;
|
||||||
|
/**
|
||||||
|
* Minimal fps.
|
||||||
|
* @type {number}
|
||||||
|
*/
|
||||||
public fpsMin: number = 1000;
|
public fpsMin: number = 1000;
|
||||||
|
/**
|
||||||
|
* Maximal fps.
|
||||||
|
* @type {number}
|
||||||
|
*/
|
||||||
public fpsMax: number = 0;
|
public fpsMax: number = 0;
|
||||||
|
/**
|
||||||
|
* Mininal duration between 2 frames.
|
||||||
|
* @type {number}
|
||||||
|
*/
|
||||||
public msMin: number = 1000;
|
public msMin: number = 1000;
|
||||||
|
/**
|
||||||
|
* Maximal duration between 2 frames.
|
||||||
|
* @type {number}
|
||||||
|
*/
|
||||||
public msMax: number = 0;
|
public msMax: number = 0;
|
||||||
|
/**
|
||||||
|
* How many frames in last second.
|
||||||
|
* @type {number}
|
||||||
|
*/
|
||||||
public frames: number = 0;
|
public frames: number = 0;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Time of last second.
|
||||||
|
* @type {number}
|
||||||
|
*/
|
||||||
private _timeLastSecond: number = 0;
|
private _timeLastSecond: number = 0;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
* Update clock and calc fps.
|
||||||
* @method update
|
* @method update
|
||||||
*/
|
*/
|
||||||
public update() {
|
public update() {
|
||||||
|
|
||||||
// Can we use performance.now() ?
|
// Can we use performance.now() ?
|
||||||
@@ -102,11 +151,11 @@ module Phaser {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
* How long has passed since given time.
|
||||||
* @method elapsedSince
|
* @method elapsedSince
|
||||||
* @param {Number} since
|
* @param {number} since The time you want to measure.
|
||||||
* @return {Number}
|
* @return {number} Duration between given time and now.
|
||||||
*/
|
*/
|
||||||
public elapsedSince(since: number): number {
|
public elapsedSince(since: number): number {
|
||||||
|
|
||||||
return this.now - since;
|
return this.now - since;
|
||||||
@@ -114,11 +163,11 @@ module Phaser {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
* How long has passed since give time (in seconds).
|
||||||
* @method elapsedSecondsSince
|
* @method elapsedSecondsSince
|
||||||
* @param {Number} since
|
* @param {number} since The time you want to measure (in seconds).
|
||||||
* @return {Number}
|
* @return {number} Duration between given time and now (in seconds).
|
||||||
*/
|
*/
|
||||||
public elapsedSecondsSince(since: number): number {
|
public elapsedSecondsSince(since: number): number {
|
||||||
|
|
||||||
return (this.now - since) * 0.001;
|
return (this.now - since) * 0.001;
|
||||||
@@ -126,9 +175,9 @@ module Phaser {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
* Set the start time to now.
|
||||||
* @method reset
|
* @method reset
|
||||||
*/
|
*/
|
||||||
public reset() {
|
public reset() {
|
||||||
|
|
||||||
this._started = this.now;
|
this._started = this.now;
|
||||||
|
|||||||
@@ -21,6 +21,13 @@ module Phaser {
|
|||||||
|
|
||||||
export class Tween {
|
export class Tween {
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Tween constructor
|
||||||
|
* Create a new <code>Tween</code>.
|
||||||
|
*
|
||||||
|
* @param object {object} Target object will be affected by this tween.
|
||||||
|
* @param game {Phaser.Game} Current game instance.
|
||||||
|
*/
|
||||||
constructor(object, game:Phaser.Game) {
|
constructor(object, game:Phaser.Game) {
|
||||||
|
|
||||||
this._object = object;
|
this._object = object;
|
||||||
@@ -37,24 +44,75 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Local private reference to game.
|
||||||
|
*/
|
||||||
private _game: Phaser.Game;
|
private _game: Phaser.Game;
|
||||||
|
/**
|
||||||
|
* Manager of this tween.
|
||||||
|
* @type {Phaser.TweenManager}
|
||||||
|
*/
|
||||||
private _manager: Phaser.TweenManager;
|
private _manager: Phaser.TweenManager;
|
||||||
|
/**
|
||||||
|
* Reference to the target object.
|
||||||
|
* @type {object}
|
||||||
|
*/
|
||||||
private _object = null;
|
private _object = null;
|
||||||
private _pausedTime: number = 0;
|
private _pausedTime: number = 0;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Start values container.
|
||||||
|
* @type {object}
|
||||||
|
*/
|
||||||
private _valuesStart = {};
|
private _valuesStart = {};
|
||||||
|
/**
|
||||||
|
* End values container.
|
||||||
|
* @type {object}
|
||||||
|
*/
|
||||||
private _valuesEnd = {};
|
private _valuesEnd = {};
|
||||||
|
/**
|
||||||
|
* How long this tween will perform.
|
||||||
|
* @type {number}
|
||||||
|
*/
|
||||||
private _duration = 1000;
|
private _duration = 1000;
|
||||||
private _delayTime = 0;
|
private _delayTime = 0;
|
||||||
private _startTime = null;
|
private _startTime = null;
|
||||||
|
/**
|
||||||
|
* Easing function which actually updating this tween.
|
||||||
|
* @type {function}
|
||||||
|
*/
|
||||||
private _easingFunction;
|
private _easingFunction;
|
||||||
private _interpolationFunction;
|
private _interpolationFunction;
|
||||||
|
/**
|
||||||
|
* Contains chained tweens.
|
||||||
|
* @type {Tweens[]}
|
||||||
|
*/
|
||||||
private _chainedTweens = [];
|
private _chainedTweens = [];
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Signal to be dispatched when this tween start.
|
||||||
|
* @type {Phaser.Signal}
|
||||||
|
*/
|
||||||
public onStart: Phaser.Signal;
|
public onStart: Phaser.Signal;
|
||||||
|
/**
|
||||||
|
* Signal to be dispatched when this tween updating.
|
||||||
|
* @type {Phaser.Signal}
|
||||||
|
*/
|
||||||
public onUpdate: Phaser.Signal;
|
public onUpdate: Phaser.Signal;
|
||||||
|
/**
|
||||||
|
* Signal to be dispatched when this tween completed.
|
||||||
|
* @type {Phaser.Signal}
|
||||||
|
*/
|
||||||
public onComplete: Phaser.Signal;
|
public onComplete: Phaser.Signal;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Config the tween result.
|
||||||
|
* @param properties {object} Propertis you want to tween.
|
||||||
|
* @param duration {number} Optional, duration of this tween.
|
||||||
|
* @param ease {any} Easing function.
|
||||||
|
* @param autoStart {boolean} Whether this tween will start automatically or not.
|
||||||
|
* @return {Tween} Itself.
|
||||||
|
*/
|
||||||
public to(properties, duration?: number = 1000, ease?: any = null, autoStart?: bool = false) {
|
public to(properties, duration?: number = 1000, ease?: any = null, autoStart?: bool = false) {
|
||||||
|
|
||||||
this._duration = duration;
|
this._duration = duration;
|
||||||
@@ -78,6 +136,9 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Start to tween.
|
||||||
|
*/
|
||||||
public start() {
|
public start() {
|
||||||
|
|
||||||
if (this._game === null || this._object === null)
|
if (this._game === null || this._object === null)
|
||||||
@@ -120,6 +181,9 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Stop tweening.
|
||||||
|
*/
|
||||||
public stop() {
|
public stop() {
|
||||||
|
|
||||||
if (this._manager !== null)
|
if (this._manager !== null)
|
||||||
@@ -164,6 +228,11 @@ module Phaser {
|
|||||||
return this._interpolationFunction;
|
return this._interpolationFunction;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add another chained tween, which will start automatically when the one before it completes.
|
||||||
|
* @param tween {Phaser.Tween} Tween object you want to chain with this.
|
||||||
|
* @return {Phaser.Tween} Itselfe.
|
||||||
|
*/
|
||||||
public chain(tween:Phaser.Tween) {
|
public chain(tween:Phaser.Tween) {
|
||||||
|
|
||||||
this._chainedTweens.push(tween);
|
this._chainedTweens.push(tween);
|
||||||
@@ -172,8 +241,16 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Debug value?
|
||||||
|
*/
|
||||||
public debugValue;
|
public debugValue;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Update tweening.
|
||||||
|
* @param time {number} Current time from game clock.
|
||||||
|
* @return {boolean} Return false if this completed and no need to update, otherwise return true.
|
||||||
|
*/
|
||||||
public update(time) {
|
public update(time) {
|
||||||
|
|
||||||
if (this._game.paused == true)
|
if (this._game.paused == true)
|
||||||
|
|||||||
@@ -14,8 +14,12 @@ module Phaser {
|
|||||||
* Animation constructor
|
* Animation constructor
|
||||||
* Create a new <code>Animation</code>.
|
* Create a new <code>Animation</code>.
|
||||||
*
|
*
|
||||||
* @param width Width of the world bound.
|
* @param parent {Sprite} Owner sprite of this animation.
|
||||||
* @param height Height of the world bound.
|
* @param frameData {FrameData} The FrameData object contains animation data.
|
||||||
|
* @param name {string} Unique name of this animation.
|
||||||
|
* @param frames {number[]/string[]} An array of numbers or strings indicating what frames to play in what order.
|
||||||
|
* @param delay {number} Time between frames in ms.
|
||||||
|
* @param looped {boolean} Whether or not the animation is looped or just plays once.
|
||||||
*/
|
*/
|
||||||
constructor(game: Game, parent: Sprite, frameData: FrameData, name: string, frames, delay: number, looped: bool) {
|
constructor(game: Game, parent: Sprite, frameData: FrameData, name: string, frames, delay: number, looped: bool) {
|
||||||
|
|
||||||
@@ -36,21 +40,72 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Local private reference to game.
|
||||||
|
*/
|
||||||
private _game: Game;
|
private _game: Game;
|
||||||
|
/**
|
||||||
|
* Local private reference to its owner sprite.
|
||||||
|
* @type {Sprite}
|
||||||
|
*/
|
||||||
private _parent: Sprite;
|
private _parent: Sprite;
|
||||||
|
/**
|
||||||
|
* Animation frame container.
|
||||||
|
* @type {number[]}
|
||||||
|
*/
|
||||||
private _frames: number[];
|
private _frames: number[];
|
||||||
|
/**
|
||||||
|
* Frame data of this animation.(parsed from sprite sheet)
|
||||||
|
* @type {FrameData}
|
||||||
|
*/
|
||||||
private _frameData: FrameData;
|
private _frameData: FrameData;
|
||||||
|
/**
|
||||||
|
* Index of current frame.
|
||||||
|
* @type {number}
|
||||||
|
*/
|
||||||
private _frameIndex: number;
|
private _frameIndex: number;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Time when switched to last frame (in ms).
|
||||||
|
* @type number
|
||||||
|
*/
|
||||||
private _timeLastFrame: number;
|
private _timeLastFrame: number;
|
||||||
|
/**
|
||||||
|
* Time when this will switch to next frame (in ms).
|
||||||
|
* @type number
|
||||||
|
*/
|
||||||
private _timeNextFrame: number;
|
private _timeNextFrame: number;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Name of this animation.
|
||||||
|
* @type {string}
|
||||||
|
*/
|
||||||
public name: string;
|
public name: string;
|
||||||
|
/**
|
||||||
|
* Currently played frame instance.
|
||||||
|
* @type {Frame}
|
||||||
|
*/
|
||||||
public currentFrame: Frame;
|
public currentFrame: Frame;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Whether or not this animation finished playing.
|
||||||
|
* @type {boolean}
|
||||||
|
*/
|
||||||
public isFinished: bool;
|
public isFinished: bool;
|
||||||
|
/**
|
||||||
|
* Whethor or not this animation is currently playing.
|
||||||
|
* @type {boolean}
|
||||||
|
*/
|
||||||
public isPlaying: bool;
|
public isPlaying: bool;
|
||||||
|
/**
|
||||||
|
* Whether or not the animation is looped.
|
||||||
|
* @type {boolean}
|
||||||
|
*/
|
||||||
public looped: bool;
|
public looped: bool;
|
||||||
|
/**
|
||||||
|
* Time between frames in ms.
|
||||||
|
* @type {number}
|
||||||
|
*/
|
||||||
public delay: number;
|
public delay: number;
|
||||||
|
|
||||||
public get frameTotal(): number {
|
public get frameTotal(): number {
|
||||||
@@ -74,6 +129,11 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Play this animation.
|
||||||
|
* @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 = null, loop?: bool) {
|
public play(frameRate?: number = null, loop?: bool) {
|
||||||
|
|
||||||
if (frameRate !== null)
|
if (frameRate !== null)
|
||||||
@@ -97,6 +157,9 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Play this animation from the first frame.
|
||||||
|
*/
|
||||||
public restart() {
|
public restart() {
|
||||||
|
|
||||||
this.isPlaying = true;
|
this.isPlaying = true;
|
||||||
@@ -110,6 +173,9 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Stop playing animation and set it finished.
|
||||||
|
*/
|
||||||
public stop() {
|
public stop() {
|
||||||
|
|
||||||
this.isPlaying = false;
|
this.isPlaying = false;
|
||||||
@@ -117,6 +183,9 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Update animation frames.
|
||||||
|
*/
|
||||||
public update(): bool {
|
public update(): bool {
|
||||||
|
|
||||||
if (this.isPlaying == true && this._game.time.now >= this._timeNextFrame)
|
if (this.isPlaying == true && this._game.time.now >= this._timeNextFrame)
|
||||||
@@ -150,6 +219,9 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Clean up animation memory.
|
||||||
|
*/
|
||||||
public destroy() {
|
public destroy() {
|
||||||
|
|
||||||
this._game = null;
|
this._game = null;
|
||||||
@@ -161,6 +233,9 @@ module Phaser {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Animation complete callback method.
|
||||||
|
*/
|
||||||
private onComplete() {
|
private onComplete() {
|
||||||
|
|
||||||
this.isPlaying = false;
|
this.isPlaying = false;
|
||||||
|
|||||||
@@ -12,11 +12,11 @@ module Phaser {
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* Parse a sprite sheet from asset data.
|
* Parse a sprite sheet from asset data.
|
||||||
* @param key Asset key for the sprite sheet data.
|
* @param key {string} Asset key for the sprite sheet data.
|
||||||
* @param frameWidth Width of animation frame.
|
* @param frameWidth {number} Width of animation frame.
|
||||||
* @param frameHeight Height of animation frame.
|
* @param frameHeight {number} Height of animation frame.
|
||||||
* @param frameMax Number of animation frames.
|
* @param frameMax {number} Number of animation frames.
|
||||||
* @return {FrameData=} Generated FrameData object.
|
* @return {FrameData} Generated FrameData object.
|
||||||
*/
|
*/
|
||||||
public static parseSpriteSheet(game: Game, key: string, frameWidth: number, frameHeight: number, frameMax: number): FrameData {
|
public static parseSpriteSheet(game: Game, key: string, frameWidth: number, frameHeight: number, frameMax: number): FrameData {
|
||||||
|
|
||||||
@@ -73,8 +73,8 @@ module Phaser {
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* Parse frame datas from json.
|
* Parse frame datas from json.
|
||||||
* @param json Json data you want to parse.
|
* @param json {object} Json data you want to parse.
|
||||||
* @return {FrameData=} Generated FrameData object.
|
* @return {FrameData} Generated FrameData object.
|
||||||
*/
|
*/
|
||||||
public static parseJSONData(game: Game, json): FrameData {
|
public static parseJSONData(game: Game, json): FrameData {
|
||||||
|
|
||||||
|
|||||||
@@ -14,11 +14,11 @@ module Phaser {
|
|||||||
* Frame constructor
|
* Frame constructor
|
||||||
* Create a new <code>Frame</code> with specific position, size and name.
|
* Create a new <code>Frame</code> with specific position, size and name.
|
||||||
*
|
*
|
||||||
* @param x X position within the image to cut from.
|
* @param x {number} X position within the image to cut from.
|
||||||
* @param y Y position within the image to cut from.
|
* @param y {number} Y position within the image to cut from.
|
||||||
* @param width Width of the frame.
|
* @param width {number} Width of the frame.
|
||||||
* @param height Height of the frame.
|
* @param height {number} Height of the frame.
|
||||||
* @param name Name of this frame.
|
* @param name {string} Name of this frame.
|
||||||
*/
|
*/
|
||||||
constructor(x: number, y: number, width: number, height: number, name: string) {
|
constructor(x: number, y: number, width: number, height: number, name: string) {
|
||||||
|
|
||||||
@@ -122,13 +122,13 @@ module Phaser {
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* Set trim of the frame.
|
* Set trim of the frame.
|
||||||
* @param trimmed Whether this frame trimmed or not.
|
* @param trimmed {boolean} Whether this frame trimmed or not.
|
||||||
* @param actualWidth Actual width of this frame.
|
* @param actualWidth {number} Actual width of this frame.
|
||||||
* @param actualHeight Actual height of this frame.
|
* @param actualHeight {number} Actual height of this frame.
|
||||||
* @param destX Destiny x position.
|
* @param destX {number} Destiny x position.
|
||||||
* @param destY Destiny y position.
|
* @param destY {number} Destiny y position.
|
||||||
* @param destWidth Destiny draw width.
|
* @param destWidth {number} Destiny draw width.
|
||||||
* @param destHeight Destiny draw height.
|
* @param destHeight {number} Destiny draw height.
|
||||||
*/
|
*/
|
||||||
public setTrim(trimmed: bool, actualWidth, actualHeight, destX, destY, destWidth, destHeight, ) {
|
public setTrim(trimmed: bool, actualWidth, actualHeight, destX, destY, destWidth, destHeight, ) {
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user