components/equip-item/equip-item.vue

@@ -11,9 +11,7 @@
 			<text v-if="item.device_status==1" class="state on">在线</text>
 			<text v-else  class="state off">离线</text>
 		</view>
-		<view class="date">
-			最新上报时间：{{item.status_time|timeFormat}}
-		</view>
+		<slot></slot>
 	</view>
 </template>
 

pages/cb/index/index.vue

@@ -16,7 +16,11 @@
 		</view>
 		<view class="content">
 			<template v-for="(item,index) in equipArr[active].list" >
-				<equipItem @click.native="itemClick(item)" v-bind:item="item" :key="index"></equipItem>
+				<equipItem @click.native="itemClick(item)" v-bind:item="item" :key="index">
+					<view class="date">
+						最新上报时间：{{item.status_time|timeFormat}}
+					</view>
+				</equipItem>
 			</template>
 		</view>
 	</view>

pages/index/index.vue

@@ -147,7 +147,9 @@
 						url:"../prevention/index"
 					})
 				}else if(index==2){
-					console.log(2)
+					uni.navigateTo({
+						url:"/pages/monitor/index"
+					})
 				}else if(index==3){
 					uni.navigateTo({
 						url:"../environment/index"

pages/monitor/detail.vue

@@ -0,0 +1,141 @@
+<template>
+	<view class="">
+		<uni-nav-bar @clickLeft="clickLeft" left-icon="back" left-text="返回" title="监控详情"></uni-nav-bar>
+		<view class="" style="height:400px">
+			<view id="myPlayer"></view>
+		</view>
+		<view class="btn-box">
+			<view class="more" @touchstart="configCamera('move', 8)" @touchend="stopConfigCamera()">
+				<image :src="moreSrc" mode="widthFix"></image>
+			</view>
+			<view class="direc">
+				<view class="top"  @touchstart="configCamera('move', 0)" @touchend="stopConfigCamera()">
+
+				</view>
+				<view class="bottom"  @touchstart="configCamera('move', 1)" @touchend="stopConfigCamera()">
+
+				</view>
+				<view class="photo"  @touchstart="configCamera('takephoto', '')" >
+
+				</view>
+				<view class="left"  @touchstart="configCamera('move', 2)" @touchend="stopConfigCamera()">
+
+				</view>
+				<view class="right"  @touchstart="configCamera('move', 6)" @touchend="stopConfigCamera()">
+
+				</view>
+			</view>
+			<view class="less" @touchstart="configCamera('move', 9)" @touchend="stopConfigCamera()">
+				<image :src="lessSrc" mode="widthFix"></image>
+			</view>
+		</view>
+	</view>
+</template>
+<script>
+	import EZUIKit from '../../static/js/ezuikit.js'
+	export default {
+		data() {
+			return {
+				device_id: '',
+				accessToken: "",
+				moreSrc: require('../../static/image/monitor/3.png'),
+				lessSrc: require('../../static/image/monitor/2.png')
+			}
+		},
+		onLoad(options) {
+			this.device_id = options.device_id
+			this.accessToken = options.accessToken
+			console.log(options)
+			this.getAddr()
+		},
+		methods: {
+			getAddr() {
+				setTimeout(() => {
+					let url = `ezopen://open.ys7.com/${this.device_id}/1.hd.live`
+					var player = new EZUIKit.EZUIPlayer({
+						id: 'myPlayer',
+						url: url,
+						autoplay: true,
+						accessToken: this.accessToken,
+						decoderPath: 'static/js/',
+						width: 600,
+						height: 400,
+					});
+					player.play();
+				}, 500)
+			},
+			clickLeft() {
+				uni.navigateBack({
+					delta: 1
+				});
+			},
+			//上下左右和拍照
+			configCamera(ctrl, movenum) {
+				if (ctrl == "takephoto") {
+					this.$myRequest({
+						url: "/api/api_gateway?method=camera.camera_manage.camera_takephoto",
+						data: {
+							device_id: this.device_id,
+						}
+					}).then((res) => {
+						console.log(111)
+						// let data = JSON.parse(res.data.data);
+						// if (data.code == 200) {
+						// 	this.picUrl = data.data.picUrl;
+						// 	this.takePhotoDialogVisible = true;
+						// } else {
+						// 	this.$message.error(data.msg);
+						// }
+					});
+				} else {
+					//上下左右、放大、缩小
+					this.$myRequest({
+						url: "/api/api_gateway?method=camera.camera_manage.ctrl_camera",
+						data: {
+							device_id: this.device_id,
+							ctrl: ctrl,
+							movenum: movenum,
+						}
+					}).then((res) => {
+						console.log(222)
+						// if (res.data.message == '') {
+						// 	this.$message.success('指令下发成功')
+						// 	// this.stopConfigCamera() //关闭方向
+						// }
+					});
+				}
+			},
+			stopConfigCamera() {
+				this.$myRequest({
+					url: "/api/api_gateway?method=camera.camera_manage.ctrl_camera",
+					data: this.qs.stringify({
+						device_id: this.device_id,
+						ctrl: "stop",
+					}),
+				});
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.btn-box {
+		margin-top: 20px;
+		display: flex;
+		flex-direction: row;
+		justify-content: space-around;
+
+		image {
+			width: 200rpx;
+		}
+
+		align-items: center;
+
+		.direc {
+			width: 300rpx;
+			height: 300rpx;
+			background: url('../../static/image/monitor/1.png');
+			background-size: 100% auto;
+		}
+	}
+</style>

pages/monitor/index.vue

@@ -0,0 +1,112 @@
+<template>
+	<view class="">
+		<uni-nav-bar  @clickLeft="clickLeft" left-icon="back" left-text="返回" 
+		 title="监控系统"></uni-nav-bar>
+		<view class="">
+			<image src="../../static/image/monitor/banner.png" mode="widthFix"></image>
+		</view>
+		<view class="content">
+			<template v-for="(item,index) in listArr">
+				<equipItem @click.native="itemClick(item)" v-bind:item="item" :key="index">
+					<view class="type-name">
+						<view class="iconfont icon-jiankong"></view>
+						<text>
+							监控
+						</text>
+					</view>
+
+				</equipItem>
+			</template>
+		</view>
+
+	</view>
+</template>
+
+<script>
+	import equipItem from "../../components/equip-item/equip-item"
+	export default {
+		data() {
+			return {
+				listArr: [],
+				page: 1,
+				accessToken: '',
+				counts: ''
+			}
+		},
+		onLoad() {
+			this.getEquipList()
+		},
+		onPullDownRefresh() {
+			this.page = 1
+			this.listArr = []
+			this.getEquipList()
+			setTimeout(()=>{
+				uni.stopPullDownRefresh()
+			},1000)
+
+		},
+		onReachBottom() {
+			this.page++
+			if (this.counts == this.listArr.length) {
+				return false
+			}
+			this.getEquipList()
+		},
+		methods: {
+			async getEquipList() {
+				const res = await this.$myRequest({
+					url: '/api/api_gateway?method=camera.camera_manage.list_camera',
+					data: {
+						page: this.page
+					}
+				})
+				let data = res.data
+				let arr = data.map(item => {
+					return {
+						...item,
+						device_status: item.status
+					}
+				})
+				console.log(arr)
+				console.log(this.listArr)
+				this.listArr = [...this.listArr, ...arr]
+				this.accessToken = res.accessToken
+				this.counts = res.counts
+			},
+			clickLeft() {
+				uni.switchTab({
+					url: "../index/index"
+				})
+			},
+			itemClick(item) {
+				// uni.navigateTo({
+				// 	url:"/pages/monitor/detail?device_id="+item.device_id+"&accessToken="+this.accessToken
+				// })
+				uni.navigateTo({
+					url:"/pages/webview?device_id="+item.device_id+"&accessToken="+this.accessToken
+				})
+			}
+		},
+		components: {
+			equipItem
+		}
+
+	}
+</script>
+
+<style lang="scss">
+	image {
+		width: 100%;
+	}
+
+	.type-name {
+		color: #999;
+		display: flex;
+		justify-content: flex-start;
+		font-size: 12px;
+
+		text {
+			margin-left: 10px;
+		}
+	}
+</style>

pages/monitor/video.vue

@@ -0,0 +1,14 @@
+<template>
+	<view class="">
+		<web-view src="http://localhost:8080/#/pages/monitor/detail">
+
+		</web-view>
+	</view>
+
+</template>
+
+<script>
+</script>
+
+<style>
+</style>

pages/search/search.vue

@@ -1,5 +1,6 @@
 <template>
 	<view>
+		
 		<!-- <uni-nav-bar @clickRight="clickRight" left-icon="back" left-text="返回"  >
 			<view slot="default">
 				<input type="text" confirm-type="search" value="对对对" />

pages/webview.vue

@@ -0,0 +1,49 @@
+<template>
+	<view class="webview">
+		<web-view :src="url" id="webcon">
+
+		</web-view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				url: '',
+				device_id: '',
+				accessToken: ''
+			}
+		},
+		onLoad(options) {
+			this.device_id = options.device_id
+			this.accessToken = options.accessToken
+			console.log(options)
+			this.getWebviewPage()
+		},
+		methods: {
+			getWebviewPage(id) {
+				this.url = "/static/h5.html"
+				uni.setStorage({
+					key: 'obj',
+					data: JSON.stringify({
+						device_id: this.device_id,
+						accessToken: this.accessToken
+					})
+				})
+				//设置 webview 界面的状态栏的 title
+				uni.setNavigationBarTitle({
+					title: '监控详情'
+				});
+			}
+
+		}
+	}
+</script>
+
+<style>
+	.webview {
+		width: 100vw;
+		height: 100vh;
+	}
+</style>

static/h5.html

@@ -0,0 +1,109 @@
+<!DOCTYPE html>
+<html lang=zh-CN>
+	<head>
+		<meta charset="utf-8">
+		<meta http-equiv="X-UA-Compatible" content="IE=edge">
+		<meta name="divport" content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1">
+		<title>uni-app h5平台在电脑浏览器打开解决方案</title>
+		<meta name="Copyright" content="helang">
+		<link rel="shortcut icon" type="image/png" href="/uniapp-extend/static/logo.png">
+		<meta name="keywords" content="黄河爱浪,WEB前端河浪,jQuery插件开发者河浪">
+		<meta name="description" content="公众号:web-7258,QQ:1846492969,邮箱:helang.love@qq.com">
+		<style type="text/css">
+			body {
+				margin: 0;
+				background-color: #f3f3f3;
+			}
+
+			iframe {
+				width: 375px;
+				height: 667px;
+				background-color: #fff;
+				box-sizing: content-box;
+				border: none;
+			}
+
+			@media screen and (min-width: 450px) {
+				iframe {
+					position: fixed;
+					top: 0;
+					right: 0;
+					bottom: 0;
+					left: 0;
+					margin: auto;
+					border: rgba(0, 0, 0, 0.7) solid 10px;
+					border-radius: 4px;
+				}
+			}
+		</style>
+		<script type="text/javascript" src="./js/ezuikit.js"></script>
+		<script type="text/javascript">
+			window.onload = function() {
+				/* 监听电脑浏览器窗口尺寸改变 */
+				//                window.onresize = function(){
+				//                    /* 窗口宽度 小于或等于420px 时，跳转回H5页面 */
+				//                    if(window.innerWidth <= 420){
+				//                        // window.location.pathname = '/uniapp-extend';
+
+				//                    /* 若你的项目未设置根目录（默认为 / 时），则使用下方代码 */
+				//                    // window.location.pathname = '';
+				//                    }
+				//     
+			
+				var obj=JSON.parse(localStorage.getItem('obj'))
+				console.log(obj)
+				var accessToken=obj.accessToken 
+				var device_id=obj.device_id
+				// let name = window.parent.document.getElementsByTagName("iframe")[0].baseURI; //需要iframe的ID
+			
+				// console.log(name)
+				setTimeout(() => {
+					var url = "ezopen://open.ys7.com/"+device_id+"/1.hd.live"
+					var player = new EZUIKit.EZUIPlayer({
+						id: 'myPlayer',
+						url: url,
+						autoplay: true,
+						accessToken: accessToken,
+						decoderPath: 'js/',
+						width: 600,
+						height: 400,
+					});
+					player.play();
+				}, 500)
+			}
+		</script>
+	</head>
+	<body>
+		<!-- <iframe src="/uniapp-extend"></iframe> -->
+		<div id="myPlayer"></div>
+		<div class="btn-box">
+			<div class="more" @touchstart="configCamera('move', 8)" @touchend="stopConfigCamera()">
+				<!-- <image src="" :src="moreSrc" mode="widthFix"></image> -->
+			</div>
+			<div class="direc">
+				<div class="top"  @touchstart="configCamera('move', 0)" @touchend="stopConfigCamera()">
+		
+				</div>
+				<div class="bottom"  @touchstart="configCamera('move', 1)" @touchend="stopConfigCamera()">
+		
+				</div>
+				<div class="photo"  @touchstart="configCamera('takephoto', '')" >
+		
+				</div>
+				<div class="left"  @touchstart="configCamera('move', 2)" @touchend="stopConfigCamera()">
+		
+				</div>
+				<div class="right"  @touchstart="configCamera('move', 6)" @touchend="stopConfigCamera()">
+		
+				</div>
+			</div>
+			<div class="less" @touchstart="configCamera('move', 9)" @touchend="stopConfigCamera()">
+				<image :src="lessSrc" mode="widthFix"></image>
+			</div>
+		</div>
+		<!--
+            若你的项目未设置根目录（默认为 / 时），则使用下方代码
+            <iframe src="/"></iframe>
+        -->
+	</body>
+</html>

static/js/js/ckplayer/ckplayer.xml

@@ -0,0 +1,280 @@
+<?xml version="1.0" encoding="utf-8"?>
+<ckplayer>
+  <style>
+		<cpath></cpath>
+		<!--
+		播放器风格压缩包文件的路径，默认的是style.swf
+		如果调用不出来可以试着设置成绝对路径试试
+		如果不知道路径并且使用的是默认配置，可以直接留空，播放器会自动寻找
+		-->
+		<language></language>
+		<!--
+		播放器所使用的语言配置文件，需要和播放器在同目录下，默认是language.xml
+		-->
+		<flashvars>{b->1}{p->1}</flashvars>
+		<!--
+		这里是用来做为对flashvars值的补充，除了c和x二个参数以外的设置都可以在这里进行配置
+			                     1 1 1 1   1 1 1 1 1 1 2 2 2  2 2 2 2 2    2 2 3 3 3 3 3 3 3 3 3   3 4  4 4 4
+       		   1 2 3 4 5 6 7 8 9 0 1 2 3   4 5 6 7 8 9 0 1 2  3 4 5 6 7    8 9 0 1 2 3 4 5 6 7 8   9 0  1 2 3
+		-->
+		<setup>1,1,1,1,1,2,0,1,0,0,0,1,200,0,2,1,0,1,1,1,0,10,3,0,1,2,3000,0,0,0,0,1,1,1,1,1,1,250,0,90,0,0,0</setup>
+		<!--
+		这是配置文件里比较重要的一个参数，共有N个功能控制参数，并且以后会继续的增加，各控制参数以英文逗号(,)隔开。下面列出各参数的说明：
+			1、鼠标经过按钮是否使用手型，0普通鼠标，1手型鼠标，2是只有按钮手型，3是控制栏手型
+			2、是否支持单击暂停，0不支持，1是支持
+			3、是否支持双击全屏，0不支持，1是支持
+			4、在播放前置广告时是否同时加载视频，0不加载，1加载
+			5、广告显示的参考对象，0是参考视频区域，1是参考播放器区域
+			6、广告大小的调整方式,只针对swf和图片有效,视频是自动缩放的
+				0=自动调整大小，意思是说大的话就变小，小的话就变大
+				1=是大的化变小，小的话不变
+				2=是什么也不变，就这么大
+				3=是跟参考对像(第5个控制)参数设置的一样宽高
+			7、前置广告播放顺序，0是顺序播放，1是随机播放，>1则随机取所有广告中的(N-1)个进行播放
+			8、对于视频广告是否采用修正，0是不使用，1是使用，如果是1，则用户在网速慢的情况下会按设定的倒计时进行播放广告，计时结束则放正片（比较人性化），设置成0的话，则强制播放完广告才能播放正片
+			9、是否开启滚动文字广告，0是不开启，1是开启且不使用关闭按钮，2是开启并且使用关闭按钮，开启后将在加载视频的时候加载滚动文字广告
+			10、视频的调整方式
+				0=是自动调整大小，意思是说大的话就变小，小的话就变大，同时保持长宽比例不变
+				1=是大的化变小，小的话不变
+				2=是什么也不变，就这么大
+				3=是跟参考对像(pm_video的设置)参数设置的一样宽高
+			11、是否在多视频时分段加载，0不是，1是
+			12、缩放视频时是否进行平滑处理，0不是，1是
+			13、视频缓冲时间,单位：毫秒,建议不超过300
+			14、初始图片调整方式(
+				0=是自动调整大小，意思是说大的话就变小，小的话就变大，同时保持长宽比例不变
+				1=是大的化变小，小的话不变
+				2=是什么也不变，就这么大
+				3=是跟pm_video参数设置的一样宽高
+			15、暂停广告调整方式(
+				0=是自动调整大小，意思是说大的话就变小，小的话就变大，同时保持长宽比例不变
+				1=是大的化变小，小的话不变
+				2=是什么也不变，就这么大
+				3=是跟pm_video参数设置的一样宽
+			16、暂停广告是否使用关闭广告设置，0不使用，1使用
+			17、缓冲时是否播放广告，0是不显示，1是显示并同时隐藏掉缓冲图标和进度，2是显示并不隐藏缓冲图标
+			18、是否支持键盘空格键控制播放和暂停0不支持，1支持
+			19、是否支持键盘左右方向键控制快进快退0不支持，1支持
+			20、是否支持键盘上下方向键控制音量0不支持，1支持
+			21、播放器返回js全部监听函数的等级，0-2,等级越高，返回的参数越多
+				0=不返回全部监听事件
+				1=返回监听，但不在控制台输出
+				2=返回监听，并且在控制台同步输出
+				3=返回全部监听事件，并且在参数前加上"播放器ID->"，用于多播放器的监听
+			22、快进和快退的秒数
+			23、界面上图片元素加载失败重新加载次数
+			24、开启加载皮肤压缩文件包的加载进度提示
+			25、使用隐藏控制栏时显示简单进度条的功能,0是不使用，1是使用，2是只在普通状态下使用
+			26、控制栏隐藏设置(0不隐藏，1全屏时隐藏，2都隐藏
+			27、控制栏隐藏延时时间，即在鼠标离开控制栏后多少毫秒后隐藏控制栏
+			28、滚动文字广告左右滚动时是否采用无缝，默认0采用，1是不采用
+			29、0是正常状态，1是控制栏默认隐藏，播放状态下鼠标经过播放器显示控制栏，2是一直隐藏控制栏
+			30、在播放rtmp视频时暂停后点击播放是否采用重新链接的方式,这里一共分0-2三个等级
+			31、当采用网址形式(flashvars里s=1/2时)读取视频地址时是采用默认0=get方法，1=post方式
+			32、是否启用播放按钮和暂停按钮
+			33、是否启用中间暂停按钮
+			34、是否启用静音按钮
+			35、是否启用全屏按钮
+			36、是否启用进度调节栏,0不启用，1是启用，2是只能前进（向右拖动），3是只能后退，4是只能前进但能回到第一次拖动时的位置，5是看过的地方可以随意拖动，
+			37、是否启用调节音量
+			38、计算时间的间隔，毫秒
+			39、前置logo至少显示的时间，单位：毫秒
+			40、前置视频广告的默认音量
+			41、当s=3/4时加载插件是否从压缩包里加载，0不是，1是
+			42、加载风格是否采用加密方式传送，该功能普通用户不能使用,并且需要下载ckplayer-SN版
+			43、在s=1/2时，调用地址里的地址是否是相对地址（相对于调用文件），0不是，1是
+		-->
+		<pm_bg>0x000000,100,230,180</pm_bg>
+		<!--播放器整体的背景配置
+			1、整体背景颜色
+			2、背景透明度
+			3、播放器最小宽度
+			4、播放器最小高度
+			这里只是初始化时的设置，最终加载完播放器后显示的效果需要在style.swf/style.xml里设置该参数
+		-->
+		<mylogo>logo.swf</mylogo>
+		<!--
+		视频加载前显示的logo文件，不使用设置成<mylogo>null</mylogo>
+		-->
+		<pm_mylogo>1,1,-100,-55</pm_mylogo>
+		<!--
+		视频加载前显示的logo文件(mylogo参数的)的位置
+		本软件所有的四个参数控制位置的方式全部都是统一的意思，如下
+			1、水平对齐方式，0是左，1是中，2是右
+			2、垂直对齐方式，0是上，1是中，2是下
+			3、水平偏移量，举例说明，如果第1个参数设置成0左对齐，第3个偏移量设置成10，就是离左边10个像素，第一个参数设置成2，偏移量如果设置的是正值就会移到播放器外面，只有设置成负值才行，设置成-1，按钮就会跑到播放器外面
+			4、垂直偏移量 
+		-->
+		<logo>cklogo.png</logo>
+		<!--
+		默认右上角一直显示的logo，不使用设置成<logo>null</logo>
+		-->
+		<pm_logo>2,0,-100,20</pm_logo>
+		<!--
+		播放器右上角的logo的位置
+			1、水平对齐方式，0是左，1是中，2是右
+			2、垂直对齐方式，0是上，1是中，2是下
+			3、水平偏移量
+			4、垂直偏移量 
+		以下是播放器自带的二个插件
+		-->
+		<control_rel>related.swf,related.xml,0</control_rel>
+		<!--
+			1、视频播放结束后显示相关精彩视频的插件文件（注意，视频结束动作设置成3时(即var flashvars={e:3})有效），
+			2、xml文件是调用精彩视频的示例文件，可以自定义文件类型（比如asp,php,jsp,.net只要输出的是xml格式就行）,实际使用中一定要注意第二个参数的路径要正确
+			3、第三个参数是设置配置文件的编码，0是默认的utf-8,1是gbk2312 
+		-->
+		<control_pv>Preview.swf,105,2000</control_pv>
+		<!--
+		视频预览插件
+			1、插件文件名称(该插件和上面的精彩视频的插件都是放在风格压缩包里的)
+			2、离进度栏的高(指的是插件的顶部离进度栏的位置)
+			3、延迟时间(该处设置鼠标经过进度栏停顿多少毫秒后才显示插件)
+			建议一定要设置延时时间，不然当鼠标在进度栏上划过的时候就会读取视频地址进行预览，很占资源 
+		-->
+		<pm_repc></pm_repc>
+		<!--
+		视频地址替换符，该功能主要是用来做简单加密的功能，使用方法很简单，请注意，只针对f值是视频地址的时候有效，其它地方不能使用。具体的请查看http://www.ckplayer.com/manual.php?id=4#title_25
+		-->
+		<pm_spac>|</pm_spac>
+		<!--
+		视频地址间隔符，这里主要是播放多段视频时使用普通调用方式或网址调用方式时使用的。默认使用|，如果视频地址里本身存在|的话需要另外设置一个间隔符，注意，即使只有一个视频也需要设置。另外在使用rtmp协议播放视频的时候，如果视频存在多级目录的话，这里要改成其它的符号，因为rtmp协议的视频地址多级的话也需要用到|隔开流地址和实例地址 
+		-->
+		<pm_fpac>file->f</pm_fpac>
+		<!--
+		该参数的功能是把自定义的flashvars里的变量替换成ckplayer里对应的变量，默认的参数的意思是把flashvars里的file值替换成f值，因为ckplayer里只认f值，多个替换之间用竖线隔开
+		-->
+		<pm_advtime>2,0,-110,10,0,300,0</pm_advtime>
+		<!--
+		前置广告倒计时文本位置，播放前置 广告时有个倒计时的显示文本框，这里是设置该文本框的位置和宽高，对齐方式的。一共7个参数，分别表示：
+			1、水平对齐方式，0是左对齐，1是中间对齐，2是右对齐
+			2、垂直对齐方式，0是上对齐，1是中间对齐，2是低部对齐
+			3、水平位置偏移量
+			4、垂直位置偏移量
+			5、文字对齐方式，0是左对齐，1是中间对齐，2是右对齐，3是默认对齐
+			6、文本框宽席
+			7、文本框高度 
+		-->
+		<pm_advstatus>1,2,2,-200,-40</pm_advstatus>
+		<!--
+		前置广告静音按钮，静音按钮只在是视频广告时显示，当然也可以控制不显示 
+			1、是否显示0不显示，1显示
+			2、水平对齐方式
+			3、垂直对齐方式
+			4、水平偏移量
+			5、垂直偏移量
+		-->
+		<pm_advjp>1,0,2,2,-100,-40</pm_advjp>
+		<!--
+		前置广告跳过广告按钮的位置
+			1、是否显示0不显示，1是显示
+			2、跳过按钮触发对象(值0/1,0是直接跳转,1是触发js:function ckadjump(){})
+			3、水平对齐方式
+			4、垂直对齐方式
+			5、水平偏移量
+			6、垂直偏移量
+		-->
+		<pm_padvc>2,0,-13,-13</pm_padvc>
+		<!--
+		暂停广告的关闭按钮的位置
+			1、水平对齐方式
+			2、垂直对齐方式
+			3、水平偏移量
+			4、垂直偏移量
+		-->
+		<pm_advms>2,2,-46,-67</pm_advms>
+		<!--
+		滚动广告关闭按钮位置
+			1、水平对齐方式
+			2、垂直对齐方式
+			3、水平偏移量
+			4、垂直偏移量
+		-->
+		<pm_zip>1,1,-20,-8,1,0,0</pm_zip>
+		<!--
+		加载皮肤压缩包时提示文字的位置
+			1、水平对齐方式，0是左对齐，1是中间对齐，2是右对齐
+			2、垂直对齐方式，0是上对齐，1是中间对齐，2是低部对齐
+			3、水平位置偏移量
+			4、垂直位置偏移量
+			5、文字对齐方式，0是左对齐，1是中间对齐，2是右对齐，3是默认对齐
+			6、文本框宽席
+			7、文本框高度
+		-->
+		<pm_advmarquee>1,2,50,-70,50,18,0,0x000000,50,0,20,1,30,2000</pm_advmarquee>
+		<!--
+		滚动广告的控制，要使用的话需要在setup里的第9个参数设置成1
+		这里分二种情况,前六个参数是定位控制，第7个参数是设置定位方式(0：相对定位，1：绝对定位)
+		第一种情况：第7个参数是0的时候，相对定位，就是播放器长宽变化的时候，控制栏也跟着变
+			1、默认1:中间对齐
+			2、上中下对齐（0是上，1是中，2是下）
+			3、离左边的距离
+			4、Y轴偏移量
+			5、离右边的距离
+			6、高度
+			7、定位方式
+		第二种情况：第7个参数是1的时候，绝对定位，就是播放器长宽变化的时候，控制栏不跟着变，这种方式一般使用在控制栏大小不变的时候
+			1、左中右对齐方式（0是左，1是中间，2是右）
+			2、上中下对齐（0是上，1是中，2是下）
+			3、x偏移量
+			4、y偏移量
+			5、宽度
+			6、高度
+			7、定位方式
+		以上是前7个参数的作用
+			8、是文字广告的背景色
+			9、置背景色的透明度
+			10、控制滚动方向，0是水平滚动（包括左右），1是上下滚动（包括向上和向下）
+			11、移动的单位时长，即移动单位像素所需要的时长，毫秒
+			12、移动的单位像素,正数同左/上，负数向右/下
+			13、是行高，这个在设置向上或向下滚动的时候有用处
+			14、控制向上或向下滚动时每次停止的时间
+		-->
+		<pm_glowfilter>0,0x01485d, 100, 6, 3, 10, 1, 0, 0</pm_glowfilter>
+		<!--滚动文字广告是否采用发光滤镜
+			1、是否使用发光滤镜，0是不采用，1是使用
+			2、(default = 0xFF0000) — 光晕颜色，采用十六进制格式 0xRRGGBB。 默认值为 0xFF0000  
+			3、(default = 100) — 颜色的 Alpha 透明度值。 有效值为 0 到 100。 例如，25 设置透明度为 25%  
+			4、(default = 6.0) — 水平模糊量。 有效值为 0 到 255（浮点）。 2 的乘方值（如 2、4、8、16 和 32）经过优化，呈现速度比其它值更快  
+			5、(default = 6.0) — 垂直模糊量。 有效值为 0 到 255（浮点）。 2 的乘方值（如 2、4、8、16 和 32）经过优化，呈现速度比其它值更快  
+			6、(default = 2) — 印记或跨页的强度。 该值越高，压印的颜色越深，而且发光与背景之间的对比度也越强。 有效值为 0 到 255  
+			7、(default = 1) — 应用滤镜的次数
+			8、(default = 0) — 指定发光是否为内侧发光。 值 1 指定发光是内侧发光。 值 0 指定发光是外侧发光（对象外缘周围的发光）  
+			9、(default = 0) — 指定对象是否具有挖空效果。 值为 1 将使对象的填充变为透明，并显示文档的背景颜色背景颜色。 
+		-->
+		<advmarquee>{a href='http://www.ckplayer.com'}{font color='#FFFFFF' size='12'}这里可以放文字广告，为什么要在这里放呢，{/font}{/a}{a href='http://www.ckplayer.com'}{font color='#FFFFFF' size='12'}是因为如果你想在站外调用视频并且有文字广告的话，{/a}{br}就得在这里才能被加载，在js里是不能补加载的，{br}默认使用这里的广告，如果不想在这里使用可以清空这里的内容</advmarquee>
+		<!--
+		该处是滚动文字广告的内容，如果不想在这里设置，就把这里清空并且在页面中使用js的函数定义function ckmarqueeadv(){return '广告内容'}
+		-->
+		<mainfuntion></mainfuntion>
+		<!--
+		当flashvars里s=3/4时，调用的函数包名称，默认为空，调用时间轴上的函数setAppObj
+		-->
+		<flashplayer></flashplayer>
+		<!--
+		当flashvars里的s=3/4时，也可以把swf文件放在这里
+		-->
+		<calljs>ckplayer_status,ckadjump,playerstop,ckmarqueeadv</calljs>
+		<!--
+			1、全局监听返回结果的函数
+			2、跳过广告的函数
+			3、播放结束时调用的js函数
+			4、加载滚动文字广告的函数
+		-->
+		<myweb></myweb>
+		
+		<!--
+		以下内容部份是和插件相关的配置，请注意，自定义插件以及其配置的命名方式要注意，不要和系统的相重复，不然就会替换掉系统的相关设置，删除相关插件的话也可以同时删除相关的配置
+		以下内容定义自定义插件的相关配置，这里也可以自定义任何自己的插件需要配置的内容，当然，如果你某个插件不使用的话，也可以删除相关的配置
+		-->
+		<cpt_lights>0</cpt_lights>
+		<!--
+		该处定义是否使用开关灯，使用开灯效果时调用页面的js函数function closelights(){}，关灯调用 function closelights(){};
+		-->
+		<cpt_share>/ckplayer/share.xml</cpt_share>
+		<!--
+		分享插件调用的配置文件地址,此设设置成空，则不启用分享按钮
+		调用插件开始
+		-->
+	</style>
+</ckplayer>

static/js/js/ckplayer/language.xml

@@ -0,0 +1,81 @@
+<?xml version="1.0" encoding="utf-8"?>
+	<ckplayer>
+		<style>
+			<pr_zip>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}已加载[$prtage]%{/font}</pr_zip>
+			<!--
+			加载皮肤包进度提示的文字，[$prtage]会被替换成加载百分比
+			-->
+			<pr_load>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}已加载[$prtage]%{/font}</pr_load>
+			<!--
+			当调用多段视频时，并且没有配置好各段视频的时间和字节数的情况下，播放器需要先读取各段视频的元数据进行计算，此时需要显示一个加载进度告诉用户已计算的情况。 
+			-->
+			<pr_noload>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}加载失败{/font}</pr_noload>
+			<!--
+			加载视频失败时显示的内容 
+			-->
+			<pr_buffer>{font color='#FFFFFF' face='Arial' size='12'}[$buffer]%{/font}</pr_buffer>
+			<!--
+			视频缓冲时显示的提示，[$buffer]会被替换成缓冲的百分比数字部份
+			-->
+			<pr_play>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}点击播放{/font}</pr_play>
+			<!--
+			鼠标经过播放按钮时的提示，支持html 
+			-->
+			<pr_pause>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}点击暂停{/font}</pr_pause>
+			<!--
+			鼠标经过暂停按钮时的提示，支持html 
+			-->
+			<pr_mute>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}点击静音{/font}</pr_mute>
+			<!--
+			鼠标经过静音按钮时的提示，支持html 
+			-->
+			<pr_nomute>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}取消静音{/font}</pr_nomute>
+			<!--
+			鼠标经过取消静音按钮时的提示，支持html 
+			-->
+			<pr_full>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}点击全屏{/font}</pr_full>
+			<!--
+			鼠标经过全屏按钮时的提示，支持html 
+			-->
+			<pr_nofull>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}退出全屏{/font}</pr_nofull>
+			<!--
+			鼠标经过退出全屏按钮时的提示，支持html 
+			-->
+			<pr_fastf>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}快进{/font}</pr_fastf>
+			<!--
+			鼠标经过快进按钮时的提示，支持html 
+			-->
+			<pr_fastr>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}快退{/font}</pr_fastr>
+			<!--
+			鼠标经过快退按钮时的提示，支持html 
+			-->
+			<pr_time>{font color='#FFFFFF' face='Arial' size='16'}[$Time]{/font}</pr_time>
+			<!--
+			鼠标经过进度栏时提示当前点上时间的，[$Time]会被替换成时间，支持html 
+			-->
+			<pr_volume>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}音量：[$Volume]%{/font}</pr_volume>
+			<!--
+			鼠标经过音量调节框或调整音量时提示，[$Volume]会自动替换音量值(0-100) 
+			-->
+			<pr_clockwait>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}00:00 / 00:00{/font}</pr_clockwait>
+			<!--
+			在默认不加载视频，即m=1的时候，同时并没有设置视频的时间和字节，即o和w值的时候，pr_clock和pr_clock2里的所有内容被替换成这里设置的值 
+			-->
+			<pr_live>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}视频直播中{/font}</pr_live>
+			<!--
+			在直播的情况下显示的文字 
+			-->
+			<pr_adv>{font color='#FFFFFF' size='12' face='Microsoft YaHei,微软雅黑'}广告剩余：{font color='#FF0000' size='15' face='Arial'}{b}[$Second]{/b}{/font} 秒{/font}</pr_adv>
+			<!--
+			广告倒计时显示的内容，[$Second]将会显示倒计时的秒数
+			-->
+			<pr_prompt>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}[$prompt]{/font}</pr_prompt>
+			<!--
+			提示点文字 
+			-->
+			<pr_cksetup>{font color='#FFFFFF' face='Microsoft YaHei,微软雅黑' size='14'}设置{/font}</pr_cksetup>
+			<!--
+			鼠标经过设置提示的文字（该定义为插件所用）
+			-->
+		</style>
+	</ckplayer>

static/js/js/ckplayer/related.xml

@@ -0,0 +1,121 @@
+<?xml version="1.0" encoding="utf-8"?>
+<ckplayer>
+<title>{font color="#FFDD00" face="Microsoft YaHei,微软雅黑" size="14"}精彩视频推荐{/font}</title>
+	<!--左上角的标题说明文字，支持html-->
+	<area>600,400,0xFFDD00,20</area>
+	<!--
+		该插件在播放中的区域控制
+		固定尺寸，精彩视频区域会固定大小并且保持剧中
+		1：宽
+		2：高
+		3：边框色
+		4：边框透明度
+	-->
+	<image>120,90</image>
+	<!--图片的宽，高-->
+	<distance>150,175,100</distance>
+	<!--
+		1：横排图片之间的距离，前一个图片的左边到后一个图片的左边的距离
+		2：竖排图片之间距离，上一个图片的上边到下一个图片的上边距离，这里需要特别注意，因为图片显示区域是总区域-40的高度，默认的即<area>的高400-40=360，所以比如你的图片想一列显示二个，则该参数需要设置成360/2=180
+		3：文字距离图片上方的距离
+		只要设置好这三个参数，图片的位置就可以固定住了
+	-->
+	<rep_title>{a href="[url]" target="_blank"}{font color="#FFFFFF" face="新宋体"}[title]{/font}{/a}</rep_title>
+	<!--标题替换规则-->
+	<style>a{color:#FFFFFF;}a:hover{color:#FF0000;}</style>
+	<!--文本样式-->
+	<size>120,42,3</size>
+	<!--文本的宽度，高度，行和行之间距离-->
+	<relatedlist>
+		<related>
+			<img>temp/1.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>1：这里调用的文件配置在ckplayer/related.xml里</title>
+		</related>
+		<related>
+			<img>temp/2.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>2：支持多页调用</title>
+		</related>
+		<related>
+			<img>temp/3.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>3：文本请保持在二行，不能多于三行，多于三行将不显示</title>
+		</related>
+		<related>
+			<img>temp/4.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>4：支持多行调用，多页调用</title>
+		</related>
+		<related>
+			<img>temp/5.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>5：感谢对ckplayer的支持</title>
+		</related>
+		<related>
+			<img>temp/6.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>6：最多两行,请不要超过二行</title>
+		</related>
+		<related>
+			<img>temp/3.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>7：这里调用的文件配置在ckplayer/related.xml里</title>
+		</related>
+		<related>
+			<img>temp/5.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>8：支持多页调用</title>
+		</related>
+		<related>
+			<img>temp/4.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>9：文本请保持在二行，不能多于三行，多于三行将不显示</title>
+		</related>
+		<related>
+			<img>temp/1.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>10：支持多行调用，多页调用</title>
+		</related>
+		<related>
+			<img>temp/2.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>11：感谢对ckplayer的支持</title>
+		</related>
+		<related>
+			<img>temp/6.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>12：最多两行,请不要超过二行</title>
+		</related>
+		<related>
+			<img>temp/5.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>13：这里调用的文件配置在ckplayer/related.xml里</title>
+		</related>
+		<related>
+			<img>temp/4.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>14：支持多页调用</title>
+		</related>
+		<related>
+			<img>temp/6.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>15：文本请保持在二行，不能多于三行，多于三行将不显示</title>
+		</related>
+		<related>
+			<img>temp/3.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>16：支持多行调用，多页调用</title>
+		</related>
+		<related>
+			<img>temp/1.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>17：感谢对ckplayer的支持</title>
+		</related>
+		<related>
+			<img>temp/2.jpg</img>
+			<url>http://www.ckplayer.com/</url>
+			<title>18：最多两行,请不要超过二行</title>
+		</related>
+	</relatedlist>
+</ckplayer>

static/js/js/ckplayer/share.xml

@@ -0,0 +1,61 @@
+<?xml version="1.0" encoding="utf-8"?>
+<ckplayer>
+	<share_html>
+	{embed src="贵站网址，在ckplayer/share.xml里修改/ckplayer/ckplayer.swf" flashvars="[$share]" quality="high" width="480" height="400" align="middle" allowScriptAccess="always" allowFullscreen="true" type="application/x-shockwave-flash"}{/embed}
+	</share_html>
+	<share_flash>
+	贵站网址/ckplayer/ckplayer.swf?[$share]
+	</share_flash>
+	<share_flashvars>
+	f,my_url,my_pic,a
+	</share_flashvars>
+	<share_path>ckplayer/share/</share_path><!--分享图片的文件夹地址-->
+	<share_replace>
+	</share_replace>
+	<share_permit>0</share_permit><!--是否有视听许可证,默认0没有，1是有-->
+	<share_uuid>
+	c25cf02c-1705-412d-bd4b-77a10b380f08
+	</share_uuid>
+	<share_button>
+		<share>
+			<id>qqmb</id>
+			<img>qq.png</img>
+			<coordinate>20,50</coordinate>
+		</share>
+		<share>
+			<id>sinaminiblog</id>
+			<img>sina.png</img>
+			<coordinate>101,50</coordinate>
+		</share>
+		<share>
+			<id>qzone</id>
+			<img>qzone.png</img>
+			<coordinate>182,50</coordinate>
+		</share>
+		<share>
+			<id>renren</id>
+			<img>rr.png</img>
+			<coordinate>263,50</coordinate>
+		</share>
+		<share>
+			<id>kaixin001</id>
+			<img>kaixin001.png</img>
+			<coordinate>20,85</coordinate>
+		</share>
+		<share>
+			<id>tianya</id>
+			<img>tianya.png</img>
+			<coordinate>101,85</coordinate>
+		</share>
+		<share>
+			<id>feixin</id>
+			<img>feixin.png</img>
+			<coordinate>182,85</coordinate>
+		</share>
+		<share>
+			<id>msn</id>
+			<img>msn.png</img>
+			<coordinate>263,85</coordinate>
+		</share>
+	</share_button>
+</ckplayer>

static/js/js/playctrl/DecodeWorker.js

@@ -0,0 +1,708 @@
+/**
+ * Created by wangweijie5 on 2016/12/5.
+ */
+(function (event) {
+    const AUDIO_TYPE = 0;	// 音频
+    const VIDEO_TYPE = 1;   // 视频
+    const PRIVT_TYPE = 2;  // 私有帧
+
+    const PLAYM4_AUDIO_FRAME = 100; // 音频帧
+    const PLAYM4_VIDEO_FRAME = 101; // 视频帧
+
+    const PLAYM4_OK = 1;
+    const PLAYM4_DECODE_ERROR = 44 	// 解码失败
+    const PLAYM4_NOT_KEYFRAME = 48; 	// 非关键帧
+    const PLAYM4_NEED_MORE_DATA = 31;   // 需要更多数据才能解析
+    const PLAYM4_SYS_NOT_SUPPORT = 16; 	// 不支持
+
+    const PLAYM4_PARA_ENCODER_ERROR                     = 71;  //音频编码参数错误
+    const PLAYM4_PRECONDITION_ENCODER_ERROR             = 72;  //不满足音频编码条件错误
+    const PLAYM4_ENCODER_ERROR                          = 73;  //音频编码失败
+    const PLAYM4_CREATE_ENCODER_ERROR                   = 74;  //创建音频编码器失败
+    const PLAYM4_NOSUPPORT_ENCODER_ERROR                = 75;  //音频编码不支持
+    const PLAYM4_ALLOC_MEMORY_ENCODER_ERROR	            = 76;  //音频编码相关内存申请失败
+    const PLAYM4_BUF_OVER_ENCODER_ERROR                 = 77;  //音频编码相关buffer满
+    const PLAYM4_NEED_MORE_DATA_ENCODER_ERROR           = 78;  //音频编码需要更多数据进行编码
+    const PLAYM4_CALL_ORDER_ENCODER_ERROR               = 79;  //音频编码调用顺序错误
+
+    const PLAYM4_ITYPE_DECODE_ERROR                     =100;   //定位后送进来的第一帧I帧解码失败
+    const PLAYM4_FIRST_FRAME_NOT_ICURRENT               =101;   //定位后送进来的第一帧不是定位帧所在的I帧（Ni>Mp）
+
+
+    importScripts('Decoder.js');
+    Module.postRun.push(function () {
+        postMessage({'function': "loaded"});
+    });
+
+    var iStreamMode = 0;  // 流模式
+
+    var bOpenMode = false;
+    var bOpenStream = false;
+    
+    var funGetFrameData = null;
+    var funGetAudFrameData = null;
+	
+	var bWorkerPrintLog=false;//worker层log开关
+
+    onmessage = function (event)
+    {
+        var eventData = event.data;
+        var res = 0;
+        switch (eventData.command)
+        {
+			case "printLog":
+			    let downloadFlag=eventData.data;
+			    if(downloadFlag===true)
+                {
+                    bWorkerPrintLog=true;
+                    res = Module._SetPrintLogFlag(downloadFlag);
+                }
+			    else
+                {
+                    bWorkerPrintLog=false;
+                    res = Module._SetPrintLogFlag(downloadFlag);
+                }
+
+				if (res !== PLAYM4_OK)
+                {
+					console.log("DecodeWorker.js: PlayerSDK print log failed,res"+res);
+                    postMessage({'function': "printLog", 'errorCode': res});
+                }
+				break;
+            case "SetPlayPosition":
+                let nFrameNumOrTime=eventData.data;
+                let enPosType=eventData.type;
+                res = Module._SetPlayPosition(nFrameNumOrTime,enPosType);
+                if (res !== PLAYM4_OK)
+                {
+                    postMessage({'function': "SetPlayPosition", 'errorCode': res});
+                    return;
+                }
+                //有没有buffer需要清除
+
+                break;
+            case "SetStreamOpenMode":
+                iStreamMode = eventData.data;
+                res = Module._SetStreamOpenMode(iStreamMode);
+                if (res !== PLAYM4_OK)
+                {
+                    postMessage({'function': "SetStreamOpenMode", 'errorCode': res});
+                    return;
+                }
+                bOpenMode = true;
+                break;
+
+            case "OpenStream":
+                // 接收到的数据
+                var iHeadLen = eventData.dataSize;
+                var pHead = Module._malloc(iHeadLen + 4);
+                if (pHead === null)
+                {
+                    return;
+                }
+                var aHead = Module.HEAPU8.subarray(pHead, pHead + iHeadLen);
+                aHead.set(eventData.data);
+                res = Module._OpenStream(pHead, iHeadLen, eventData.bufPoolSize);
+                postMessage({'function': "OpenStream", 'errorCode': res});
+                if (res !== PLAYM4_OK)
+                {
+                    //释放内存
+                    Module._free(pHead);
+                    pHead = null;
+                    return;
+                }
+                bOpenStream = true;
+
+                // 加4字节长度信息
+                var a32 = new Uint32Array([iHeadLen]);
+                var a8 = new Uint8Array(a32.buffer);
+                var tempBuf = new Uint8Array(iHeadLen + 4);
+                tempBuf.set(a8, 0);
+                tempBuf.set(eventData.data, 4);
+                a32 = null;
+                a8 = null;
+
+                aHead = Module.HEAPU8.subarray(pHead, pHead + iHeadLen + 4);
+                aHead.set(tempBuf);
+                tempBuf = null;
+
+                res = Module._InputData(pHead, iHeadLen + 4);
+                if (res !== PLAYM4_OK)
+                {
+                    postMessage({'function': "InputData", 'errorCode': res});
+                    Module._free(pHead);
+                    pHead = null;
+                    return;
+                }
+
+                // 释放内存
+                Module._free(pHead);
+                pHead = null;
+
+                if (funGetFrameData === null) {
+                    funGetFrameData = Module.cwrap('GetFrameData', 'number');
+                }
+
+                if (iStreamMode === 0) {
+                    // Module._GetFrameData();
+                    funGetFrameData();
+                }
+                break;
+
+            case "InputData":
+                // 接收到的数据
+                var iLen = eventData.dataSize;
+                if(bWorkerPrintLog)
+                {
+                    console.log("<<<Worker: DecodeWorker-InputData iLen:"+iLen);
+                }
+                
+                if (iLen > 0)
+                {
+                    var pInputData = Module._malloc(iLen);
+                    if (pInputData === null)
+                    {
+                        return;
+                    }
+                    var inputData = new Uint8Array(eventData.data);
+                    // var aInputData = Module.HEAPU8.subarray(pInputData, pInputData + iLen);
+                    // aInputData.set(inputData);
+                    Module.writeArrayToMemory(inputData, pInputData);
+                    inputData = null;
+                    res = Module._InputData(pInputData, iLen);
+                    //console.log("DecodeWorker-InputData-ret:%d", res);
+					if(bWorkerPrintLog)
+					{
+						console.log("<<<Worker:InputData result:"+ +res);
+					}
+					
+                    if (res !== PLAYM4_OK)
+                    {
+                        if (res === 98)
+                        {
+                            res = 1;
+                        }
+                        postMessage({'function': "InputData", 'errorCode': res});
+                    }
+                    Module._free(pInputData);
+                    pInputData = null;
+                }
+
+                /////////////////////
+                if (funGetFrameData === null)
+                {
+                    funGetFrameData = Module.cwrap('GetFrameData', 'number');
+                }
+
+                while (bOpenMode && bOpenStream)
+                {
+                    
+                    var ret = getFrameData(funGetFrameData);
+                    // 直到获取视频帧或数据不足为止
+                    if (PLAYM4_VIDEO_FRAME === ret || PLAYM4_NEED_MORE_DATA === ret)
+                    {
+                        break;
+                    }
+                }
+                break;
+
+            case "SetSecretKey":
+                var keyLen = eventData.nKeyLen;
+                var pKeyData = Module._malloc(keyLen);
+                if (pKeyData === null) {
+                    return;
+                }
+                var nKeySize = eventData.data.length
+                var bufData = stringToBytes (eventData.data);
+                var aKeyData = Module.HEAPU8.subarray(pKeyData, pKeyData + keyLen);
+                aKeyData.set(new Uint8Array(bufData));
+
+                res = Module._SetSecretKey(eventData.nKeyType, pKeyData, keyLen, nKeySize);
+                if (res !== PLAYM4_OK) {
+                    postMessage({'function': "SetSecretKey", 'errorCode': res});
+                    Module._free(pKeyData);
+                    pKeyData = null;
+                    return;
+                }
+
+                Module._free(pKeyData);
+                pKeyData = null;
+                break;
+
+            case "GetBMP":
+                var nBMPWidth = eventData.width;
+                var nBMPHeight = eventData.height;
+                var pYUVData = eventData.data;
+                var nYUVSize = nBMPWidth * nBMPHeight * 3 / 2;
+                var oBMPCropRect = eventData.rect;
+
+                var pDataYUV = Module._malloc(nYUVSize);
+                if (pDataYUV === null) {
+                    return;
+                }
+
+                Module.writeArrayToMemory(new Uint8Array(pYUVData, 0, nYUVSize), pDataYUV);
+
+                // 分配BMP空间
+                var nBmpSize = nBMPWidth * nBMPHeight * 4 + 60;
+                var pBmpData = Module._malloc(nBmpSize);
+                var pBmpSize = Module._malloc(4);
+                if (pBmpData === null || pBmpSize === null) {
+                    Module._free(pDataYUV);
+                    pDataYUV = null;
+
+                    if (pBmpData != null) {
+                        Module._free(pBmpData);
+                        pBmpData = null;
+                    }
+
+                    if (pBmpSize != null) {
+                        Module._free(pBmpSize);
+                        pBmpSize = null;
+                    }
+                    return;
+                }
+
+                Module._memset(pBmpSize, nBmpSize, 4); // 防止bmp截图出现输入数据过大的错误码
+
+                res = Module._GetBMP(pDataYUV, nYUVSize, pBmpData, pBmpSize,
+                    oBMPCropRect.left, oBMPCropRect.top, oBMPCropRect.right, oBMPCropRect.bottom);
+                if (res !== PLAYM4_OK) {
+                    postMessage({'function': "GetBMP", 'errorCode': res});
+                    Module._free(pDataYUV);
+                    pDataYUV = null;
+                    Module._free(pBmpData);
+                    pBmpData = null;
+                    Module._free(pBmpSize);
+                    pBmpSize = null;
+                    return;
+                }
+
+                // 获取BMP图片大小
+                var nBmpDataSize = Module.getValue(pBmpSize, "i32");
+
+                // 获取BMP图片数据
+                var aBmpData = new Uint8Array(nBmpDataSize);
+                aBmpData.set(Module.HEAPU8.subarray(pBmpData, pBmpData + nBmpDataSize));
+
+                postMessage({'function': "GetBMP", 'data': aBmpData, 'errorCode': res}, [aBmpData.buffer]);
+                aBmpData=null;
+                if (pDataYUV != null) {
+                    Module._free(pDataYUV);
+                    pDataYUV = null;
+                }
+                if (pBmpData != null) {
+                    Module._free(pBmpData);
+                    pBmpData = null;
+                }
+                if (pBmpSize != null) {
+                    Module._free(pBmpSize);
+                    pBmpSize = null;
+                }
+                break;
+
+            case "GetJPEG":
+                var nJpegWidth = eventData.width;
+                var nJpegHeight = eventData.height;
+                var pYUVData1 = eventData.data;
+                var nYUVSize1 = nJpegWidth * nJpegHeight * 3 / 2;
+                var oJpegCropRect = eventData.rect;
+
+                var pDataYUV1 = Module._malloc(nYUVSize1);
+                if (pDataYUV1 === null) {
+                    return;
+                }
+
+                Module.writeArrayToMemory(new Uint8Array(pYUVData1, 0, nYUVSize1), pDataYUV1);
+
+                // 分配JPEG空间
+                var pJpegData = Module._malloc(nYUVSize1);
+                var pJpegSize = Module._malloc(4);
+                if (pJpegData === null || pJpegSize === null) {
+                    if (pJpegData != null) {
+                        Module._free(pJpegData);
+                        pJpegData = null;
+                    }
+
+                    if (pJpegSize != null) {
+                        Module._free(pJpegSize);
+                        pJpegSize = null;
+                    }
+
+                    if (pDataYUV1 != null) {
+                        Module._free(pDataYUV1);
+                        pDataYUV1 = null;
+                    }
+                    return;
+                }
+
+                Module.setValue(pJpegSize, nJpegWidth * nJpegHeight * 2, "i32");    // JPEG抓图，输入缓冲长度不小于当前帧YUV大小
+
+                res = Module._GetJPEG(pDataYUV1, nYUVSize1, pJpegData, pJpegSize,
+                    oJpegCropRect.left, oJpegCropRect.top, oJpegCropRect.right, oJpegCropRect.bottom);
+                if (res !== PLAYM4_OK) {
+                    postMessage({'function': "GetJPEG", 'errorCode': res});
+                    if (pJpegData != null) {
+                        Module._free(pJpegData);
+                        pJpegData = null;
+                    }
+
+                    if (pJpegSize != null) {
+                        Module._free(pJpegSize);
+                        pJpegSize = null;
+                    }
+
+                    if (pDataYUV1 != null) {
+                        Module._free(pDataYUV1);
+                        pDataYUV1 = null;
+                    }
+                    return;
+                }
+
+                // 获取JPEG图片大小
+                var nJpegSize = Module.getValue(pJpegSize, "i32");
+
+                // 获取JPEG图片数据
+                var aJpegData = new Uint8Array(nJpegSize);
+                aJpegData.set(Module.HEAPU8.subarray(pJpegData, pJpegData + nJpegSize));
+
+                postMessage({'function': "GetJPEG", 'data': aJpegData, 'errorCode': res}, [aJpegData.buffer]);
+
+                nJpegSize = null;
+                aJpegData = null;
+
+                if (pDataYUV1 != null) {
+                    Module._free(pDataYUV1);
+                    pDataYUV1 = null;
+                }
+                if (pJpegData != null) {
+                    Module._free(pJpegData);
+                    pJpegData = null;
+                }
+                if (pJpegSize != null) {
+                    Module._free(pJpegSize);
+                    pJpegSize = null;
+                }
+                break;
+
+            case "SetDecodeFrameType":
+                var nFrameType = eventData.data;
+                res = Module._SetDecodeFrameType(nFrameType);
+                if (res !== PLAYM4_OK) {
+                    postMessage({'function': "SetDecodeFrameType", 'errorCode': res});
+                    return;
+                }
+                break;
+
+            case "DisplayRegion":
+                var nRegionNum = eventData.nRegionNum;
+                var srcRect = eventData.srcRect;
+                var hDestWnd = eventData.hDestWnd;
+                var bEnable = eventData.bEnable;
+
+                res = Module._SetDisplayRegion(nRegionNum, srcRect, hDestWnd, bEnable);
+                if (res !== PLAYM4_OK) {
+                    postMessage({'function': "DisplayRegion", 'errorCode': res});
+                    return;
+                }
+                break;
+
+            case "CloseStream":
+                res = Module._CloseStream();
+                if (res !== PLAYM4_OK) {
+                    postMessage({'function': "CloseStream", 'errorCode': res});
+                    return;
+                }
+                break;
+
+            case "SetIFrameDecInterval":
+                Module._SetIFrameDecInterval(eventData.data);
+                break;
+                /*******************************************worker音频编码相关接口实现**********************************************************/
+            case "CreateAudEncode":
+			
+                res = Module._CreateAudEncode(eventData.encodertype);
+                
+                postMessage({'function':"CreateAudEncode",'errorCode':res});
+                break;
+            case "SetAudEncodeParam":
+                
+                res = Module._SetAudEncodeParam(eventData.samplerate, eventData.channel, eventData.bitrate, eventData.bitwidth);
+			
+                postMessage({'function':"SetAudEncodeParam",'errorCode':res});
+                break;
+            case "DestroyAudEncode":
+               
+                res = Module._DestroyAudEncode();
+                
+                postMessage({'function':"DestroyAudEncode",'errorCode':res});
+                break;
+            case "InputAudEncodeData":
+			    if(bWorkerPrintLog)
+				{
+					console.log("<<<Worker: 20200113 DecodeWorker-InputAudEncodeData 1");
+				}
+                
+                var iLen = eventData.dataSize;
+                if(iLen > 0)
+                {
+                    
+                    var pAudInputData = Module._malloc(iLen);
+                    if (pAudInputData === null)
+                    {
+                        return;
+                    }
+                    var audinputData = new Uint8Array(eventData.data);
+                    Module.writeArrayToMemory(audinputData, pAudInputData);
+                    audinputData = null;
+                    res = Module._InputAudEncodeData(pAudInputData, iLen);
+					if(bWorkerPrintLog)
+					{
+						console.log("<<<Worker: 20200113 DecodeWorker-InputAudEncodeData 2 res:"+res);
+					}
+                    
+                    if(res == PLAYM4_OK)  //接口返回成功，表明已编码好一帧音频数据
+                    {
+                        
+                        if (funGetAudFrameData === null)
+                        {
+                            funGetAudFrameData = Module.cwrap('GetAudFrameData', 'number');
+                        }
+                        if(bWorkerPrintLog)
+						{
+							console.log("<<<Worker: 20200113 DecodeWorker-InputAudEncodeData 2-1 succ");
+						}
+                        //调用C++ GetAudFrameData
+                        var ret = getAudFrameData(funGetAudFrameData);
+                    }
+                    Module._free(pAudInputData);
+                    pAudInputData = null;
+                }
+                break;
+            default:
+                break;
+        }
+    };
+
+    function getOSDTime(oFrameInfo) {
+        var iYear = oFrameInfo.year;
+        var iMonth = oFrameInfo.month;
+        var iDay = oFrameInfo.day;
+        var iHour = oFrameInfo.hour;
+        var iMinute = oFrameInfo.minute;
+        var iSecond = oFrameInfo.second;
+
+        if (iMonth < 10) {
+            iMonth = "0" + iMonth;
+        }
+        if (iDay < 10) {
+            iDay = "0" + iDay;
+        }
+        if (iHour < 10) {
+            iHour = "0" + iHour;
+        }
+        if (iMinute < 10) {
+            iMinute = "0" + iMinute;
+        }
+        if (iSecond < 10) {
+            iSecond = "0" + iSecond;
+        }
+
+        return iYear + "-" + iMonth + "-" + iDay + " " + iHour + ":" + iMinute + ":" + iSecond;
+    }
+
+    function getAudFrameData(fun)
+    {
+		if(bWorkerPrintLog)
+		{
+			console.log("<<<Worker: DecodeWorker-getAudFrameData 1");
+		}
+    
+        var res = fun(); // 调用C++GetAudFrameData函数
+        if(res === PLAYM4_OK)
+        {
+            var oFrameInfo = Module._GetAudFrameInfo();
+            var iSize = oFrameInfo.frameSize;
+            if (0 === iSize)
+            {
+                return null;
+            }
+
+            var pEncodeAud = Module._GetAudFrameBuffer();
+            if(pEncodeAud == null)
+            {
+                return null;
+            }
+            var aEncodeAudData = new Uint8Array(iSize);
+            aEncodeAudData.set(Module.HEAPU8.subarray(pEncodeAud, pEncodeAud + iSize));
+			if(bWorkerPrintLog)
+			{
+				console.log("<<<Worker: DecodeWorker-getAudFrameData 2");
+			}
+            
+            //获取到音频编码帧数据通过worker返回
+            postMessage({'function':"GetAudEncodeData",'data':aEncodeAudData.buffer,'dataSize':iSize, 'errorCode': res});
+        }
+        else
+        {
+            postMessage({'function':"GetAudEncodeData",'data':null,'dataSize':-1, 'errorCode': res});
+        }
+        oFrameInfo=null;
+        pEncodeAud=null;
+        aEncodeAudData=null;
+        return res;
+    }
+
+    // 获取帧数据
+    function getFrameData(fun)
+    {
+    // function getFrameData() {
+        // 获取帧数据
+        // var res = Module._GetFrameData();
+        var res = fun();
+        if(bWorkerPrintLog)
+        {
+            console.log("<<<Worker: getFrameData Result:"+res);
+        }
+
+        if (res === PLAYM4_OK)
+        {
+            var oFrameInfo = Module._GetFrameInfo();
+
+            switch (oFrameInfo.frameType)
+            {
+                case AUDIO_TYPE:
+                    var iSize = oFrameInfo.frameSize;
+                    if (0 === iSize)
+                    {
+                        return -1;
+                    }
+                    var pPCM = Module._GetFrameBuffer();
+                    // var audioBuf = new ArrayBuffer(iSize);
+                    var aPCMData = new Uint8Array(iSize);
+                    aPCMData.set(Module.HEAPU8.subarray(pPCM, pPCM + iSize));
+                    if(bWorkerPrintLog)
+                    {
+                        console.log("<<<Worker: audio media Info: nSise:"+ oFrameInfo.frameSize+",nSampleRate:"+oFrameInfo.samplesPerSec+',channel:'+oFrameInfo.channels+',bitsPerSample:'+oFrameInfo.bitsPerSample);
+                    }
+                    postMessage({
+                        'function': "GetFrameData", 'type': "audioType", 'data': aPCMData.buffer,
+                        'frameInfo': oFrameInfo, 'errorCode': res
+                    }, [aPCMData.buffer]);
+
+                    oFrameInfo = null;
+                    pPCM = null;
+                    aPCMData = null;
+                    return PLAYM4_AUDIO_FRAME;
+
+                case VIDEO_TYPE:
+                    var szOSDTime = getOSDTime(oFrameInfo);
+
+                    var iWidth = oFrameInfo.width;
+                    var iHeight = oFrameInfo.height;
+
+                    var iYUVSize = iWidth * iHeight * 3 / 2;
+                    if (0 === iYUVSize)
+                    {
+                        return -1;
+                    }
+
+                    var pYUV = Module._GetFrameBuffer();
+
+                    // 图像数据渲染后压回，若从主码流切到子码流，存在数组大小与图像大小不匹配现象
+                    var aYUVData = new Uint8Array(iYUVSize);
+                    aYUVData.set(Module.HEAPU8.subarray(pYUV, pYUV + iYUVSize));
+                    if(bWorkerPrintLog)
+                    {
+                        console.log("<<<Worker: InputData-getFrameData Video: Width:"+ oFrameInfo.width+",Height:"+oFrameInfo.height+",timeStamp:"+oFrameInfo.timeStamp);
+                    }
+
+                    postMessage({
+                      'function': "GetFrameData", 'type': "videoType", 'data': aYUVData.buffer,
+                   'dataLen': aYUVData.length,'osd': szOSDTime, 'frameInfo': oFrameInfo, 'errorCode': res
+                    }, [aYUVData.buffer]);
+
+                    oFrameInfo = null;
+                    pYUV = null;
+                    aYUVData = null;
+                    return PLAYM4_VIDEO_FRAME;
+
+                case PRIVT_TYPE:
+                    postMessage({
+                        'function': "GetFrameData", 'type': "", 'data': null,
+                        'dataLen': -1, 'osd': 0, 'frameInfo': null, 'errorCode': PLAYM4_SYS_NOT_SUPPORT
+                    });
+                    return PLAYM4_SYS_NOT_SUPPORT;
+
+                default:
+                    postMessage({
+                        'function': "GetFrameData", 'type': "", 'data': null,
+                        'dataLen': -1, 'osd': 0, 'frameInfo': null, 'errorCode': PLAYM4_SYS_NOT_SUPPORT
+                    });
+                    return PLAYM4_SYS_NOT_SUPPORT;
+            }
+        }
+        else {
+            //解码失败返回裸数据
+            if(PLAYM4_DECODE_ERROR===res)
+            {
+                var rawInfo=Module._GetRawDataInfo();
+                var pRawData = Module._GetRawDataBuffer();
+                var aRawData = new Uint8Array(rawInfo.isize);
+                aRawData.set(Module.HEAPU8.subarray(pRawData, pRawData + rawInfo.isize));
+                postMessage({
+                    'function': "GetRawData", 'type': "", 'data':aRawData.buffer,
+                    'rawDataLen': rawInfo.isize, 'osd': 0, 'frameInfo': null, 'errorCode': res
+                });
+                rawInfo=null;
+                pRawData=null;
+                aRawData=null;
+            }
+            //定位返回的错误
+            if(PLAYM4_FIRST_FRAME_NOT_ICURRENT===res|| PLAYM4_ITYPE_DECODE_ERROR===res)
+            {
+                postMessage({
+                    'function': "GetFrameData", 'type': "", 'data': null,
+                    'dataLen': -1, 'osd': 0, 'frameInfo': null, 'errorCode': res
+                });
+            }
+            //需要更多数据
+            if (PLAYM4_NEED_MORE_DATA === res || PLAYM4_SYS_NOT_SUPPORT === res) {
+                postMessage({
+                    'function': "GetFrameData", 'type': "", 'data': null,
+                    'dataLen': -1, 'osd': 0, 'frameInfo': null, 'errorCode': res
+                });
+            }
+            return res;
+        }
+    }
+
+    // 开始计算时间
+    function startTime() {
+        return new Date().getTime();
+    }
+
+    // 结束计算时间
+    function endTime() {
+        return new Date().getTime();
+    }
+
+    // 字母字符串转byte数组
+    function stringToBytes ( str ) {
+        var ch, st, re = [];
+        for (var i = 0; i < str.length; i++ ) {
+            ch = str.charCodeAt(i);  // get char
+            st = [];                 // set up "stack"
+            do {
+                st.push( ch & 0xFF );  // push byte to stack
+                ch = ch >> 8;          // shift value down by 1 byte
+            }
+            while ( ch );
+            // add stack contents to result
+            // done because chars have "wrong" endianness
+            re = re.concat( st.reverse() );
+        }
+        // return an array of bytes
+        return re;
+    }
+})();

static/js/js/playctrl/SuperRender_10.js

@@ -0,0 +1,340 @@
+"use strict";
+ //顶点着色器
+//attribute修饰符用于声明由浏览器（javascript）传输给顶点着色器的变量值；
+// vertexPos即我们定义的顶点坐标；
+// gl_Position是一个内建的传出变量。
+var vertexYUVShader = [
+    'attribute vec4 vertexPos;',
+    'attribute vec2 texturePos;',
+    'varying vec2 textureCoord;',
+
+    'void main()',
+    '{',
+        'gl_Position = vertexPos;',
+        'textureCoord = texturePos;',
+    '}'
+    ].join('\n');
+    //像素着色器(yuv->rgb)
+var fragmentYUVShader = [
+    'precision highp float;',
+    'varying highp vec2 textureCoord;',
+    'uniform sampler2D ySampler;',
+    'uniform sampler2D uSampler;',
+    'uniform sampler2D vSampler;',
+    'const mat4 YUV2RGB = mat4',
+    '(',
+        '1.1643828125, 0, 1.59602734375, -.87078515625,',
+        '1.1643828125, -.39176171875, -.81296875, .52959375,',
+        '1.1643828125, 2.017234375, 0, -1.081390625,',
+        '0, 0, 0, 1',
+    ');',
+  
+    'void main(void) {',
+        'highp float y = texture2D(ySampler,  textureCoord).r;',
+        'highp float u = texture2D(uSampler,  textureCoord).r;',
+        'highp float v = texture2D(vSampler,  textureCoord).r;',
+        'gl_FragColor = vec4(y, u, v, 1) * YUV2RGB;',
+    '}'
+    ].join('\n');
+
+(function (root, factory) {
+    root.SuperRender = factory();
+}(this, function () {
+    
+    function RenderManager(canvas) {
+
+        this.canvasElement = document.getElementById(canvas);
+
+        this.initContextGL();
+
+        if(this.contextGL) {
+            this.YUVProgram = this.initProgram(vertexYUVShader, fragmentYUVShader);
+            this.initBuffers();
+            this.initTextures();
+        }
+    };
+
+    /**
+     * 初始化WebGL上下文
+     */
+    RenderManager.prototype.initContextGL = function() {
+        
+        var canvas = this.canvasElement;
+
+        var gl = null;
+
+        try {
+            gl = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
+        } catch (e) {
+            gl = null;
+        }
+
+        if(!gl || typeof gl.getParameter !== "function") {
+            gl = null;
+        }
+
+        this.contextGL = gl;
+
+        console.log("WebGL1.0");
+    };
+
+    /**
+     * 初始化着色器程序
+     * @param vertexShaderScript    顶点着色器脚本
+     * @param fragmentShaderScript  片段着色器脚本
+     */
+    RenderManager.prototype.initProgram = function(vertexShaderScript, fragmentShaderScript) {
+        
+        var gl = this.contextGL;
+        
+        var vertexShader = gl.createShader(gl.VERTEX_SHADER); //创建定点着色器
+        gl.shaderSource(vertexShader, vertexShaderScript);
+        gl.compileShader(vertexShader);
+        if(!gl.getShaderParameter(vertexShader, gl.COMPILE_STATUS)) {
+            console.log('Vertex shader failed to compile: ' + gl.getShaderInfoLog(vertexShader));
+        }
+
+        var fragmentShader = gl.createShader(gl.FRAGMENT_SHADER);
+        gl.shaderSource(fragmentShader, fragmentShaderScript);
+        gl.compileShader(fragmentShader);
+        if(!gl.getShaderParameter(fragmentShader, gl.COMPILE_STATUS)) {
+            console.log('Fragment shader failed to compile: ' + gl.getShaderInfoLog(fragmentShader));
+        }
+
+        var program = gl.createProgram();
+        gl.attachShader(program, vertexShader);
+        gl.attachShader(program, fragmentShader);
+        gl.linkProgram(program);
+        if(!gl.getProgramParameter(program, gl.LINK_STATUS)) {
+            console.log('Program failed to compile: ' + gl.getProgramInfoLog(program));
+        }
+        
+        gl.deleteShader(vertexShader);
+        gl.deleteShader(fragmentShader);
+
+        return program;
+    };
+
+    /**
+     * 初始化数据缓存
+     */
+    RenderManager.prototype.initBuffers = function() {
+        
+        var gl = this.contextGL;
+    
+        var vertexPosBuffer = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, vertexPosBuffer);
+        gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([1, 1, -1, 1, 1, -1, -1, -1]), gl.STATIC_DRAW);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+
+        var texturePosBuffer = gl.createBuffer();
+        gl.bindBuffer(gl.ARRAY_BUFFER, texturePosBuffer);
+        gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([1, 0, 0, 0, 1, 1, 0, 1]), gl.DYNAMIC_DRAW);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+
+        this.vertexPosBuffer  = vertexPosBuffer;
+        this.texturePosBuffer = texturePosBuffer;
+    };
+
+    /**
+     * 创建纹理
+     */
+    RenderManager.prototype.initTexture = function() {
+
+        var gl = this.contextGL;
+
+        var textureRef = gl.createTexture();
+        gl.bindTexture(gl.TEXTURE_2D, textureRef);
+        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
+        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+        gl.bindTexture(gl.TEXTURE_2D, null);
+
+        return textureRef;
+    };
+
+    /**
+     * 初始化YUV纹理
+     */
+    RenderManager.prototype.initTextures = function() {
+        
+        var gl = this.contextGL;
+        
+        var program = this.YUVProgram;
+        gl.useProgram(program);
+        
+        var yTextureRef = this.initTexture();
+        var ySamplerRef = gl.getUniformLocation(program, 'ySampler');
+        gl.uniform1i(ySamplerRef, 0);
+        this.yTextureRef = yTextureRef;
+
+        var uTextureRef = this.initTexture();
+        var uSamplerRef = gl.getUniformLocation(program, 'uSampler');
+        gl.uniform1i(uSamplerRef, 1);
+        this.uTextureRef = uTextureRef;
+
+        var vTextureRef = this.initTexture();
+        var vSamplerRef = gl.getUniformLocation(program, 'vSampler');
+        gl.uniform1i(vSamplerRef, 2);
+        this.vTextureRef = vTextureRef;
+        
+        gl.useProgram(null);
+    };
+
+    /**
+     * 显示帧数据
+     * @param nWidth    宽度
+     * @param nHeight   高度
+     * @param nHeight   帧数据
+     */
+    RenderManager.prototype.SR_DisplayFrameData = function(nWidth, nHeight, pData) {
+
+        if(nWidth <= 0 || nHeight <= 0)
+        {
+            return;
+        }
+
+        var gl = this.contextGL;
+
+        if(null == pData)
+        {
+            gl.clearColor(0.0, 0.0, 0.0, 0.0);
+            gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
+            return;
+        }
+
+        var canvas = this.canvasElement;
+
+        this.nWindowWidth = canvas.width;
+        this.nWindowHeight = canvas.height;
+        
+        var nWindowWidth = this.nWindowWidth;
+        var nWindowHeight = this.nWindowHeight;
+
+        gl.clearColor(0.8, 0.8, 1.0, 1.0);
+        gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
+
+        gl.viewport(0, 0, nWindowWidth, nWindowHeight);
+
+        this.updateFrameData(nWidth, nHeight, pData);
+
+        var program = this.YUVProgram;
+        gl.useProgram(program);
+
+        var vertexPosBuffer = this.vertexPosBuffer;
+        gl.bindBuffer(gl.ARRAY_BUFFER, vertexPosBuffer);
+        var vertexPosRef = gl.getAttribLocation(program, 'vertexPos');
+        gl.enableVertexAttribArray(vertexPosRef);
+        gl.vertexAttribPointer(vertexPosRef, 2, gl.FLOAT, false, 0, 0);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+
+        var texturePosBuffer = this.texturePosBuffer;
+        gl.bindBuffer(gl.ARRAY_BUFFER, texturePosBuffer);
+        var texturePosRef = gl.getAttribLocation(program, 'texturePos');
+        gl.enableVertexAttribArray(texturePosRef);
+        gl.vertexAttribPointer(texturePosRef, 2, gl.FLOAT, false, 0, 0);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+
+        gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4); 
+
+        gl.disableVertexAttribArray(vertexPosRef);
+        gl.disableVertexAttribArray(texturePosRef);
+
+        gl.useProgram(null);
+    };
+
+    /**
+     * 上传YUV数据到纹理
+     * @param nWidth    宽度
+     * @param nHeight   高度
+     * @param nHeight   帧数据
+     */
+    RenderManager.prototype.updateFrameData = function(width, height, data) {
+
+        var gl = this.contextGL;
+
+        var yTextureRef = this.yTextureRef;
+        var uTextureRef = this.uTextureRef;
+        var vTextureRef = this.vTextureRef;
+
+        var i420Data = data;
+
+        var yDataLength = width * height;
+        var yData = i420Data.subarray(0, yDataLength);
+        gl.activeTexture(gl.TEXTURE0);
+        gl.bindTexture(gl.TEXTURE_2D, yTextureRef);
+        gl.texImage2D(gl.TEXTURE_2D, 0, gl.LUMINANCE, width, height, 0, gl.LUMINANCE, gl.UNSIGNED_BYTE, yData);
+
+        var cbDataLength = width/2 * height/2;
+        var cbData = i420Data.subarray(yDataLength, yDataLength + cbDataLength);
+        gl.activeTexture(gl.TEXTURE1);
+        gl.bindTexture(gl.TEXTURE_2D, uTextureRef);
+        gl.texImage2D(gl.TEXTURE_2D, 0, gl.LUMINANCE, width/2, height/2, 0, gl.LUMINANCE, gl.UNSIGNED_BYTE, cbData);
+
+        var crDataLength = cbDataLength;
+        var crData = i420Data.subarray(yDataLength + cbDataLength, yDataLength + cbDataLength + crDataLength);
+        gl.activeTexture(gl.TEXTURE2);
+        gl.bindTexture(gl.TEXTURE_2D, vTextureRef);
+        gl.texImage2D(gl.TEXTURE_2D, 0, gl.LUMINANCE, width/2, height/2, 0, gl.LUMINANCE, gl.UNSIGNED_BYTE, crData);
+    };
+
+    /**
+     * 设置显示区域
+     * @param stDisplayRect    显示区域
+     */
+    RenderManager.prototype.SR_SetDisplayRect = function(stDisplayRect) {
+
+        var gl = this.contextGL;
+
+        var nWindowWidth = this.nWindowWidth;
+        var nWindowHeight = this.nWindowHeight;
+        
+        var texturePosValues = null;
+        
+        if(stDisplayRect && nWindowWidth > 0 && nWindowHeight > 0) {
+            var fLeft = stDisplayRect.left / nWindowWidth;
+            var fTop = stDisplayRect.top / nWindowHeight;
+            var fRight = stDisplayRect.right / nWindowWidth;
+            var fBottom = stDisplayRect.bottom / nWindowHeight;
+
+            texturePosValues = new Float32Array([fRight, fTop, fLeft, fTop, fRight, fBottom, fLeft, fBottom]);
+        }
+        else {
+            texturePosValues = new Float32Array([1, 0, 0, 0, 1, 1, 0, 1]);
+        }
+
+        var texturePosBuffer = this.texturePosBuffer;
+
+        gl.bindBuffer(gl.ARRAY_BUFFER, texturePosBuffer);
+        gl.bufferSubData(gl.ARRAY_BUFFER, 0, texturePosValues);
+        gl.bindBuffer(gl.ARRAY_BUFFER, null);
+    };
+
+    /**
+     * 释放显示资源
+     */
+    RenderManager.prototype.SR_Destroy = function() {
+
+        var gl = this.contextGL;
+        
+        var YUVProgram = this.YUVProgram;
+        gl.deleteProgram(YUVProgram);
+
+        var vertexPosBuffer = this.vertexPosBuffer;
+        var texturePosBuffer = this.texturePosBuffer;
+        
+        gl.deleteBuffer(vertexPosBuffer);
+        gl.deleteBuffer(texturePosBuffer);
+
+        var yTextureRef = this.yTextureRef;
+        var uTextureRef = this.uTextureRef;
+        var vTextureRef = this.vTextureRef;
+        gl.deleteTexture(yTextureRef);
+        gl.deleteTexture(uTextureRef);
+        gl.deleteTexture(vTextureRef);
+    };
+
+    return RenderManager;
+
+}));

static/js/js/talk/recoder.js

@@ -0,0 +1,107 @@
+var audio_context;
+var recorder;
+
+function startUserMedia(stream) {
+    var input = audio_context.createMediaStreamSource(stream);
+    recorder = new Recorder(input);
+}
+function startRecording(button) {
+    recorder && recorder.record();
+    // button.disabled = true;
+    // button.nextElementSibling.disabled = false;
+}
+
+function stopRecording(button) {
+    recorder && recorder.stop();
+    // button.disabled = true;
+    // button.previousElementSibling.disabled = false;
+    createAudioDom();
+
+    recorder.clear();
+}
+function voiceInit() {
+    console.log("run init")
+    try {
+      // webkit shim
+      window.AudioContext = window.AudioContext || window.webkitAudioContext;
+      navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
+      window.URL = window.URL || window.webkitURL;
+
+      audio_context = new AudioContext;
+     console.log('Audio context set up.');
+     console.log('navigator.getUserMedia ' + (navigator.getUserMedia ? 'available.' : 'not present!'));
+    } catch (e) {
+        console.log("err",e)
+      // layer.msg('No web audio support in this browser!');
+    }
+
+    navigator.getUserMedia({ audio: true }, startUserMedia, function (e) {
+     console.log('No live audio input: ' + e);
+    //  layer.msg('浏览器未找到麦克风');
+    });
+  };
+  function createAudioDom(){
+    // recorder && recorder.exportWAV(function (blob) {
+    //     var url = URL.createObjectURL(blob);
+    //     var au = document.createElement('audio');
+
+    //     au.controls = true;
+    //     au.src = url;
+    //     document.body.appendChild(au);
+    // });
+  }
+
+  function wavUpload() {
+    try{
+    recorder && recorder.stop();
+    createAudioDom();
+
+    recorder &&recorder.exportWAV(function (wav_file) {
+      console.log("wav_file",wav_file);
+      if(wav_file.size < 1000){
+        layer.msg("录音失败，请重试");
+        recodeTime = 0;
+        return false;
+      }
+      var formdata = new FormData(); // form 表单 {key:value}
+      formdata.append("voiceFile", wav_file); // form input type="file"
+      formdata.append("accessToken", accessToken);
+      formdata.append("deviceSerial", deviceSerial);
+      formdata.append("channelNo", channelNo);
+      padding = true;
+
+      $.ajax({
+        url: "/api/lapp/voice/sendonce",
+        type: 'post',
+        processData: false,
+        contentType: false,
+        data: formdata,
+        dataType: 'json',
+        success: function (data) {
+          console.log(data);
+          if(data.code == '200'){
+          countTime('sub', recodeTime + 2); // 延时
+          }else if(data.code == "111001"){
+            return false;
+          } else {
+            if(recodeTime !== 0){ // 仅需提示过短外其他错误
+              layer.msg(data.msg || '发送失败，请稍后再试')
+            }
+          }
+          //ocument.getElementById("player").src = "/get_audio/" + data.filename;
+          padding = false;
+          recodeTime = 0;
+        },
+        error: function(err){
+          console.log("err",err);
+          padding = false;
+          recodeTime = 0;
+          layer.msg("网络异常，请稍后再试");
+        }
+      })
+    });
+    recorder && recorder.clear();
+  }catch(err){
+    console.log(err);
+  }
+  }

static/js/js/talk/tts.js

@@ -0,0 +1,554 @@
+// We make use of this 'server' variable to provide the address of the
+// REST Janus API. By default, in this example we assume that Janus is
+// co-located with the web server hosting the HTML pages but listening
+// on a different port (8088, the default for HTTP in Janus), which is
+// why we make use of the 'window.location.hostname' base address. Since
+// Janus can also do HTTPS, and considering we don't really want to make
+// use of HTTP for Janus if your demos are served on HTTPS, we also rely
+// on the 'window.location.protocol' prefix to build the variable, in
+// particular to also change the port used to contact Janus (8088 for
+// HTTP and 8089 for HTTPS, if enabled).
+// In case you place Janus behind an Apache frontend (as we did on the
+// online demos at http://janus.conf.meetecho.com) you can just use a
+// relative path for the variable, e.g.:
+//
+// 		var server = "/janus";
+//
+// which will take care of this on its own.
+//
+//
+// If you want to use the WebSockets frontend to Janus, instead, you'll
+// have to pass a different kind of address, e.g.:
+//
+// 		var server = "ws://" + window.location.hostname + ":8188";
+//
+// Of course this assumes that support for WebSockets has been built in
+// when compiling the server. WebSockets support has not been tested
+// as much as the REST API, so handle with care!
+//
+//
+// If you have multiple options available, and want to let the library
+// autodetect the best way to contact your server (or pool of servers),
+// you can also pass an array of servers, e.g., to provide alternative
+// means of access (e.g., try WebSockets first and, if that fails, fall
+// back to plain HTTP) or just have failover servers:
+//
+//		var server = [
+//			"ws://" + window.location.hostname + ":8188",
+//			"/janus"
+//		];
+//
+// This will tell the library to try connecting to each of the servers
+// in the presented order. The first working server will be used for
+// the whole session.
+//
+var server = null;
+if(window.location.protocol === 'http:')
+  //server = "http://" + window.location.hostname + ":9020/janus";
+  // yujianbo
+  server = "https://" + "10.80.21.211" + ":9022/janus";
+else
+  //server = "https://" + window.location.hostname + ":9022/janus";
+  // -yujianbo
+  server = "https://" + "10.80.21.211" + ":9022/janus";
+
+var janus = null;
+var tts = null;
+var opaqueId = "tts-"+Janus.randomString(12);
+
+var spinner = null;
+
+$(document).ready(function() {
+	// Initialize the library (all console debuggers enabled)
+	Janus.init({debug: "all", callback: function() {
+		// Use a button to start the demo
+		$('#start').on('click', function() {
+			// Make sure the browser supports WebRTC
+			if(!Janus.isWebrtcSupported()) {
+				bootbox.alert("No WebRTC support... ");
+				return;
+			}
+
+			if($('#tts_url').val().length == 0){
+				bootbox.alert("Please input tts url... ");
+				return;
+			}
+
+			$(this).attr('disabled', true).unbind('click');
+
+			// Create session
+			janus = new Janus(
+				{
+					server: window.EZUITalk.opt.rtcUrl,
+					// No "iceServers" is provided, meaning janus.js will use a default STUN server
+					// Here are some examples of how an iceServers field may look like to support TURN
+					// 		iceServers: [{urls: "turn:yourturnserver.com:3478", username: "janususer", credential: "januspwd"}],
+					// 		iceServers: [{urls: "turn:yourturnserver.com:443?transport=tcp", username: "janususer", credential: "januspwd"}],
+					// 		iceServers: [{urls: "turns:yourturnserver.com:443?transport=tcp", username: "janususer", credential: "januspwd"}],
+					// Should the Janus API require authentication, you can specify either the API secret or user token here too
+					//		token: "mytoken",
+					//	or
+					//		apisecret: "serversecret",
+					success: function() {
+						// Attach to tts plugin
+						janus.attach(
+							{
+								plugin: "rtcgw.plugin.tts",
+								opaqueId: opaqueId,
+								success: function(pluginHandle) {
+									$('#details').remove();
+									tts = pluginHandle;
+									Janus.log("Plugin attached! (" + tts.getPlugin() + ", id=" + tts.getId() + ")");
+									// Negotiate WebRTC
+									//var url = "tts://61.130.6.23:8664/talk://D13781761:0:1:cas.ys7.com:6500?97fbd2a75fa94b7682c994d3d1fac8ca:ut.5porslgu79e9r7ca48z32k8abgl3rp58-77bhb6i7xr-1kmumtg-jkhy7pvfr:0:3"
+									
+
+									//var url = "tts://10.86.15.209:8664/talk://D13781761:0:1:cas.ys7.com:6500?32db2578ba7c4a84be22ecc0bcd0f8db:ut.5lqpkhim5m7cdk2y5w60g7hm9vd7i3v0-3d2pwhxe2t-11wx2ge-sh4yazbll:0:3"
+									//var url = "tts://10.86.15.209:8664/talk://D13781761:0:1:cas.ys7.com:6500"
+									//test12.ys.com
+									//var url = "tts://10.86.15.209:8664/talk://D08197169:0:1:cas.ys7.com:6500"
+									//test10.ys.com
+									//var url = "tts://10.86.29.210:8664/talk://D08197169:0:1:cas.ys7.com:6500"
+									var url = $('#tts_url').val();
+									var body = { "request": "start", "url": url, "codec": "opus", "dir": "sendrecv", "audio_debug": 1};
+									//tts.send({"message": body});
+									Janus.debug("Trying a createOffer too (audio/video sendrecv)");
+									tts.createOffer(
+										{
+											// No media provided: by default, it's sendrecv for audio and video
+											media: { audio: true, video: false, data: false },	// Audio only
+											// If you want to test simulcasting (Chrome and Firefox only), then
+											// pass a ?simulcast=true when opening this demo page: it will turn
+											// the following 'simulcast' property to pass to janus.js to true
+											simulcast: false,
+											simulcast2: false,
+											success: function(jsep) {
+												Janus.debug("Got SDP!");
+												Janus.debug(jsep);
+												tts.send({"message": body, "jsep": jsep});
+											},
+											error: function(error) {
+												Janus.error("WebRTC error:", error);
+											//	bootbox.alert("WebRTC error... " + JSON.stringify(error));
+											}
+										});
+									// $('#start').removeAttr('disabled').html("Stop")
+									// 	.click(function() {
+									// 		$(this).attr('disabled', true);
+									// 		janus.destroy();
+									// 	});
+								},
+								error: function(error) {
+									console.error("  -- Error attaching plugin...", error);
+									bootbox.alert("Error attaching plugin... " + error);
+								},
+								consentDialog: function(on) {
+									Janus.debug("Consent dialog should be " + (on ? "on" : "off") + " now");
+									if(on) {
+										// Darken screen and show hint
+										// $.blockUI({
+										// 	message: '<div><img src="up_arrow.png"/></div>',
+										// 	css: {
+										// 		border: 'none',
+										// 		padding: '15px',
+										// 		backgroundColor: 'transparent',
+										// 		color: '#aaa',
+										// 		top: '10px',
+										// 		left: (navigator.mozGetUserMedia ? '-100px' : '300px')
+										// 	} });
+									} else {
+										// Restore screen
+										// $.unblockUI();
+									}
+								},
+								iceState: function(state) {
+									Janus.log("ICE state changed to " + state);
+								},
+								mediaState: function(medium, on) {
+									Janus.log("Janus " + (on ? "started" : "stopped") + " receiving our " + medium);
+								},
+								webrtcState: function(on) {
+									Janus.log("Janus says our WebRTC PeerConnection is " + (on ? "up" : "down") + " now");
+									$("#audioleft").parent().unblock();
+								},
+								slowLink: function(uplink, lost) {
+									Janus.warn("Janus reports problems " + (uplink ? "sending" : "receiving") +
+										" packets on this PeerConnection (" + lost + " lost packets)");
+								},
+								onmessage: function(msg, jsep) {
+									Janus.debug(" ::: Got a message :::");
+									Janus.debug(msg);
+									if(jsep !== undefined && jsep !== null) {
+										Janus.debug("Handling SDP as well...");
+										Janus.debug(jsep);
+										tts.handleRemoteJsep({jsep: jsep});
+									}
+									var result = msg["result"];
+									if(result !== null && result !== undefined) {
+										if(result === "done") {
+											// The plugin closed
+											bootbox.alert("The TTS Test is over");
+											if(spinner !== null && spinner !== undefined)
+												spinner.stop();
+											spinner = null;
+											$('#myaudio').remove();
+											//$('#waitingvideo').remove();
+											$('#peeraudio').remove();
+											return;
+										}
+										// Any loss?
+										var status = result["status"];
+										if(status === "slow_link") {
+											//~ var bitrate = result["bitrate"];
+											//~ toastr.warning("The bitrate has been cut to " + (bitrate/1000) + "kbps", "Packet loss?", {timeOut: 2000});
+											toastr.warning("Janus apparently missed many packets we sent, maybe we should reduce the bitrate", "Packet loss?", {timeOut: 2000});
+										}
+									}
+								},
+								onlocalstream: function(stream) {
+									Janus.debug(" ::: Got a local stream :::");
+									Janus.debug(stream);
+									if($('#myaudio').length === 0) {
+										$('#audios').removeClass('hide').show();
+										$('#audioleft').append('<audio id="myaudio" autoplay controls muted>Your browser does not support audio tag</audio>');
+									}
+									Janus.attachMediaStream($('#myaudio').get(0), stream);
+									//$("#myaudio").get(0).muted = "muted";
+									if(tts.webrtcStuff.pc.iceConnectionState !== "completed" &&
+											tts.webrtcStuff.pc.iceConnectionState !== "connected") {
+										// $("#audioleft").parent().block({
+										// 	message: '<b>Publishing...</b>',
+										// 	css: {
+										// 		border: 'none',
+										// 		backgroundColor: 'transparent',
+										// 		color: 'white'
+										// 	}
+										// });
+										// No remote video yet
+										//$('#audioright').append('<video class="rounded centered" id="waitingvideo" width=320 height=240 />');
+										if(spinner == null) {
+											var target = document.getElementById('audioright');
+											//spinner = new Spinner({top:100}).spin(target);
+										} else {
+											spinner.spin();
+										}
+									}
+									var audioTracks = stream.getAudioTracks();
+									if(audioTracks === null || audioTracks === undefined || audioTracks.length === 0) {
+										$('#myaudio').hide();
+									} else {
+										$('#myaudio').removeClass('hide').show();
+									}
+								},
+								onremotestream: function(stream) {
+									Janus.debug(" ::: Got a remote stream :::");
+									Janus.debug(stream);
+									if($('#peeraudio').length === 0) {
+										$('#audios').removeClass('hide').show();
+										$('#audioright').append('<audio id="peeraudio" autoplay controls>Your browser does not support audio tag</audio>');
+										// Show the video, hide the spinner and show the resolution when we get a playing event
+										$("#peeraudio").bind("playing", function () {
+											//$('#waitingvideo').remove();
+											$('#peeraudio').removeClass('hide').show();
+											if(spinner !== null && spinner !== undefined)
+												spinner.stop();
+											spinner = null;
+										});
+									}
+									Janus.attachMediaStream($('#peeraudio').get(0), stream);
+									var audioTracks = stream.getAudioTracks();
+									if(audioTracks === null || audioTracks === undefined || audioTracks.length === 0) {
+										$('#peeraudio').hide();
+									} else {
+										$('#peeraudio').removeClass('hide').show();
+									}
+								},
+								ondataopen: function(data) {
+									Janus.log("The DataChannel is available!");
+								},
+								ondata: function(data) {
+									Janus.debug("We got data from the DataChannel! " + data);
+								},
+								oncleanup: function() {
+									Janus.log(" ::: Got a cleanup notification :::");
+									if(spinner !== null && spinner !== undefined)
+										spinner.stop();
+									spinner = null;
+									$('#myaudio').remove();
+									//$('#waitingvideo').remove();
+									$("#audioleft").parent().unblock();
+									$('#peeraudio').remove();
+								}
+							});
+					},
+					error: function(error) {
+						Janus.error(error);
+						bootbox.alert(error, function() {
+							// window.location.reload();
+						});
+					},
+					destroyed: function() {
+						// window.location.reload();
+					}
+				});
+		});
+		window.stopTalk = function (){
+			janus.destroy();
+		}
+		EZUITalkStopTalk = function (){
+			janus.destroy();
+		}
+		// debugger;
+		window.startTalk = startTalk;
+		function startTalk() {
+			// Make sure the browser supports WebRTC
+			if(!Janus.isWebrtcSupported()) {
+				bootbox.alert("No WebRTC support... ");
+				return;
+			}
+
+			// if($('#tts_url').val().length == 0){
+			// 	bootbox.alert("Please input tts url... ");
+			// 	return;
+			// }
+
+			$(this).attr('disabled', true).unbind('click');
+
+			// Create session
+			janus = new Janus(
+				{
+					server: window.EZUITalk.opt.rtcUrl,
+					// No "iceServers" is provided, meaning janus.js will use a default STUN server
+					// Here are some examples of how an iceServers field may look like to support TURN
+					// 		iceServers: [{urls: "turn:yourturnserver.com:3478", username: "janususer", credential: "januspwd"}],
+					// 		iceServers: [{urls: "turn:yourturnserver.com:443?transport=tcp", username: "janususer", credential: "januspwd"}],
+					// 		iceServers: [{urls: "turns:yourturnserver.com:443?transport=tcp", username: "janususer", credential: "januspwd"}],
+					// Should the Janus API require authentication, you can specify either the API secret or user token here too
+					//		token: "mytoken",
+					//	or
+					//		apisecret: "serversecret",
+					success: function() {
+						// Attach to tts plugin
+						janus.attach(
+							{
+								plugin: "rtcgw.plugin.tts",
+								opaqueId: opaqueId,
+								success: function(pluginHandle) {
+									$('#details').remove();
+									tts = pluginHandle;
+									Janus.log("Plugin attached! (" + tts.getPlugin() + ", id=" + tts.getId() + ")");
+									// Negotiate WebRTC
+									//var url = "tts://61.130.6.23:8664/talk://D13781761:0:1:cas.ys7.com:6500?97fbd2a75fa94b7682c994d3d1fac8ca:ut.5porslgu79e9r7ca48z32k8abgl3rp58-77bhb6i7xr-1kmumtg-jkhy7pvfr:0:3"
+									
+
+									//var url = "tts://10.86.15.209:8664/talk://D13781761:0:1:cas.ys7.com:6500?32db2578ba7c4a84be22ecc0bcd0f8db:ut.5lqpkhim5m7cdk2y5w60g7hm9vd7i3v0-3d2pwhxe2t-11wx2ge-sh4yazbll:0:3"
+									//var url = "tts://10.86.15.209:8664/talk://D13781761:0:1:cas.ys7.com:6500"
+									//test12.ys.com
+									//var url = "tts://10.86.15.209:8664/talk://D08197169:0:1:cas.ys7.com:6500"
+									//test10.ys.com
+									//var url = "tts://10.86.29.210:8664/talk://D08197169:0:1:cas.ys7.com:6500"
+									var url = window.EZUITalk.opt.talkLink;
+									console.log("ttsUlr",url);
+									var body = { "request": "start", "url": url, "codec": "opus", "dir": "sendrecv", "audio_debug": 1};
+									//tts.send({"message": body});
+									Janus.debug("Trying a createOffer too (audio/video sendrecv)");
+									tts.createOffer(
+										{
+											// No media provided: by default, it's sendrecv for audio and video
+											media: { audio: true, video: false, data: false },	// Audio only
+											// If you want to test simulcasting (Chrome and Firefox only), then
+											// pass a ?simulcast=true when opening this demo page: it will turn
+											// the following 'simulcast' property to pass to janus.js to true
+											simulcast: false,
+											simulcast2: false,
+											success: function(jsep) {
+												Janus.debug("Got SDP!");
+												Janus.debug(jsep);
+												tts.send({"message": body, "jsep": jsep});
+											},
+											error: function(error) {
+												Janus.error("WebRTC error:", error);
+											//	bootbox.alert("WebRTC error... " + JSON.stringify(error));
+											}
+										});
+									// $('#start').removeAttr('disabled').html("Stop")
+									// 	.click(function() {
+									// 		$(this).attr('disabled', true);
+									// 		janus.destroy();
+									// 	});
+								},
+								error: function(error) {
+									console.error("  -- Error attaching plugin...", error);
+									bootbox.alert("Error attaching plugin... " + error);
+								},
+								consentDialog: function(on) {
+									Janus.debug("Consent dialog should be " + (on ? "on" : "off") + " now");
+									if(on) {
+										// Darken screen and show hint
+										// $.blockUI({
+										// 	message: '<div><img src="up_arrow.png"/></div>',
+										// 	css: {
+										// 		border: 'none',
+										// 		padding: '15px',
+										// 		backgroundColor: 'transparent',
+										// 		color: '#aaa',
+										// 		top: '10px',
+										// 		left: (navigator.mozGetUserMedia ? '-100px' : '300px')
+										// 	} });
+									} else {
+										// Restore screen
+										// $.unblockUI();
+									}
+								},
+								iceState: function(state) {
+									Janus.log("ICE state changed to " + state);
+								},
+								mediaState: function(medium, on) {
+									Janus.log("Janus " + (on ? "started" : "stopped") + " receiving our " + medium);
+								},
+								webrtcState: function(on) {
+									Janus.log("Janus says our WebRTC PeerConnection is " + (on ? "up" : "down") + " now");
+									// $("#audioleft").parent().unblock();
+								},
+								slowLink: function(uplink, lost) {
+									Janus.warn("Janus reports problems " + (uplink ? "sending" : "receiving") +
+										" packets on this PeerConnection (" + lost + " lost packets)");
+								},
+								onmessage: function(msg, jsep) {
+									Janus.debug(" ::: Got a message :::");
+									Janus.debug(msg);
+									if(jsep !== undefined && jsep !== null) {
+										Janus.debug("Handling SDP as well...");
+										Janus.debug(jsep);
+										tts.handleRemoteJsep({jsep: jsep});
+									}
+									var result = msg["result"];
+									if(result !== null && result !== undefined) {
+										if(result === "done") {
+											// The plugin closed
+											bootbox.alert("The TTS Test is over");
+											if(spinner !== null && spinner !== undefined)
+												spinner.stop();
+											spinner = null;
+											$('#myaudio').remove();
+											//$('#waitingvideo').remove();
+											$('#peeraudio').remove();
+											return;
+										}
+										// Any loss?
+										var status = result["status"];
+										if(status === "slow_link") {
+											//~ var bitrate = result["bitrate"];
+											//~ toastr.warning("The bitrate has been cut to " + (bitrate/1000) + "kbps", "Packet loss?", {timeOut: 2000});
+											toastr.warning("Janus apparently missed many packets we sent, maybe we should reduce the bitrate", "Packet loss?", {timeOut: 2000});
+										}
+									}
+								},
+								onlocalstream: function(stream) {
+									Janus.debug(" ::: Got a local stream :::");
+									Janus.debug(stream);
+									if($('#myaudio').length === 0) {
+										$('#audios').removeClass('hide').show();
+										$('#audioleft').append('<audio id="myaudio" autoplay controls muted>Your browser does not support audio tag</audio>');
+									}
+									Janus.attachMediaStream($('#myaudio').get(0), stream);
+									//$("#myaudio").get(0).muted = "muted";
+									if(tts.webrtcStuff.pc.iceConnectionState !== "completed" &&
+											tts.webrtcStuff.pc.iceConnectionState !== "connected") {
+										// $("#audioleft").parent().block({
+										// 	message: '<b>Publishing...</b>',
+										// 	css: {
+										// 		border: 'none',
+										// 		backgroundColor: 'transparent',
+										// 		color: 'white'
+										// 	}
+										// });
+										// No remote video yet
+										//$('#audioright').append('<video class="rounded centered" id="waitingvideo" width=320 height=240 />');
+										if(spinner == null) {
+											var target = document.getElementById('audioright');
+											//spinner = new Spinner({top:100}).spin(target);
+										} else {
+											spinner.spin();
+										}
+									}
+									var audioTracks = stream.getAudioTracks();
+									if(audioTracks === null || audioTracks === undefined || audioTracks.length === 0) {
+										$('#myaudio').hide();
+									} else {
+										$('#myaudio').removeClass('hide').show();
+									}
+								},
+								onremotestream: function(stream) {
+									Janus.debug(" ::: Got a remote stream :::");
+									Janus.debug(stream);
+									if($('#peeraudio').length === 0) {
+										$('#audios').removeClass('hide').show();
+										$('#audioright').append('<audio id="peeraudio" autoplay controls>Your browser does not support audio tag</audio>');
+										// Show the video, hide the spinner and show the resolution when we get a playing event
+										$("#peeraudio").bind("playing", function () {
+											//$('#waitingvideo').remove();
+											$('#peeraudio').removeClass('hide').show();
+											if(spinner !== null && spinner !== undefined)
+												spinner.stop();
+											spinner = null;
+										});
+									}
+									Janus.attachMediaStream($('#peeraudio').get(0), stream);
+									var audioTracks = stream.getAudioTracks();
+									if(audioTracks === null || audioTracks === undefined || audioTracks.length === 0) {
+										$('#peeraudio').hide();
+									} else {
+										$('#peeraudio').removeClass('hide').show();
+									}
+								},
+								ondataopen: function(data) {
+									Janus.log("The DataChannel is available!");
+								},
+								ondata: function(data) {
+									Janus.debug("We got data from the DataChannel! " + data);
+								},
+								oncleanup: function() {
+									Janus.log(" ::: Got a cleanup notification :::");
+									if(spinner !== null && spinner !== undefined)
+										spinner.stop();
+									spinner = null;
+									$('#myaudio').remove();
+									//$('#waitingvideo').remove();
+									$("#audioleft").parent().unblock();
+									$('#peeraudio').remove();
+								}
+							});
+					},
+					error: function(error) {
+						Janus.error(error);
+						console.log("error",error)
+					},
+					destroyed: function() {
+						// window.location.reload();
+					}
+				});
+			}
+
+	}});
+});
+
+function checkEnter(event) {
+	var theCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;
+	if(theCode == 13) {
+		sendData();
+		return false;
+	} else {
+		return true;
+	}
+}
+
+// Helper to parse query string
+function getQueryStringValue(name) {
+	name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
+	var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
+		results = regex.exec(location.search);
+	return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
+}
+
+

static/js/js/wav-audio-encoder.js

@@ -0,0 +1,51 @@
+(function(self) {
+  var min = Math.min,
+      max = Math.max;
+
+  var setString = function(view, offset, str) {
+    var len = str.length;
+    for (var i = 0; i < len; ++i)
+      view.setUint8(offset + i, str.charCodeAt(i));
+  };
+
+  var Encoder = function(sampleRate, numChannels) {
+    this.sampleRate = sampleRate;
+    this.numChannels = numChannels;
+    this.numSamples = 0;
+    this.dataViews = [];
+  };
+
+  Encoder.prototype.encode = function(buffer) {
+    var len = 1024;
+    this.dataViews.push(buffer);
+    this.numSamples += len;
+  };
+
+  Encoder.prototype.finish = function(mimeType) {
+    var dataSize = this.numChannels * this.numSamples * 2,
+        view = new DataView(new ArrayBuffer(44));
+    setString(view, 0, 'RIFF');
+    view.setUint32(4, 36 + dataSize, true);
+    setString(view, 8, 'WAVE');
+    setString(view, 12, 'fmt ');
+    view.setUint32(16, 16, true);
+    view.setUint16(20, 1, true);
+    view.setUint16(22, this.numChannels, true);
+    view.setUint32(24, this.sampleRate, true);
+    view.setUint32(28, this.sampleRate * 4, true);
+    view.setUint16(32, this.numChannels * 2, true);
+    view.setUint16(34, 16, true);
+    setString(view, 36, 'data');
+    view.setUint32(40, dataSize, true);
+    this.dataViews.unshift(view);
+    var blob = new Blob(this.dataViews, { type: 'audio/wav' });
+    this.cleanup();
+    return blob;
+  };
+
+  Encoder.prototype.cancel = Encoder.prototype.cleanup = function() {
+    delete this.dataViews;
+  };
+
+  self.WavAudioEncoder = Encoder;
+})(self);

static/js/js/worker.js

@@ -0,0 +1,35 @@
+(function(){
+    'use strict';
+
+    var  samplesMono;
+
+    var floatTo16BitPCM = function(input, output){
+        for(var i = 0; i < input.length; i++){
+            var s = Math.max(-1, Math.min(1, input[i]));
+            output[i] = (s < 0 ? s * 0x8000 : s * 0x7FFF);
+        }
+    };
+
+    var convertBuffer = function(arrayBuffer){
+        var data = new Float32Array(arrayBuffer);
+        var out = new Int16Array(arrayBuffer.length);
+        floatTo16BitPCM(data, out);
+        return out;
+    };
+
+    var encode = function(arrayBuffer){
+        samplesMono = convertBuffer(arrayBuffer);
+        self.postMessage({
+            cmd: 'pcm',
+            buf: samplesMono
+        });
+    };
+
+  self.onmessage = function(e){
+    switch(e.data.cmd){
+      case 'encode':
+        encode(e.data.buf);
+        break;
+    }
+  };
+})();

unpackage/dist/dev/app-plus/static/data/cbd_pest_library.js

@@ -0,0 +1,336 @@
+// 害虫库
+var insect_dict = {'1':'金龟子',
+'2':'夜蛾',
+'3':'二点委夜蛾',
+'4':'梨剑纹夜蛾',
+'5':'杨扇舟蛾',
+'6':'舟蛾',
+'7':'旋幽夜蛾',
+'8':'蝼蛄',
+'9':'步甲',
+'10':'螟蛾',
+'11':'毛黄鳃金龟',
+'12':'尺蛾',
+'13':'剑纹夜蛾',
+'14':'粉缘钻夜蛾',
+'15':'夜蛾科',
+'16':'七星瓢虫',
+'17':'棉铃虫',
+'18':'蜻蜓',
+'19':'蚊',
+'20':'东方粘虫',
+'21':'叶蝉',
+'22':'春尺蠖',
+'23':'雄性春尺蠖',
+'24':'杨小舟蛾',
+'25':'甘蓝夜蛾',
+'26':'小地老虎',
+'27':'两点尼夜蛾',
+'28':'柳阴翅斑螟',
+'29':'桑褶翅尺蛾',
+'30':'宽胫夜蛾',
+'31':'尺蠖',
+'32':'一点钻夜蛾',
+'33':'天蛾',
+'34':'裳夜蛾',
+'35':'灯蛾',
+'36':'美国白蛾',
+'37':'八字白眉天蛾',
+'38':'陌夜蛾',
+'39':'豆天蛾',
+'40':'麦蛾',
+'41':'围连环夜蛾',
+'42':'亚美尺蛾',
+'43':'梨星毛虫',
+'44':'银锭夜蛾',
+'45':'黄臀灯蛾',
+'46':'大螟',
+'47':'燕尾舟蛾',
+'48':'榆津尺蛾',
+'49':'朽木夜蛾',
+'50':'黄地老虎',
+'51':'白钩粘夜蛾',
+'52':'桃蛀螟',
+'53':'甜菜夜蛾',
+'54':'斜纹夜蛾',
+'55':'蚀夜蛾',
+'56':'淡银锭夜蛾',
+'57':'齿美冬夜蛾',
+'58':'一点金刚钻',
+'59':'胡桃豹夜蛾',
+'60':'桑剑纹夜蛾',
+'61':'蓝目天蛾',
+'62':'黑绒绢金龟',
+'63':'烟青虫',
+'64':'暗黑鳃金龟',
+'65':'中华绒金龟',
+'66':'八字地老虎',
+'67':'榆绿天蛾',
+'68':'红星雪灯蛾',
+'69':'雀纹天蛾',
+'70':'铜绿丽金龟',
+'71':'水龟虫',
+'72':'曲线尼夜蛾',
+'73':'粘虫',
+'74':'瘦银锭夜蛾',
+'75':'红天蛾',
+'76':'鳃金龟',
+'77':'大黑鳃金龟',
+'78':'大地老虎',
+'79':'玉米螟',
+'80':'赤角盲蝽',
+'81':'槐尺蛾',
+'82':'银纹夜蛾',
+'83':'天牛',
+'84':'乏夜蛾',
+'85':'丁香天蛾',
+'86':'构月天蛾',
+'87':'虎甲',
+'88':'劳氏粘虫',
+'89':'白薯天蛾',
+'90':'广鹿蛾',
+'91':'二十八星瓢虫',
+'92':'腮金龟',
+'93':'人纹污夜蛾',
+'94':'叩甲',
+'95':'楸蠹野螟',
+'96':'丝绵木金星尺蛾',
+'97':'红缘灯蛾',
+'98':'黄褐丽金龟',
+'99':'螟蛾科',
+'100':'红棕灰夜蛾',
+'101':'黑绒绢金龟',
+'102':'广鹿灯蛾',
+'103':'蝽',
+'104':'蜂',
+'105':'大造桥虫',
+'106':'童剑纹夜蛾',
+'107':'晃剑纹夜蛾',
+'108':'钩粘虫',
+'109':'直影夜蛾',
+'110':'毛黄绢金龟',
+'111':'乌氏小尾天蚕蛾',
+'112':'褐边绿刺蛾',
+'113':'广鹿舟蛾',
+'114':'颜倾城',
+'115':'龙虱',
+'116':'双带盘瓢虫',
+'117':'槲犹冬夜蛾',
+'118':'洋槐天蛾',
+'119':'弧角散纹夜蛾',
+'120':'黄脉天蛾',
+'121':'葡萄天蛾',
+'122':'桃六点天蛾',
+'123':'异色瓢虫',
+'124':'榆黄足毒蛾',
+'125':'客来夜蛾',
+'126':'桦尺蛾',
+'127':'草地螟',
+'128':'细条纹野螟',
+'129':'污灯蛾属',
+'130':'杨二尾舟蛾',
+'131':'克什杆野螟',
+'132':'筱客来夜蛾',
+'133':'栗六点天蛾',
+'134':'紫光盾天蛾',
+'135':'款冬玉米螟',
+'136':'草蛉',
+'137':'亚麻篱灯蛾',
+'138':'扁连环夜蛾',
+'139':'圣蜣螂',
+'140':'白钩粘虫',
+'141':'苇实夜蛾',
+'142':'姬蜂',
+'143':'秘夜蛾',
+'144':'织网夜蛾',
+'145':'深色白眉天蛾',
+'146':'短扇舟蛾',
+'147':'白须天蛾',
+'148':'歌梦尼夜蛾',
+'149':'海安夜蛾',
+'150':'满丫纹夜蛾',
+'151':'蟋蟀',
+'152':'双斑青步甲',
+'153':'白条夜蛾',
+'154':'蟪蛄',
+'155':'负子蝽',
+'156':'脊青步甲',
+'157':'宽斑青步甲',
+'158':'稻从卷叶螟',
+'159':'淡剑夜蛾',
+'160':'甜菜白带野螟',
+'161': '樗蚕', 
+'162': '蒙古寒蝉',
+'163': '中带三角夜蛾', 
+'164': '蝗虫', 
+'165': '多色异丽金龟', 
+'166': '白色小卷蛾', 
+'167': '狭边青步甲',
+'168': '棉卷叶野螟', 
+'169': '豆荚野螟', 
+'170': '麻小食心虫', 
+'171': '星斑虎甲', 
+'172': '黄缘龙虱',
+'173': '无斑弧丽金龟', 
+'174': '白额鹰翅天蛾',
+'175': '日本真龙虱', 
+'176': '山东云斑螟',
+'177': '小文夜蛾', 
+'178': '三条蛀野螟', 
+'179': '榆掌舟蛾', 
+'180': '刺槐掌舟蛾', 
+'181': '星绒天蛾', 
+'182': '杨剑舟蛾', 
+'183': '刀夜蛾',
+'184': '红节天蛾', 
+'185': '星白雪灯蛾', 
+'186': '桃剑纹夜蛾', 
+'187': '谐夜蛾', 
+'188': '小剑纹夜蛾', 
+'189': '鸣鸣蝉', 
+'190': '姬夜蛾',
+'191': '落叶松毛虫', 
+'192': '苹六点天蛾', 
+'193': '四斑绢野螟', 
+'194': '甘薯天蛾', 
+'195': '小线角木蠹蛾', 
+'196': '三斑蕊夜蛾', 
+'197': '白雪灯蛾', 
+'198': '黄刺蛾', 
+'199': '茶翅蝽',
+'200': '杨树枯叶蛾',
+"201": "标瑙夜蛾",
+"202": "瓜绢野螟",
+"203": "稻绿蝽",
+"204": "杨雪毒蛾",
+"205": "榆白边舟蛾",
+"206": "扁刺蛾",
+"207": "绒黏夜蛾",
+"208": "庸肖毛翅夜蛾",
+"209": "中华婪步甲",
+"210": "褐黄前锹甲",
+"211": "旱柳原野螟",
+"212": "巨影夜蛾",
+"213": "食蚜蝇",
+"214": "双斑葬甲",
+"215": "黄毒蛾",
+"216": "婪步甲",
+"217": "土甲",
+"218": "中华真地鳖",
+"219": "紫线夜蛾",
+"220": "小黄鳃金龟",
+"221": "中华真土鳖",
+"222": "云斑虎甲",
+"223": "中华黧尺蛾",
+"224": "中华绿刺蛾",
+"225": "巨豹纹尺蛾",
+"226": "多斑豹蠹蛾",
+"227": "桑尺蛾",
+"228": "灰直纹螟",
+"229": "中国绿刺蛾",
+"230": "云杉梢斑螟",
+"231": "桑绢野螟",
+"232": "黄杨绢野螟",
+"233": "突背斑红蝽",
+"234": "高粱条螟",
+"235": "小麦负泥虫",
+"236": "苹掌舟蛾",
+"237": "绒粘夜蛾",
+"238": "灰白灯蛾",
+"239": "隐丫纹夜蛾",
+"240": "满纹夜蛾",
+"241": "黑剑狼夜蛾",
+"242": "蜣螂",
+"243": "福婆鳃金龟",
+"244": "雨尺蛾",
+"245": "优美苔蛾",
+"246": "黄斑野螟",
+"247": "疆夜蛾",
+"248": "六点天蛾",
+"249": "斜线夜蛾",
+"250": "石榴巾夜蛾",
+"251": "绒星天蛾",
+"252": "霜天蛾",
+"253": "大田鳖",
+"254": "灰双纹螟",
+"255": "青尺蛾",
+"256": "二线绿尺蛾",
+"257": "散纹夜蛾",
+"258": "红双线尺蛾",
+"259": "胞短栉夜蛾",
+"260": "飞虱科",
+"261": "桃多斑野螟",
+"262": "甜菜青野螟",
+"263": "核桃鹰翅天蛾",
+"264": "角顶尺蛾",
+"265": "葡萄缺角天蛾",
+"266": "绿尾大蚕蛾",
+"267": "杨褐枯叶蝶",
+"268": "双云尺蛾",
+"269": "斑拟兜夜蛾",
+"270": "阿莎尺蛾",
+"271": "榄绿岐角螟",
+"272": "青革土蝽",
+"273": "核桃美舟蛾",
+"274": "斑点卷叶螟",
+"275": "黄褐箩纹蛾",
+"276": "白环红天蛾",
+"277": "白腹网丛螟",
+"278": "枯叶蛾",
+"279": "丹日明夜蛾",
+"280": "仿白边舟蛾",
+"281": "槐羽舟蛾",
+"282": "草地贪夜蛾",
+"283": "环夜蛾",
+"284": "尘尺蛾",
+"285": "黄二星舟蛾",
+"286": "榆木蠹蛾",
+"287": "水黾",
+"288": "银装冬夜蛾",
+"289": "饰奇尺蛾",
+"290": "枯叶蝶",
+"291": "步甲",
+"292": "阔胸禾犀金龟",
+"293": "眼斑钩蛾",
+"294": "三开蜣螂",
+"295": "金星步甲",
+"296": "残夜蛾",
+"297": "野蚕蛾",
+"298": "芦苇豹蠹蛾",
+"299": "华晓扁犀金龟",
+"300": "灰胸突鳃金龟",
+"301": "龟纹瓢虫",
+"302": "麻皮蝽",
+"303": "斑须蝽",
+"304": "斜斑虎甲",
+"305": "地鳖",
+"306": "叶甲",
+"307": "燕夜蛾",
+"308": "黑纹北灯蛾",
+"309": "网夜蛾",
+"310": "棘翅夜蛾",
+"311": "规尺蛾",
+"312": "苜蓿银纹夜蛾",
+"313": "拟扇舟蛾",
+"314": "丁目大蚕蛾",
+"315": "金黄蛾",
+"316": "黄星雪灯蛾",
+"317": "暗纹紫褐螟",
+"318": "白眉天蛾",
+"319": "黄板盘瓢虫",
+"320": "玫岐角螟",
+"321":"枯黄贡尺蛾",
+"322":"小豆长喙天蛾",
+"323":"橙拟灯蛾",
+"324":"粉蝶灯蛾",
+"325":"纹散丽灯蛾",
+"326":"雪尾尺蛾",
+"327":"鹰翅天蛾",
+"328":"波纹蛾",
+"329":"黑条灰灯蛾",
+"330":"八点灰灯蛾",
+"331":"间纹弦夜蛾",
+"332":"缤夜蛾",
+}
+
+export default insect_dict

unpackage/dist/dev/app-plus/static/h5.html

@@ -0,0 +1,109 @@
+<!DOCTYPE html>
+<html lang=zh-CN>
+	<head>
+		<meta charset="utf-8">
+		<meta http-equiv="X-UA-Compatible" content="IE=edge">
+		<meta name="divport" content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1">
+		<title>uni-app h5平台在电脑浏览器打开解决方案</title>
+		<meta name="Copyright" content="helang">
+		<link rel="shortcut icon" type="image/png" href="/uniapp-extend/static/logo.png">
+		<meta name="keywords" content="黄河爱浪,WEB前端河浪,jQuery插件开发者河浪">
+		<meta name="description" content="公众号:web-7258,QQ:1846492969,邮箱:helang.love@qq.com">
+		<style type="text/css">
+			body {
+				margin: 0;
+				background-color: #f3f3f3;
+			}
+
+			iframe {
+				width: 375px;
+				height: 667px;
+				background-color: #fff;
+				box-sizing: content-box;
+				border: none;
+			}
+
+			@media screen and (min-width: 450px) {
+				iframe {
+					position: fixed;
+					top: 0;
+					right: 0;
+					bottom: 0;
+					left: 0;
+					margin: auto;
+					border: rgba(0, 0, 0, 0.7) solid 10px;
+					border-radius: 4px;
+				}
+			}
+		</style>
+		<script type="text/javascript" src="./js/ezuikit.js"></script>
+		<script type="text/javascript">
+			window.onload = function() {
+				/* 监听电脑浏览器窗口尺寸改变 */
+				//                window.onresize = function(){
+				//                    /* 窗口宽度 小于或等于420px 时，跳转回H5页面 */
+				//                    if(window.innerWidth <= 420){
+				//                        // window.location.pathname = '/uniapp-extend';
+
+				//                    /* 若你的项目未设置根目录（默认为 / 时），则使用下方代码 */
+				//                    // window.location.pathname = '';
+				//                    }
+				//     
+			
+				var obj=JSON.parse(localStorage.getItem('obj'))
+				console.log(obj)
+				var accessToken=obj.accessToken 
+				var device_id=obj.device_id
+				// let name = window.parent.document.getElementsByTagName("iframe")[0].baseURI; //需要iframe的ID
+			
+				// console.log(name)
+				setTimeout(() => {
+					var url = "ezopen://open.ys7.com/"+device_id+"/1.hd.live"
+					var player = new EZUIKit.EZUIPlayer({
+						id: 'myPlayer',
+						url: url,
+						autoplay: true,
+						accessToken: accessToken,
+						decoderPath: 'js/',
+						width: 600,
+						height: 400,
+					});
+					player.play();
+				}, 500)
+			}
+		</script>
+	</head>
+	<body>
+		<!-- <iframe src="/uniapp-extend"></iframe> -->
+		<div id="myPlayer"></div>
+		<div class="btn-box">
+			<div class="more" @touchstart="configCamera('move', 8)" @touchend="stopConfigCamera()">
+				<!-- <image src="" :src="moreSrc" mode="widthFix"></image> -->
+			</div>
+			<div class="direc">
+				<div class="top"  @touchstart="configCamera('move', 0)" @touchend="stopConfigCamera()">
+		
+				</div>
+				<div class="bottom"  @touchstart="configCamera('move', 1)" @touchend="stopConfigCamera()">
+		
+				</div>
+				<div class="photo"  @touchstart="configCamera('takephoto', '')" >
+		
+				</div>
+				<div class="left"  @touchstart="configCamera('move', 2)" @touchend="stopConfigCamera()">
+		
+				</div>
+				<div class="right"  @touchstart="configCamera('move', 6)" @touchend="stopConfigCamera()">
+		
+				</div>
+			</div>
+			<div class="less" @touchstart="configCamera('move', 9)" @touchend="stopConfigCamera()">
+				<image :src="lessSrc" mode="widthFix"></image>
+			</div>
+		</div>
+		<!--
+            若你的项目未设置根目录（默认为 / 时），则使用下方代码
+            <iframe src="/"></iframe>
+        -->
+	</body>
+</html>