mirror of
https://github.com/photonstorm/phaser
synced 2024-11-26 14:40:38 +00:00
Tweens have a new event: onLoop.
Tweens - Example showing how to use the tween events, onStart, onLoop and onComplete. Lots of documentation fixes in the Tween class. Tweens fire an onLoop event if they are set to repeat. onComplete is now only fired for the final repeat (or never if the repeat is infinite) Tween.onStart is now called when the tween starts AFTER the delay value, if given (thanks stevenbouma)
This commit is contained in:
parent
b2c680811b
commit
f991f9cee8
6 changed files with 159 additions and 51 deletions
|
@ -58,6 +58,7 @@ New features:
|
|||
* Added Device.trident and Device.tridentVersion for testing IE11.
|
||||
* Added Device.silk for detecting a Kindle Fire and updated desktop OS check to exclude Kindles (thanks LuckieLordie)
|
||||
* TilemapLayers now have debug and debugAlpha values, this turns on the drawing of the collision edges (very handy for debugging, as the name implies!)
|
||||
* Tweens have a new event: onLoop.
|
||||
|
||||
|
||||
New Examples:
|
||||
|
@ -69,6 +70,8 @@ New Examples:
|
|||
* Physics - Snake (use the keyboard to control the snake like creature) by Patrick OReilly and Richard Davey.
|
||||
* Added touch joystick example showing how to use the clay.io virtual game controller (thanks gabehollombe)
|
||||
* Games - Matching Pairs by Patrick OReilly.
|
||||
* Tweens - Example showing how to use the tween events, onStart, onLoop and onComplete.
|
||||
|
||||
|
||||
Updates:
|
||||
|
||||
|
@ -86,6 +89,8 @@ Updates:
|
|||
* Group.countLiving and countDead used to return -1 if the Group was empty, but now return 0.
|
||||
* Text can now be fixedToCamera, updated world/fixed to camera example to show this.
|
||||
* ArcadePhysics.overlap and collide now recognise TileSprites in the collision checks.
|
||||
* Lots of documentation fixes in the Tween class.
|
||||
* Tweens fire an onLoop event if they are set to repeat. onComplete is now only fired for the final repeat (or never if the repeat is infinite)
|
||||
|
||||
|
||||
Bug Fixes:
|
||||
|
@ -98,6 +103,7 @@ Bug Fixes:
|
|||
* Switch Camera.setBoundsToWorld to match world.bounds instead of world (thanks cocoademon)
|
||||
* Fixed an issue where passing null as the Group parent wouldn't set it to game.world as it should have (thanks tito100)
|
||||
* Fixed Pixi bug (#425) incorrect width property for multi-line BitmapText (thanks jcd-as)
|
||||
* Tween.onStart is now called when the tween starts AFTER the delay value, if given (thanks stevenbouma)
|
||||
|
||||
|
||||
You can view the Change Log for all previous versions at https://github.com/photonstorm/phaser/changelog.md
|
||||
|
|
|
@ -740,6 +740,10 @@
|
|||
"file": "pause+tween.js",
|
||||
"title": "pause tween"
|
||||
},
|
||||
{
|
||||
"file": "tween+loop+event.js",
|
||||
"title": "tween loop event"
|
||||
},
|
||||
{
|
||||
"file": "tween+several+properties.js",
|
||||
"title": "tween several properties"
|
||||
|
|
63
examples/tweens/tween loop event.js
Normal file
63
examples/tweens/tween loop event.js
Normal file
|
@ -0,0 +1,63 @@
|
|||
|
||||
var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, render: render });
|
||||
|
||||
function preload() {
|
||||
|
||||
game.load.spritesheet('balls', 'assets/sprites/balls.png', 17, 17);
|
||||
|
||||
}
|
||||
|
||||
var ball;
|
||||
var tween;
|
||||
var bounces = 10;
|
||||
|
||||
function create() {
|
||||
|
||||
ball = game.add.sprite(400, 0, 'balls', 0);
|
||||
|
||||
tween = game.add.tween(ball).to( { y: game.world.height - ball.height }, 1500, Phaser.Easing.Bounce.Out, true, 2500, 10);
|
||||
|
||||
// There is a 2.5 second delay at the start, then it calls this function
|
||||
tween.onStart.add(onStart, this);
|
||||
|
||||
// This tween will loop 10 times, calling this function every time it loops
|
||||
tween.onLoop.add(onLoop, this);
|
||||
|
||||
// When it completes it will call this function
|
||||
tween.onComplete.add(onComplete, this);
|
||||
|
||||
}
|
||||
|
||||
function onStart() {
|
||||
|
||||
// Turn off the delay, so it loops seamlessly from here on
|
||||
tween.delay(0);
|
||||
|
||||
}
|
||||
|
||||
function onLoop() {
|
||||
|
||||
bounces--;
|
||||
|
||||
if (ball.frame === 5)
|
||||
{
|
||||
ball.frame = 0;
|
||||
}
|
||||
else
|
||||
{
|
||||
ball.frame++;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function onComplete() {
|
||||
|
||||
tween = game.add.tween(ball).to( { x: 800 - ball.width }, 2000, Phaser.Easing.Exponential.Out, true);
|
||||
|
||||
}
|
||||
|
||||
function render() {
|
||||
|
||||
game.debug.renderText('Bounces: ' + bounces, 32, 32);
|
||||
|
||||
}
|
|
@ -942,7 +942,6 @@ Phaser.Loader.prototype = {
|
|||
return;
|
||||
}
|
||||
|
||||
|
||||
var file = this._fileList[index];
|
||||
file.loaded = true;
|
||||
|
||||
|
|
|
@ -89,8 +89,42 @@ Phaser.Tilemap.prototype = {
|
|||
|
||||
addTilesets: function (tilesets) {
|
||||
|
||||
// { "TiledKey": "TilesetKey" }
|
||||
|
||||
// parse the tilesets array and set-up gid mappings
|
||||
|
||||
// "tilesets":[
|
||||
// {
|
||||
// "firstgid":1,
|
||||
// "image":"SuperMarioBros-World1-1_bank.png",
|
||||
// "imageheight":64,
|
||||
// "imagewidth":176,
|
||||
// "margin":0,
|
||||
// "name":"SuperMarioBros-World1-1_bank.png",
|
||||
// "properties":
|
||||
// {
|
||||
|
||||
// },
|
||||
// "spacing":0,
|
||||
// "tileheight":16,
|
||||
// "tilewidth":16
|
||||
// }],
|
||||
|
||||
//this.layers = this.game.cache.getTilemapData(key).layers;
|
||||
|
||||
var mapTilesets = this.game.cache.getTilemapData(this.key).tilesets;
|
||||
|
||||
for (var tileset in tilesets)
|
||||
{
|
||||
for (var i = 0; i < mapTilesets.length; i++)
|
||||
{
|
||||
if (mapTilesets[i].name === tilesets[tileset])
|
||||
{
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
|
||||
|
|
|
@ -28,119 +28,119 @@ Phaser.Tween = function (object, game) {
|
|||
this.game = game;
|
||||
|
||||
/**
|
||||
* @property {object} _manager - Description.
|
||||
* @property {Phaser.TweenManager} _manager - Reference to the TweenManager.
|
||||
* @private
|
||||
*/
|
||||
this._manager = this.game.tweens;
|
||||
|
||||
/**
|
||||
* @property {object} _valuesStart - Description.
|
||||
* @property {object} _valuesStart - Private value object.
|
||||
* @private
|
||||
*/
|
||||
this._valuesStart = {};
|
||||
|
||||
/**
|
||||
* @property {object} _valuesEnd - Description.
|
||||
* @property {object} _valuesEnd - Private value object.
|
||||
* @private
|
||||
*/
|
||||
this._valuesEnd = {};
|
||||
|
||||
/**
|
||||
* @property {object} _valuesStartRepeat - Description.
|
||||
* @property {object} _valuesStartRepeat - Private value object.
|
||||
* @private
|
||||
*/
|
||||
this._valuesStartRepeat = {};
|
||||
|
||||
/**
|
||||
* @property {number} _duration - Description.
|
||||
* @property {number} _duration - Private duration counter.
|
||||
* @private
|
||||
* @default
|
||||
*/
|
||||
this._duration = 1000;
|
||||
|
||||
/**
|
||||
* @property {number} _repeat - Description.
|
||||
* @property {number} _repeat - Private repeat counter.
|
||||
* @private
|
||||
* @default
|
||||
*/
|
||||
this._repeat = 0;
|
||||
|
||||
/**
|
||||
* @property {boolean} _yoyo - Description.
|
||||
* @property {boolean} _yoyo - Private yoyo flag.
|
||||
* @private
|
||||
* @default
|
||||
*/
|
||||
this._yoyo = false;
|
||||
|
||||
/**
|
||||
* @property {boolean} _reversed - Description.
|
||||
* @property {boolean} _reversed - Private reversed flag.
|
||||
* @private
|
||||
* @default
|
||||
*/
|
||||
this._reversed = false;
|
||||
|
||||
/**
|
||||
* @property {number} _delayTime - Description.
|
||||
* @property {number} _delayTime - Private delay counter.
|
||||
* @private
|
||||
* @default
|
||||
*/
|
||||
this._delayTime = 0;
|
||||
|
||||
/**
|
||||
* @property {Description} _startTime - Description.
|
||||
* @property {number} _startTime - Private start time counter.
|
||||
* @private
|
||||
* @default null
|
||||
*/
|
||||
this._startTime = null;
|
||||
|
||||
/**
|
||||
* @property {Description} _easingFunction - Description.
|
||||
* @property {function} _easingFunction - The easing function used for the tween.
|
||||
* @private
|
||||
*/
|
||||
this._easingFunction = Phaser.Easing.Linear.None;
|
||||
|
||||
/**
|
||||
* @property {Description} _interpolationFunction - Description.
|
||||
* @property {function} _interpolationFunction - The interpolation function used for the tween.
|
||||
* @private
|
||||
*/
|
||||
this._interpolationFunction = Phaser.Math.linearInterpolation;
|
||||
|
||||
/**
|
||||
* @property {Description} _chainedTweens - Description.
|
||||
* @property {array} _chainedTweens - A private array of chained tweens.
|
||||
* @private
|
||||
*/
|
||||
this._chainedTweens = [];
|
||||
|
||||
/**
|
||||
* @property {Description} _onStartCallback - Description.
|
||||
* @property {function} _onStartCallback - An onStart callback.
|
||||
* @private
|
||||
* @default
|
||||
*/
|
||||
this._onStartCallback = null;
|
||||
|
||||
/**
|
||||
* @property {boolean} _onStartCallbackFired - Description.
|
||||
* @property {boolean} _onStartCallbackFired - Private onStart flag.
|
||||
* @private
|
||||
* @default
|
||||
*/
|
||||
this._onStartCallbackFired = false;
|
||||
|
||||
/**
|
||||
* @property {Description} _onUpdateCallback - Description.
|
||||
* @property {function} _onUpdateCallback - An onUpdate callback.
|
||||
* @private
|
||||
* @default null
|
||||
*/
|
||||
this._onUpdateCallback = null;
|
||||
|
||||
/**
|
||||
* @property {Description} _onCompleteCallback - Description.
|
||||
* @property {function} _onCompleteCallback - An onComplete callback.
|
||||
* @private
|
||||
* @default null
|
||||
*/
|
||||
this._onCompleteCallback = null;
|
||||
|
||||
/**
|
||||
* @property {number} _pausedTime - Description.
|
||||
* @property {number} _pausedTime - Private pause timer.
|
||||
* @private
|
||||
* @default
|
||||
*/
|
||||
|
@ -153,22 +153,28 @@ Phaser.Tween = function (object, game) {
|
|||
this.pendingDelete = false;
|
||||
|
||||
// Set all starting values present on the target object
|
||||
for ( var field in object ) {
|
||||
for (var field in object)
|
||||
{
|
||||
this._valuesStart[field] = parseFloat(object[field], 10);
|
||||
}
|
||||
|
||||
/**
|
||||
* @property {Phaser.Signal} onStart - Description.
|
||||
* @property {Phaser.Signal} onStart - The onStart event is fired when the Tween begins.
|
||||
*/
|
||||
this.onStart = new Phaser.Signal();
|
||||
|
||||
/**
|
||||
* @property {Phaser.Signal} onComplete - Description.
|
||||
* @property {Phaser.Signal} onLoop - The onLoop event is fired if the Tween loops.
|
||||
*/
|
||||
this.onLoop = new Phaser.Signal();
|
||||
|
||||
/**
|
||||
* @property {Phaser.Signal} onComplete - The onComplete event is fired when the Tween completes. Does not fire if the Tween is set to loop.
|
||||
*/
|
||||
this.onComplete = new Phaser.Signal();
|
||||
|
||||
/**
|
||||
* @property {boolean} isRunning - Description.
|
||||
* @property {boolean} isRunning - If the tween is running this is set to true, otherwise false. Tweens that are in a delayed state, waiting to start, are considered as being running.
|
||||
* @default
|
||||
*/
|
||||
this.isRunning = false;
|
||||
|
@ -182,13 +188,13 @@ Phaser.Tween.prototype = {
|
|||
*
|
||||
* @method Phaser.Tween#to
|
||||
* @param {object} properties - Properties you want to tween.
|
||||
* @param {number} duration - Duration of this tween.
|
||||
* @param {function} ease - Easing function.
|
||||
* @param {boolean} autoStart - Whether this tween will start automatically or not.
|
||||
* @param {number} delay - Delay before this tween will start, defaults to 0 (no delay).
|
||||
* @param {boolean} repeat - Should the tween automatically restart once complete? (ignores any chained tweens).
|
||||
* @param {Phaser.Tween} yoyo - Description.
|
||||
* @return {Phaser.Tween} Itself.
|
||||
* @param {number} [duration=1000] - Duration of this tween in ms.
|
||||
* @param {function} [ease=null] - Easing function. If not set it will default to Phaser.Easing.Linear.None.
|
||||
* @param {boolean} [autoStart=false] - Whether this tween will start automatically or not.
|
||||
* @param {number} [delay=0] - Delay before this tween will start, defaults to 0 (no delay). Value given is in ms.
|
||||
* @param {boolean} [repeat=0] - Should the tween automatically restart once complete? (ignores any chained tweens).
|
||||
* @param {boolean} [yoyo=false] - A tween that yoyos will reverse itself when it completes.
|
||||
* @return {Phaser.Tween} This Tween object.
|
||||
*/
|
||||
to: function ( properties, duration, ease, autoStart, delay, repeat, yoyo ) {
|
||||
|
||||
|
@ -200,6 +206,7 @@ Phaser.Tween.prototype = {
|
|||
yoyo = yoyo || false;
|
||||
|
||||
var self;
|
||||
|
||||
if (this._parent)
|
||||
{
|
||||
self = this._manager.create(this._object);
|
||||
|
@ -251,8 +258,6 @@ Phaser.Tween.prototype = {
|
|||
|
||||
this._manager.add(this);
|
||||
|
||||
this.onStart.dispatch(this._object);
|
||||
|
||||
this.isRunning = true;
|
||||
|
||||
this._onStartCallbackFired = false;
|
||||
|
@ -485,30 +490,28 @@ Phaser.Tween.prototype = {
|
|||
return false;
|
||||
}
|
||||
|
||||
if (this._paused || time < this._startTime) {
|
||||
|
||||
if (this._paused || time < this._startTime)
|
||||
{
|
||||
return true;
|
||||
|
||||
}
|
||||
|
||||
var property;
|
||||
|
||||
if ( time < this._startTime ) {
|
||||
|
||||
if (time < this._startTime)
|
||||
{
|
||||
return true;
|
||||
|
||||
}
|
||||
|
||||
if ( this._onStartCallbackFired === false ) {
|
||||
|
||||
if ( this._onStartCallback !== null ) {
|
||||
if (this._onStartCallbackFired === false)
|
||||
{
|
||||
this.onStart.dispatch(this._object);
|
||||
|
||||
if (this._onStartCallback !== null )
|
||||
{
|
||||
this._onStartCallback.call( this._object );
|
||||
|
||||
}
|
||||
|
||||
this._onStartCallbackFired = true;
|
||||
|
||||
}
|
||||
|
||||
var elapsed = ( time - this._startTime ) / this._duration;
|
||||
|
@ -558,27 +561,26 @@ Phaser.Tween.prototype = {
|
|||
// reassign starting values, restart by making startTime = now
|
||||
for ( property in this._valuesStartRepeat ) {
|
||||
|
||||
if ( typeof( this._valuesEnd[ property ] ) === "string" ) {
|
||||
if ( typeof( this._valuesEnd[ property ] ) === "string" )
|
||||
{
|
||||
this._valuesStartRepeat[ property ] = this._valuesStartRepeat[ property ] + parseFloat(this._valuesEnd[ property ], 10);
|
||||
}
|
||||
|
||||
if (this._yoyo) {
|
||||
if (this._yoyo)
|
||||
{
|
||||
var tmp = this._valuesStartRepeat[ property ];
|
||||
this._valuesStartRepeat[ property ] = this._valuesEnd[ property ];
|
||||
this._valuesEnd[ property ] = tmp;
|
||||
this._reversed = !this._reversed;
|
||||
}
|
||||
|
||||
this._valuesStart[ property ] = this._valuesStartRepeat[ property ];
|
||||
|
||||
}
|
||||
|
||||
this._startTime = time + this._delayTime;
|
||||
|
||||
this.onComplete.dispatch(this._object);
|
||||
|
||||
if ( this._onCompleteCallback !== null ) {
|
||||
this._onCompleteCallback.call( this._object );
|
||||
}
|
||||
this.onLoop.dispatch(this._object);
|
||||
|
||||
return true;
|
||||
|
||||
|
|
Loading…
Reference in a new issue