game-sdk/public/static/mini/dark/pages/box/box.js

const util = require('../../utils/util.js')
const api = require('../../utils/api.js')
const app = getApp()
Page({ 
  data: {
    auth: {},
    userInfo: {},
    system: '', // devtools:PC  ios:苹果 android:安卓
    boxGamesParams: {
      page: 1,
      offset: 999,
      listype: 2
    },
    ShowEditInfoMask: false,
    boxName: '我的游戏盒子',
    boxName_maxLength: 12,
    boxIntro: '这是我的游戏盒子，来玩吧额勤奋的我',
    boxIntro_maxLength: 20,
    boxInfo: {}, // 主页信息
    memData: [],
    memGame: {},
    floats: [],
    visiblePrompt: true,
    rankList: [],
    sharePath: 'pages/share/game',
    shareInfo: {},
    ShowShareMask: false,
    ShowshareCirclesMask: false,
    mpType: app.globalData.mpType,
    GamePlayList: {}
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.getSystem()
    let timer = setInterval(() => {
      if (app.globalData.PageCallback) {
        this.getBoxInfo()
        
        this.getShareInfo()

        clearInterval(timer)
        this.setData({
          auth: app.globalData.auth,
          userInfo: app.globalData.userInfo
        })
      }
    }, 200)
  },
  getShareInfo: function () {
    api.getShareInfo({
      data: {
        path: 'pages/share/share'
      }
    }).then(res => {
      this.setData({
        shareInfo: res.data
      })
    }, err => {
      console.log(err)
    })
  },
  // 关闭分享朋友圈弹框
  CloseshareCircles: function () {
    wx.showTabBar({
      aniamtion: true
    })
    this.setData({
      ShowshareCirclesMask: false
    })
  },
  onShow: function () {
    wx.showShareMenu({ // 允许转发时携带 shareTicket。 
      withShareTicket: true
    })
    let timer = setInterval(() => {
      if (app.globalData.PageCallback) {
        this.getMemData()
        this.getBoxGameList()
        this.getShareIncomRank()
        this.getGamePlayList()
        clearInterval(timer)
      }
    }, 60)
  },
  routeDetail: function (e) {
    // util.routeTo(`/pages/detail/detail?id=${e.currentTarget.dataset.id}`)
  },
  // 获取活跃用户
  getMemData: function () {
    api.getMemberList({ page: 1, offset: 10, HideLoading: true }).then(res => {
      this.setData({
        memData: res.data
      })
    })
  },
  // 获取我的盒子游戏列表
  getBoxGameList: function () {
    api.getMemGameList({
      ...this.data.boxGamesParams,
      offset: 3,
      HideLoading: true
    }).then( res => {
      this.setData({
        memGame: res.data,
        floats: res.data.list.map((item) => {
          return this.data.mpType === 'gd' ? item.mem_agent_integral : (item.mem_agent_reward).toFixed(2)
        })
      })
    })
  },
  getShareIncomRank: function () {
    api.getShareIncomeRank({ HideLoading: true }).then(res => {
      if (res.code === 200) {
        this.setData({
          rankList: res.data.list
        })
      }
    })
  },
  // tips 显示
  ShowPrompt: function () {
    this.setData({
      visiblePrompt: !this.data.visiblePrompt
    })
  },
  // 获取主页信息
  getBoxInfo: function () {
    api.getHomeInfo().then(res => {
      this.setData({
        boxInfo: res.data,
        boxName: res.data.title,
        boxIntro: res.data.intro
      })
    })
  },
  // 限制输入字数
  ChangeForm: function (e) {
    let taget = e.detail
    if (e.target.dataset.type === 'Name') {
      this.setData({
        boxName: taget.cursor > this.data.boxName_maxLength ? taget.value.substr(0, this.data.boxName_maxLength) : taget.value
      })
    } else if (e.target.dataset.type === 'Intro') {
      this.setData({
        boxIntro: taget.cursor > this.data.boxIntro_maxLength ? taget.value.substr(0, this.data.boxIntro_maxLength) : taget.value
      })
    }
  },
  // 显示隐藏编辑信息弹框
  ChangeEditInfo: function (e) {
    this.setData({
      ShowEditInfoMask: e.currentTarget.dataset.show ? true : false
    })
  },
  // 保存信息
  saveEdit: function () {
    const _self = this
    let params = { title: this.data.boxName, intro: this.data.boxIntro }
    if (params.title && params.intro) {
      api.setHomeInfo(params).then(res => {
        if (res.code === 200) {
          wx.showToast({
            title: res.msg,
            icon: 'success',
            duration: 500,
            mask: true,
            success: function () {
              setTimeout(() => {
                _self.getBoxInfo()
                _self.setData({
                  ShowEditInfoMask: false
                })
              }, 500)
            }
          })
        } else {
          wx.showToast({
            title: `${res.msg}`
          })
        }
      })
    } else {
      wx.showToast({
        title: '请确认您的输入完整后重试~',
        icon: 'none'
      })
    }
  },
  routeManage: function (e) {
    util.routeTo('/pages/manage/manage')
  },
  routeTo: function (e) {
    util.routeTo(e.currentTarget.dataset.to)
  },
  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
  },
  openGame: function (e) {
    let id = e.currentTarget.dataset.id
    api.openGame({
      game_id: id
    }).then(res => {
      console.log(res)
    }, err => {
      console.log(err)
    })
  },
  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function (opt) {
    this.getShareInfo()
    let shareUrl = ''
    let shareTitle = ''
    let shareImage = ''
    if (opt.from === 'menu') {
      let { title, image, state } = this.data.shareInfo
      shareUrl = `/pages/share/share?state=${state}&mem_id=${this.data.userInfo.mem_id}`
      shareTitle = this.data.boxName
    } else if (opt.target) {
      let { title, image, state } = this.data.shareInfo
      let { game_id, gamename, share_title, share_img } = opt.target.dataset
      if (opt.target.id === 'share-box') {
        shareUrl = `/pages/share/share?state=${state}&mem_id=${this.data.userInfo.mem_id}`
        shareTitle = title || this.data.userInfo.nickname
        shareImage = image
      } else if (opt.target.id === 'share-game') {
        shareUrl = `/${this.data.sharePath}?state=${state}&game_id=${game_id}&mem_id=${this.data.userInfo.mem_id}`
        shareTitle = share_title || gamename || title
        shareImage = share_img || image
      }
    }
    return {
      title: shareTitle,
      path: shareUrl,
      imageUrl: shareImage
    }
  },
  // 显示隐藏分享menu
  ChangeShare: function (e) {
    wx.hideTabBar({
      animation: true
    })
    if (!this.data.shareInfo.title) {
      api.getShareInfo({
        data: {
          path: this.data.sharePath
        }
      }).then(res => {
        console.log('getShare', res)
        this.setData({
          shareInfo: res.data,
          ShowShareMask: e.currentTarget.dataset.show ? true : false
        })
      }).catch(err => {
        console.log('getShare', err)
      })
    } else {
      this.setData({
        ShowShareMask: e.currentTarget.dataset.show ? true : false
      })
    }
  },
  // 显示隐藏分享弹框
  showShare: function (e) {
    let { show } = e.currentTarget.dataset
    if (!show) {
      wx.showTabBar({
        animation: true
      })
    }
    this.setData({
      ShowShareMask: show ? true : false
    })
  },
  // 分享朋友圈
  shareCircles: function () {
    console.log(this.data.shareImgSrc)
    if (this.data.shareImgSrc) {
      this.setData({
        ShowShareMask: false,
        ShowshareCirclesMask: true
      })
      return false
    }
    wx.showLoading({
      title: '正在生成',
      mask: true
    })
    this.setData({
      ShowShareMask: false,
      ShowshareCirclesMask: true
    })
    const _self = this
    const rpx = this.data.system.windowWidth / 750
    const ctx = wx.createCanvasContext('shareCanvas')
    const canvasW = 466 * rpx
    const canvasH = 828 * rpx
    const avatarW = 60 * rpx
    const avatarH = 60 * rpx
    const avatarX = 203 * rpx
    const avatarY = 23 * rpx
    const avatarBW = 66 * rpx
    const avatarBH = 66 * rpx
    const avatarBX = 200 * rpx
    const avatarBY = 20 * rpx
    const QRcodeW = 137 * rpx
    const QRcodeH = 137 * rpx
    const QRcodeX = 165 * rpx
    const QRcodeY = 585 * rpx
    const QRcodeBW = 147 * rpx
    const QRcodeBH = 147 * rpx
    const QRcodeBX = 160 * rpx
    const QRcodeBY = 580 * rpx
    util.getImageInfo(this.data.shareInfo.pyq_bg).then(res => {
      ctx.drawImage(res.path, 0, 0, canvasW, canvasH)

      ctx.save()
      ctx.beginPath()
      ctx.arc(avatarBW / 2 + avatarBX, avatarBH / 2 + avatarBY, avatarBW / 2, 0, Math.PI * 2, false)
      ctx.clip()
      ctx.setFillStyle('white')
      ctx.fillRect(avatarBX, avatarBY, avatarBW, avatarBH)
      ctx.restore()
      ctx.draw(true)

      ctx.save()
      ctx.beginPath()
      ctx.arc(QRcodeBW / 2 + QRcodeBX, QRcodeBH / 2 + QRcodeBY, QRcodeBW / 2, 0, Math.PI * 2, false)
      ctx.clip()
      ctx.setFillStyle('white')
      ctx.fillRect(QRcodeBX, QRcodeBY, QRcodeBW, QRcodeBH)
      ctx.restore()
      ctx.draw(true)
    }).then(res => {
      return util.getImageInfo(this.data.shareInfo.mp_qr).then(res => {
        ctx.save()
        ctx.beginPath()
        ctx.arc(QRcodeW / 2 + QRcodeX, QRcodeH / 2 + QRcodeY, QRcodeW / 2, 0, Math.PI * 2, false)
        ctx.clip()
        ctx.drawImage(res.path, canvasW / 2 - QRcodeW / 2, QRcodeY, QRcodeW, QRcodeH)
        ctx.restore()
        ctx.draw(true)
      })
    }).then(res => {
      return util.getImageInfo(this.data.userInfo.avatar).then(res => {
        ctx.beginPath()
        ctx.arc(avatarW / 2 + avatarX, avatarH / 2 + avatarY, avatarW / 2, 0, Math.PI * 2, false)
        ctx.clip()
        ctx.drawImage(res.path, canvasW / 2 - avatarW / 2, avatarY, avatarW, avatarH)
        ctx.restore()
        ctx.draw(true)
      })
    }).then(res => {
      setTimeout(() => {
        wx.canvasToTempFilePath({
          x: 0,
          y: 0,
          width: canvasW,
          height: canvasH,
          destWidth: canvasW * 4,
          destHeight: canvasH * 4,
          canvasId: 'shareCanvas',
          success: function (res) {
            wx.hideLoading()
            _self.setData({
              shareImgSrc: res.tempFilePath
            })
          },
          fail: function (res) {
            console.log(res)
          }
        })
      }, 500)
    }).catch(err => {
      wx.hideLoading()
      console.log(err)
    })
  },
  // 保存分享朋友圈图片
  saveMemQRcode: function (e) {
    const _self = this
    wx.showLoading({
      title: '正在保存...'
    })
    wx.saveImageToPhotosAlbum({
      filePath: _self.data.shareImgSrc,
      success: function (res) {
        console.log('保存图片', res)
        wx.showToast({
          title: '保存成功',
          icon: 'success',
          duration: 1000
        })
      },
      fail: function (err) {
        console.log('保存图片', err)
        if (err.errMsg === "saveImageToPhotosAlbum:fail:auth denied") {
          console.log("用户一开始拒绝了，我们想再次发起授权")
          console.log('打开设置窗口')
          wx.openSetting({
            success(settingdata) {
              console.log(settingdata)
              if (settingdata.authSetting['scope.writePhotosAlbum']) {
                console.log('获取权限成功，给出再次点击图片保存到相册的提示。')
              } else {
                console.log('获取权限失败，给出不给权限就无法正常使用的提示')
              }
            }
          })
        }
      },
      complete: function () {
        wx.hideLoading()
        _self.setData({
          ShowshareCirclesMask: false
        })
        wx.showTabBar({
          aniamtion: true
        })
      }
    })
  },
  // 获取设备信息
  getSystem: function (e) {
    const _self = this
    wx.getSystemInfo({
      success: function (res) {
        _self.setData({
          system: res
        })
      }
    })
  },
  // 我玩过的游戏
  getGamePlayList: function () {
    api.getGamePlayList({
      page: 1,
      offset: 6,
      HideLoading: true
    }).then(res => {
      if (!res.data.count) {
        api.getGameList({
          rank_type: 3,
          page: 1,
          offset: 6,
          HideLoading: true
        }).then(res => {
          this.setData({
            GamePlayList: res.data
          })
        })
      } else {
        this.setData({
          GamePlayList: res.data
        })
      }
    })
  },

  showPop: function (e) {
    wx.previewImage({
      urls: [e.currentTarget.dataset.entrance]
    })
  }
})