share.js 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  1. module.exports = Behavior({
  2. data: {},
  3. methods: {
  4. onShareAppMessage({
  5. from,
  6. target
  7. }) {
  8. if (from == 'button') {
  9. let video = target.dataset.info
  10. const promise = new Promise(resolve => {
  11. this.creatShare(video).then(res => {
  12. resolve(res)
  13. })
  14. })
  15. return {
  16. title: '这个小程序太赞了!孩子朗读能力蹭蹭上涨,推荐你试试!',
  17. path: `/pages/index/index?uid=${wx.getStorageSync('uid')}`,
  18. imageUrl: 'http://reader-wx.ai160.com/images/reader/v3/shareContent.png',
  19. promise
  20. }
  21. } else {
  22. return {
  23. title: '这个小程序太赞了!孩子朗读能力蹭蹭上涨,推荐你试试!',
  24. path: `/pages/index/index?uid=${wx.getStorageSync('uid')}`,
  25. imageUrl: 'http://reader-wx.ai160.com/images/reader/v3/shareContent.png'
  26. }
  27. }
  28. },
  29. creatShare(video) {
  30. return new Promise((resolve, reject) => {
  31. let context = wx.createSelectorQuery();
  32. context
  33. .select('#share')
  34. .fields({
  35. node: true,
  36. size: true
  37. }).exec((res) => {
  38. const canvas = res[0].node;
  39. const ctx = canvas.getContext('2d');
  40. const dpr = wx.getSystemInfoSync().pixelRatio;
  41. canvas.width = res[0].width * dpr;
  42. canvas.height = res[0].height * dpr;
  43. ctx.scale(dpr, dpr);
  44. ctx.font = '14px PingFang';
  45. let pic = canvas.createImage();
  46. pic.src = video.userReadExtend && video.userReadExtend.resourcesType == 1 ? video.userReadExtend.backgroundVirtualImg : video.userRead.coverImg;
  47. pic.onload = () => {
  48. ctx.drawImage(pic, 0, 0, 375, 211);
  49. if (video.userReadExtend.resourcesType == 1) {
  50. let aBg = canvas.createImage();
  51. aBg.src = '/static/shareAudioBg.png';
  52. aBg.onload = () => {
  53. ctx.drawImage(aBg, 127.5, 38, 120, 120);
  54. let rate = 0.5
  55. ctx.arc(
  56. Math.floor(375 * rate),
  57. 98,
  58. Math.floor(100 * rate),
  59. 0,
  60. 2 * Math.PI
  61. );
  62. ctx.clip() //裁剪
  63. let coverImg = canvas.createImage();
  64. coverImg.src = video.userRead.coverImg;
  65. coverImg.onload = () => {
  66. ctx.drawImage( //定位在圆圈范围内便会出现
  67. coverImg, //图片暂存路径
  68. 129, 42,
  69. 110, 110,
  70. );
  71. ctx.restore()
  72. }
  73. }
  74. }
  75. }
  76. let peiyin = canvas.createImage();
  77. peiyin.src = '/static/peiyin.jpg';
  78. peiyin.onload = () => {
  79. ctx.drawImage(peiyin, 0, 211, 375, 89);
  80. //分享
  81. let fx = canvas.createImage();
  82. fx.src = '/static/share.png'
  83. fx.onload = () => {
  84. ctx.drawImage(fx, 12, 220, 20, 20)
  85. ctx.fillText('分享', 36, 238)
  86. // 收藏,一个一个渲染
  87. let sc = canvas.createImage();
  88. sc.src = '/static/no_collect.png'
  89. sc.onload = () => {
  90. ctx.drawImage(sc, 110, 220, 19, 19)
  91. ctx.fillText('收藏', 134, 238)
  92. // 评论
  93. let pl = canvas.createImage();
  94. pl.src = '/static/comment.png'
  95. pl.onload = () => {
  96. ctx.drawImage(pl, 228, 222, 22, 22)
  97. ctx.fillText(video.userRead.commentAmount || 0, 340, 238)
  98. //点赞
  99. let dz = canvas.createImage();
  100. dz.src = video.isLike ? '/static/heart_colored.png' : '/static/heart.png'
  101. dz.onload = () => {
  102. ctx.drawImage(dz, 318, 222, 22, 22)
  103. ctx.fillText(video.userRead.likeAmount || 0, 254, 238)
  104. setTimeout(() => {
  105. wx.canvasToTempFilePath({
  106. canvas: canvas,
  107. success(res) {
  108. let title = wx.getStorageSync('uid') == video.user.uid ? '我的新作品发布啦,快来捧场点赞!' : video.userRead.type == 'READ' ? '发现一篇宝藏作品,这声音让人爱了!不信你不着迷!' : '我正在听这篇朗读示范,这发音,播音专业水准!你也来听听!'
  109. resolve({
  110. title,
  111. path: `/pages/pkPage/index?videoId=${video.userRead.id}&uid=${wx.getStorageSync('uid')}`,
  112. imageUrl: res.tempFilePath
  113. })
  114. },
  115. fail(res) {
  116. reject()
  117. }
  118. }, this)
  119. }, 500)
  120. }
  121. }
  122. }
  123. }
  124. }
  125. })
  126. })
  127. },
  128. }
  129. })