count-down.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
  2. var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  3. if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  4. else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  5. return c > 3 && r && Object.defineProperty(target, key, r), r;
  6. };
  7. import { SuperComponent, wxComponent } from '../common/src/index';
  8. import config from '../common/config';
  9. import props from './props';
  10. import { isSameSecond, parseFormat, parseTimeData, TimeDataUnit } from './utils';
  11. const { prefix } = config;
  12. const name = `${prefix}-count-down`;
  13. let CountDown = class CountDown extends SuperComponent {
  14. constructor() {
  15. super(...arguments);
  16. this.externalClasses = [`${prefix}-class`, `${prefix}-class-count`, `${prefix}-class-split`];
  17. this.properties = props;
  18. this.observers = {
  19. time() {
  20. this.reset();
  21. },
  22. };
  23. this.data = {
  24. prefix,
  25. classPrefix: name,
  26. timeDataUnit: TimeDataUnit,
  27. timeData: parseTimeData(0),
  28. formattedTime: '0',
  29. };
  30. this.timeoutId = null;
  31. this.lifetimes = {
  32. detached() {
  33. if (this.timeoutId) {
  34. clearTimeout(this.timeoutId);
  35. this.timeoutId = null;
  36. }
  37. },
  38. };
  39. this.methods = {
  40. start() {
  41. if (this.counting) {
  42. return;
  43. }
  44. this.counting = true;
  45. this.endTime = Date.now() + this.remain;
  46. this.doCount();
  47. },
  48. pause() {
  49. this.counting = false;
  50. this.timeoutId && clearTimeout(this.timeoutId);
  51. },
  52. reset() {
  53. this.pause();
  54. this.remain = this.properties.time;
  55. this.updateTime(this.remain);
  56. if (this.properties.autoStart) {
  57. this.start();
  58. }
  59. },
  60. getTime() {
  61. return Math.max(this.endTime - Date.now(), 0);
  62. },
  63. updateTime(remain) {
  64. const { format } = this.properties;
  65. this.remain = remain;
  66. const timeData = parseTimeData(remain);
  67. this.triggerEvent('change', timeData);
  68. const { timeText } = parseFormat(remain, format);
  69. const timeRange = format.split(':');
  70. this.setData({
  71. timeRange,
  72. timeData,
  73. formattedTime: timeText.replace(/:/g, ' : '),
  74. });
  75. if (remain === 0) {
  76. this.pause();
  77. this.triggerEvent('finish');
  78. }
  79. },
  80. doCount() {
  81. this.timeoutId = setTimeout(() => {
  82. const time = this.getTime();
  83. if (this.properties.millisecond) {
  84. this.updateTime(time);
  85. }
  86. else if (!isSameSecond(time, this.remain) || time === 0) {
  87. this.updateTime(time);
  88. }
  89. if (time !== 0) {
  90. this.doCount();
  91. }
  92. }, 33);
  93. },
  94. };
  95. }
  96. };
  97. CountDown = __decorate([
  98. wxComponent()
  99. ], CountDown);
  100. export default CountDown;