Animation - Building JavaScript Games for Phones, Tablets, and Desktop - page 318

the animation to get a continuous walking motion. Not all animations should be looped, though.
For example, a dying animation shouldn't be looped (that would be very cruel to the character).
Here is the complete constructor of the Animation class:
function Animation(sprite, looping, frameTime) {
this.sprite = sprite;
this.frameTime = typeof frameTime !== 'undefined' ? frameTime : 0.1;
this.looping = looping;
}
An Animated Game Object
The Animation class provides the groundwork for representing an animation. This section
introduces a new kind of game object: the animated game object, which uses this class. The
AnimatedGameObject class is a subclass of SpriteGameObject .
An animated game object may contain a number of different animations, so you can have a
character that can perform different (animated) actions such as walking, running, jumping, and
more. Each action is represented by an animation. Depending on the player input, you change the
animation that is currently active. Then, based on the time that has passed and the properties of the
currently active animation (such as whether it loops), you determine the sheet index of the sprite that
should be shown on the screen.
To store the different animations, you use a composite object. For each animation, you add a
variable to that object. You also need a variable to keep track of the currently active animation.
Finally, there is one additional member variable: _time . This variable keeps track of how long
you still need to show the current frame, as explained later. Here is the complete constructor of
AnimatedGameObject :
function AnimatedGameObject(layer, id) {
powerupjs.SpriteGameObject.call(this, null, layer, id);
this._animations = {};
this._current = null;
this._time = 0;
}
You also add two methods to the class: loadAnimation and playAnimation . The first method creates
an Animation object and adds it to the _animations variable:
AnimatedGameObject.prototype.loadAnimation = function (animname, id, looping,
frametime) {
this._animations[id] = new powerupjs.Animation(animname, looping,
frametime);
};