easing.js 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178
  1. function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
  2. function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
  3. function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
  4. function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
  5. function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
  6. function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
  7. function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
  8. function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
  9. function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
  10. function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
  11. import { warn } from './util';
  12. var ACCURACY = 1e-4;
  13. var cubicBezierFactor = function cubicBezierFactor(c1, c2) {
  14. return [0, 3 * c1, 3 * c2 - 6 * c1, 3 * c1 - 3 * c2 + 1];
  15. };
  16. var multyTime = function multyTime(params, t) {
  17. return params.map(function (param, i) {
  18. return param * Math.pow(t, i);
  19. }).reduce(function (pre, curr) {
  20. return pre + curr;
  21. });
  22. };
  23. var cubicBezier = function cubicBezier(c1, c2) {
  24. return function (t) {
  25. var params = cubicBezierFactor(c1, c2);
  26. return multyTime(params, t);
  27. };
  28. };
  29. var derivativeCubicBezier = function derivativeCubicBezier(c1, c2) {
  30. return function (t) {
  31. var params = cubicBezierFactor(c1, c2);
  32. var newParams = [].concat(_toConsumableArray(params.map(function (param, i) {
  33. return param * i;
  34. }).slice(1)), [0]);
  35. return multyTime(newParams, t);
  36. };
  37. };
  38. // calculate cubic-bezier using Newton's method
  39. export var configBezier = function configBezier() {
  40. for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
  41. args[_key] = arguments[_key];
  42. }
  43. var x1 = args[0],
  44. y1 = args[1],
  45. x2 = args[2],
  46. y2 = args[3];
  47. if (args.length === 1) {
  48. switch (args[0]) {
  49. case 'linear':
  50. x1 = 0.0;
  51. y1 = 0.0;
  52. x2 = 1.0;
  53. y2 = 1.0;
  54. break;
  55. case 'ease':
  56. x1 = 0.25;
  57. y1 = 0.1;
  58. x2 = 0.25;
  59. y2 = 1.0;
  60. break;
  61. case 'ease-in':
  62. x1 = 0.42;
  63. y1 = 0.0;
  64. x2 = 1.0;
  65. y2 = 1.0;
  66. break;
  67. case 'ease-out':
  68. x1 = 0.42;
  69. y1 = 0.0;
  70. x2 = 0.58;
  71. y2 = 1.0;
  72. break;
  73. case 'ease-in-out':
  74. x1 = 0.0;
  75. y1 = 0.0;
  76. x2 = 0.58;
  77. y2 = 1.0;
  78. break;
  79. default:
  80. {
  81. var easing = args[0].split('(');
  82. if (easing[0] === 'cubic-bezier' && easing[1].split(')')[0].split(',').length === 4) {
  83. var _easing$1$split$0$spl = easing[1].split(')')[0].split(',').map(function (x) {
  84. return parseFloat(x);
  85. });
  86. var _easing$1$split$0$spl2 = _slicedToArray(_easing$1$split$0$spl, 4);
  87. x1 = _easing$1$split$0$spl2[0];
  88. y1 = _easing$1$split$0$spl2[1];
  89. x2 = _easing$1$split$0$spl2[2];
  90. y2 = _easing$1$split$0$spl2[3];
  91. } else {
  92. warn(false, '[configBezier]: arguments should be one of ' + "oneOf 'linear', 'ease', 'ease-in', 'ease-out', " + "'ease-in-out','cubic-bezier(x1,y1,x2,y2)', instead received %s", args);
  93. }
  94. }
  95. }
  96. }
  97. warn([x1, x2, y1, y2].every(function (num) {
  98. return typeof num === 'number' && num >= 0 && num <= 1;
  99. }), '[configBezier]: arguments should be x1, y1, x2, y2 of [0, 1] instead received %s', args);
  100. var curveX = cubicBezier(x1, x2);
  101. var curveY = cubicBezier(y1, y2);
  102. var derCurveX = derivativeCubicBezier(x1, x2);
  103. var rangeValue = function rangeValue(value) {
  104. if (value > 1) {
  105. return 1;
  106. }
  107. if (value < 0) {
  108. return 0;
  109. }
  110. return value;
  111. };
  112. var bezier = function bezier(_t) {
  113. var t = _t > 1 ? 1 : _t;
  114. var x = t;
  115. for (var i = 0; i < 8; ++i) {
  116. var evalT = curveX(x) - t;
  117. var derVal = derCurveX(x);
  118. if (Math.abs(evalT - t) < ACCURACY || derVal < ACCURACY) {
  119. return curveY(x);
  120. }
  121. x = rangeValue(x - evalT / derVal);
  122. }
  123. return curveY(x);
  124. };
  125. bezier.isStepper = false;
  126. return bezier;
  127. };
  128. export var configSpring = function configSpring() {
  129. var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  130. var _config$stiff = config.stiff,
  131. stiff = _config$stiff === void 0 ? 100 : _config$stiff,
  132. _config$damping = config.damping,
  133. damping = _config$damping === void 0 ? 8 : _config$damping,
  134. _config$dt = config.dt,
  135. dt = _config$dt === void 0 ? 17 : _config$dt;
  136. var stepper = function stepper(currX, destX, currV) {
  137. var FSpring = -(currX - destX) * stiff;
  138. var FDamping = currV * damping;
  139. var newV = currV + (FSpring - FDamping) * dt / 1000;
  140. var newX = currV * dt / 1000 + currX;
  141. if (Math.abs(newX - destX) < ACCURACY && Math.abs(newV) < ACCURACY) {
  142. return [destX, 0];
  143. }
  144. return [newX, newV];
  145. };
  146. stepper.isStepper = true;
  147. stepper.dt = dt;
  148. return stepper;
  149. };
  150. export var configEasing = function configEasing() {
  151. for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
  152. args[_key2] = arguments[_key2];
  153. }
  154. var easing = args[0];
  155. if (typeof easing === 'string') {
  156. switch (easing) {
  157. case 'ease':
  158. case 'ease-in-out':
  159. case 'ease-out':
  160. case 'ease-in':
  161. case 'linear':
  162. return configBezier(easing);
  163. case 'spring':
  164. return configSpring();
  165. default:
  166. if (easing.split('(')[0] === 'cubic-bezier') {
  167. return configBezier(easing);
  168. }
  169. warn(false, "[configEasing]: first argument should be one of 'ease', 'ease-in', " + "'ease-out', 'ease-in-out','cubic-bezier(x1,y1,x2,y2)', 'linear' and 'spring', instead received %s", args);
  170. }
  171. }
  172. if (typeof easing === 'function') {
  173. return easing;
  174. }
  175. warn(false, '[configEasing]: first argument type should be function or string, instead received %s', args);
  176. return null;
  177. };