mini_read_space_front/happyphoto/yujiandongtian2022/yujiandongtian2022.js

// temp1/yujiandongtian2022/yujiandongtian2022.js
Page({
  /**
   * 页面的初始数据
   */
  data: {
    // 背景音乐
    bgmusic: {
      music: null,
      playing: false
    },
    ads: null,
    hasLoadAdConfig: false,
    photoIndex: 0,
    templateName: 'yujiandongtian2022',
    imageURLList: [],
    examplePhotos: [
      'ac_317918916r8020.jpeg',
      'ac_318236669r1319.jpeg',
      'ac_317922035r8317.jpeg',
      'ac_317922036r7219.jpeg',
      'ac_317925006r4661.jpeg',
      'ac_317924076r7251.jpeg',
      'ac_317924074r7850.jpeg',
      'ac_317924908r5638.jpeg',
      'ac_317920724r9814.jpeg',
      'ac_317919339r2625.jpeg',
    ],
    imageWidths: [],
    imageHeights: [],
    imageStyles: [],
    page1BlockStyle: '',
    page1Image: ``,
    page2BlockStyle: '',
    page2Image: ``,
    page3BlockStyle: '',
    page3Image: ``,

    photo_load: "",
    biaotiimg: "",
    pagetitle: "",
    bg1imgBox: "",
    bg1img: "",
    snowBox: "",
    snow: "",
    tabimgBox: "",
    tabimg: "",
    bg2imgBox: "",
    bg2img: "",
    kuangtopBox: "",
    kuangbotBox: "",
    snowhua: "",

    timeouts: []
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    this.setData({
      imageURLList: this.data.examplePhotos.map(item => {
        return `https://novel-video.hongdes.cn/kawaalbum/${this.data.templateName}/example/${item}`
      })
    })
    this.initAnimation()
  },

  initAnimation() {
    const _this = this
    this.setData({
      photoIndex: 0
    })
    _this.setData({
      photo_load: "animation: fadeOut 0.5s linear both",
      biaotiimg: "animation: biaotiimg_an 4.3s linear both",
      pagetitle: "animation: pagetitle_an 5.4s 3.2s linear both",
      bg1imgBox: "animation: bg1imgBox_an 8.8s linear both",
      bg1img: "animation: bg1img_an 6.7s steps(1) both",
      snowBox: "animation: fadeIn 0.9s linear both",
      snow: "animation: snow_an 3.1s steps(1) infinite",
    })
    _this.data.timeouts.push(setTimeout(function () {
      _this.setData({
        tabimgBox: "animation: fadeIn 0.3s linear both",
        tabimg: "animation: tabimg_an 1.2s steps(1) both"
      })
    }, 7700))
    _this.data.timeouts.push(setTimeout(function () {
      _this.setData({
        bg2imgBox: "animation: fadeIn 0.9s linear both",
        bg2img: "animation: bg2img_an 3.4s steps(1) infinite",
        kuangtopBox: "animation: kuangtopBox_an 1.2s linear both",
        kuangbotBox: "animation: kuangbotBox_an 1.2s linear both",
      })
      _this.showPage()
    }, 8600))
  },

  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 imageURL = `https://novel-video.hongdes.cn/kawaalbum/${this.data.templateName}/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({
          snowhua: 'animation: snowhua_an 1.4s steps(1) both;',
          [`page${pageIndex}BlockStyle`]: `${blockStyle}animation: showimg 7.9s linear both;`,
          [`page${pageIndex}Image`]: imageURL,
          [`page${pageIndex === 1 ? 2 : 1}BlockStyle`]: '',
        })

        _this.data.timeouts.push(setTimeout(function () {
          _this.setData({
            snowhua: '',
          })
        }, 3000))
        _this.data.timeouts.push(setTimeout(() => {
          _this.setData({
            'photoIndex': _this.data.photoIndex + 1
          })
          _this.showPage()
        }, 6800));
        _this.data.timeouts.push(setTimeout(function () {
          _this.setData({
            [`page${pageIndex}BlockStyle`]: ``,
          })
        }, 8000))
      },
      fail(err) {
        console.error(err);
      }
    })
  },

  /**
 * 播放音乐
 */
  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() {

  }
})