mini_read_space_front/happyphoto/yujianqiutian2023/yujianqiutian2023.js

Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 背景音乐
    bgmusic: {
      music: null,
      playing: false
    },
    ads: null,
    hasLoadAdConfig: false,
    photoIndex: 0,
    examplePhotos: [
      'ac_527831862795.jpeg',
      'ac_527831968525.jpeg',
      'ac_527832032890.jpeg',
      'ac_527832064227.jpeg',
      'ac_527832099230.jpeg',
      'ac_527832214467.jpeg',
      'ac_527832265952.jpeg',
      'ac_527832389834.jpeg',
      'ac_527832424179.jpeg',
      'ac_527832663439.jpeg',
    ],
    imageWidths: [],
    imageHeights: [],
    imageStyles: [],
    page1BlockStyle: '',
    page1Block1Style: '',
    page1ImageStyle: ``,
    page2BlockStyle: '',
    page2Block1Style: '',
    page2ImageStyle: ``,
    page3BlockStyle: '',
    page3Block1Style: '',
    page3ImageStyle: ``,

    phudieBlockSytle: '', // 蝴蝶特效
    rhudieBlockSytle: '',
    yhudieBlockSytle: '',
    timeouts: []
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    this.initAnimation()
  },

  initAnimation() {
    this.setData({
      photoIndex: 0
    })
    this.showPage()
  },

  showPage() {
    const _this = this
    if (this.data.photoIndex === this.data.examplePhotos.length - 1) {
      // 图片轮询完重新开始
      this.setData({
        'photoIndex': 0
      })
    }
    const pageIndex = this.data.photoIndex % 3 + 1
    const anStyle = this.data.photoIndex % 2 + 1
    const imageURL = `https://novel-video.hongdes.cn/kawaalbum/yujianqiutian2023/example/${this.data.examplePhotos[this.data.photoIndex]}`
    wx.getImageInfo({
      src: imageURL,
      success(res) {
        const imageWidth = res.width
        const imageHeight = res.height
        let blockStyle = ''
        if (imageWidth > imageHeight) {
          //  横版图片
          blockStyle = 'top:30%;'
        } else {
          // 竖版图片
          blockStyle = 'top:10%;'
        }
        _this.setData({
          [`page${pageIndex}BlockStyle`]: `${blockStyle}animation: show${anStyle}page-an 2s linear both`,
          [`page${pageIndex}Block1Style`]: `animation: show1page1-an 3s linear infinite`,
          [`page${pageIndex}ImageStyle`]: imageURL,
        })

        if (pageIndex === 1) {
          _this.setData({
            phudieBlockSytle: `animation: phudie_run 5s 2s ease-out both;`,
            rhudieBlockSytle: '',
            yhudieBlockSytle: ''
          })
        } else if (pageIndex === 2) {
          _this.setData({
            phudieBlockSytle: ``,
            rhudieBlockSytle: 'animation: rhudie_run 5s 2s ease-out both;',
            yhudieBlockSytle: ''
          })
        } else {
          _this.setData({
            phudieBlockSytle: ``,
            rhudieBlockSytle: '',
            yhudieBlockSytle: 'animation: yhudie_run 5s 2s ease-out both;'
          })
        }

        _this.data.timeouts.push(setTimeout(() => {
          _this.setData({
            [`page${pageIndex}BlockStyle`]: `animation: show${anStyle}page-out 2s linear both`,
            'photoIndex': _this.data.photoIndex + 1
          })
          _this.showPage();
        }, 5000));
      }
    })
  },

  /**
 * 播放音乐
 */
  initBgMusic() {
    let _this = this
    if (!app.globalData.audioContext) {
      app.globalData.audioContext = wx.createInnerAudioContext()
    }
    // obeyMuteSwitch（仅在 iOS 生效）是否遵循静音开关，设置为 false 之后，即使是在静音模式下，也能播放声音
    wx.setInnerAudioOption({
      obeyMuteSwitch: false
    })
    // 设置音乐循环
    app.globalData.audioContext.loop = true
    // 监听音乐播放
    app.globalData.audioContext.onPlay(() => {
      _this.setData({
        'bgmusic.playing': true
      })
      console.log('music play', _this.data.bgmusic.playing)
    })
    // 监听音乐暂停
    app.globalData.audioContext.onPause(() => {
      console.log('music pause')
      _this.setData({
        'bgmusic.playing': false
      })
    })
    app.globalData.audioContext.src = this.data.bgmusic.music.url
    app.globalData.audioContext.play()
  },

  /**
   * 音乐播放按钮
   */
  musicPlayTap() {
    app.globalData.audioContext.paused ? app.globalData.audioContext.play() : app.globalData.audioContext.pause()
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {
    this.clearTimeoutTask()
  },

  // 清除定时任务
  clearTimeoutTask() {
    this.data.timeouts.forEach(timeout => clearTimeout(timeout));
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})