@tweenjs/tween.js - npm Package Compare versions

Comparing version 23.1.1 to 23.1.2

dist/tween.amd.js

@@ -12,9 +12,9 @@ define(['exports'], (function (exports) { 'use strict';
             In: function (amount) {
-                return this.None(amount);
+                return amount;
             },
             Out: function (amount) {
-                return this.None(amount);
+                return amount;
             },
             InOut: function (amount) {
-                return this.None(amount);
+                return amount;
             },
@@ -682,3 +682,2 @@ }),
         Tween.prototype.update = function (time, autoStart) {
-            var _this = this;
             var _a;
@@ -689,3 +688,2 @@ if (time === void 0) { time = now(); }
                 return true;
-            var property;
             var endTime = this._startTime + this._duration;
@@ -717,69 +715,82 @@ if (!this._goToEnd && !this._isPlaying) {
             var totalTime = this._duration + this._repeat * durationAndDelay;
-            var calculateElapsedPortion = function () {
-                if (_this._duration === 0)
-                    return 1;
-                if (elapsedTime > totalTime) {
-                    return 1;
-                }
-                var timesRepeated = Math.trunc(elapsedTime / durationAndDelay);
-                var timeIntoCurrentRepeat = elapsedTime - timesRepeated * durationAndDelay;
-                // TODO use %?
-                // const timeIntoCurrentRepeat = elapsedTime % durationAndDelay
-                var portion = Math.min(timeIntoCurrentRepeat / _this._duration, 1);
-                if (portion === 0 && elapsedTime === _this._duration) {
-                    return 1;
-                }
-                return portion;
-            };
-            var elapsed = calculateElapsedPortion();
+            var elapsed = this._calculateElapsedPortion(elapsedTime, durationAndDelay, totalTime);
             var value = this._easingFunction(elapsed);
-            // properties transformations
+            var status = this._calculateCompletionStatus(elapsedTime, durationAndDelay);
+            if (status === 'repeat') {
+                // the current update is happening after the instant the tween repeated
+                this._processRepetition(elapsedTime, durationAndDelay);
+            }
             this._updateProperties(this._object, this._valuesStart, this._valuesEnd, value);
+            if (status === 'about-to-repeat') {
+                // the current update is happening at the exact instant the tween is going to repeat
+                // the values should match the end of the tween, not the beginning,
+                // that's why _processRepetition happens after _updateProperties
+                this._processRepetition(elapsedTime, durationAndDelay);
+            }
             if (this._onUpdateCallback) {
                 this._onUpdateCallback(this._object, elapsed);
             }
-            if (this._duration === 0 || elapsedTime >= this._duration) {
-                if (this._repeat > 0) {
-                    var completeCount = Math.min(Math.trunc((elapsedTime - this._duration) / durationAndDelay) + 1, this._repeat);
-                    if (isFinite(this._repeat)) {
-                        this._repeat -= completeCount;
-                    }
-                    // Reassign starting values, restart by making startTime = now
-                    for (property in this._valuesStartRepeat) {
-                        if (!this._yoyo && typeof this._valuesEnd[property] === 'string') {
-                            this._valuesStartRepeat[property] =
-                                // eslint-disable-next-line
-                                // @ts-ignore FIXME?
-                                this._valuesStartRepeat[property] + parseFloat(this._valuesEnd[property]);
-                        }
-                        if (this._yoyo) {
-                            this._swapEndStartRepeatValues(property);
-                        }
-                        this._valuesStart[property] = this._valuesStartRepeat[property];
-                    }
-                    if (this._yoyo) {
-                        this._reversed = !this._reversed;
-                    }
-                    this._startTime += durationAndDelay * completeCount;
-                    if (this._onRepeatCallback) {
-                        this._onRepeatCallback(this._object);
-                    }
-                    this._onEveryStartCallbackFired = false;
-                    return true;
+            if (status === 'repeat' || status === 'about-to-repeat') {
+                if (this._onRepeatCallback) {
+                    this._onRepeatCallback(this._object);
                 }
-                else {
-                    if (this._onCompleteCallback) {
-                        this._onCompleteCallback(this._object);
-                    }
-                    for (var i = 0, numChainedTweens = this._chainedTweens.length; i < numChainedTweens; i++) {
-                        // Make the chained tweens start exactly at the time they should,
-                        // even if the `update()` method was called way past the duration of the tween
-                        this._chainedTweens[i].start(this._startTime + this._duration, false);
-                    }
-                    this._isPlaying = false;
-                    return false;
+                this._onEveryStartCallbackFired = false;
+            }
+            else if (status === 'completed') {
+                this._isPlaying = false;
+                if (this._onCompleteCallback) {
+                    this._onCompleteCallback(this._object);
                 }
+                for (var i = 0, numChainedTweens = this._chainedTweens.length; i < numChainedTweens; i++) {
+                    // Make the chained tweens start exactly at the time they should,
+                    // even if the `update()` method was called way past the duration of the tween
+                    this._chainedTweens[i].start(this._startTime + this._duration, false);
+                }
             }
-            return true;
+            return status !== 'completed';
         };
+        Tween.prototype._calculateElapsedPortion = function (elapsedTime, durationAndDelay, totalTime) {
+            if (this._duration === 0 || elapsedTime > totalTime) {
+                return 1;
+            }
+            var timeIntoCurrentRepeat = elapsedTime % durationAndDelay;
+            var portion = Math.min(timeIntoCurrentRepeat / this._duration, 1);
+            if (portion === 0 && elapsedTime !== 0 && elapsedTime % this._duration === 0) {
+                return 1;
+            }
+            return portion;
+        };
+        Tween.prototype._calculateCompletionStatus = function (elapsedTime, durationAndDelay) {
+            if (this._duration !== 0 && elapsedTime < this._duration) {
+                return 'playing';
+            }
+            if (this._repeat <= 0) {
+                return 'completed';
+            }
+            if (elapsedTime === this._duration) {
+                return 'about-to-repeat';
+            }
+            return 'repeat';
+        };
+        Tween.prototype._processRepetition = function (elapsedTime, durationAndDelay) {
+            var completeCount = Math.min(Math.trunc((elapsedTime - this._duration) / durationAndDelay) + 1, this._repeat);
+            if (isFinite(this._repeat)) {
+                this._repeat -= completeCount;
+            }
+            // Reassign starting values, restart by making startTime = now
+            for (var property in this._valuesStartRepeat) {
+                var valueEnd = this._valuesEnd[property];
+                if (!this._yoyo && typeof valueEnd === 'string') {
+                    this._valuesStartRepeat[property] = this._valuesStartRepeat[property] + parseFloat(valueEnd);
+                }
+                if (this._yoyo) {
+                    this._swapEndStartRepeatValues(property);
+                }
+                this._valuesStart[property] = this._valuesStartRepeat[property];
+            }
+            if (this._yoyo) {
+                this._reversed = !this._reversed;
+            }
+            this._startTime += durationAndDelay * completeCount;
+        };
         Tween.prototype._updateProperties = function (_object, _valuesStart, _valuesEnd, value) {
@@ -839,3 +850,3 @@ for (var property in _valuesEnd) {
 
-    var VERSION = '23.1.1';
+    var VERSION = '23.1.2';
 
@@ -842,0 +853,0 @@ /**

dist/tween.d.ts

@@ -140,2 +140,5 @@ type EasingFunction = (amount: number) => number;
     update(time?: number, autoStart?: boolean): boolean;
+    private _calculateElapsedPortion;
+    private _calculateCompletionStatus;
+    private _processRepetition;
     private _updateProperties;
@@ -157,3 +160,3 @@ private _handleRelativeValue;
 
-declare const VERSION = "23.1.1";
+declare const VERSION = "23.1.2";
 
@@ -160,0 +163,0 @@ declare const nextId: typeof Sequence.nextId;

dist/tween.esm.js

@@ -10,9 +10,9 @@ /**
         In: function (amount) {
-            return this.None(amount);
+            return amount;
         },
         Out: function (amount) {
-            return this.None(amount);
+            return amount;
         },
         InOut: function (amount) {
-            return this.None(amount);
+            return amount;
         },
@@ -680,3 +680,2 @@ }),
     Tween.prototype.update = function (time, autoStart) {
-        var _this = this;
         var _a;
@@ -687,3 +686,2 @@ if (time === void 0) { time = now(); }
             return true;
-        var property;
         var endTime = this._startTime + this._duration;
@@ -715,69 +713,82 @@ if (!this._goToEnd && !this._isPlaying) {
         var totalTime = this._duration + this._repeat * durationAndDelay;
-        var calculateElapsedPortion = function () {
-            if (_this._duration === 0)
-                return 1;
-            if (elapsedTime > totalTime) {
-                return 1;
-            }
-            var timesRepeated = Math.trunc(elapsedTime / durationAndDelay);
-            var timeIntoCurrentRepeat = elapsedTime - timesRepeated * durationAndDelay;
-            // TODO use %?
-            // const timeIntoCurrentRepeat = elapsedTime % durationAndDelay
-            var portion = Math.min(timeIntoCurrentRepeat / _this._duration, 1);
-            if (portion === 0 && elapsedTime === _this._duration) {
-                return 1;
-            }
-            return portion;
-        };
-        var elapsed = calculateElapsedPortion();
+        var elapsed = this._calculateElapsedPortion(elapsedTime, durationAndDelay, totalTime);
         var value = this._easingFunction(elapsed);
-        // properties transformations
+        var status = this._calculateCompletionStatus(elapsedTime, durationAndDelay);
+        if (status === 'repeat') {
+            // the current update is happening after the instant the tween repeated
+            this._processRepetition(elapsedTime, durationAndDelay);
+        }
         this._updateProperties(this._object, this._valuesStart, this._valuesEnd, value);
+        if (status === 'about-to-repeat') {
+            // the current update is happening at the exact instant the tween is going to repeat
+            // the values should match the end of the tween, not the beginning,
+            // that's why _processRepetition happens after _updateProperties
+            this._processRepetition(elapsedTime, durationAndDelay);
+        }
         if (this._onUpdateCallback) {
             this._onUpdateCallback(this._object, elapsed);
         }
-        if (this._duration === 0 || elapsedTime >= this._duration) {
-            if (this._repeat > 0) {
-                var completeCount = Math.min(Math.trunc((elapsedTime - this._duration) / durationAndDelay) + 1, this._repeat);
-                if (isFinite(this._repeat)) {
-                    this._repeat -= completeCount;
-                }
-                // Reassign starting values, restart by making startTime = now
-                for (property in this._valuesStartRepeat) {
-                    if (!this._yoyo && typeof this._valuesEnd[property] === 'string') {
-                        this._valuesStartRepeat[property] =
-                            // eslint-disable-next-line
-                            // @ts-ignore FIXME?
-                            this._valuesStartRepeat[property] + parseFloat(this._valuesEnd[property]);
-                    }
-                    if (this._yoyo) {
-                        this._swapEndStartRepeatValues(property);
-                    }
-                    this._valuesStart[property] = this._valuesStartRepeat[property];
-                }
-                if (this._yoyo) {
-                    this._reversed = !this._reversed;
-                }
-                this._startTime += durationAndDelay * completeCount;
-                if (this._onRepeatCallback) {
-                    this._onRepeatCallback(this._object);
-                }
-                this._onEveryStartCallbackFired = false;
-                return true;
+        if (status === 'repeat' || status === 'about-to-repeat') {
+            if (this._onRepeatCallback) {
+                this._onRepeatCallback(this._object);
             }
-            else {
-                if (this._onCompleteCallback) {
-                    this._onCompleteCallback(this._object);
-                }
-                for (var i = 0, numChainedTweens = this._chainedTweens.length; i < numChainedTweens; i++) {
-                    // Make the chained tweens start exactly at the time they should,
-                    // even if the `update()` method was called way past the duration of the tween
-                    this._chainedTweens[i].start(this._startTime + this._duration, false);
-                }
-                this._isPlaying = false;
-                return false;
+            this._onEveryStartCallbackFired = false;
+        }
+        else if (status === 'completed') {
+            this._isPlaying = false;
+            if (this._onCompleteCallback) {
+                this._onCompleteCallback(this._object);
             }
+            for (var i = 0, numChainedTweens = this._chainedTweens.length; i < numChainedTweens; i++) {
+                // Make the chained tweens start exactly at the time they should,
+                // even if the `update()` method was called way past the duration of the tween
+                this._chainedTweens[i].start(this._startTime + this._duration, false);
+            }
         }
-        return true;
+        return status !== 'completed';
     };
+    Tween.prototype._calculateElapsedPortion = function (elapsedTime, durationAndDelay, totalTime) {
+        if (this._duration === 0 || elapsedTime > totalTime) {
+            return 1;
+        }
+        var timeIntoCurrentRepeat = elapsedTime % durationAndDelay;
+        var portion = Math.min(timeIntoCurrentRepeat / this._duration, 1);
+        if (portion === 0 && elapsedTime !== 0 && elapsedTime % this._duration === 0) {
+            return 1;
+        }
+        return portion;
+    };
+    Tween.prototype._calculateCompletionStatus = function (elapsedTime, durationAndDelay) {
+        if (this._duration !== 0 && elapsedTime < this._duration) {
+            return 'playing';
+        }
+        if (this._repeat <= 0) {
+            return 'completed';
+        }
+        if (elapsedTime === this._duration) {
+            return 'about-to-repeat';
+        }
+        return 'repeat';
+    };
+    Tween.prototype._processRepetition = function (elapsedTime, durationAndDelay) {
+        var completeCount = Math.min(Math.trunc((elapsedTime - this._duration) / durationAndDelay) + 1, this._repeat);
+        if (isFinite(this._repeat)) {
+            this._repeat -= completeCount;
+        }
+        // Reassign starting values, restart by making startTime = now
+        for (var property in this._valuesStartRepeat) {
+            var valueEnd = this._valuesEnd[property];
+            if (!this._yoyo && typeof valueEnd === 'string') {
+                this._valuesStartRepeat[property] = this._valuesStartRepeat[property] + parseFloat(valueEnd);
+            }
+            if (this._yoyo) {
+                this._swapEndStartRepeatValues(property);
+            }
+            this._valuesStart[property] = this._valuesStartRepeat[property];
+        }
+        if (this._yoyo) {
+            this._reversed = !this._reversed;
+        }
+        this._startTime += durationAndDelay * completeCount;
+    };
     Tween.prototype._updateProperties = function (_object, _valuesStart, _valuesEnd, value) {
@@ -837,3 +848,3 @@ for (var property in _valuesEnd) {
 
-var VERSION = '23.1.1';
+var VERSION = '23.1.2';
 
@@ -840,0 +851,0 @@ /**

dist/tween.umd.js

@@ -16,9 +16,9 @@ (function (global, factory) {
             In: function (amount) {
-                return this.None(amount);
+                return amount;
             },
             Out: function (amount) {
-                return this.None(amount);
+                return amount;
             },
             InOut: function (amount) {
-                return this.None(amount);
+                return amount;
             },
@@ -686,3 +686,2 @@ }),
         Tween.prototype.update = function (time, autoStart) {
-            var _this = this;
             var _a;
@@ -693,3 +692,2 @@ if (time === void 0) { time = now(); }
                 return true;
-            var property;
             var endTime = this._startTime + this._duration;
@@ -721,69 +719,82 @@ if (!this._goToEnd && !this._isPlaying) {
             var totalTime = this._duration + this._repeat * durationAndDelay;
-            var calculateElapsedPortion = function () {
-                if (_this._duration === 0)
-                    return 1;
-                if (elapsedTime > totalTime) {
-                    return 1;
-                }
-                var timesRepeated = Math.trunc(elapsedTime / durationAndDelay);
-                var timeIntoCurrentRepeat = elapsedTime - timesRepeated * durationAndDelay;
-                // TODO use %?
-                // const timeIntoCurrentRepeat = elapsedTime % durationAndDelay
-                var portion = Math.min(timeIntoCurrentRepeat / _this._duration, 1);
-                if (portion === 0 && elapsedTime === _this._duration) {
-                    return 1;
-                }
-                return portion;
-            };
-            var elapsed = calculateElapsedPortion();
+            var elapsed = this._calculateElapsedPortion(elapsedTime, durationAndDelay, totalTime);
             var value = this._easingFunction(elapsed);
-            // properties transformations
+            var status = this._calculateCompletionStatus(elapsedTime, durationAndDelay);
+            if (status === 'repeat') {
+                // the current update is happening after the instant the tween repeated
+                this._processRepetition(elapsedTime, durationAndDelay);
+            }
             this._updateProperties(this._object, this._valuesStart, this._valuesEnd, value);
+            if (status === 'about-to-repeat') {
+                // the current update is happening at the exact instant the tween is going to repeat
+                // the values should match the end of the tween, not the beginning,
+                // that's why _processRepetition happens after _updateProperties
+                this._processRepetition(elapsedTime, durationAndDelay);
+            }
             if (this._onUpdateCallback) {
                 this._onUpdateCallback(this._object, elapsed);
             }
-            if (this._duration === 0 || elapsedTime >= this._duration) {
-                if (this._repeat > 0) {
-                    var completeCount = Math.min(Math.trunc((elapsedTime - this._duration) / durationAndDelay) + 1, this._repeat);
-                    if (isFinite(this._repeat)) {
-                        this._repeat -= completeCount;
-                    }
-                    // Reassign starting values, restart by making startTime = now
-                    for (property in this._valuesStartRepeat) {
-                        if (!this._yoyo && typeof this._valuesEnd[property] === 'string') {
-                            this._valuesStartRepeat[property] =
-                                // eslint-disable-next-line
-                                // @ts-ignore FIXME?
-                                this._valuesStartRepeat[property] + parseFloat(this._valuesEnd[property]);
-                        }
-                        if (this._yoyo) {
-                            this._swapEndStartRepeatValues(property);
-                        }
-                        this._valuesStart[property] = this._valuesStartRepeat[property];
-                    }
-                    if (this._yoyo) {
-                        this._reversed = !this._reversed;
-                    }
-                    this._startTime += durationAndDelay * completeCount;
-                    if (this._onRepeatCallback) {
-                        this._onRepeatCallback(this._object);
-                    }
-                    this._onEveryStartCallbackFired = false;
-                    return true;
+            if (status === 'repeat' || status === 'about-to-repeat') {
+                if (this._onRepeatCallback) {
+                    this._onRepeatCallback(this._object);
                 }
-                else {
-                    if (this._onCompleteCallback) {
-                        this._onCompleteCallback(this._object);
-                    }
-                    for (var i = 0, numChainedTweens = this._chainedTweens.length; i < numChainedTweens; i++) {
-                        // Make the chained tweens start exactly at the time they should,
-                        // even if the `update()` method was called way past the duration of the tween
-                        this._chainedTweens[i].start(this._startTime + this._duration, false);
-                    }
-                    this._isPlaying = false;
-                    return false;
+                this._onEveryStartCallbackFired = false;
+            }
+            else if (status === 'completed') {
+                this._isPlaying = false;
+                if (this._onCompleteCallback) {
+                    this._onCompleteCallback(this._object);
                 }
+                for (var i = 0, numChainedTweens = this._chainedTweens.length; i < numChainedTweens; i++) {
+                    // Make the chained tweens start exactly at the time they should,
+                    // even if the `update()` method was called way past the duration of the tween
+                    this._chainedTweens[i].start(this._startTime + this._duration, false);
+                }
             }
-            return true;
+            return status !== 'completed';
         };
+        Tween.prototype._calculateElapsedPortion = function (elapsedTime, durationAndDelay, totalTime) {
+            if (this._duration === 0 || elapsedTime > totalTime) {
+                return 1;
+            }
+            var timeIntoCurrentRepeat = elapsedTime % durationAndDelay;
+            var portion = Math.min(timeIntoCurrentRepeat / this._duration, 1);
+            if (portion === 0 && elapsedTime !== 0 && elapsedTime % this._duration === 0) {
+                return 1;
+            }
+            return portion;
+        };
+        Tween.prototype._calculateCompletionStatus = function (elapsedTime, durationAndDelay) {
+            if (this._duration !== 0 && elapsedTime < this._duration) {
+                return 'playing';
+            }
+            if (this._repeat <= 0) {
+                return 'completed';
+            }
+            if (elapsedTime === this._duration) {
+                return 'about-to-repeat';
+            }
+            return 'repeat';
+        };
+        Tween.prototype._processRepetition = function (elapsedTime, durationAndDelay) {
+            var completeCount = Math.min(Math.trunc((elapsedTime - this._duration) / durationAndDelay) + 1, this._repeat);
+            if (isFinite(this._repeat)) {
+                this._repeat -= completeCount;
+            }
+            // Reassign starting values, restart by making startTime = now
+            for (var property in this._valuesStartRepeat) {
+                var valueEnd = this._valuesEnd[property];
+                if (!this._yoyo && typeof valueEnd === 'string') {
+                    this._valuesStartRepeat[property] = this._valuesStartRepeat[property] + parseFloat(valueEnd);
+                }
+                if (this._yoyo) {
+                    this._swapEndStartRepeatValues(property);
+                }
+                this._valuesStart[property] = this._valuesStartRepeat[property];
+            }
+            if (this._yoyo) {
+                this._reversed = !this._reversed;
+            }
+            this._startTime += durationAndDelay * completeCount;
+        };
         Tween.prototype._updateProperties = function (_object, _valuesStart, _valuesEnd, value) {
@@ -843,3 +854,3 @@ for (var property in _valuesEnd) {
 
-    var VERSION = '23.1.1';
+    var VERSION = '23.1.2';
 
@@ -846,0 +857,0 @@ /**

package.json

 {
 	"name": "@tweenjs/tween.js",
 	"description": "Simple and fast tweening engine with optimised Robert Penner's equations.",
-	"version": "23.1.1",
+	"version": "23.1.2",
 	"type": "module",
@@ -42,6 +42,6 @@ "main": "dist/tween.cjs",
 		"examples": "npx serve .",
-		"test": "npm run build && npm run test-lint && npm run test-unit",
+		"test": "npm run build && npm run format-check && npm run test-unit",
 		"test-unit": "nodeunit test/unit/nodeunitheadless.cjs",
-		"test-lint": "npm run prettier -- --check",
-		"lint": "npm run prettier -- --write",
+		"format-check": "npm run prettier -- --check",
+		"format": "npm run prettier -- --write",
 		"prettier": "prettier .",
@@ -48,0 +48,0 @@ "prepare": "npm run build",

README.md

@@ -12,3 +12,3 @@ # tween.js
 
----
+# Example
 
@@ -52,4 +52,7 @@ ```html
 
-[Try this example on CodePen](https://codepen.io/trusktr/pen/KKGaBVz?editors=1000)
+[Try the above example on CodePen](https://codepen.io/trusktr/pen/KKGaBVz?editors=1000)
 
+Animate numbers in any JavaScript object. For example, [rotate a 3D box made
+with Three.js](https://codepen.io/trusktr/pen/ExJqvgZ):
+
 # Installation
@@ -56,0 +59,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

163796

increased by1.44%

Lines of code

3762

increased by1.27%

Number of lines in readme file

400

increased by0.76%

No dependency changes