视频播放jsmpeg.js

jsmpeg.js

 

<canvas style="width: 100%" id="video-canvas"></canvas>


<script src="js/lib/jsmpeg.min.js"></script>



app.videoPlay = new JSMpeg.Player(app.params.ts, {
			canvas: document.getElementById('video-canvas'),
			autoplay:false,//是否自动播放
			loop:false,
			poster:'img/sharehint.png',
			onPlay: function() {
				//开始播放事件回调
				console.log('play')
			},
			onEnded: function() {
				//播放完成事件回调
	       console.log('end')
	   },
	   onPause:function(){
	   		//暂停时的回调
	   		console.log('pause')
	   },
	   onVideoDecode:function(){
	   	//–在每个解码和渲染的视频帧之后调用的回调
//	   	console.log(app.videoPlay.currentTime);
	   }
		});
		// try to unlock immediately
		app.videoPlay.audioOut.unlock(onUnlocked)
		
		//下方为了移动端出声音
		function onUnlocked () {
			app.videoPlay.volume = 1;
			//移除掉点击事件
//			document.removeEventListener('touchstart', onTouchStart)
		}
		function onTouchStart () {
			app.videoPlay.audioOut.unlock(onUnlocked);
			//播放与暂停
			if(app.videoPlay.paused ){
				app.videoPlay.play();
			}else{
				app.videoPlay.pause();
			}
//			document.removeEventListener('touchstart', onTouchStart)
		}
		// try to unlock by touchstart event
		document.addEventListener('touchstart', onTouchStart, false)