flutter-hearts-zmt.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. /**
  2. * @ProjectName flutter-hearts-zmt
  3. * @Version 0.0.0
  4. * @Author Jiangshilong(https://github.com/JSL8023)
  5. * @Update 2018-03-22 17:24 pm
  6. */
  7. ! function(t, e) {
  8. "object" == typeof exports && "undefined" != typeof module ? module.exports = e() : "function" == typeof define && define.amd ? define(e) : t.BubbleHearts = e()
  9. }(this, function() {
  10. "use strict";
  11. function t(t, n, r) {
  12. var i = e.uniformDiscrete(89, 91) / 100,
  13. o = 1 - i,
  14. u = (e.uniformDiscrete(45, 60) + e.uniformDiscrete(45, 60)) / 100,
  15. a = function(t) {
  16. return t > i ? Math.max(((1 - t) / o).toFixed(2), .1) * u : u
  17. },
  18. c = e.uniformDiscrete(-30, 30),
  19. f = function(t) {
  20. return c
  21. },
  22. h = 10,
  23. s = n.width / 2 + e.uniformDiscrete(-h, h),
  24. d = (n.width - Math.sqrt(Math.pow(t.width, 2) + Math.pow(t.height, 2))) / 2 - h,
  25. l = e.uniformDiscrete(.8 * d, d) * (e.uniformDiscrete(0, 1) ? 1 : -1),
  26. m = e.uniformDiscrete(250, 400),
  27. w = function(t) {
  28. return t > i ? s : s + l * Math.sin(m * (i - t) * Math.PI / 180)
  29. },
  30. v = function(e) {
  31. return t.height / 2 + (n.height - t.height / 2) * e
  32. },
  33. p = e.uniformDiscrete(14, 18) / 100,
  34. g = function(t) {
  35. return t > p ? 1 : 1 - ((p - t) / p).toFixed(2)
  36. };
  37. return function(e) {
  38. if(!(e >= 0)) return !0;
  39. r.save();
  40. var n = a(e),
  41. i = f(e),
  42. o = w(e),
  43. u = v(e);
  44. r.translate(o, u), r.scale(n, n), r.rotate(i * Math.PI / 180), r.globalAlpha = g(e), r.drawImage(t, -t.width / 2, -t.height / 2, 30, 30), r.restore()
  45. }
  46. }
  47. var e = function(t) {
  48. var e = t,
  49. n = Math.floor,
  50. r = Math.random;
  51. return t.uniform = function(t, e) {
  52. return t + (e - t) * r()
  53. }, t.uniformDiscrete = function(t, r) {
  54. return t + n((r - t + 1) * e.uniform(0, 1))
  55. }, t
  56. }({}),
  57. n = function(t, e) {
  58. if(!(t instanceof e)) throw new TypeError("Cannot call a class as a function")
  59. },
  60. r = function() {
  61. function t(t, e) {
  62. for(var n = 0; n < e.length; n++) {
  63. var r = e[n];
  64. r.enumerable = r.enumerable || !1, r.configurable = !0, "value" in r && (r.writable = !0), Object.defineProperty(t, r.key, r)
  65. }
  66. }
  67. return function(e, n, r) {
  68. return n && t(e.prototype, n), r && t(e, r), e
  69. }
  70. }(),
  71. i = window.requestAnimationFrame || window.webkitRequestAnimationFrame || function(t) {
  72. return setTimeout(t, 16)
  73. },
  74. o = function() {
  75. function o() {
  76. n(this, o);
  77. var t = this.canvas = document.getElementById('likeId'),
  78. e = this.context = t.getContext("2d"),
  79. r = this._children = [],
  80. u = function n() {
  81. i(n), e.clearRect(0, 0, t.width, t.height);
  82. for(var o = 0, u = r.length; o < u;) {
  83. var a = r[o];
  84. a.render.call(null, (a.timestamp + a.duration - new Date) / a.duration) ? (r.splice(o, 1), u--) : o++
  85. }
  86. };
  87. i(u)
  88. }
  89. return r(o, [{
  90. key: "bubble",
  91. value: function(n) {
  92. var r = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : e.uniformDiscrete(2400, 3600),
  93. i = arguments.length > 2 && void 0 !== arguments[2] ? arguments[2] : t(n, this.canvas, this.context);
  94. return this._children.push({
  95. render: i,
  96. duration: r,
  97. timestamp: +new Date
  98. }), this
  99. }
  100. }]), o
  101. }();
  102. return o
  103. });
  104. // 图片地址在此处更换 可换成你的图片
  105. var bg = document.getElementById('canvasImg');
  106. console.log("sssssssssssssssssssss",bg)
  107. var assets = [
  108. bg.src
  109. ];
  110. assets.forEach(function(src, index) {
  111. assets[index] = new Promise(function(resolve) {
  112. var img = new Image();
  113. img.onload = resolve.bind(null, img);
  114. img.src = src;
  115. });
  116. });
  117. Promise.all(assets).then(function(images) {
  118. var random = {
  119. uniform: function(min, max) {
  120. return min + (max - min) * Math.random();
  121. },
  122. uniformDiscrete: function(i, j) {
  123. return i + Math.floor((j - i + 1) * random.uniform(0, 1));
  124. },
  125. };
  126. var stage = new BubbleHearts();
  127. var canvas = stage.canvas;
  128. // canvas.width = 170;
  129. // canvas.height = 300;
  130. // canvas.style['width'] = '170px';
  131. // canvas.style['height'] = '300px';
  132. // document.body.appendChild(canvas);
  133. //journal-reward 为触发的按钮
  134. document.getElementsByClassName('journal-reward')[0].addEventListener('click', function() {
  135. //随机飘动
  136. stage.bubble(images[random.uniformDiscrete(0, images.length - 1)]);
  137. //垂直向上飘动效果
  138. // let image = images[random.uniformDiscrete(0, images.length - 1)];
  139. // stage.bubble(image, 3000, function(lifespan) {
  140. // if(lifespan >= 0) {
  141. // stage.context.drawImage(
  142. // image,
  143. // (canvas.width - image.width) / 2,
  144. // (canvas.height - image.height) * lifespan,
  145. // image.width,
  146. // image.height
  147. // );
  148. // } else {
  149. // return true;
  150. // }
  151. // });
  152. }, false);
  153. }).catch((error) => {
  154. console.log('失败 了 ')
  155. });