reader/pages/main/reading/reading.js

import httpRequestApi from '../../../utils/APIClient';
import {
    formatDate
} from '../../../utils/util';
Page({
    data: {
        title: '',
        id: '',
        img: '',
        fullScreenBtn: false,
        playBtn: true,
        gesture: true,
        muted: false,
        gesture: false,
        centerBtn: true,
        recordFlag: 0,
        recordSource: '',
        videoCtr: 'recordingVideoEnd',
        btnFlag: false,
        btnImgFlag: false,
        microphonePng: '../../../static/image/microphone.png',
        recordingGif: '../../../static/image/readingNow.gif',
        videoUrl: '',
        readingText: '',
        videoList: [],
        pageNo: 1,
        nextMargin: getApp().globalData.nextMargin,
        lowerThresHold: 100,
        isVideoListShow: true
    },
    onLoad: function (option) {
        console.log(option);
        this.videoCtx = null;
        const uid = wx.getStorageSync('uid')
        httpRequestApi.getClassDetail(option.id).success(res => {
            console.log(res)
            let reg = /\\n/g
            this.setData({
                title: res.data.data.title,
                videoUrl: res.data.data.originVideo || res.data.data.playUrl,
                originVideo: res.data.data.originVideo,
                img: res.data.data.iconImg,
                id: res.data.data.id,
                readingText: res.data.data.lessonText,
                grade: res.data.data.grade,
                exampleId: res.data.data.exampleId,
                summary: res.data.data.summary
                // productId: res.data.data.product.id

            })
            console.log(this.data.readingText)
            console.log(this.data.img)
            this.getReadInfo(option.id)

            httpRequestApi.userIntoPage('pages/main/reading/reading', '朗读页面').success((res) => {

            })
        })
        this.recorderManager = wx.getRecorderManager();


        // 监听录音部分
        // 录音开始
        this.recorderManager.onStart(() => {
            // this.saveVideo();
            this.setData({
                btnImgFlag: true,
                btnFlag: false
            })
            console.log('recorder start')
        })
        // this.recorderManager.onPause(() => {
        //     wx.showToast({
        //         title: '录音被暂停',
        //         icon: 'fail',
        //         duration: 500
        //     })
        // })
        // this.recorderManager.onInterruptionBegin(() => {
        //     wx.showToast({
        //         title: '录音被应用中断开始',
        //         icon: 'fail',
        //         duration: 500
        //     })
        // })
        // this.recorderManager.onInterruptionEnd(() => {
        //     wx.showToast({
        //         title: '录音中断结束',
        //         icon: 'fail',
        //         duration: 500
        //     })
        // })
        let dialogFlag = true;
        this.recorderManager.onError(() => {
            wx.getSetting({
                success(res) {
                    if (!res.authSetting['scope.record'] && dialogFlag) {
                        wx.showModal({
                            title: '录音前请打开麦克风权限',
                            content: '点击右上角浮点...，选择：设置-麦克风，点击/打开。',
                            confirmText: '我知道了',
                            showCancel: false,
                            success(res) {
                                console.log('用户点击确定')
                                // dialogFlag = false;
                            }
                        })
                        dialogFlag = false;
                        setTimeout(() => {
                            dialogFlag = true;
                        }, 1000)
                    }
                    // else {
                    //     wx.showToast({
                    //         title: 'onError',
                    //         icon: 'fail',
                    //         duration: 500
                    //     })
                    // }
                }
            })
        })
        // 录音结束
        this.recorderManager.onStop((res) => {
            // wx.showToast({
            //     title: 'onStop',
            //     icon: 'fail',
            //     duration: 500
            // })
            this.videoCtx.stop();
            console.log('recorder stop', res)
            const recordFile = res.tempFilePath;
            this.setData({
                recordFlag: 0,
                recordSource: recordFile,
                btnFlag: true,
                btnImgFlag: false
            })
        })
    },
    onHide: function () {
        console.log('onhide')
        if (this.data.btnImgFlag) {
            this.recorderManager.stop();
        }

        if (this.innerAudioContext) {
            this.innerAudioContext.stop();
        }
        this.setData({
            recordFlag: 0
        })

    },
    onUnload: function () {
        console.log('onUnload')
        if (this.recorderManager) {
            this.recorderManager.stop();
        }
        if (this.innerAudioContext) {
            this.innerAudioContext.stop();
        }
    },
    onShow: function () {
        this.setData({
            statusbarobj: {
                isshowbtn: false, //是否显示按钮
                title: "小学语文课文朗读", //标题
            },
        })
        this.videoCtx = wx.createVideoContext('myVideo', this);

    },
    // 视频缓冲
    // videoWaiting: function () {
    //     this.recorderManager.pause();
    // },
    // //视频播放
    // videoPlay: function () {
    //     this.recorderManager.resume();
    // },
    // 录音中视频播放结束 (控制录音同时结束)
    recordingVideoEnd: function () {
        console.log(this.data.videoCtr)
        console.log('recordingVideoEnd');
        // 
        if (this.data.recordFlag === 0) {
            // this.recordStop();

            this.playingVideoEnd();
            return;
        }
        // 录音结束
        if (this.data.recordFlag === 1) {
            this.recordStop();
        }
    },
    // 播放中视频播放结束 (控制录音同时结束)
    playingVideoEnd: function () {
        console.log('playingVideoEnd')
        this.innerAudioContext.stop();
    },
    /***
     *  recordFlag: 
     *      0 初始状态
     *      1 录音中
     *      2 录音结束
     ***/
    audioRecord: function () {
        console.log('recordFlag', this.data.recordFlag)
        if (this.data.recordFlag === 0) {
            // this.recordStart();
            // this.saveVideo();
            console.log('是否有视频', this.videoCtx)
            if (this.videoCtx) {
                this.videoCtx.stop();
                this.videoCtx.seek(0);
            }
            if (this.recorderManager) {
                this.recorderManager.stop();
            }
            if (this.innerAudioContext) {
                this.innerAudioContext.stop();
            }
            const that = this;
            wx.getSetting({
                success(res) {
                    if (res.authSetting['scope.record']) {
                        that.videoComplete();
                    }
                    // else {
                    //     wx.showToast({
                    //         title: 'onError',
                    //         icon: 'fail',
                    //         duration: 500
                    //     })
                    // }
                }
            })
            return;
        }
        // 录音结束后
        if (this.data.recordFlag === 1) {
            wx.showLoading({
                title: '作品转码中',
                mask: true
            })
            this.recordStop();
        }
    },
    // 录音开始
    /**
     * duration: 时长 最长10分钟
            sampleRate: 44100, 采样率
            numberOfChannels: 1, 录音通道
            encodeBitRate: 192000, 码率
            format: 'mp3', 格式
            frameSize: 50 制定帧大小
     */
    recordStart: function () {
        console.log('录音开始');
        const options = {
            duration: 600000,
            sampleRate: 44100,
            numberOfChannels: 1,
            encodeBitRate: 192000,
            format: 'mp3',
            frameSize: 50
        }
        this.recorderManager.start(options);
    },
    // 录音结束
    recordStop: function () {
        console.log('录音结束')
        this.recorderManager.stop();
        wx.hideLoading()
    },
    // 播放录音
    audioPlay: function () {
        this.setData({
            videoUrl: this.data.videoUrl
        })
        console.log('音频播放');
        if (this.innerAudioContext) {
            this.innerAudioContext.stop();
            this.videoCtx.stop();
        }
        this.videoCtx.seek(0)
        this.innerAudioContext = wx.createInnerAudioContext();
        this.innerAudioContext.src = this.data.recordSource; // 这里可以是录音的临时路径
        console.log(this.innerAudioContext.src);
        this.videoCtx.play();
        this.innerAudioContext.play();
    },

    videoComplete: function () {
        // let videoUrl = 'http://efunimgs.ai160.com/ott/test/002tPr2Xlx07oP7B4ro40104120022hP0k010.mp4';
        this.setData({
            recordFlag: 1,
            videoUrl: this.data.originVideo,
            centerBtn: false,
            playBtn: false,
            isVideoListShow: false
        }, () => {
            this.videoCtx.play();
            this.recordStart();
        })

    },
    // 上传
    upload: function () {
        if (this.videoCtx) {
            this.videoCtx.stop();
        }
        if (this.recorderManager) {
            this.recorderManager.stop();
        }
        if (this.innerAudioContext) {
            this.innerAudioContext.stop();
        }
        wx.showLoading({
            title: '作品分享中',
            mask: true
        })
        const recordSource = this.data.recordSource;
        wx.uploadFile({
            url: 'https://reader.lingjiao.cn/readerBase/file/upload',
            filePath: recordSource,
            name: '朗读录音',
            header: {
                uid: wx.getStorageSync('uid')
            },
            success: (res) => {
                const formateRes = JSON.parse(res.data);
                let audioPath = formateRes.data;
                let uid = wx.getStorageSync('uid');
                shareWorks(uid, audioPath);
            }

        })
        let shareWorks = (uid, audio) => {
            if (this.innerAudioContext) {
                this.innerAudioContext.stop();
            }
            const data = {
                "lessonId": this.data.id,
                "originVideo": this.data.videoUrl,
                "audioPath": audio,
                "title": this.data.title,
                "iconImg": this.data.img,
                "summary": this.data.summary,
                "productId": this.data.productId,
                "grade":this.data.grade,
                "exampleId": this.data.exampleId
            };
            httpRequestApi.postWork(uid, data).success(res => {
                wx.hideLoading({
                    success: () => {
                        wx.showToast({
                            title: '上传成功',
                            icon: 'success',
                            duration: 1000,
                            success: () => {
                                console.log(res);
                                wx.redirectTo({
                                    url: `../../social/works/works?id=${res.data.data.id}&flowerCount=${res.data.count}`
                                })
                            }
                        })
                    }
                });

            })
        };
    },

    // 获取本课朗读内容
    getReadInfo: function (id,pageNo, pageSize) {
        // const uid =  wx.getStorageSync('uid');
        const data = {
            exampleId: this.data.id || id,
            pageNo: this.data.pageNo,
            pageSize: 3,
            type:'READ'
        };
        httpRequestApi.getClassRead(this.uid, data).success(res => {
            const readInfo = res.data.data.list;
            console.log(res)
            readInfo.forEach(item => {
                const temp = {};
                temp.title = item.userRead ? item.userRead.title : '';
                temp.img = item.userRead.iconImg;
                temp.plays = item.userRead.playAmount ? item.userRead.playAmount : 0;
                temp.likes = item.userRead.likeAmount ? item.userRead.likeAmount : 0;
                temp.classId = item.userRead.lessonId;
                temp.time = formatDate(item.userRead.gmtCreated, 3);
                temp.avatar = item.user ? item.user.avatar : '';
                temp.uid = item.user ? item.user.uid : '';
                temp.url = item.userRead.originVideo;
                // temp.avatar = item.user.avatar;
                temp.nickName = item.user ? item.user.wechatName : '';
                temp.id = item.userRead.id;
                // recommendWorks.push(temp);
                // that.data.hotData.hotWorks.push(temp);
                this.data.videoList.push(temp);
            });
            this.setData({
                videoList: this.data.videoList
            })
        });
    },
    // 评论区点击
    commentTap: function (e) {
        console.log('点击评论区', e)
        if (e.target.dataset.type === 'blank') {
            this.setData({
                commentShow: false
            })
        }
    },
    scrollToLower: function (e) {
        console.log('滑动到底部', e)
        this.setData({
            pageNo: this.data.pageNo + 1
        }, () => {
            this.getReadInfo()
        })
    },
    scrollToUpper: function (e) {
        console.log('滑动到顶部', e)

    },
    // 打开评论
    openComment: function (e) {
        console.log('id', e.detail.activeId)
        this.setData({
            commentShow: !this.data.commentShow,
            commentId: e.detail.activeId,
        });
    },
})