animation.js 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. var zrUtil = require("zrender/lib/core/util");
  2. /**
  3. * @param {number} [time=500] Time in ms
  4. * @param {string} [easing='linear']
  5. * @param {number} [delay=0]
  6. * @param {Function} [callback]
  7. *
  8. * @example
  9. * // Animate position
  10. * animation
  11. * .createWrap()
  12. * .add(el1, {position: [10, 10]})
  13. * .add(el2, {shape: {width: 500}, style: {fill: 'red'}}, 400)
  14. * .done(function () { // done })
  15. * .start('cubicOut');
  16. */
  17. function createWrap() {
  18. var storage = [];
  19. var elExistsMap = {};
  20. var doneCallback;
  21. return {
  22. /**
  23. * Caution: a el can only be added once, otherwise 'done'
  24. * might not be called. This method checks this (by el.id),
  25. * suppresses adding and returns false when existing el found.
  26. *
  27. * @param {modele:zrender/Element} el
  28. * @param {Object} target
  29. * @param {number} [time=500]
  30. * @param {number} [delay=0]
  31. * @param {string} [easing='linear']
  32. * @return {boolean} Whether adding succeeded.
  33. *
  34. * @example
  35. * add(el, target, time, delay, easing);
  36. * add(el, target, time, easing);
  37. * add(el, target, time);
  38. * add(el, target);
  39. */
  40. add: function (el, target, time, delay, easing) {
  41. if (zrUtil.isString(delay)) {
  42. easing = delay;
  43. delay = 0;
  44. }
  45. if (elExistsMap[el.id]) {
  46. return false;
  47. }
  48. elExistsMap[el.id] = 1;
  49. storage.push({
  50. el: el,
  51. target: target,
  52. time: time,
  53. delay: delay,
  54. easing: easing
  55. });
  56. return true;
  57. },
  58. /**
  59. * Only execute when animation finished. Will not execute when any
  60. * of 'stop' or 'stopAnimation' called.
  61. *
  62. * @param {Function} callback
  63. */
  64. done: function (callback) {
  65. doneCallback = callback;
  66. return this;
  67. },
  68. /**
  69. * Will stop exist animation firstly.
  70. */
  71. start: function () {
  72. var count = storage.length;
  73. for (var i = 0, len = storage.length; i < len; i++) {
  74. var item = storage[i];
  75. item.el.animateTo(item.target, item.time, item.delay, item.easing, done);
  76. }
  77. return this;
  78. function done() {
  79. count--;
  80. if (!count) {
  81. storage.length = 0;
  82. elExistsMap = {};
  83. doneCallback && doneCallback();
  84. }
  85. }
  86. }
  87. };
  88. }
  89. exports.createWrap = createWrap;