Skip to content

L
learn-online
提交 676769a8 authored 作者: 王鹏飞's avatar 王鹏飞
浏览文件
操作

fix:修复视频播放问题

上级 5f5f129e
隐藏空白字符变更
内嵌 并排
正在显示 包含 289 行增加 和 135 行删除
learnOnline/app.json
浏览文件 @ 676769a8
......@@ -27,7 +27,6 @@
"color": "#313131",
"backgroundColor": "#ffffff",
"selectedColor": "#b49441",
"aniamtion": "true",
"list": [
{
"pagePath": "pages/learnSystem/home/home",
......
learnOnline/pages/videoPlayer/contentAudio/contentAudio.wxml
浏览文件 @ 676769a8
<template name='contentAudio'>
<view class='content-audio'
style='{{status.isSet && status.isAudio ? "display: none;" : "" }} {{status.isImages && status.isAudio ? "display: none;" : "" }} {{status.isVideo ? "display: none;" : "" }}'
>
<view class='content-audio' wx:if="{{status.isAudio}}">
<image src='./contentAudio/icons/loading_small.gif' class='loading-image {{status.imagesLoaded && "none"}}' mode='aspectFit'/>
<image wx:if='{{image.imgUrls[image.current]}}' src='{{image.imgUrls[image.current]}}' class='slide-image' mode='aspectFill' bindload='imagesLoaded'/>
<view wx:if='{{!image.imgUrls[image.current]}}' class='slide-image'>本课程暂无PPT</view>
......
learnOnline/pages/videoPlayer/contentVideo/contentVideo.wxml
浏览文件 @ 676769a8
<template name='contentVideo'>
<!-- 这里加 这么多判断原因，video组件在真机上测试，一定在最上层，其他任何元素都挡不住，只能先隐藏，需要时再显示 -->
<view class='content-video'
style='{{status.isSet && status.isVideo ? "display: none;" : "" }} {{status.isImages && status.isVideo ? "display: none;" : "" }} {{status.isAudio ? "display: none;" : "" }} {{chapterList.isShow && status.isVideo ? "display: none;" : "" }} {{ status.isLoading ? "display: none": "" }}'
>
<view class='content-video' wx:if="{{status.isVideo}}">
<video id='my-video' class='my-video' src='{{video.src}}' show-center-play-btn='{{false}}' controls='{{false}}' bindtimeupdate='timeUpdate' bindfullscreenchange='beginAndOutFullScreen' bindpause='beginPauseVA' bindplay='beginPlayVA' binderror='playError' bindended='playEnded' autoplay='{{true}}'></video>
</view>
</template>
\ No newline at end of file
learnOnline/pages/videoPlayer/show.js
浏览文件 @ 676769a8
......@@ -26,7 +26,7 @@ Page({
isAudio: false, // 是否播放音频
isImages: false, // 是否播放图片
isVideo: false, // 是否播放视频，独立存在，永远存在，只用isVideo属性控制
imagesLoaded: false, // 图片是否加载完
imagesLoaded: false // 图片是否加载完
},
/* 视频地址 */
video: {
......@@ -65,21 +65,28 @@ Page({
chapterList: {
isShow: false, // 是否显示列表
currentChapterId: '11', // 当前章节id
course: [{
title: '第一章：重要概念',
chapters: [
{ id: '11', time: '28:18', name: '1.1 现值（PV）和终值（FV）' },
{ id: '12', time: '19:09', name: '1.2 净现值（NPV）及实际收益率' }
]
}, {
title: '第二章：证券估值',
chapters: [
{ id: '21', time: '27:49', name: '2.1 债券和股票的现金流贴现估值方法' },
{ id: '22', time: '16:04', name: '2.2 债券评级及债券协议' },
{ id: '23', time: '', name: '公司金融第二周测验' },
{ id: '24', time: '', name: '公司金融第二周作业' }
]
}],
course: [
{
title: '第一章：重要概念',
chapters: [
{ id: '11', time: '28:18', name: '1.1 现值（PV）和终值（FV）' },
{ id: '12', time: '19:09', name: '1.2 净现值（NPV）及实际收益率' }
]
},
{
title: '第二章：证券估值',
chapters: [
{
id: '21',
time: '27:49',
name: '2.1 债券和股票的现金流贴现估值方法'
},
{ id: '22', time: '16:04', name: '2.2 债券评级及债券协议' },
{ id: '23', time: '', name: '公司金融第二周测验' },
{ id: '24', time: '', name: '公司金融第二周作业' }
]
}
],
nextVideo: {}, // 下一章 音视频对象
prevVideo: {} // 上一章音视频对象
},
......@@ -110,9 +117,18 @@ Page({
initPage: function (res, vid) {
/* 默认先 显示视频 */
this.setData({ 'status.isVideo': true })
this._cache = { isPlay: false, initial_time: 0, currentTime: '00:00', totalTime: '00:00', progress: '0%', curRate: '1.0X', jumpFlag: false, vid: vid }
this._cache = {
isPlay: false,
initial_time: 0,
currentTime: '00:00',
totalTime: '00:00',
progress: '0%',
curRate: '1.0X',
jumpFlag: false,
vid: vid
}
/* 加载中时，重置控制内容 全部为 0 */
this.setData({ 'ctrlBar': this._cache })
this.setData({ ctrlBar: this._cache })
/* 一定会 存在值 */
if (res) {
let tempVid = wx.getStorageSync('videoCacheCtrlBar').vid
......@@ -123,36 +139,45 @@ Page({
this._cache.initial_time = res.cpt
this.realTimeProgress = res
}
wx.setStorageSync('videoCacheCtrlBar', this._cache);
wx.setStorageSync('audioCacheCtrlBar', this._cache);
wx.setStorageSync('videoCacheCtrlBar', this._cache)
wx.setStorageSync('audioCacheCtrlBar', this._cache)
/* 将旧的对象全部抛弃掉 */
(!this._video && (this._video = objV.Video('my-video')));
this._audio = objA.Audio(this.data.audio.src, this);
!this._video && (this._video = objV.Video('my-video'))
this._audio = objA.Audio(this.data.audio.src, this)
/* setData、视频设置等 异步，需要时间，所以加个延时，为true时播放按钮不可用 */
this.setData({ 'initVAFlag': true })
this.setData({ initVAFlag: true })
this.setData({ 'ctrlBar.isPlay': true })
setTimeout(() => {
/* android 手机有时候 播放失效，追加 autoPlay 自动播放 */
this.playVA()
this.setData({ 'status.isLoading': false })
/* 这里 设置倍速还有点问题 */
let _vObj = this._video; for (let i = 0; i < _vObj.RATE.length; i++) { let _ = _vObj.RATE[i]; if (this.data.ctrlBar.curRate.replace(/X/, '') == _) { _vObj.rateIndex = i - 1; this.setRate(); }; }
}, 200);
let _vObj = this._video
for (let i = 0; i < _vObj.RATE.length; i++) {
let _ = _vObj.RATE[i]
if (this.data.ctrlBar.curRate.replace(/X/, '') == _) {
_vObj.rateIndex = i - 1
this.setRate()
}
}
}, 200)
},
/* 页面初始入口，会 先走 AJAX 读取 章节列表数据、音视频和PPT数据、进度数据 */
ajaxInitGetInfo: function (vid,videoType) {
let cid = this.data.options.cid, sid = this.data.options.sid, did = 'jjhz92fn0.le2a6c06c9g0.thhg7ekb1f8';
ajaxInitGetInfo: function (vid, videoType) {
let cid = this.data.options.cid,
sid = this.data.options.sid,
did = 'jjhz92fn0.le2a6c06c9g0.thhg7ekb1f8'
ChapterApi.getChapterList(cid, sid, vid, (json) => {
this.setData({ 'chapterList': json })
this.setData({ chapterList: json })
})
// CC视频走这个接口
ChapterApi.getCurrentChapterDetail(vid,videoType, (json) => {
ChapterApi.getCurrentChapterDetail(vid, videoType, (json) => {
// 播放的视频数据
this.setData({ 'video': json.video })
this.setData({ 'audio': json.audio })
this.setData({ 'image': json.image })
this.setData({ video: json.video })
this.setData({ audio: json.audio })
this.setData({ image: json.image })
ChapterApi.getProgress(vid, did, sid, (res) => {
res.did = did
res.vid = vid
......@@ -163,79 +188,111 @@ Page({
})
},
onLoad: function (options) {
if(!options.vid){
if (!options.vid) {
wx.showToast({
title: '获取视频失败',
icon: 'loading',
duration: 3000,
success:function(){
setTimeout(function(){
success: function () {
setTimeout(function () {
wx.navigateBack({
delta: 1
})
},2000)
}, 2000)
}
})
}
this.data.options = options;
this.data.options = options
},
onHide: function () {
this.isBackend = true
this.pauseVA()
clearInterval(this.heartbeat)
},
onUnload: function () {
this.pauseVA()
},
onHide: function () { this.isBackend = true; this.pauseVA(); clearInterval(this.heartbeat); },
onUnload: function () { this.pauseVA(); },
onShow: function () {
/* 兼容 android 这里发现 android 打开预览大图，然后关闭 自动播放视频，而且关不掉, 兼容android强制关闭视频 */
/* 这里没有 预览大图 关闭监听，所以 isBigPicShow 状态永远为 true */
if (this.isBigPicShow) { this.playVA(); this.isBigPicShow = false; this.isBackend = false; return; }
if (this.isBigPicShow) {
this.playVA()
this.isBigPicShow = false
this.isBackend = false
return
}
if (this.isBackend) {
// this.setData({ 'initVAFlag': true });
this.playVA();
this.playVA()
/* 这里调用，跟初始化调用时保持一致，其主要也是为了解决android从后台进入前台时出现的问题 */
this.isBackend = false;
this.isBackend = false
}
},
/* 生命周期函数--监听页面初次渲染完成 */
onReady: function () { this.ajaxInitGetInfo(this.data.options.vid,this.data.options.type); },
onReady: function () {
this.ajaxInitGetInfo(this.data.options.vid, this.data.options.type)
},
/* controlBar页面 - 切换音频页面 - bindTap事件 */
showContentAudio: function () {
if (!this.data.audio.src) { wx.showToast({ title: '暂无音频文件', icon: 'none' }); return; }
this.changeVideoAndAudio({ content: '当前视频将暂停播放，请确认？', setStorage: 'videoCacheCtrlBar', getStorage: 'audioCacheCtrlBar', isAudio: true, isVideo: false });
if (!this.data.audio.src) {
wx.showToast({ title: '暂无音频文件', icon: 'none' })
return
}
this.changeVideoAndAudio({
content: '当前视频将暂停播放，请确认？',
setStorage: 'videoCacheCtrlBar',
getStorage: 'audioCacheCtrlBar',
isAudio: true,
isVideo: false
})
},
/* controlBar页面 - 切换视频页面 - bindTap事件 */
showContentVideo: function () {
this.changeVideoAndAudio({ content: '当前音频将暂停播放，请确认？', setStorage: 'audioCacheCtrlBar', getStorage: 'videoCacheCtrlBar', isAudio: false, isVideo: true });
this.changeVideoAndAudio({
content: '当前音频将暂停播放，请确认？',
setStorage: 'audioCacheCtrlBar',
getStorage: 'videoCacheCtrlBar',
isAudio: false,
isVideo: true
})
},
/* controlBar页面 - 切换音视频页面:辅助方法 - 1. 关闭音频或视频；2. 需要提示；3. 初始化视频记录或音频记录 */
changeVideoAndAudio: function (obj) {
this.pauseVA();
this.pauseVA()
wx.showModal({
title: '提示', content: obj.content,
title: '提示',
content: obj.content,
success: (res) => {
if (res.confirm) {
wx.setStorageSync(obj.setStorage, obj.getStorage);
let cache = wx.getStorageSync(obj.getStorage);
this.setData({ 'ctrlBar': cache });
this.setData({ 'status.isAudio': obj.isAudio });
this.setData({ 'status.isVideo': obj.isVideo });
/* 这里调用，解决VA视频初始化 */
this.setData({ 'initVAFlag': true });
setTimeout(() => {
this.seekVA(cache.initial_time);
this.playVA();
}, 200)
// wx.setStorageSync(obj.setStorage, obj.getStorage)
let cache = wx.getStorageSync(obj.getStorage)
this.setData(
{
ctrlBar: cache,
'status.isAudio': obj.isAudio,
'status.isVideo': obj.isVideo,
initVAFlag: true
},
function () {
this.seekVA(cache.initial_time)
this.playVA()
}
)
}
}
});
})
},
/* controlBar页面 和 selectChapterList页面 - 切换章节列表 - bindTap事件 */
jumpToOtherVA: function (e) {
/* 跳转时，清空当前播放状态 */
this.heartbeat && clearInterval(this.heartbeat)
let _data = e.target.dataset;
if (!_data.hasva) {
let _data = e.target.dataset
if (!_data.hasva) {
/* 如果存在 - 课后习题类型， type:3、work_type:1 */
let i1 = _data.index, i2 = _data.index1
let i1 = _data.index,
i2 = _data.index1
let _course = this.data.chapterList.course[i1]
if (_course && _course.chapters[i2] && _course.chapters[i2].homework) {
let _hw = _course.chapters[i2].homework
......@@ -243,91 +300,176 @@ Page({
wx.navigateTo({
url: '/pages/learnSystem/courseContent/examDetail/examDetail'
})
return;
return
}
wx.showToast({ title: '请在PC上使用该功能', icon: 'none' }); return;
wx.showToast({ title: '请在PC上使用该功能', icon: 'none' })
return
}
this.isFirstInitAndSwitchVideo = true;
this.statusClear(_data.name, _data.id);
this.ajaxInitGetInfo(_data.id,_data.type);
this.isFirstInitAndSwitchVideo = true
this.statusClear(_data.name, _data.id)
this.ajaxInitGetInfo(_data.id, _data.type)
},
/* controlBar页面 和 selectChapterList页面 - 切换章节列表: 辅助方法 - 1. 暂停视频；2. 关闭章节选择列表；3. 状态清理(status、videoCacheCtrlBar、audioCacheCtrlBar)；4. 设置微信导航头 */
statusClear: function (name, id) {
this.pauseVA();
this.closeSelectChapterList();
let initStatus = { isLoading: true, isSupport: true, isSet: false, isAudio: false, isImages: false, isVideo: false, imagesLoaded: false };
this.setData({ 'status': initStatus });
let initCtrlBar = { isPlay: false, initial_time: 0, currentTime: '00:00', totalTime: '00:00', progress: '0%', curRate: '1.0X', jumpFlag: false, vid: id };
wx.setStorageSync('videoCacheCtrlBar', initCtrlBar);
wx.setStorageSync('audioCacheCtrlBar', initCtrlBar);
wx.setNavigationBarTitle({ title: name || '音视频' });
this.pauseVA()
this.closeSelectChapterList()
let initStatus = {
isLoading: true,
isSupport: true,
isSet: false,
isAudio: false,
isImages: false,
isVideo: false,
imagesLoaded: false
}
this.setData({ status: initStatus })
let initCtrlBar = {
isPlay: false,
initial_time: 0,
currentTime: '00:00',
totalTime: '00:00',
progress: '0%',
curRate: '1.0X',
jumpFlag: false,
vid: id
}
wx.setStorageSync('videoCacheCtrlBar', initCtrlBar)
wx.setStorageSync('audioCacheCtrlBar', initCtrlBar)
wx.setNavigationBarTitle({ title: name || '音视频' })
},
/* controlBar页面 - 上一章 - bindTap事件 */
prevChapter: function (e) { if (!e.target.dataset.id) { wx.showToast({ title: '已经是第一章了.', icon: 'none' }); return; }; this.jumpToOtherVA(e); },
prevChapter: function (e) {
if (!e.target.dataset.id) {
wx.showToast({ title: '已经是第一章了.', icon: 'none' })
return
}
this.jumpToOtherVA(e)
},
/* controlBar页面 - 下一章 - bindTap事件 */
nextChapter: function (e) { if (!e.target.dataset.id) { wx.showToast({ title: '已经是最后一章了.', icon: 'none' }); return; }; this.jumpToOtherVA(e); },
nextChapter: function (e) {
if (!e.target.dataset.id) {
wx.showToast({ title: '已经是最后一章了.', icon: 'none' })
return
}
this.jumpToOtherVA(e)
},
/* controlBar页面 - 打开切换章节列表 - bindTap事件 */
openSelectChapterList: function () { this.setData({ 'chapterList.isShow': true }); },
openSelectChapterList: function () {
this.setData({ 'chapterList.isShow': true })
},
/* controlBar页面 - 关闭切换章节列表 - bindTap事件和内部调用 */
closeSelectChapterList: function () { this.setData({ 'chapterList.isShow': false }); },
closeSelectChapterList: function () {
this.setData({ 'chapterList.isShow': false })
},
/* controlBar页面 - 打开图片轮播页面 - bindTap事件 */
openContentImages: function () { this.setData({ 'status.isImages': true }); },
openContentImages: function () {
this.pauseVA()
this.setData({ 'status.isImages': true })
},
/* controlBar页面 - 关闭图片轮播页面 - bindTap事件 */
closeContentImages: function () {
this.setData({ 'status.isImages': false });
this.playVA()
this.setData({ 'status.isImages': false })
/* 兼容 android 发现打开previewImage后,从swiper 切换回 视频播放页，视频会自动暂停 */
// this.data.status.isVideo && this.pauseVA();
// wx.getStorageSync('videoCacheCtrlBar').isPlay && this.playVA();
},
/* controlBar页面 - 打开设置面板 - bindTap事件 */
openSetContent: function () { this.setData({ 'status.isSet': true }); },
openSetContent: function () {
this.data.status.isSet ? this.playVA() : this.pauseVA()
this.setData({ 'status.isSet': !this.data.status.isSet })
},
/* controlBar页面 - 关闭设置面板 - bindTap事件 */
closeSetContent: function () { this.setData({ 'status.isSet': false }); },
closeSetContent: function () {
this.setData({ 'status.isSet': false }, function () {
this.playVA()
})
},
/* contentImages页面 - 点击放大图 - bindTap事件 */
showBigImage: function () {
let _obj = this.data.image
/* 兼容 android 暂停后 回退回来，视频未暂停还在继续播放，但进度条失去作用，所以需要 onShow中 重新调用 暂停方法 */
this.isBigPicShow = true
wx.previewImage({ current: _obj.imgUrls[_obj.selectIndex], urls: _obj.imgUrls })
wx.previewImage({
current: _obj.imgUrls[_obj.selectIndex],
urls: _obj.imgUrls
})
},
/* Swiper标签 - 轮播图切换时 - bindchange事件 */
imageSelectIndexUpdate: function (e) { this.setData({ 'image.selectIndex': e.detail.current }); },
imageSelectIndexUpdate: function (e) {
this.setData({ 'image.selectIndex': e.detail.current })
},
/* VideoOrAudio image标签 - 图片开始加载 注意：图片过大时，有个加载状态 */
imagesLoadBegin: function () { this.setData({ 'status.imagesLoaded': false }) },
imagesLoadBegin: function () {
this.setData({ 'status.imagesLoaded': false })
},
/* contentAudio页面 - 图片加载完成 - bindload事件 */
imagesLoaded: function () { this.setData({ 'status.imagesLoaded': true }) },
imagesLoaded: function () {
this.setData({ 'status.imagesLoaded': true })
},
/* controlBar页面 - 播放音视频 - bindTap事件和内部调用 */
playVA: function () {
let _data = this.data, _status = _data.status
let _data = this.data,
_status = _data.status
this.setData({ 'ctrlBar.isPlay': true })
_status.isVideo && this._video.play();
_status.isAudio && this._audio.play();
_status.isVideo && this._video.play()
_status.isAudio && this._audio.play()
this.setHeartbeat()
},
/* controlBar页面 - 暂停音视频 - bindTap事件和内部调用 */
pauseVA: function () {
let _data = this.data, _status = _data.status
let _data = this.data,
_status = _data.status
this.setData({ 'ctrlBar.isPlay': false })
_status.isVideo && this._video.pause()
_status.isAudio && this._audio.pause()
clearInterval(this.heartbeat)
},
/* controlBar页面 - 点击进度条跳到某个位置播放 - bindtouchstart事件 */
tapToSeek: function (e) { let pLine = wx.getSystemInfoSync().windowWidth - e.currentTarget.offsetLeft * 2, pos = e.touches[0].pageX, _data = this.data, _status = _data.status, _obj = _status.isVideo ? this._video : this._audio; this.seekVA(parseInt(pos / pLine * _obj.totalTime)); },
tapToSeek: function (e) {
let pLine =
wx.getSystemInfoSync().windowWidth - e.currentTarget.offsetLeft * 2,
pos = e.touches[0].pageX,
_data = this.data,
_status = _data.status,
_obj = _status.isVideo ? this._video : this._audio
this.seekVA(parseInt((pos / pLine) * _obj.totalTime))
},
/* VideoOrAudio - 跳到某个点开始播放 */
seekVA: function (time) { let _data = this.data, _status = _data.status; _status.isVideo && this._video.seek(time); _status.isAudio && this._audio.seek(time); },
seekVA: function (time) {
let _data = this.data,
_status = _data.status
_status.isVideo && this._video.seek(time)
_status.isAudio && this._audio.seek(time)
},
/* setContent页面 - 跳过片头 - bindTap事件 */
jumpHead: function () { this.setData({ 'ctrlBar.jumpFlag': !this.data.ctrlBar.jumpFlag }); },
jumpHead: function () {
this.setData({ 'ctrlBar.jumpFlag': !this.data.ctrlBar.jumpFlag })
},
/* setContent页面 - 后退15s音视频 - bindTap事件 */
slow15s: function () { let _data = this.data, _status = _data.status; _status.isVideo && this._video.fastSlow15('-15'); _status.isAudio && this._audio.fastSlow15('-15'); },
slow15s: function () {
let _data = this.data,
_status = _data.status
_status.isVideo && this._video.fastSlow15('-15')
_status.isAudio && this._audio.fastSlow15('-15')
},
/* setContent页面 - 快进15s音视频 - bindTap事件 */
fast15s: function () { let _data = this.data, _status = _data.status; _status.isVideo && this._video.fastSlow15('15'); _status.isAudio && this._audio.fastSlow15('15'); },
fast15s: function () {
let _data = this.data,
_status = _data.status
_status.isVideo && this._video.fastSlow15('15')
_status.isAudio && this._audio.fastSlow15('15')
},
/* setContent页面 - 改变播放倍率 注意：音频不支持倍速 - bindTap事件 */
setRate: function () {
let _data = this.data, _status = _data.status
if (_status.isAudio) { wx.showToast({ title: '音频暂不支持倍速', icon: 'none' }); return; }
let _data = this.data,
_status = _data.status
if (_status.isAudio) {
wx.showToast({ title: '音频暂不支持倍速', icon: 'none' })
return
}
let _obj = this._video
_obj.rate()
this.setData({ 'ctrlBar.curRate': _obj.RATE[_obj.rateIndex] + 'X' })
......@@ -336,37 +478,51 @@ Page({
beginAndOutFullScreen: function (e) {},
/* VideoOrAudio标签 - 开始/继续播放时触发play事件时，触发 - bindplay事件 */
beginPlayVA: function () {
if(this.data.initVAFlag){
this.setData({ 'initVAFlag': false })
if (this.data.initVAFlag) {
this.setData({ initVAFlag: false })
this.setHeartbeat() //安卓手机播放之后才会上送进度
}
/* iphone6 8.4.1 首次初始化时，不能直接 设置进度并播放 */
if (this.isFirstInitAndSwitchVideo) {
if (!this._cache) this._cache = wx.getStorageSync('videoCacheCtrlBar') || {}
this.seekVA(this._cache.initial_time);
this.isFirstInitAndSwitchVideo = false;
if (!this._cache)
this._cache = wx.getStorageSync('videoCacheCtrlBar') || {}
this.seekVA(this._cache.initial_time)
this.isFirstInitAndSwitchVideo = false
}
},
/* VideoOrAudio标签 - 暂停播放时触发pause事件时，触发 - bindpause事件 */
beginPauseVA: function () {
},
beginPauseVA: function () {},
/* VideoOrAudio标签 - 当播放到末尾时，触发 - bindended事件 */
playEnded: function () { wx.showToast({ title: '当前音/视频播放完毕。', icon: 'none' }); this.pauseVA(); },
playEnded: function () {
wx.showToast({ title: '当前音/视频播放完毕。', icon: 'none' })
this.pauseVA()
},
/* VideoOrAudio标签 - 视频播放错误时，触发 - binderror事件 */
playError: function (e) { },
playError: function (e) {},
/* VideoOrAudio标签 - 视频播放发生变化时 - bindtimeupdate事件 */
timeUpdate: function (e) {
let _data = this.data, _status = _data.status, _detail = e.detail, _obj = _status.isVideo ? this._video : this._audio
let _data = this.data,
_status = _data.status,
_detail = e.detail,
_obj = _status.isVideo ? this._video : this._audio
_obj.currentTime = parseInt(_detail.currentTime)
_obj.totalTime = parseInt(_detail.duration)
this.setData({ 'ctrlBar.progress': _obj.currentTime / _obj.totalTime * 100 + '%' });
this.setData({ 'ctrlBar.currentTime': util.durationToTimeString(_obj.currentTime) });
this.setData({ 'ctrlBar.totalTime': util.durationToTimeString(_obj.totalTime) })
this.setData({
'ctrlBar.progress': (_obj.currentTime / _obj.totalTime) * 100 + '%'
})
this.setData({
'ctrlBar.currentTime': util.durationToTimeString(_obj.currentTime)
})
this.setData({
'ctrlBar.totalTime': util.durationToTimeString(_obj.totalTime)
})
/* 实时改变 当前的PPT当前页 */
let arr = this.data.image.timeArr
for (let i = 0; i < arr.length; i++) {
if (_obj.currentTime >= arr[i] && (i + 1 < arr.length ? _obj.currentTime < arr[i + 1] : 1)) {
if (
_obj.currentTime >= arr[i] &&
(i + 1 < arr.length ? _obj.currentTime < arr[i + 1] : 1)
) {
this.setData({ 'image.current': i })
break
}
......@@ -381,17 +537,18 @@ Page({
this.heartbeat = setInterval(() => {
/* 如果是初始加载状态，就不计算时间状态 和 提交进度了 */
if (this.data.initVAFlag) return;
let arr = _data.ctrlBar.currentTime.split(':'), tempTime = parseInt(arr[0] * 60) + parseInt(arr[1]);
if (this.data.initVAFlag) return
let arr = _data.ctrlBar.currentTime.split(':'),
tempTime = parseInt(arr[0] * 60) + parseInt(arr[1])
this.setData({ 'ctrlBar.initial_time': tempTime })
/* 这里改成异步的，试一下 */
wx.setStorage({
'key': 'videoCacheCtrlBar',
'data': _data.ctrlBar
key: 'videoCacheCtrlBar',
data: _data.ctrlBar
})
wx.setStorage({
'key': 'audioCacheCtrlBar',
'data': _data.ctrlBar
key: 'audioCacheCtrlBar',
data: _data.ctrlBar
})
/* 由于 音视频相同，所以 设置方式设置成一致就可以了 */
/* 提交进度请求, 进度进行中，才计算上进度时间 */
......@@ -404,4 +561,4 @@ Page({
}
}, 10000)
}
})
\ No newline at end of file
})
learnOnline/pages/videoPlayer/show.wxml
浏览文件 @ 676769a8
......@@ -13,14 +13,16 @@
<template is='pageLoading'></template>
</block>
<block wx:if='{{status.isSupport}}'>
<template is='contentAudio' data='{{status, audio, image, ctrlBar}}'></template>
<template is='contentVideo' data='{{status, video, chapterList, ctrlBar}}'></template>
<block wx:if='{{status.isSet}}'>
<template is='setContent' data='{{ctrlBar}}'></template>
</block><block wx:elif='{{status.isImages}}'>
</block>
<block wx:elif='{{status.isImages}}'>
<template is='contentImages' data='{{status, image}}'></template>
</block>
<template is='contentAudio' data='{{status, audio, image, ctrlBar}}'></template>
<template is='contentVideo' data='{{status, video, chapterList, ctrlBar}}'></template>
</block><block wx:else>
</block>
<block wx:else>
<template is='noSupport'></template>
</block>
<template is='controlBar' data='{{status, video, ctrlBar, chapterList, initVAFlag}}'></template>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论