tdesign-mobile-vue/lib/_common/js/statistic/tween.js

tdesign-mobile-vue

/**
 * tdesign v1.9.3
 * (c) 2025 TDesign Group
 * @license MIT
 */

import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
import _createClass from '@babel/runtime/helpers/createClass';
import _defineProperty from '@babel/runtime/helpers/defineProperty';
import { getIEVersion } from '../utils/helper.js';
import '@babel/runtime/helpers/toConsumableArray';
import '@babel/runtime/helpers/objectWithoutProperties';
import 'lodash-es';

var quartOut = function quartOut(t) {
  return 1 - Math.abs(Math.pow(t - 1, 4));
};
var Tween = /*#__PURE__*/function () {
  function Tween(_ref) {
    var _this = this;
    var from = _ref.from,
      to = _ref.to,
      _ref$duration = _ref.duration,
      duration = _ref$duration === void 0 ? 200 : _ref$duration,
      onStart = _ref.onStart,
      _ref$onUpdate = _ref.onUpdate,
      onUpdate = _ref$onUpdate === void 0 ? function () {} : _ref$onUpdate,
      onFinish = _ref.onFinish;
    _classCallCheck(this, Tween);
    _defineProperty(this, "from", void 0);
    _defineProperty(this, "to", void 0);
    _defineProperty(this, "duration", void 0);
    _defineProperty(this, "onStart", void 0);
    _defineProperty(this, "onUpdate", void 0);
    _defineProperty(this, "onFinish", void 0);
    _defineProperty(this, "startTime", void 0);
    _defineProperty(this, "started", void 0);
    _defineProperty(this, "finished", void 0);
    _defineProperty(this, "timer", void 0);
    _defineProperty(this, "keys", void 0);
    _defineProperty(this, "time", 0);
    _defineProperty(this, "elapsed", 0);
    this.from = from;
    this.to = to;
    this.duration = duration;
    this.onStart = onStart;
    this.onUpdate = onUpdate;
    this.onFinish = onFinish;
    this.startTime = Date.now();
    this.started = false;
    this.finished = false;
    this.timer = null;
    this.keys = {};
    Object.entries(from).forEach(function (_ref2) {
      var _ref3 = _slicedToArray(_ref2, 2),
        key = _ref3[0],
        value = _ref3[1];
      if (_this.to[key] === void 0) {
        _this.to[key] = value;
      }
    });
    Object.entries(to).forEach(function (_ref4) {
      var _ref5 = _slicedToArray(_ref4, 2),
        key = _ref5[0],
        value = _ref5[1];
      if (_this.from[key] === void 0) {
        _this.from[key] = value;
      }
    });
  }
  return _createClass(Tween, [{
    key: "update",
    value: function update() {
      var _this2 = this;
      this.time = Date.now();
      if (this.time < this.startTime || this.finished) return;
      if (this.elapsed >= this.duration) {
        var _this$onFinish;
        this.finished = true;
        (_this$onFinish = this.onFinish) === null || _this$onFinish === void 0 || _this$onFinish.call(this, this.keys);
        return;
      }
      var elapsed = Math.min(this.time - this.startTime, this.duration);
      this.elapsed = elapsed;
      var progress = quartOut(elapsed / this.duration);
      Object.keys(this.to).forEach(function (key) {
        var delta = _this2.to[key] - _this2.from[key];
        _this2.keys[key] = _this2.from[key] + delta * progress;
      });
      if (!this.started) {
        var _this$onStart;
        (_this$onStart = this.onStart) === null || _this$onStart === void 0 || _this$onStart.call(this, this.keys);
        this.started = true;
      }
      this.onUpdate(this.keys);
    }
  }, {
    key: "polyfillStart",
    value: function polyfillStart() {
      var _this3 = this;
      var elapsed = Date.now() - this.startTime;
      var interval = quartOut(elapsed / this.duration);
      this.timer = setInterval(function () {
        _this3.update();
        if (_this3.finished) {
          clearInterval(_this3.timer);
        }
      }, interval);
    }
  }, {
    key: "normalStart",
    value: function normalStart() {
      var _this4 = this;
      var _tick = function tick() {
        _this4.update();
        _this4.timer = requestAnimationFrame(_tick);
        if (_this4.finished) {
          cancelAnimationFrame(_this4.timer);
          _this4.timer = null;
        }
      };
      _tick();
    }
  }, {
    key: "start",
    value: function start() {
      this.startTime = Date.now();
      if (getIEVersion() < 10) this.polyfillStart();else this.normalStart();
    }
  }, {
    key: "stop",
    value: function stop() {
      if (getIEVersion() < 10) clearInterval(this.timer);else cancelAnimationFrame(this.timer);
      this.timer = null;
    }
  }]);
}();

export { Tween as default };
//# sourceMappingURL=tween.js.map