index.js 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", { value: true });
  3. var component_1 = require("../common/component");
  4. var utils_1 = require("../common/utils");
  5. (0, component_1.VantComponent)({
  6. props: {
  7. text: {
  8. type: String,
  9. value: '',
  10. observer: 'init',
  11. },
  12. mode: {
  13. type: String,
  14. value: '',
  15. },
  16. url: {
  17. type: String,
  18. value: '',
  19. },
  20. openType: {
  21. type: String,
  22. value: 'navigate',
  23. },
  24. delay: {
  25. type: Number,
  26. value: 1,
  27. },
  28. speed: {
  29. type: Number,
  30. value: 60,
  31. observer: 'init',
  32. },
  33. scrollable: null,
  34. leftIcon: {
  35. type: String,
  36. value: '',
  37. },
  38. color: String,
  39. backgroundColor: String,
  40. background: String,
  41. wrapable: Boolean,
  42. },
  43. data: {
  44. show: true,
  45. },
  46. created: function () {
  47. this.resetAnimation = wx.createAnimation({
  48. duration: 0,
  49. timingFunction: 'linear',
  50. });
  51. },
  52. destroyed: function () {
  53. this.timer && clearTimeout(this.timer);
  54. },
  55. mounted: function () {
  56. this.init();
  57. },
  58. methods: {
  59. init: function () {
  60. var _this = this;
  61. (0, utils_1.requestAnimationFrame)(function () {
  62. Promise.all([
  63. (0, utils_1.getRect)(_this, '.van-notice-bar__content'),
  64. (0, utils_1.getRect)(_this, '.van-notice-bar__wrap'),
  65. ]).then(function (rects) {
  66. var contentRect = rects[0], wrapRect = rects[1];
  67. var scrollable = _this.data.scrollable;
  68. if (contentRect == null ||
  69. wrapRect == null ||
  70. !contentRect.width ||
  71. !wrapRect.width ||
  72. scrollable === false) {
  73. return;
  74. }
  75. if (scrollable || wrapRect.width < contentRect.width) {
  76. _this.initAnimation(wrapRect.width, contentRect.width);
  77. _this.scroll(true);
  78. }
  79. });
  80. });
  81. },
  82. initAnimation: function (warpWidth, contentWidth) {
  83. var _a = this.data, speed = _a.speed, delay = _a.delay;
  84. this.wrapWidth = warpWidth;
  85. this.contentWidth = contentWidth;
  86. // begin 0
  87. this.contentDuration = (contentWidth / speed) * 1000;
  88. // begin -wrapWidth
  89. this.duration = ((warpWidth + contentWidth) / speed) * 1000;
  90. this.animation = wx.createAnimation({
  91. duration: this.contentDuration,
  92. timingFunction: 'linear',
  93. delay: delay,
  94. });
  95. },
  96. scroll: function (isInit) {
  97. var _this = this;
  98. if (isInit === void 0) { isInit = false; }
  99. this.timer && clearTimeout(this.timer);
  100. this.timer = null;
  101. this.setData({
  102. animationData: this.resetAnimation
  103. .translateX(isInit ? 0 : this.wrapWidth)
  104. .step()
  105. .export(),
  106. });
  107. var duration = isInit ? this.contentDuration : this.duration;
  108. (0, utils_1.requestAnimationFrame)(function () {
  109. _this.setData({
  110. animationData: _this.animation
  111. .translateX(-_this.contentWidth)
  112. .step({ duration: duration })
  113. .export(),
  114. });
  115. });
  116. this.timer = setTimeout(function () {
  117. _this.scroll();
  118. }, duration + this.data.delay);
  119. },
  120. onClickIcon: function (event) {
  121. if (this.data.mode === 'closeable') {
  122. this.timer && clearTimeout(this.timer);
  123. this.timer = null;
  124. this.setData({ show: false });
  125. this.$emit('close', event.detail);
  126. }
  127. },
  128. onClick: function (event) {
  129. this.$emit('click', event);
  130. },
  131. },
  132. });