// pages/beautify/coach.wxss.js
Page({
    data: {
        videos: [{
                video_id: 1,
                cover: 'https://cdn.shuiganying.com/images/2023/11/14/236a3949c2c0794de850617d4204a159.png',
                url: 'https://sns-video-bd.xhscdn.com/stream/110/258/01e524b445288836010370038b176a34a1_258.mp4',
                steps: [{
                        title: '第一步：在右脸颊处缓慢向上打圈，反复两次',
                        startTime: 0, // 开始时间
                        startCountDown: 3, // 开始倒计时（暂时先可不给）
                        endTime: 7, // 自定义第一段截止到
                    },
                    {
                        title: '第二步：在右脸颊处缓慢向上打圈，反复3次',
                        startTime: 8,
                        startCountDown: 11, // 开始倒计时
                        endTime: 15, // 自定义 20s
                    },
                    {
                        title: '第三步：在右脸颊处缓慢向上打圈，反复4次',
                        startTime: 16,
                        startCountDown: 18, // 开始倒计时
                        endTime: 20, // 自定义 20s
                    }
                ],
            },
            {
                id: 2,
                cover: 'https://cdn.shuiganying.com/images/2023/11/14/0835381c22b00f574afb34d319cce442.png',
                url: 'https://sns-video-bd.xhscdn.com/stream/110/258/01e524b445288836010370038b176a34a1_258.mp4',
                steps: [{
                        title: '第一步：在右脸颊处缓慢向上打圈，反复两次',
                        startTime: 0,
                        startCountDown: 3, // 开始倒计时
                        endTime: 7, // 自定义第一段截止到
                    },
                    {
                        title: '第二步：在右脸颊处缓慢向上打圈，反复3次',
                        startTime: 8,
                        startCountDown: 11, // 开始倒计时
                        endTime: 15, // 自定义 20s
                    },
                    {
                        title: '第三步：在右脸颊处缓慢向上打圈，反复4次',
                        startTime: 16,
                        startCountDown: 18, // 开始倒计时
                        endTime: 20, // 自定义 20s
                    }
                ],
            },
            {
                id: 3,
                cover: 'https://cdn.shuiganying.com/images/2023/11/14/0835381c22b00f574afb34d319cce442.png',
                url: 'https://sns-video-bd.xhscdn.com/stream/110/258/01e524b445288836010370038b176a34a1_258.mp4',
                steps: [{
                        title: '第一步：在右脸颊处缓慢向上打圈，反复两次',
                        startTime: 0,
                        startCountDown: 3, // 开始倒计时
                        endTime: 7, // 自定义第一段截止到
                    },
                    {
                        title: '第二步：在右脸颊处缓慢向上打圈，反复3次',
                        startTime: 8,
                        startCountDown: 11, // 开始倒计时
                        endTime: 15, // 自定义 20s
                    },
                    {
                        title: '第三步：在右脸颊处缓慢向上打圈，反复4次',
                        startTime: 16,
                        startCountDown: 18, // 开始倒计时
                        endTime: 20, // 自定义 20s
                    }
                ],
            },
            {
                id: 4,
                cover: 'https://cdn.shuiganying.com/images/2023/11/14/236a3949c2c0794de850617d4204a159.png',
                url: 'https://sns-video-bd.xhscdn.com/stream/110/258/01e524b445288836010370038b176a34a1_258.mp4',
                steps: [{
                        title: '第一步：在右脸颊处缓慢向上打圈，反复两次',
                        startTime: 0,
                        startCountDown: 3, // 开始倒计时
                        endTime: 7, // 自定义第一段截止到
                    },
                    {
                        title: '第二步：在右脸颊处缓慢向上打圈，反复3次',
                        startTime: 8,
                        startCountDown: 11, // 开始倒计时
                        endTime: 15, // 自定义 20s
                    },
                    {
                        title: '第三步：在右脸颊处缓慢向上打圈，反复4次',
                        startTime: 16,
                        startCountDown: 18, // 开始倒计时
                        endTime: 20, // 自定义 20s
                    }
                ],
            }
        ],
        selectVideoItem: {
            video_id: 0, // 默认id是否为0
            playedState: false, // 当前是否是正在播放播放状态
            muted: false, // 静音状态
            stepsCount: 0, // 默认分几个步骤
            currentSteps: 0, // 当前默认是第几步
            currentTime: 0, // 当前总时长
            remainingTime: '00', // 播放时间
            remainingTimeShow: '00:00' // 播放时间展示
        },
        videoContext: null,
        seeAllVideo: true,
        openCamera: false, // 是否打开摄像头
        userData: {},
        // 是否显示摄像头
        isCamera: false
    },

    onShow() {
        wx.getSetting({
            success: (res) => {
                let authSetting = res.authSetting
                this.setData({
                    isCamera: authSetting['scope.camera'] == true ? true : false,
                    openCamera: authSetting['scope.camera'] == true ? true : false
                })
            }
        })
        this.userInfo()
        this.getVideos()
    },
    onReady(res) {
        this.videoContext = wx.createVideoContext('myVideo')
    },
    // 视频更新事件
    videoTimeupdated(e) {
        let selectVideoItem = this.data.selectVideoItem
        let currentTimeEnd = selectVideoItem.steps[selectVideoItem.currentSteps].endTime
        let {
            currentTime,
            duration
        } = e.detail
        if (currentTime > currentTimeEnd && selectVideoItem.currentSteps < selectVideoItem.stepsCount) {
            selectVideoItem.currentSteps++
            // this.videoContext.pause()
            // 倒计时且有提醒
            // setTimeout(() => {
            //     this.videoContext.play()
            // }, 3000);
        }

        let remainingTime = parseInt(duration - currentTime) >= 10 ? parseInt(duration - currentTime) : '0' + parseInt(duration - currentTime)
        let remainingTimeShow = parseInt(duration - currentTime) >= 60 ? '01:' + (parseInt(remainingTime - 60) >= 10 ? parseInt(remainingTime - 60) : '0' + parseInt(remainingTime - 60)) : '00:' + remainingTime
        selectVideoItem.remainingTime = remainingTime
        selectVideoItem.remainingTimeShow = remainingTimeShow
        this.setData({
            selectVideoItem: selectVideoItem
        })
    },

    // 视频播放结束事件
    videoEnded() {
        // console.log('视频播放结束事件')
        // 完成弹窗  重置基础数据

        this.setData({
            selectVideoItem: {
                video_id: 0
            },
            seeAllVideo: true,
        })
    },

    // 点击全部视频
    allVideoTab() {
        this.setData({
            seeAllVideo: !this.data.seeAllVideo
        })
    },

    // 点击暂停视频
    videoPauseTab() {
        // console.log('暂停')
        let selectVideoItem = this.data.selectVideoItem
        selectVideoItem.playedState = false
        this.setData({
            selectVideoItem: selectVideoItem
        })
        this.videoContext.pause()
    },

    // 点击播放视频
    videoPlayTab() {
        // console.log('播放')
        let selectVideoItem = this.data.selectVideoItem
        selectVideoItem.playedState = true
        selectVideoItem.muted = false
        this.setData({
            selectVideoItem: selectVideoItem
        })
        this.videoContext.play()
    },

    // 轮播图切换
    swiperChange(e) {
        // console.log(e.detail)
    },

    // 选择视频教程-点击
    selectVideo(e) {
        let item = e.currentTarget.dataset.item
        // console.log(this.data.selectVideoItem.video_id, item.video_id)
        if (this.data.selectVideoItem.video_id == item.video_id) return

        item.playedState = false
        item.stepsCount = item.steps.length
        item.currentSteps = 0
        this.setData({
            selectVideoItem: item,
            seeAllVideo: false,
        })
        // 处理弹窗，且最后在处理视频播放
        setTimeout(() => {
            this.doPlay(0)
        }, 300);
    },

    // 播放视频
    doPlay(position) {
        // console.log(position)
        this.videoContext.seek(position)
        let selectVideoItem = this.data.selectVideoItem
        selectVideoItem.playedState = true
        this.setData({
            selectVideoItem: selectVideoItem
        })
        // 播放视频
        this.videoContext.play()
    },

    // 静音非经营处理
    mutedTab(e) {
        // console.log(e)
        let type = e.target.dataset.type
        // console.log(type)
        let selectVideoItem = this.data.selectVideoItem
        if (type == 'open') {
            selectVideoItem.muted = false

        } else {
            selectVideoItem.muted = true
        }
        this.setData({
            selectVideoItem: selectVideoItem
        })
    },

    // 上一段，下一段切换
    preTab(e) {
        let type = e.target.dataset.type
        let selectVideoItem = this.data.selectVideoItem
        let stepsLength = this.data.selectVideoItem.steps.length
        if (type == 'prev') {
            if (selectVideoItem.currentSteps == 0) {
                wx.showToast({
                    title: '已经是第一步',
                    icon: 'none',
                    mask: true
                })
                return
            }

            if (selectVideoItem.currentSteps > 0) {
                selectVideoItem.currentSteps--
                let startTime = selectVideoItem.steps[selectVideoItem.currentSteps].startTime
                this.videoContext.pause()
                this.videoContext.seek(startTime)
                this.videoContext.play()
                selectVideoItem.playedState = true
                this.setData({
                    selectVideoItem: selectVideoItem
                })
            }

        } else {
            if (selectVideoItem.currentSteps == stepsLength) {
                wx.showToast({
                    title: '已经是最后一步',
                    icon: 'none',
                    mask: true
                })
                return
            }
            if (selectVideoItem.currentSteps < stepsLength) {
                selectVideoItem.currentSteps++
                let startTime = selectVideoItem.steps[selectVideoItem.currentSteps].startTime
                this.videoContext.pause()
                this.videoContext.seek(startTime)
                this.videoContext.play()
                selectVideoItem.playedState = true
                this.setData({
                    selectVideoItem: selectVideoItem
                })
            }
        }
    },
    openMirror() {
        if (this.data.openCamera) {
            this.setData({
                openCamera: !this.data.openCamera
            })
            return
        }
        wx.getSetting({
            success: (res) => {
                let authSetting = res.authSetting
                // console.log(res)
                if (!authSetting['scope.camera'] || authSetting['scope.camera'] == undefined) {
                    wx.showModal({
                        title: '温馨提示',
                        content: '若不授权使用摄像头，将无法使用镜子功能！',
                        cancelText: '不授权',
                        cancelColor: '#999',
                        confirmText: '授权',
                        confirmColor: '#1ba9ba',
                        success: (res) => {
                            if (res.confirm) { //允许打开授权页面
                                //调起客户端小程序设置界面，返回用户设置的操作结果
                                // console.log(JSON.stringify(authSetting['scope.camera']), authSetting['scope.camera'] == undefined)
                                // console.log(authSetting['scope.camera'])
                                if (authSetting['scope.camera'] == undefined) {
                                    wx.authorize({
                                        scope: 'scope.camera',
                                        success: () => {
                                            // 用户已经同意小程序使用摄像头
                                            this.setData({
                                                openCamera: true,
                                                isCamera: true
                                            })
                                        },
                                        fail: (err) => {
                                            console.log('err',err)
                                        }
                                    })
                                } else {
                                    wx.openSetting({
                                        success: (res) => {
                                            // console.log('res', res)
                                            res.authSetting = {
                                                "scope.camera": true
                                            }
                                            this.setData({
                                                openCamera: true
                                            })
                                        },
                                    })
                                }
                            } else if (res.cancel) { //拒绝打开授权页面
                                this.setData({
                                    openCamera: false
                                })
                            }
                        }
                    })
                } else {
                    this.setData({
                        openCamera: !this.data.openCamera
                    })
                }
            }
        })
    },
    userInfo() {
        wx.$api.user.userIndex().then(res => {
            this.setData({
                userData: res.data,
            })
        }).catch(err => {})
    },
    getVideos() {
        wx.$api.user.videos().then(res => {
            // console.log(res)
            this.setData({
                videos: res.data.data,
            })
        }).catch(err => {})
    },
})