Mui框架自带VideoPlayer插件的使用

VideoPlayer是一个可用于创建视频播放的控件。

本文将用VideoPlayer控件实现功能：记录视频观看记录。比如，用户观看视频看了1/3，下次进来就是从1/3开始继续播放。官方文档连接为http://www.html5plus.org/doc/zh_cn/media.html

js示例代码：

//创建视频播放对象。需要填入视频地址，视频初始化时间，parseInt(data.data.initial_time)这个值不能抽出来在外面声明，可能是这个插件的一个漏洞。
video = new plus.video.VideoPlayer('video',{
	'src':video_url,
	'initial-time':parseInt(data.data.initial_time)
});

// 监听播放进度更新事件
video.addEventListener('timeupdate', function(e){
	initialTime = e.detail.currentTime;
	//console.log(JSON.stringify(e));
}, false);

// 监听播放结束事件
video.addEventListener('ended', function(e){
	initialTime = 1;
}, false);

html示例代码

用Hbuilder运行这个页面，就可以监听到的播放进度更新事件和播放进度结束事件。

视频播放过程中，会有一个总时长和已观看时长。我们拿到已观看时长，传参。

在用户下次进来时，把这个已观看时长的num值，赋值给initial-time即可

这样用户就可以继续看下去。

此外，前端还重定义返回事件，当点击返回就把initial-time传给后台记录起来。