Tween.js 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912
  1. /**
  2. * Tween.js - Licensed under the MIT license
  3. * https://github.com/tweenjs/tween.js
  4. * ----------------------------------------------
  5. *
  6. * See https://github.com/tweenjs/tween.js/graphs/contributors for the full list of contributors.
  7. * Thank you all, you're awesome!
  8. */
  9. var _Group = function () {
  10. this._tweens = {};
  11. this._tweensAddedDuringUpdate = {};
  12. };
  13. _Group.prototype = {
  14. getAll: function () {
  15. return Object.keys(this._tweens).map(function (tweenId) {
  16. return this._tweens[tweenId];
  17. }.bind(this));
  18. },
  19. removeAll: function () {
  20. this._tweens = {};
  21. },
  22. add: function (tween) {
  23. this._tweens[tween.getId()] = tween;
  24. this._tweensAddedDuringUpdate[tween.getId()] = tween;
  25. },
  26. remove: function (tween) {
  27. delete this._tweens[tween.getId()];
  28. delete this._tweensAddedDuringUpdate[tween.getId()];
  29. },
  30. update: function (time, preserve) {
  31. var tweenIds = Object.keys(this._tweens);
  32. if (tweenIds.length === 0) {
  33. return false;
  34. }
  35. time = time !== undefined ? time : TWEEN.now();
  36. // Tweens are updated in "batches". If you add a new tween during an update, then the
  37. // new tween will be updated in the next batch.
  38. // If you remove a tween during an update, it may or may not be updated. However,
  39. // if the removed tween was added during the current batch, then it will not be updated.
  40. while (tweenIds.length > 0) {
  41. this._tweensAddedDuringUpdate = {};
  42. for (var i = 0; i < tweenIds.length; i++) {
  43. var tween = this._tweens[tweenIds[i]];
  44. if (tween && tween.update(time) === false) {
  45. tween._isPlaying = false;
  46. if (!preserve) {
  47. delete this._tweens[tweenIds[i]];
  48. }
  49. }
  50. }
  51. tweenIds = Object.keys(this._tweensAddedDuringUpdate);
  52. }
  53. return true;
  54. }
  55. };
  56. var TWEEN = new _Group();
  57. TWEEN.Group = _Group;
  58. TWEEN._nextId = 0;
  59. TWEEN.nextId = function () {
  60. return TWEEN._nextId++;
  61. };
  62. // Include a performance.now polyfill.
  63. // In node.js, use process.hrtime.
  64. if (typeof (window) === 'undefined' && typeof (process) !== 'undefined') {
  65. TWEEN.now = function () {
  66. var time = process.hrtime();
  67. // Convert [seconds, nanoseconds] to milliseconds.
  68. return time[0] * 1000 + time[1] / 1000000;
  69. };
  70. }
  71. // In a browser, use window.performance.now if it is available.
  72. else if (typeof (window) !== 'undefined' &&
  73. window.performance !== undefined &&
  74. window.performance.now !== undefined) {
  75. // This must be bound, because directly assigning this function
  76. // leads to an invocation exception in Chrome.
  77. TWEEN.now = window.performance.now.bind(window.performance);
  78. }
  79. // Use Date.now if it is available.
  80. else if (Date.now !== undefined) {
  81. TWEEN.now = Date.now;
  82. }
  83. // Otherwise, use 'new Date().getTime()'.
  84. else {
  85. TWEEN.now = function () {
  86. return new Date().getTime();
  87. };
  88. }
  89. TWEEN.Tween = function (object, group) {
  90. this._object = object;
  91. this._valuesStart = {};
  92. this._valuesEnd = {};
  93. this._valuesStartRepeat = {};
  94. this._duration = 1000;
  95. this._repeat = 0;
  96. this._repeatDelayTime = undefined;
  97. this._yoyo = false;
  98. this._isPlaying = false;
  99. this._reversed = false;
  100. this._delayTime = 0;
  101. this._startTime = null;
  102. this._easingFunction = TWEEN.Easing.Linear.None;
  103. this._interpolationFunction = TWEEN.Interpolation.Linear;
  104. this._chainedTweens = [];
  105. this._onStartCallback = null;
  106. this._onStartCallbackFired = false;
  107. this._onUpdateCallback = null;
  108. this._onCompleteCallback = null;
  109. this._onStopCallback = null;
  110. this._group = group || TWEEN;
  111. this._id = TWEEN.nextId();
  112. };
  113. TWEEN.Tween.prototype = {
  114. getId: function getId() {
  115. return this._id;
  116. },
  117. isPlaying: function isPlaying() {
  118. return this._isPlaying;
  119. },
  120. to: function to(properties, duration) {
  121. this._valuesEnd = properties;
  122. if (duration !== undefined) {
  123. this._duration = duration;
  124. }
  125. return this;
  126. },
  127. start: function start(time) {
  128. this._group.add(this);
  129. this._isPlaying = true;
  130. this._onStartCallbackFired = false;
  131. this._startTime = time !== undefined ? typeof time === 'string' ? TWEEN.now() + parseFloat(time) : time : TWEEN.now();
  132. this._startTime += this._delayTime;
  133. for (var property in this._valuesEnd) {
  134. // Check if an Array was provided as property value
  135. if (this._valuesEnd[property] instanceof Array) {
  136. if (this._valuesEnd[property].length === 0) {
  137. continue;
  138. }
  139. // Create a local copy of the Array with the start value at the front
  140. this._valuesEnd[property] = [this._object[property]].concat(this._valuesEnd[property]);
  141. }
  142. // If `to()` specifies a property that doesn't exist in the source object,
  143. // we should not set that property in the object
  144. if (this._object[property] === undefined) {
  145. continue;
  146. }
  147. // Save the starting value.
  148. this._valuesStart[property] = this._object[property];
  149. if ((this._valuesStart[property] instanceof Array) === false) {
  150. this._valuesStart[property] *= 1.0; // Ensures we're using numbers, not strings
  151. }
  152. this._valuesStartRepeat[property] = this._valuesStart[property] || 0;
  153. }
  154. return this;
  155. },
  156. stop: function stop() {
  157. if (!this._isPlaying) {
  158. return this;
  159. }
  160. this._group.remove(this);
  161. this._isPlaying = false;
  162. if (this._onStopCallback !== null) {
  163. this._onStopCallback(this._object);
  164. }
  165. this.stopChainedTweens();
  166. return this;
  167. },
  168. end: function end() {
  169. this.update(this._startTime + this._duration);
  170. return this;
  171. },
  172. stopChainedTweens: function stopChainedTweens() {
  173. for (var i = 0, numChainedTweens = this._chainedTweens.length; i < numChainedTweens; i++) {
  174. this._chainedTweens[i].stop();
  175. }
  176. },
  177. delay: function delay(amount) {
  178. this._delayTime = amount;
  179. return this;
  180. },
  181. repeat: function repeat(times) {
  182. this._repeat = times;
  183. return this;
  184. },
  185. repeatDelay: function repeatDelay(amount) {
  186. this._repeatDelayTime = amount;
  187. return this;
  188. },
  189. yoyo: function yoyo(yoyo) {
  190. this._yoyo = yoyo;
  191. return this;
  192. },
  193. easing: function easing(easing) {
  194. this._easingFunction = easing;
  195. return this;
  196. },
  197. interpolation: function interpolation(interpolation) {
  198. this._interpolationFunction = interpolation;
  199. return this;
  200. },
  201. chain: function chain() {
  202. this._chainedTweens = arguments;
  203. return this;
  204. },
  205. onStart: function onStart(callback) {
  206. this._onStartCallback = callback;
  207. return this;
  208. },
  209. onUpdate: function onUpdate(callback) {
  210. this._onUpdateCallback = callback;
  211. return this;
  212. },
  213. onComplete: function onComplete(callback) {
  214. this._onCompleteCallback = callback;
  215. return this;
  216. },
  217. onStop: function onStop(callback) {
  218. this._onStopCallback = callback;
  219. return this;
  220. },
  221. update: function update(time) {
  222. var property;
  223. var elapsed;
  224. var value;
  225. if (time < this._startTime) {
  226. return true;
  227. }
  228. if (this._onStartCallbackFired === false) {
  229. if (this._onStartCallback !== null) {
  230. this._onStartCallback(this._object);
  231. }
  232. this._onStartCallbackFired = true;
  233. }
  234. elapsed = (time - this._startTime) / this._duration;
  235. elapsed = elapsed > 1 ? 1 : elapsed;
  236. value = this._easingFunction(elapsed);
  237. for (property in this._valuesEnd) {
  238. // Don't update properties that do not exist in the source object
  239. if (this._valuesStart[property] === undefined) {
  240. continue;
  241. }
  242. var start = this._valuesStart[property] || 0;
  243. var end = this._valuesEnd[property];
  244. if (end instanceof Array) {
  245. this._object[property] = this._interpolationFunction(end, value);
  246. } else {
  247. // Parses relative end values with start as base (e.g.: +10, -3)
  248. if (typeof (end) === 'string') {
  249. if (end.charAt(0) === '+' || end.charAt(0) === '-') {
  250. end = start + parseFloat(end);
  251. } else {
  252. end = parseFloat(end);
  253. }
  254. }
  255. // Protect against non numeric properties.
  256. if (typeof (end) === 'number') {
  257. this._object[property] = start + (end - start) * value;
  258. }
  259. }
  260. }
  261. if (this._onUpdateCallback !== null) {
  262. this._onUpdateCallback(this._object);
  263. }
  264. if (elapsed === 1) {
  265. if (this._repeat > 0) {
  266. if (isFinite(this._repeat)) {
  267. this._repeat--;
  268. }
  269. // Reassign starting values, restart by making startTime = now
  270. for (property in this._valuesStartRepeat) {
  271. if (typeof (this._valuesEnd[property]) === 'string') {
  272. this._valuesStartRepeat[property] = this._valuesStartRepeat[property] + parseFloat(this._valuesEnd[property]);
  273. }
  274. if (this._yoyo) {
  275. var tmp = this._valuesStartRepeat[property];
  276. this._valuesStartRepeat[property] = this._valuesEnd[property];
  277. this._valuesEnd[property] = tmp;
  278. }
  279. this._valuesStart[property] = this._valuesStartRepeat[property];
  280. }
  281. if (this._yoyo) {
  282. this._reversed = !this._reversed;
  283. }
  284. if (this._repeatDelayTime !== undefined) {
  285. this._startTime = time + this._repeatDelayTime;
  286. } else {
  287. this._startTime = time + this._delayTime;
  288. }
  289. return true;
  290. } else {
  291. if (this._onCompleteCallback !== null) {
  292. this._onCompleteCallback(this._object);
  293. }
  294. for (var i = 0, numChainedTweens = this._chainedTweens.length; i < numChainedTweens; i++) {
  295. // Make the chained tweens start exactly at the time they should,
  296. // even if the `update()` method was called way past the duration of the tween
  297. this._chainedTweens[i].start(this._startTime + this._duration);
  298. }
  299. return false;
  300. }
  301. }
  302. return true;
  303. }
  304. };
  305. TWEEN.Easing = {
  306. Linear: {
  307. None: function (k) {
  308. return k;
  309. }
  310. },
  311. Quadratic: {
  312. In: function (k) {
  313. return k * k;
  314. },
  315. Out: function (k) {
  316. return k * (2 - k);
  317. },
  318. InOut: function (k) {
  319. if ((k *= 2) < 1) {
  320. return 0.5 * k * k;
  321. }
  322. return - 0.5 * (--k * (k - 2) - 1);
  323. }
  324. },
  325. Cubic: {
  326. In: function (k) {
  327. return k * k * k;
  328. },
  329. Out: function (k) {
  330. return --k * k * k + 1;
  331. },
  332. InOut: function (k) {
  333. if ((k *= 2) < 1) {
  334. return 0.5 * k * k * k;
  335. }
  336. return 0.5 * ((k -= 2) * k * k + 2);
  337. }
  338. },
  339. Quartic: {
  340. In: function (k) {
  341. return k * k * k * k;
  342. },
  343. Out: function (k) {
  344. return 1 - (--k * k * k * k);
  345. },
  346. InOut: function (k) {
  347. if ((k *= 2) < 1) {
  348. return 0.5 * k * k * k * k;
  349. }
  350. return - 0.5 * ((k -= 2) * k * k * k - 2);
  351. }
  352. },
  353. Quintic: {
  354. In: function (k) {
  355. return k * k * k * k * k;
  356. },
  357. Out: function (k) {
  358. return --k * k * k * k * k + 1;
  359. },
  360. InOut: function (k) {
  361. if ((k *= 2) < 1) {
  362. return 0.5 * k * k * k * k * k;
  363. }
  364. return 0.5 * ((k -= 2) * k * k * k * k + 2);
  365. }
  366. },
  367. Sinusoidal: {
  368. In: function (k) {
  369. return 1 - Math.cos(k * Math.PI / 2);
  370. },
  371. Out: function (k) {
  372. return Math.sin(k * Math.PI / 2);
  373. },
  374. InOut: function (k) {
  375. return 0.5 * (1 - Math.cos(Math.PI * k));
  376. }
  377. },
  378. Exponential: {
  379. In: function (k) {
  380. return k === 0 ? 0 : Math.pow(1024, k - 1);
  381. },
  382. Out: function (k) {
  383. return k === 1 ? 1 : 1 - Math.pow(2, - 10 * k);
  384. },
  385. InOut: function (k) {
  386. if (k === 0) {
  387. return 0;
  388. }
  389. if (k === 1) {
  390. return 1;
  391. }
  392. if ((k *= 2) < 1) {
  393. return 0.5 * Math.pow(1024, k - 1);
  394. }
  395. return 0.5 * (- Math.pow(2, - 10 * (k - 1)) + 2);
  396. }
  397. },
  398. Circular: {
  399. In: function (k) {
  400. return 1 - Math.sqrt(1 - k * k);
  401. },
  402. Out: function (k) {
  403. return Math.sqrt(1 - (--k * k));
  404. },
  405. InOut: function (k) {
  406. if ((k *= 2) < 1) {
  407. return - 0.5 * (Math.sqrt(1 - k * k) - 1);
  408. }
  409. return 0.5 * (Math.sqrt(1 - (k -= 2) * k) + 1);
  410. }
  411. },
  412. Elastic: {
  413. In: function (k) {
  414. if (k === 0) {
  415. return 0;
  416. }
  417. if (k === 1) {
  418. return 1;
  419. }
  420. return -Math.pow(2, 10 * (k - 1)) * Math.sin((k - 1.1) * 5 * Math.PI);
  421. },
  422. Out: function (k) {
  423. if (k === 0) {
  424. return 0;
  425. }
  426. if (k === 1) {
  427. return 1;
  428. }
  429. return Math.pow(2, -10 * k) * Math.sin((k - 0.1) * 5 * Math.PI) + 1;
  430. },
  431. InOut: function (k) {
  432. if (k === 0) {
  433. return 0;
  434. }
  435. if (k === 1) {
  436. return 1;
  437. }
  438. k *= 2;
  439. if (k < 1) {
  440. return -0.5 * Math.pow(2, 10 * (k - 1)) * Math.sin((k - 1.1) * 5 * Math.PI);
  441. }
  442. return 0.5 * Math.pow(2, -10 * (k - 1)) * Math.sin((k - 1.1) * 5 * Math.PI) + 1;
  443. }
  444. },
  445. Back: {
  446. In: function (k) {
  447. var s = 1.70158;
  448. return k * k * ((s + 1) * k - s);
  449. },
  450. Out: function (k) {
  451. var s = 1.70158;
  452. return --k * k * ((s + 1) * k + s) + 1;
  453. },
  454. InOut: function (k) {
  455. var s = 1.70158 * 1.525;
  456. if ((k *= 2) < 1) {
  457. return 0.5 * (k * k * ((s + 1) * k - s));
  458. }
  459. return 0.5 * ((k -= 2) * k * ((s + 1) * k + s) + 2);
  460. }
  461. },
  462. Bounce: {
  463. In: function (k) {
  464. return 1 - TWEEN.Easing.Bounce.Out(1 - k);
  465. },
  466. Out: function (k) {
  467. if (k < (1 / 2.75)) {
  468. return 7.5625 * k * k;
  469. } else if (k < (2 / 2.75)) {
  470. return 7.5625 * (k -= (1.5 / 2.75)) * k + 0.75;
  471. } else if (k < (2.5 / 2.75)) {
  472. return 7.5625 * (k -= (2.25 / 2.75)) * k + 0.9375;
  473. } else {
  474. return 7.5625 * (k -= (2.625 / 2.75)) * k + 0.984375;
  475. }
  476. },
  477. InOut: function (k) {
  478. if (k < 0.5) {
  479. return TWEEN.Easing.Bounce.In(k * 2) * 0.5;
  480. }
  481. return TWEEN.Easing.Bounce.Out(k * 2 - 1) * 0.5 + 0.5;
  482. }
  483. }
  484. };
  485. TWEEN.Interpolation = {
  486. Linear: function (v, k) {
  487. var m = v.length - 1;
  488. var f = m * k;
  489. var i = Math.floor(f);
  490. var fn = TWEEN.Interpolation.Utils.Linear;
  491. if (k < 0) {
  492. return fn(v[0], v[1], f);
  493. }
  494. if (k > 1) {
  495. return fn(v[m], v[m - 1], m - f);
  496. }
  497. return fn(v[i], v[i + 1 > m ? m : i + 1], f - i);
  498. },
  499. Bezier: function (v, k) {
  500. var b = 0;
  501. var n = v.length - 1;
  502. var pw = Math.pow;
  503. var bn = TWEEN.Interpolation.Utils.Bernstein;
  504. for (var i = 0; i <= n; i++) {
  505. b += pw(1 - k, n - i) * pw(k, i) * v[i] * bn(n, i);
  506. }
  507. return b;
  508. },
  509. CatmullRom: function (v, k) {
  510. var m = v.length - 1;
  511. var f = m * k;
  512. var i = Math.floor(f);
  513. var fn = TWEEN.Interpolation.Utils.CatmullRom;
  514. if (v[0] === v[m]) {
  515. if (k < 0) {
  516. i = Math.floor(f = m * (1 + k));
  517. }
  518. return fn(v[(i - 1 + m) % m], v[i], v[(i + 1) % m], v[(i + 2) % m], f - i);
  519. } else {
  520. if (k < 0) {
  521. return v[0] - (fn(v[0], v[0], v[1], v[1], -f) - v[0]);
  522. }
  523. if (k > 1) {
  524. return v[m] - (fn(v[m], v[m], v[m - 1], v[m - 1], f - m) - v[m]);
  525. }
  526. return fn(v[i ? i - 1 : 0], v[i], v[m < i + 1 ? m : i + 1], v[m < i + 2 ? m : i + 2], f - i);
  527. }
  528. },
  529. Utils: {
  530. Linear: function (p0, p1, t) {
  531. return (p1 - p0) * t + p0;
  532. },
  533. Bernstein: function (n, i) {
  534. var fc = TWEEN.Interpolation.Utils.Factorial;
  535. return fc(n) / fc(i) / fc(n - i);
  536. },
  537. Factorial: (function () {
  538. var a = [1];
  539. return function (n) {
  540. var s = 1;
  541. if (a[n]) {
  542. return a[n];
  543. }
  544. for (var i = n; i > 1; i--) {
  545. s *= i;
  546. }
  547. a[n] = s;
  548. return s;
  549. };
  550. })(),
  551. CatmullRom: function (p0, p1, p2, p3, t) {
  552. var v0 = (p2 - p0) * 0.5;
  553. var v1 = (p3 - p1) * 0.5;
  554. var t2 = t * t;
  555. var t3 = t * t2;
  556. return (2 * p1 - 2 * p2 + v0 + v1) * t3 + (- 3 * p1 + 3 * p2 - 2 * v0 - v1) * t2 + v0 * t + p1;
  557. }
  558. }
  559. };
  560. // UMD (Universal Module Definition)
  561. (function (root) {
  562. if (typeof define === 'function' && define.amd) {
  563. // AMD
  564. define([], function () {
  565. return TWEEN;
  566. });
  567. } else if (typeof module !== 'undefined' && typeof exports === 'object') {
  568. // Node.js
  569. module.exports = TWEEN;
  570. } else if (root !== undefined) {
  571. // Global variable
  572. root.TWEEN = TWEEN;
  573. }
  574. })(this);