@tweenjs/tween.js 18.6.4 → 20.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/tween.cjs.js CHANGED
@@ -5,13 +5,22 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  /**
6
6
  * The Ease class provides a collection of easing functions for use with tween.js.
7
7
  */
8
- var Easing = {
9
- Linear: {
8
+ var Easing = Object.freeze({
9
+ Linear: Object.freeze({
10
10
  None: function (amount) {
11
11
  return amount;
12
12
  },
13
- },
14
- Quadratic: {
13
+ In: function (amount) {
14
+ return this.None(amount);
15
+ },
16
+ Out: function (amount) {
17
+ return this.None(amount);
18
+ },
19
+ InOut: function (amount) {
20
+ return this.None(amount);
21
+ },
22
+ }),
23
+ Quadratic: Object.freeze({
15
24
  In: function (amount) {
16
25
  return amount * amount;
17
26
  },
@@ -24,8 +33,8 @@ var Easing = {
24
33
  }
25
34
  return -0.5 * (--amount * (amount - 2) - 1);
26
35
  },
27
- },
28
- Cubic: {
36
+ }),
37
+ Cubic: Object.freeze({
29
38
  In: function (amount) {
30
39
  return amount * amount * amount;
31
40
  },
@@ -38,8 +47,8 @@ var Easing = {
38
47
  }
39
48
  return 0.5 * ((amount -= 2) * amount * amount + 2);
40
49
  },
41
- },
42
- Quartic: {
50
+ }),
51
+ Quartic: Object.freeze({
43
52
  In: function (amount) {
44
53
  return amount * amount * amount * amount;
45
54
  },
@@ -52,8 +61,8 @@ var Easing = {
52
61
  }
53
62
  return -0.5 * ((amount -= 2) * amount * amount * amount - 2);
54
63
  },
55
- },
56
- Quintic: {
64
+ }),
65
+ Quintic: Object.freeze({
57
66
  In: function (amount) {
58
67
  return amount * amount * amount * amount * amount;
59
68
  },
@@ -66,19 +75,19 @@ var Easing = {
66
75
  }
67
76
  return 0.5 * ((amount -= 2) * amount * amount * amount * amount + 2);
68
77
  },
69
- },
70
- Sinusoidal: {
78
+ }),
79
+ Sinusoidal: Object.freeze({
71
80
  In: function (amount) {
72
- return 1 - Math.cos((amount * Math.PI) / 2);
81
+ return 1 - Math.sin(((1.0 - amount) * Math.PI) / 2);
73
82
  },
74
83
  Out: function (amount) {
75
84
  return Math.sin((amount * Math.PI) / 2);
76
85
  },
77
86
  InOut: function (amount) {
78
- return 0.5 * (1 - Math.cos(Math.PI * amount));
87
+ return 0.5 * (1 - Math.sin(Math.PI * (0.5 - amount)));
79
88
  },
80
- },
81
- Exponential: {
89
+ }),
90
+ Exponential: Object.freeze({
82
91
  In: function (amount) {
83
92
  return amount === 0 ? 0 : Math.pow(1024, amount - 1);
84
93
  },
@@ -97,8 +106,8 @@ var Easing = {
97
106
  }
98
107
  return 0.5 * (-Math.pow(2, -10 * (amount - 1)) + 2);
99
108
  },
100
- },
101
- Circular: {
109
+ }),
110
+ Circular: Object.freeze({
102
111
  In: function (amount) {
103
112
  return 1 - Math.sqrt(1 - amount * amount);
104
113
  },
@@ -111,8 +120,8 @@ var Easing = {
111
120
  }
112
121
  return 0.5 * (Math.sqrt(1 - (amount -= 2) * amount) + 1);
113
122
  },
114
- },
115
- Elastic: {
123
+ }),
124
+ Elastic: Object.freeze({
116
125
  In: function (amount) {
117
126
  if (amount === 0) {
118
127
  return 0;
@@ -144,15 +153,15 @@ var Easing = {
144
153
  }
145
154
  return 0.5 * Math.pow(2, -10 * (amount - 1)) * Math.sin((amount - 1.1) * 5 * Math.PI) + 1;
146
155
  },
147
- },
148
- Back: {
156
+ }),
157
+ Back: Object.freeze({
149
158
  In: function (amount) {
150
159
  var s = 1.70158;
151
- return amount * amount * ((s + 1) * amount - s);
160
+ return amount === 1 ? 1 : amount * amount * ((s + 1) * amount - s);
152
161
  },
153
162
  Out: function (amount) {
154
163
  var s = 1.70158;
155
- return --amount * amount * ((s + 1) * amount + s) + 1;
164
+ return amount === 0 ? 0 : --amount * amount * ((s + 1) * amount + s) + 1;
156
165
  },
157
166
  InOut: function (amount) {
158
167
  var s = 1.70158 * 1.525;
@@ -161,8 +170,8 @@ var Easing = {
161
170
  }
162
171
  return 0.5 * ((amount -= 2) * amount * ((s + 1) * amount + s) + 2);
163
172
  },
164
- },
165
- Bounce: {
173
+ }),
174
+ Bounce: Object.freeze({
166
175
  In: function (amount) {
167
176
  return 1 - Easing.Bounce.Out(1 - amount);
168
177
  },
@@ -186,40 +195,29 @@ var Easing = {
186
195
  }
187
196
  return Easing.Bounce.Out(amount * 2 - 1) * 0.5 + 0.5;
188
197
  },
198
+ }),
199
+ generatePow: function (power) {
200
+ if (power === void 0) { power = 4; }
201
+ power = power < Number.EPSILON ? Number.EPSILON : power;
202
+ power = power > 10000 ? 10000 : power;
203
+ return {
204
+ In: function (amount) {
205
+ return Math.pow(amount, power);
206
+ },
207
+ Out: function (amount) {
208
+ return 1 - Math.pow((1 - amount), power);
209
+ },
210
+ InOut: function (amount) {
211
+ if (amount < 0.5) {
212
+ return Math.pow((amount * 2), power) / 2;
213
+ }
214
+ return (1 - Math.pow((2 - amount * 2), power)) / 2 + 0.5;
215
+ },
216
+ };
189
217
  },
190
- };
218
+ });
191
219
 
192
- var now;
193
- // Include a performance.now polyfill.
194
- // In node.js, use process.hrtime.
195
- // eslint-disable-next-line
196
- // @ts-ignore
197
- if (typeof self === 'undefined' && typeof process !== 'undefined' && process.hrtime) {
198
- now = function () {
199
- // eslint-disable-next-line
200
- // @ts-ignore
201
- var time = process.hrtime();
202
- // Convert [seconds, nanoseconds] to milliseconds.
203
- return time[0] * 1000 + time[1] / 1000000;
204
- };
205
- }
206
- // In a browser, use self.performance.now if it is available.
207
- else if (typeof self !== 'undefined' && self.performance !== undefined && self.performance.now !== undefined) {
208
- // This must be bound, because directly assigning this function
209
- // leads to an invocation exception in Chrome.
210
- now = self.performance.now.bind(self.performance);
211
- }
212
- // Use Date.now if it is available.
213
- else if (Date.now !== undefined) {
214
- now = Date.now;
215
- }
216
- // Otherwise, use 'new Date().getTime()'.
217
- else {
218
- now = function () {
219
- return new Date().getTime();
220
- };
221
- }
222
- var now$1 = now;
220
+ var now = function () { return performance.now(); };
223
221
 
224
222
  /**
225
223
  * Controlling groups of tweens
@@ -250,7 +248,7 @@ var Group = /** @class */ (function () {
250
248
  delete this._tweensAddedDuringUpdate[tween.getId()];
251
249
  };
252
250
  Group.prototype.update = function (time, preserve) {
253
- if (time === void 0) { time = now$1(); }
251
+ if (time === void 0) { time = now(); }
254
252
  if (preserve === void 0) { preserve = false; }
255
253
  var tweenIds = Object.keys(this._tweens);
256
254
  if (tweenIds.length === 0) {
@@ -391,6 +389,7 @@ var Tween = /** @class */ (function () {
391
389
  this._valuesEnd = {};
392
390
  this._valuesStartRepeat = {};
393
391
  this._duration = 1000;
392
+ this._isDynamic = false;
394
393
  this._initialRepeat = 0;
395
394
  this._repeat = 0;
396
395
  this._yoyo = false;
@@ -400,10 +399,13 @@ var Tween = /** @class */ (function () {
400
399
  this._startTime = 0;
401
400
  this._easingFunction = Easing.Linear.None;
402
401
  this._interpolationFunction = Interpolation.Linear;
402
+ // eslint-disable-next-line
403
403
  this._chainedTweens = [];
404
404
  this._onStartCallbackFired = false;
405
+ this._onEveryStartCallbackFired = false;
405
406
  this._id = Sequence.nextId();
406
407
  this._isChainStopped = false;
408
+ this._propertiesAreSetUp = false;
407
409
  this._goToEnd = false;
408
410
  }
409
411
  Tween.prototype.getId = function () {
@@ -415,22 +417,28 @@ var Tween = /** @class */ (function () {
415
417
  Tween.prototype.isPaused = function () {
416
418
  return this._isPaused;
417
419
  };
418
- Tween.prototype.to = function (properties, duration) {
419
- // TODO? restore this, then update the 07_dynamic_to example to set fox
420
- // tween's to on each update. That way the behavior is opt-in (there's
421
- // currently no opt-out).
422
- // for (const prop in properties) this._valuesEnd[prop] = properties[prop]
423
- this._valuesEnd = Object.create(properties);
424
- if (duration !== undefined) {
425
- this._duration = duration;
426
- }
420
+ Tween.prototype.to = function (target, duration) {
421
+ if (duration === void 0) { duration = 1000; }
422
+ if (this._isPlaying)
423
+ throw new Error('Can not call Tween.to() while Tween is already started or paused. Stop the Tween first.');
424
+ this._valuesEnd = target;
425
+ this._propertiesAreSetUp = false;
426
+ this._duration = duration;
427
427
  return this;
428
428
  };
429
- Tween.prototype.duration = function (d) {
430
- this._duration = d;
429
+ Tween.prototype.duration = function (duration) {
430
+ if (duration === void 0) { duration = 1000; }
431
+ this._duration = duration;
431
432
  return this;
432
433
  };
433
- Tween.prototype.start = function (time) {
434
+ Tween.prototype.dynamic = function (dynamic) {
435
+ if (dynamic === void 0) { dynamic = false; }
436
+ this._isDynamic = dynamic;
437
+ return this;
438
+ };
439
+ Tween.prototype.start = function (time, overrideStartingValues) {
440
+ if (time === void 0) { time = now(); }
441
+ if (overrideStartingValues === void 0) { overrideStartingValues = false; }
434
442
  if (this._isPlaying) {
435
443
  return this;
436
444
  }
@@ -449,13 +457,27 @@ var Tween = /** @class */ (function () {
449
457
  this._isPlaying = true;
450
458
  this._isPaused = false;
451
459
  this._onStartCallbackFired = false;
460
+ this._onEveryStartCallbackFired = false;
452
461
  this._isChainStopped = false;
453
- this._startTime = time !== undefined ? (typeof time === 'string' ? now$1() + parseFloat(time) : time) : now$1();
462
+ this._startTime = time;
454
463
  this._startTime += this._delayTime;
455
- this._setupProperties(this._object, this._valuesStart, this._valuesEnd, this._valuesStartRepeat);
464
+ if (!this._propertiesAreSetUp || overrideStartingValues) {
465
+ this._propertiesAreSetUp = true;
466
+ // If dynamic is not enabled, clone the end values instead of using the passed-in end values.
467
+ if (!this._isDynamic) {
468
+ var tmp = {};
469
+ for (var prop in this._valuesEnd)
470
+ tmp[prop] = this._valuesEnd[prop];
471
+ this._valuesEnd = tmp;
472
+ }
473
+ this._setupProperties(this._object, this._valuesStart, this._valuesEnd, this._valuesStartRepeat, overrideStartingValues);
474
+ }
456
475
  return this;
457
476
  };
458
- Tween.prototype._setupProperties = function (_object, _valuesStart, _valuesEnd, _valuesStartRepeat) {
477
+ Tween.prototype.startFromCurrentValues = function (time) {
478
+ return this.start(time, true);
479
+ };
480
+ Tween.prototype._setupProperties = function (_object, _valuesStart, _valuesEnd, _valuesStartRepeat, overrideStartingValues) {
459
481
  for (var property in _valuesEnd) {
460
482
  var startValue = _object[property];
461
483
  var startValueIsArray = Array.isArray(startValue);
@@ -472,28 +494,46 @@ var Tween = /** @class */ (function () {
472
494
  if (endValues.length === 0) {
473
495
  continue;
474
496
  }
475
- // handle an array of relative values
476
- endValues = endValues.map(this._handleRelativeValue.bind(this, startValue));
477
- // Create a local copy of the Array with the start value at the front
478
- _valuesEnd[property] = [startValue].concat(endValues);
497
+ // Handle an array of relative values.
498
+ // Creates a local copy of the Array with the start value at the front
499
+ var temp = [startValue];
500
+ for (var i = 0, l = endValues.length; i < l; i += 1) {
501
+ var value = this._handleRelativeValue(startValue, endValues[i]);
502
+ if (isNaN(value)) {
503
+ isInterpolationList = false;
504
+ console.warn('Found invalid interpolation list. Skipping.');
505
+ break;
506
+ }
507
+ temp.push(value);
508
+ }
509
+ if (isInterpolationList) {
510
+ // if (_valuesStart[property] === undefined) { // handle end values only the first time. NOT NEEDED? setupProperties is now guarded by _propertiesAreSetUp.
511
+ _valuesEnd[property] = temp;
512
+ // }
513
+ }
479
514
  }
480
515
  // handle the deepness of the values
481
516
  if ((propType === 'object' || startValueIsArray) && startValue && !isInterpolationList) {
482
517
  _valuesStart[property] = startValueIsArray ? [] : {};
483
- // eslint-disable-next-line
484
- for (var prop in startValue) {
485
- // eslint-disable-next-line
486
- // @ts-ignore FIXME?
487
- _valuesStart[property][prop] = startValue[prop];
518
+ var nestedObject = startValue;
519
+ for (var prop in nestedObject) {
520
+ _valuesStart[property][prop] = nestedObject[prop];
488
521
  }
489
- _valuesStartRepeat[property] = startValueIsArray ? [] : {}; // TODO? repeat nested values? And yoyo? And array values?
490
- // eslint-disable-next-line
491
- // @ts-ignore FIXME?
492
- this._setupProperties(startValue, _valuesStart[property], _valuesEnd[property], _valuesStartRepeat[property]);
522
+ // TODO? repeat nested values? And yoyo? And array values?
523
+ _valuesStartRepeat[property] = startValueIsArray ? [] : {};
524
+ var endValues = _valuesEnd[property];
525
+ // If dynamic is not enabled, clone the end values instead of using the passed-in end values.
526
+ if (!this._isDynamic) {
527
+ var tmp = {};
528
+ for (var prop in endValues)
529
+ tmp[prop] = endValues[prop];
530
+ _valuesEnd[property] = endValues = tmp;
531
+ }
532
+ this._setupProperties(nestedObject, _valuesStart[property], endValues, _valuesStartRepeat[property], overrideStartingValues);
493
533
  }
494
534
  else {
495
- // Save the starting value, but only once.
496
- if (typeof _valuesStart[property] === 'undefined') {
535
+ // Save the starting value, but only once unless override is requested.
536
+ if (typeof _valuesStart[property] === 'undefined' || overrideStartingValues) {
497
537
  _valuesStart[property] = startValue;
498
538
  }
499
539
  if (!startValueIsArray) {
@@ -535,7 +575,7 @@ var Tween = /** @class */ (function () {
535
575
  return this;
536
576
  };
537
577
  Tween.prototype.pause = function (time) {
538
- if (time === void 0) { time = now$1(); }
578
+ if (time === void 0) { time = now(); }
539
579
  if (this._isPaused || !this._isPlaying) {
540
580
  return this;
541
581
  }
@@ -546,7 +586,7 @@ var Tween = /** @class */ (function () {
546
586
  return this;
547
587
  };
548
588
  Tween.prototype.resume = function (time) {
549
- if (time === void 0) { time = now$1(); }
589
+ if (time === void 0) { time = now(); }
550
590
  if (!this._isPaused || !this._isPlaying) {
551
591
  return this;
552
592
  }
@@ -564,14 +604,17 @@ var Tween = /** @class */ (function () {
564
604
  return this;
565
605
  };
566
606
  Tween.prototype.group = function (group) {
607
+ if (group === void 0) { group = mainGroup; }
567
608
  this._group = group;
568
609
  return this;
569
610
  };
570
611
  Tween.prototype.delay = function (amount) {
612
+ if (amount === void 0) { amount = 0; }
571
613
  this._delayTime = amount;
572
614
  return this;
573
615
  };
574
616
  Tween.prototype.repeat = function (times) {
617
+ if (times === void 0) { times = 0; }
575
618
  this._initialRepeat = times;
576
619
  this._repeat = times;
577
620
  return this;
@@ -581,17 +624,21 @@ var Tween = /** @class */ (function () {
581
624
  return this;
582
625
  };
583
626
  Tween.prototype.yoyo = function (yoyo) {
627
+ if (yoyo === void 0) { yoyo = false; }
584
628
  this._yoyo = yoyo;
585
629
  return this;
586
630
  };
587
631
  Tween.prototype.easing = function (easingFunction) {
632
+ if (easingFunction === void 0) { easingFunction = Easing.Linear.None; }
588
633
  this._easingFunction = easingFunction;
589
634
  return this;
590
635
  };
591
636
  Tween.prototype.interpolation = function (interpolationFunction) {
637
+ if (interpolationFunction === void 0) { interpolationFunction = Interpolation.Linear; }
592
638
  this._interpolationFunction = interpolationFunction;
593
639
  return this;
594
640
  };
641
+ // eslint-disable-next-line
595
642
  Tween.prototype.chain = function () {
596
643
  var tweens = [];
597
644
  for (var _i = 0; _i < arguments.length; _i++) {
@@ -604,6 +651,10 @@ var Tween = /** @class */ (function () {
604
651
  this._onStartCallback = callback;
605
652
  return this;
606
653
  };
654
+ Tween.prototype.onEveryStart = function (callback) {
655
+ this._onEveryStartCallback = callback;
656
+ return this;
657
+ };
607
658
  Tween.prototype.onUpdate = function (callback) {
608
659
  this._onUpdateCallback = callback;
609
660
  return this;
@@ -626,7 +677,7 @@ var Tween = /** @class */ (function () {
626
677
  * it is still playing, just paused).
627
678
  */
628
679
  Tween.prototype.update = function (time, autoStart) {
629
- if (time === void 0) { time = now$1(); }
680
+ if (time === void 0) { time = now(); }
630
681
  if (autoStart === void 0) { autoStart = true; }
631
682
  if (this._isPaused)
632
683
  return true;
@@ -637,7 +688,7 @@ var Tween = /** @class */ (function () {
637
688
  if (time > endTime)
638
689
  return false;
639
690
  if (autoStart)
640
- this.start(time);
691
+ this.start(time, true);
641
692
  }
642
693
  this._goToEnd = false;
643
694
  if (time < this._startTime) {
@@ -649,6 +700,12 @@ var Tween = /** @class */ (function () {
649
700
  }
650
701
  this._onStartCallbackFired = true;
651
702
  }
703
+ if (this._onEveryStartCallbackFired === false) {
704
+ if (this._onEveryStartCallback) {
705
+ this._onEveryStartCallback(this._object);
706
+ }
707
+ this._onEveryStartCallbackFired = true;
708
+ }
652
709
  elapsed = (time - this._startTime) / this._duration;
653
710
  elapsed = this._duration === 0 || elapsed > 1 ? 1 : elapsed;
654
711
  var value = this._easingFunction(elapsed);
@@ -687,6 +744,7 @@ var Tween = /** @class */ (function () {
687
744
  if (this._onRepeatCallback) {
688
745
  this._onRepeatCallback(this._object);
689
746
  }
747
+ this._onEveryStartCallbackFired = false;
690
748
  return true;
691
749
  }
692
750
  else {
@@ -696,7 +754,7 @@ var Tween = /** @class */ (function () {
696
754
  for (var i = 0, numChainedTweens = this._chainedTweens.length; i < numChainedTweens; i++) {
697
755
  // Make the chained tweens start exactly at the time they should,
698
756
  // even if the `update()` method was called way past the duration of the tween
699
- this._chainedTweens[i].start(this._startTime + this._duration);
757
+ this._chainedTweens[i].start(this._startTime + this._duration, false);
700
758
  }
701
759
  this._isPlaying = false;
702
760
  return false;
@@ -742,9 +800,7 @@ var Tween = /** @class */ (function () {
742
800
  if (end.charAt(0) === '+' || end.charAt(0) === '-') {
743
801
  return start + parseFloat(end);
744
802
  }
745
- else {
746
- return parseFloat(end);
747
- }
803
+ return parseFloat(end);
748
804
  };
749
805
  Tween.prototype._swapEndStartRepeatValues = function (property) {
750
806
  var tmp = this._valuesStartRepeat[property];
@@ -760,7 +816,7 @@ var Tween = /** @class */ (function () {
760
816
  return Tween;
761
817
  }());
762
818
 
763
- var VERSION = '18.6.4';
819
+ var VERSION = '20.0.0';
764
820
 
765
821
  /**
766
822
  * Tween.js - Licensed under the MIT license
@@ -791,7 +847,7 @@ var exports$1 = {
791
847
  Easing: Easing,
792
848
  Group: Group,
793
849
  Interpolation: Interpolation,
794
- now: now$1,
850
+ now: now,
795
851
  Sequence: Sequence,
796
852
  nextId: nextId,
797
853
  Tween: Tween,
@@ -813,7 +869,7 @@ exports.add = add;
813
869
  exports.default = exports$1;
814
870
  exports.getAll = getAll;
815
871
  exports.nextId = nextId;
816
- exports.now = now$1;
872
+ exports.now = now;
817
873
  exports.remove = remove;
818
874
  exports.removeAll = removeAll;
819
875
  exports.update = update;