Skip to content
Browse files

KeyframeAnimation: Only docs and comments were updated, added all ins…

…tance properties to the prototype chain, cleanup in next commit (for PR)
  • Loading branch information...
1 parent d5a3d01 commit 0d88736798f0247e902905fa447d17479f33ab4a Peter van der Zee committed Nov 20, 2012
Showing with 89 additions and 21 deletions.
  1. +5 −0 CHANGELOG
  2. +11 −9 src/runner/animation/animation.js
  3. +73 −12 src/runner/animation/keyframe_animation.js
View
5 CHANGELOG
@@ -1,3 +1,8 @@
+* Updated KeyframeAnimation.js documentation
+* Added all instance properties of KeyframeAnimation to the prototype and documented them
+* Removed unused KeyframeAnimation#removeSubject and #removeSubjects
+* Fixed an issue with KeyframeAnimation where it would trip over certain undefined values
+
v0.4.2
-------------------
* Add support for an `interactive` attribute on all DisplayObjects which allows
View
20 src/runner/animation/animation.js
@@ -5,33 +5,35 @@ define([
'use strict';
/**
- * The animation class stuff
+ * Simplified alias for KeyframeAnimation
*
- * @constructor
+ * @constructor (but returns a KeyframeAnimation instance!)
* @name Animation
* @memberOf module:animation
+ *
* @param {EventEmitter} clock An object that emits a 'tick' event and
* has a `toFrameNumber` method.
* @param {Number|String} duration The duration, either as frames (number),
* seconds (e.g. '1s'), milliseconds (e.g. '100ms') or as a percentage
* of the clock's total frames (e.g. '23%')
- * @param {Object} [properties] The properties/values to animate
+ * @param {Object} [endValues] The properties/values to animate
* @param {Object} [options] Additional options
- * @param {String|Function} [options.easing] Easing function. Either the name
+ * @property {String|Function} [options.easing] Easing function. Either the name
* of a predefined or a custom function
- * @param {Boolean} [options.isTimelineBound] Boolean indicating whether this
+ * @property {Boolean} [options.isTimelineBound] Boolean indicating whether this
* animation should be bound to the timeline, and respond to isPlaying state,
* or play regardless of timeline's progress.
- * @param {Array|Object} [options.subjects] The subject(s) (DisplayObjects) of
+ * @property {Array|Object} [options.subjects] The subject(s) (DisplayObjects) of
* the animation
- * @param {string|Object} [options.strategy='attr'] The strategy to use to
+ * @property {string|Object} [options.strategy='attr'] The strategy to use to
* get and set properties on the subject.
- * @param {Number|String} [options.delay=0] Delay before animation begins, in
+ * @property {Number|String} [options.delay=0] Delay before animation begins, in
* frames or seconds
- * @param {Number} [options.repeat=0] The number of repetitions.
+ * @property {Number} [options.repeat=0] The number of repetitions.
* @returns {Animation} An Animation instance
*
* @mixes EventEmitter
+ * @return {KeyframeAnimation}
*/
function Animation(clock, duration, endValues, options) {
View
85 src/runner/animation/keyframe_animation.js
@@ -31,11 +31,12 @@ define([
* @mixes EventEmitter
* @memberOf module:animation
*
- * @param {?} clock (pz: TOFIX: what is this?)
+ * @param {EventEmitter} clock An object that emits a 'tick' event and
+ * has a `toFrameNumber` method.
* @param {number|string} duration The duration, either as frames (number)
* or as seconds (e.g. '1s', '1ms')
* @param {Object} [keyframes] The keyframes to animate through
- * @param {Object} [options] Additional options
+ * @param {Object} [options={}] Additional options
* @property {String|Function} [options.easing] Easing function for each sub-animation
* @property {Array|Object} [options.subjects] The subject(s) (e.g. DisplayObjects) of
* the keyframe-animation
@@ -53,7 +54,10 @@ define([
this.subjects = [];
this.initialValues = null;
+ // Looks wonky, but because repeat allows Infinity, combining it into
+ // `(repeat-(repeat%1))||0` would result in 0, rather than Infinity.
this.repeat = (options.repeat || 0) - (options.repeat % 1 || 0);
+
this.delay = options.delay && clock.toFrameNumber(options.delay) || 0;
this.isTimelineBound = options.isTimelineBound !== false;
@@ -75,26 +79,83 @@ define([
}
}
-
KeyframeAnimation.prototype = /** @lends module:animation.KeyframeAnimation.prototype */ {
/**
* @private
- * @property {Array} animations TOFIX: annotation needed
+ * @property {number} clock Frame interval in milliseconds
*/
- animations: null,
+ clock: null,
+
/**
* @private
- * @property {Array} keyframes TOFIX: annotation needed
+ * @property {number} currentDelay Number of frames we are _still_ waiting before starting animation
*/
- keyframes: null,
+ currentDelay: -1,
+ /**
+ * @private
+ * @property {number} currentTweenIndex Basically the animation progress
+ */
+ currentTweenIndex: -1,
+ /**
+ * @private
+ * @property {number} delay Initial number of frames to wait for this animation to begin
+ */
+ delay: -1,
+ /**
+ * @private
+ * @property {number} duration Number of entire animation in frames
+ */
+ duration: -1,
+ /**
+ * depricated
+ */
+ easing: null,
+ /**
+ * @private
+ * @property {Function} easingFn The easing function which transforms the actual progress
+ */
+ easingFn: null,
+ /**
+ * @private
+ * @property {number} frame depricated?
+ */
+ frame: -1,
+ /** depricated **/
+ initialValues: null,
+ /**
+ * @private
+ * @property {boolean} isPlaying Is this animation currently applying changes?
+ */
+ isPlaying: false,
/**
- * @property {number} keys Explicitly defined key frames for this animation
+ * @private
+ * @property {boolean} isTimelineBound Does this animation sync progress with the timeline? So
+ * listen to 'tick' or 'advance'?
+ */
+ isTimelineBound: false,
+ /**
+ * @private
+ * @property {number} keys Explicitly defined key frames (normalized progress) for this animation
*/
keys: null,
/**
* @private
- * @property {Array} subjects TOFIX: annotation needed
+ * @property {Object} keyframes Each key is the proper animation progress for its (key)frame value
+ */
+ keyframes: null,
+ /**
+ * @private
+ * @property {number} prevFrame Frame number of the first frame of the animation (TOFIX: rename it!)
+ */
+ prevFrame: -1,
+ /**
+ * @property {number} repeat Number of times this animation should repeat. Use Infinity for infinite loop.
+ */
+ repeat: -1,
+ /**
+ * @private
+ * @property {Object[]} subjects The objects that are animated (usually display objects)
*/
subjects: null,
@@ -132,9 +193,9 @@ define([
},
/**
- * Starts or resumes an animation
- *
+ * Starts or resumes an animation.
* Optionally changes the subjects of the animation.
+ * Does nothing (except optionally update subjects) if already playing.
*
* @param {Object} [subjects]
* @return {KeyframeAnimation}
@@ -215,7 +276,7 @@ define([
return;
}
- // lastFrame defaults to the current frame
+ // prevFrame defaults to the current frame
// (this'll be at the start of an animation)
this.prevFrame = this.prevFrame || frameNumber;

0 comments on commit 0d88736

Please sign in to comment.
Something went wrong with that request. Please try again.