From d1468bb550ce25be6e12c4db9235b62b65f5a0f9 Mon Sep 17 00:00:00 2001 From: Richard Davey Date: Fri, 19 May 2017 02:41:26 +0100 Subject: [PATCH] Preparing for totalDuration work. --- v3/src/tween/Tween.js | 17 ++++++----------- v3/src/tween/TweenBuilder.js | 15 +++++++++++++++ v3/src/tween/TweenData.js | 13 ++++++++----- v3/src/tween/components/CalcDuration.js | 24 ++++++++++++++++++++++++ 4 files changed, 53 insertions(+), 16 deletions(-) create mode 100644 v3/src/tween/components/CalcDuration.js diff --git a/v3/src/tween/Tween.js b/v3/src/tween/Tween.js index e97c60142..10428242f 100644 --- a/v3/src/tween/Tween.js +++ b/v3/src/tween/Tween.js @@ -1,11 +1,5 @@ var TWEEN_CONST = require('./const'); -// A Tween is responsible for tweening one property of one target. -// If a target has many properties being tweened, then each unique property will be its own Tween object. -// This allows us to have differing ease, duration and associated events per property. -// A Tween contains TweenData objects (at least one). It can contain more than one TweenData, -// in which case they play out like a nested timeline, all impacting just the one target property. - var Tween = function (manager, targets, tweenData) { this.manager = manager; @@ -16,6 +10,7 @@ var Tween = function (manager, targets, tweenData) // targets array size doesn't change, so we can cache the length this.totalTargets = targets.length; + // The property data and TweenData lists this.data = tweenData; // An object with a property matching those being tweened by this Tween. @@ -37,20 +32,20 @@ var Tween = function (manager, targets, tweenData) // Time in ms/frames before the tween starts for the very first time // (populated by stagger property, or directly) - never used again once the - // tween has begun. + // tween has begun, even if it loops. this.startDelay = 0; - // infinitely loop this tween? Maybe a string? 'alternate', 'reverse', etc - // When enabled it will play through + // Infinitely loop this tween? + // When enabled it will play through ALL TweenDatas again (doesn't apply to just a single TD) this.loop = false; // Time in ms/frames before the tween loops again if loop is true this.loopDelay = 0; - // Time in ms/frames before the 'onComplete' event fires + // Time in ms/frames before the 'onComplete' event fires. this.completeDelay = 0; - // delta countdown timer (used by startDelay and loopDelay) + // Countdown timer (used by startDelay, loopDelay and completeDelay) this.countdown = 0; this.state = TWEEN_CONST.PENDING_ADD; diff --git a/v3/src/tween/TweenBuilder.js b/v3/src/tween/TweenBuilder.js index 21d68aea8..5f02ed21a 100644 --- a/v3/src/tween/TweenBuilder.js +++ b/v3/src/tween/TweenBuilder.js @@ -217,6 +217,21 @@ var TweenBuilder = function (manager, config) GetValue(value, 'yoyo', yoyo) ); + // Calculate total duration + + // Duration is derived from: + // TweenData.duration + // TweenData.delay + // TweenData.hold + // x TweenData.repeat + + // var totalDuration = 0; + + // var playThruDuration = tweenData.duration * tweenData.repeat; + + // totalDuration + // tweenData.totalDuration = + tweenData.prev = prev; if (prev) diff --git a/v3/src/tween/TweenData.js b/v3/src/tween/TweenData.js index 788eec622..aaaeca79a 100644 --- a/v3/src/tween/TweenData.js +++ b/v3/src/tween/TweenData.js @@ -14,19 +14,22 @@ var TweenData = function (key, value, ease, delay, duration, hold, repeat, repea // duration of the tween in ms/frames, excludes time for yoyo or repeats duration: duration, - // return the tween back to its start position again? + // The total calculated duration of this TweenData (based on duration, repeat, delay, hold, yoyo) + totalDuration: 0, + + // Cause the tween to alternate back and forth on each *repeat*. Has no effect unless repeat > 0. yoyo: yoyo, - // number of times to repeat the tween + // Number of times to repeat the tween. repeat: repeat, - // time in ms/frames before tween will start + // Time in ms/frames before tween will start. delay: delay, - // time in ms/frames the tween will remain in its end state before either yoyo, repeat or complete + // Time in ms/frames the tween will remain in its end state before repeat or complete. hold: hold, - // time in ms/frames before repeat will start + // Time in ms/frames before repeat will start repeatDelay: repeatDelay, // Changes the property to be this value before starting the tween diff --git a/v3/src/tween/components/CalcDuration.js b/v3/src/tween/components/CalcDuration.js new file mode 100644 index 000000000..e47c3a55a --- /dev/null +++ b/v3/src/tween/components/CalcDuration.js @@ -0,0 +1,24 @@ +var CalcDuration = function () +{ + var total = 0; + + for (var key in this.data) + { + var prop = this.data[key]; + + for (var i = 0; i < prop.list.length; i++) + { + // var tweenData = prop.list[i]; + + // Duration is derived from: + // TweenData.duration + // TweenData.delay + // TweenData.hold + // x TweenData.repeat + } + } + + return total; +}; + +module.exports = CalcDuration;