import { getAvatarGradient, formatTime } from '../../utils/format'

const DURATION = 5000

Page({
  data: {
    stories: [] as any[],
    current: 0,
    progress: 0,
    currentStory: {} as any,
  },

  _timer: null as any,

  onLoad(query: { id?: string }) {
    this.loadStory(query.id || '')
  },

  onUnload() {
    if (this._timer) clearInterval(this._timer)
  },

  async loadStory(id: string) {
    try {
      const res = await wx.cloud.callFunction({ name: 'getStory', data: { id } }) as any
      const stories = (res.result?.data || []).map((s: any) => ({
        ...s,
        gradient: getAvatarGradient(s.authorId),
        timeText: formatTime(s.createdAt),
      }))
      this.setData({ stories, currentStory: stories[0] || {} })
      this.startProgress()
    } catch {}
  },

  startProgress() {
    if (this._timer) clearInterval(this._timer)
    const interval = 100
    let elapsed = 0
    this._timer = setInterval(() => {
      elapsed += interval
      const pct = Math.min(100, (elapsed / DURATION) * 100)
      this.setData({ progress: pct })
      if (elapsed >= DURATION) this.onNext()
    }, interval)
  },

  onNext() {
    const { current, stories } = this.data
    if (current + 1 >= stories.length) {
      wx.navigateBack()
      return
    }
    const next = current + 1
    this.setData({ current: next, progress: 0, currentStory: stories[next] })
    this.startProgress()
  },

  onClose() { wx.navigateBack() },
})