Skip to content

Z
ZiBoYingJI
Commit fb62f717 authored by Kimber's avatar Kimber
Browse files
Options

'update'

parent 57533b63
Hide whitespace changes
Inline Side-by-side
Showing with 5778 additions and 162 deletions
public/datav/open-air.html
View file @ fb62f717
......@@ -140,6 +140,10 @@
<!-- video -->
<div ref="container" @dblclick="fullscreenSwich"
style="width:100%;height:100%;background-color: #000000;margin:0 auto;">
<div class="EZUIKit-video" id="video-container" style="height:100%;"></div>
<!--
<div class="buttons-box" id="buttonsBox">
<div class="buttons-box-left">
<i v-if="!playing" class="iconfont icon-play jessibuca-btn"
......@@ -153,8 +157,6 @@
</div>
<div class="buttons-box-right">
<span class="jessibuca-btn">{{ kBps }} kb/s</span>
<!-- <i class="iconfont icon-file-record1 jessibuca-btn"></i>-->
<!-- <i class="iconfont icon-xiangqing2 jessibuca-btn" ></i>-->
<i class="iconfont icon-camera1196054easyiconnet jessibuca-btn" @click="screenshot"
style="font-size: 1rem !important"></i>
<i class="iconfont icon-shuaxin11 jessibuca-btn" @click="playBtnClick"></i>
......@@ -164,6 +166,7 @@
@click="fullscreenSwich"></i>
</div>
</div>
-->
</div>
<!-- video end -->
</div>
......@@ -282,7 +285,6 @@
</div>
</body>
<!-- 引入echarts -->
<script src="js/echarts.min.js"></script>
<script src="js/echarts-gl.js"></script>
......@@ -298,20 +300,22 @@
<!-- cookie -->
<script src="js/js.cookie.js"></script>
<script type="text/javascript" src="static/js/jessibuca/jessibuca.js"></script>
<!-- <script type="text/javascript" src="static/js/jessibuca/jessibuca.js"></script>
<script type="text/javascript" src="static/js/EasyWasmPlayer.js"></script>
<script type="text/javascript" src="static/js/liveplayer-lib.min.js"></script>
<script type="text/javascript" src="static/js/ZLMRTCClient.js"></script>
<script type="text/javascript" src="static/js/ZLMRTCClient.js"></script> -->
<script type="text/javascript" src="static/ezuikit-js/ezuikit.js"></script>
<script type="text/javascript" src="static/js/config.js"></script>
<script>
let jessibucaPlayer = {};
const host = location.protocol + '//' + window.location.host;
//const host = location.protocol + '//' + window.location.host;
const token = Cookies.get('ELADMIN-TOEKN');
axios = axios.create({
const Axiosx = axios.create({
headers: { 'Authorization': token }
});
axios.interceptors.response.use(
Axiosx.interceptors.response.use(
response => {
return response
}, error => {
......@@ -338,7 +342,17 @@
alert('您没有权限使用此功能，请联系管理员开通')
return
}
});
}
);
const host = location.protocol + '//' + (location.hostname === '192.168.3.226' ? '192.168.3.37' : '192.168.13.200') + ':8013';
const selfHost = location.hostname === '192.168.3.226' ? 'http://192.168.3.226:8057' : location.protocol + '//' + window.location.host;
// 请求 token 用
const request = axios.create({});
request.defaults.headers['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
var map; // 地图
new Vue({
......@@ -425,35 +439,162 @@
window.history.go(-1)
return
}
this.getData()
this.getData();
// 视频列表
axios.get('/api/video/link-mine', {
Axiosx.get('/api/video/link-mine', {
params: {
mineType: this.selectedMine.mineType,
mineId: this.selectedMine.id,
}
}).then(resopnse => {
this.videos = []
let firstVideo = null
resopnse.data.results.forEach(vm => {
let video = {
'id': vm.id,
'videoUrl': null,
'name': vm.name,
'videoId': vm.videoId,
'deviceId': vm.deviceId
}
firstVideo = firstVideo || video
this.videos.push(video)
})
if (firstVideo) {
this.chickVideo(firstVideo, 0)
}
})
}).then(res => {
res = {
"appKey": "54309ca903e94a9bb14b7f0a69b0da94",
"appSecret": "446ece35fb3a65264a04375b72246b1f",
"list": [
{
"name": "视频2@DS-7804N-K1",
"channel": "2.hd.live",
"id": "G67791074",
"remark": "无",
"captcha": ""
},
{
"name": "视频1",
"channel": "1.hd.live",
"id": "G67791073",
"remark": "无",
"captcha": ""
}
],
};
if(this.selectedMine.code === "1225421" || true){
res = {
"appKey": "6039de9e0bf44407a15a15553986433c",
"appSecret": "fb498de47fb488e14305ff300bd30d27",
"list": [
{
"name": "视频1",
"channel": "1.hd.live",
"id": "D14924613",
"remark": "无",
"captcha": "kyd001"
},
{
"name": "视频2",
"channel": "2.hd.live",
"id": "D14924613",
"remark": "无",
"captcha": "kyd001"
},
{
"name": "视频3",
"channel": "3.hd.live",
"id": "D14924613",
"remark": "无",
"captcha": "kyd001"
},
{
"name": "视频4",
"channel": "4.hd.live",
"id": "D14924613",
"remark": "无",
"captcha": "kyd001"
}
],
};
};
console.log('selectedMineJson ________________ ', this.selectedMine);
this.info = {
appKey:res.appKey,
appSecret:res.appSecret,
};
this.videos = res.list || [];
this.createVideo(res.list[0]);
});
//
},
methods: {
// video
createVideo: function(item){
this.getAccessToken(this.info.appKey, this.info.appSecret).then(accessToken => {
var url = this.getUrl(item);
var video = document.getElementById("video-container");
video.innerHTML = '';
this.player = new EZUIKit.EZUIKitPlayer({
autoplay: true,
id: "video-container",
accessToken:accessToken,
url: url,
template: "standard", // simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版；
// 视频上方头部控件
//header: ["capturePicture", "save", "zoom"], // 如果templete参数不为simple,该字段将被覆盖
//plugin: ['talk'], // 加载插件，talk-对讲
// 视频下方底部控件
// footer: ["talk", "broadcast", "hd", "fullScreen"], // 如果template参数不为simple,该字段将被覆盖
// audio: 1, // 是否默认开启声音 0 - 关闭 1 - 开启
// openSoundCallBack: data => console.log("开启声音回调", data),
// closeSoundCallBack: data => console.log("关闭声音回调", data),
// startSaveCallBack: data => console.log("开始录像回调", data),
// stopSaveCallBack: data => console.log("录像回调", data),
// capturePictureCallBack: data => console.log("截图成功回调", data),
// fullScreenCallBack: data => console.log("全屏回调", data),
// getOSDTimeCallBack: data => console.log("获取OSDTime回调", data),
});
})
},
getAccessToken(appKey, appSecret){
var dataJson = 'appKey='+appKey+'&appSecret='+appSecret;
return request.post("/ys7com", dataJson).then(res=>{
var data = res.data || {};
if (data['code'] == '200') {
return data['data']['accessToken']
}else{
return null
}
}).catch(err=>{
console.log(err);
return err
})
},
getUrl(item){
var captcha = item.captcha ? item.captcha + '@' : '';
var id = item.id || this.info.id || '';
return 'ezopen://'+captcha+'open.ys7.com/'+id+'/'+item.channel;
},
chickVideo(video, index) {
console.log('chickVideo ________________ ', video, index);
this.createVideo(video);
this.TabCur = index;
this.showMask = false;
},
// video -----------------------------------
updatePlayerDomSize() {
let dom = this.$refs.container;
let width = dom.parentNode.clientWidth
......@@ -686,10 +827,10 @@
},
// video end
// 点击选中一路视频
chickVideo(video, index) {
chickVideo222(video, index) {
console.log('video====', video, index)
if (video.videoUrl == null) {
axios.get('/wvp/api/play/start/' + video.deviceId + '/' + video.videoId).then(res => {
Axiosx.get('/wvp/api/play/start/' + video.deviceId + '/' + video.videoId).then(res => {
console.log('res====', res)
if (res.status && res.status >= 200 && res.status - 200 < 100) {
if (res.data.code == 0) {
......@@ -719,7 +860,7 @@
// AI报警列表
this.aiWarnCount = 0
axios.get(host + '/api/datav/video-ai', {
Axiosx.get(host + '/api/datav/video-ai', {
params: {
page: 1,
count: 100,
......
public/datav/static/ezuikit-js/README.md 0 → 100644
View file @ fb62f717
# [EZUIKit-JavaScript-npm][ezuikit-js]
>轻应用npm版本，降低接入难度，适配自定义UI，适配主流框架
> 低延时预览，云存储回放，SD卡回放
> 功能API丰富，如：播放控制，音频控制，视频截图，实时获取视频OSDTime，视频录制，设备对讲，电子放大，全屏等
### 获取ezuikit-js
```
$ npm install ezuikit-js
```
### 引入ezuikit-js
```
import EZUIKit from 'ezuikit-js';
```
>##### 如果你使用原生方法,可以通过标签引用
```
<script src="./ezuikit.js"></script>
```
### 开始使用 - 初始化
>基本使用
创建DOM
```
<div id="video-container"></div>
```
播放器初始化
```
var player = new EZUIKit.EZUIKitPlayer({
id: 'video-container', // 视频容器ID
accessToken: 'at.3bvmj4ycamlgdwgw1ig1jruma0wpohl6-48zifyb39c-13t5am6-yukyi86mz',
url: 'ezopen://open.ys7.com/203751922/1.live',
})
```
### 方法调用
> 示例： 停止播放
```
1. player.stop();
2. player.stop()
.then(()=>{
console.log("执行播放成功后其他动作");
});
```
> 示例： 执行播放（自动播放为false,自定义触发播放/切换播放地址）
```
player.play();
// 切换播放地址场景（注意先执行stop方法停止上次取流）
player.play({
url: 'ezopen://open.ys7.com/203751922/1.rec?begin=202001000000&end=202001235959'
});
```
切换地址播放（注意需要先执行stop方法停止上次取流）
```
player.stop()
.then(()=>{
player.play('ezopen://open.ys7.com/{其他设备}/{其他通道}.live');
});
// 其他账号下设备
player.stop()
.then(()=>{
player.play({url:'ezopen://open.ys7.com/{其他设备}/{其他通道}.live',accessToken: 'xxxx'});
});
```
### 使用说明
#### 初始化
|参数名|类型|描述|是否必选|
|:--|:--|:--|:--|
|id| String| 播放器容器DOM的id| Y|
|accessToken| String| 授权过程获取的access_token| Y|
|url |String| 视频ezopen协议播放地址 |Y|
|audio| int | 是否默认开启声音 1：打开（默认） 0：关闭 |N|
|width |int | 视频宽度，默认值为容器容器DOM宽度 |N|
|height |int | 视频高度，默认值为容器容器DOM高度 |N|
|templete |string | 播放器模板，可以通过选定模板，使用内置的播放器样式，组件 simple：极简版;standard：标准版;security：安防版(预览回放);vioce：语音版 |N|
|header |Array | 视频头部可选UI组件，可选值：capturePicture：截图,save：录像保存,zoom：电子放大 |N|
|footer |Array | 视频底部部可选UI组件，可选值：talk：对讲,broadcast：语音播报,hd：高清标清切换,fullScreen：全屏 |N|
|plugin |Array | 按需加载插件，可选值： talk：对讲 |N|
|handleSuccess |function | 播放成功回调 |N|
|handleError |function | 播放错误回调 |N|
|openSoundCallBack |function | 开启声音回调 |N|
|closeSoundCallBack |function | 关闭回调 |N|
|startSaveCallBack |function | 开始录像回调 |N|
|stopSaveCallBack |function | 结束录像回调 |N|
|capturePictureCallBack |function | 截图回调 |N|
|fullScreenCallBack |function | 全屏回调 |N|
|fullScreenChangeCallBack |function | 全屏变化回调-全局（含ESC退出全屏等） |N|
|getOSDTimeCallBack |function | 获取OSD时间回调 |N|
#### 方法集合
|方法名|类型|描述|使用示例|
|:--|:--|:--|:--|
|stop| function| 结束播放| `player.stop()`|
|openSound| String| 开启声音|`player.openSound()`|
|closeSound |String|关闭声音 |`player.closeSound()`|
|startSave| int |开始录像|`player.startSave()`|
|stopSave|int |结束录像|`player.stopSave()`|
|capturePicture| function| 视频截图| `player.capturePicture()`|
|fullScreen| function| 全屏（自动适配移动端pc端全屏）| `player.fullScreen()`|
|cancelFullScreen| function| 取消全屏| `player.cancelFullScreen()`|
|getOSDTime| function| 获取播放时间回调| `player.getOSDTime()`|
|startTalk| function| 开始对讲| `player.startTalk()`|
|stopTalk| function| 结束对讲| `player.stopTalk()`|
### 使用示例
> 如果使用原生js，可参考demos => base-demo
> 如果使用react，可参考demos => react-demo
> 如果使用vue，可参考demos => vue-demo
public/datav/static/ezuikit-js/demos/base-demo/ezuikit.js 0 → 100644
View file @ fb62f717
"use strict";
/**
* EZUIKitPlayer for npm
*/
(function (global, factory) {
"use strict";
if (typeof module === "object" && typeof module.exports === "object") {
module.exports = global.document ? factory(global, true) : function (w) {
if (!w.document) {
throw new Error("EZUIPlayer requires a window with a document");
}
return factory(w);
};
} else {
factory(global);
} // Pass this if window is not defined yet
})(typeof window !== "undefined" ? window : void 0, function (window, noGlobal) {
// 加载js
function addJs(filepath, callback) {
var headerScript = document.getElementsByTagName('head')[0].getElementsByTagName("script");
var isReady = false;
for (var i = 0; i < headerScript.length; i++) {
if (headerScript[i].getAttribute("src") == filepath) {
isReady = true;
callback();
}
}
if (!isReady) {
var oJs = document.createElement("script");
oJs.setAttribute("src", filepath);
oJs.onload = callback;
document.getElementsByTagName("head")[0].appendChild(oJs);
}
} // 加载css
function addCss(filepath, callback) {
var headerLink = document.getElementsByTagName('head')[0].getElementsByTagName("link");
var isReady = false;
for (var i = 0; i < headerLink.length; i++) {
if (headerLink[i].getAttribute("href") == filepath) {
isReady = true;
callback();
}
}
if (!isReady) {
var oJs = document.createElement('link');
oJs.rel = 'stylesheet';
oJs.type = 'text/css';
oJs.href = filepath;
oJs.onload = callback;
document.getElementsByTagName("head")[0].appendChild(oJs);
}
} // 通用请求方法
function request(url, method, params, header, success, error) {
var _url = url;
var http_request = new XMLHttpRequest();
http_request.onreadystatechange = function () {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
var _data = JSON.parse(http_request.responseText);
success(_data);
}
}
};
http_request.open(method, _url, true); // http_request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
var data = new FormData();
for (var i in params) {
data.append(i, params[i]);
}
http_request.send(data);
}
; // 全局属性
var EZUIKit = {
EZUIKitPlayer: undefined,
EZUIKitTalk: undefined,
opt: {
apiDomain: 'https://open.ys7.com/api/lapp/live/talk/url',
filePath: 'https://open.ys7.com/assets/ezuikit_v2.6.4',
accessToken: '',
url: '',
deviceSerial: '',
channelNo: '',
id: '',
talkLink: '',
rtcUrl: '',
ttsUrl: '',
stream: '',
// 对讲插件依赖
isReliesReady: false,
template: 'simple',
plugin: [],
// 加载插件，talk-对讲
audio: 1,
// 声音id 0-不开启 1-开启
autoplay: 1,
videoLoading: false,
},
state: {
countTimer: undefined,
// countTime 计时器
recodeTime: 0,
// 录音时间
recodeTimer: undefined,
//录音时长 计时器
recodeTime: 0,
fetchDefaultList: false,
// 是否拉取默认语音-当用户语音为空
page: 0,
// 语音当前页
pageSize: 5
},
handleTalkSuccess: function(){},
handleTalkError: function(){},
};
/**
* 视频播放器-开始
*/
var domain = "https://open.ys7.com";
var filePathDomain = domain;
var EZUIKitPlayer = function EZUIKitPlayer(params) {
var _this = this;
this.opt = {
id: params.id,
apiDomain: domain + '/api/lapp/live/talk/url',
filePath: filePathDomain + '/assets/ezuikit_v2.6.4',
decoderVersion: '',
accessToken: '',
url: '',
deviceSerial: '',
channelNo: '',
talkLink: '',
rtcUrl: '',
ttsUrl: '',
stream: '',
// 对讲插件依赖
isReliesReady: false,
template: 'simple',
plugin: [],
// 加载插件，talk-对讲
audio: 1,
// 声音id 0-不开启 1-开启
autoplay: 1,
fullScreenStatus: 0,
bSupporDoubleClickFull: true,
videoLoading: false,
};
this.params = params;
if (params.id) {
this.opt.id = params.id;
}
if (params.accessToken) {
this.opt.accessToken = params.accessToken;
}
if (typeof params.audio !== 'undefined') {
this.opt.audio = params.audio;
}
if (typeof params.decoderVersion !== 'undefined') {
this.opt.decoderVersion = params.decoderVersion;
}
if (typeof params.env !== 'undefined') {
if(typeof params.env.domain !== 'undefined'){
domain = params.env.domain;
this.opt.apiDomain = domain + '/api/lapp/live/talk/url';
}
if(typeof params.env.filePathDomain !== 'undefined'){
filePathDomain = params.env.filePathDomain;
this.opt.filePathDomain = params.env.filePathDomain;
}
}
if (params.url) {
this.opt.url = params.url;
this.opt.deviceSerial = params.url.split("/")[3];
this.opt.channelNo = params.url.split("/")[4].split(".")[0];
}
if (typeof params.template !== 'undefined') {
this.opt.template = params.template;
}
if (params.plugin) {
this.opt.plugin = params.plugin;
}
if (typeof params.autoplay !== 'undefined') {
this.opt.autoplay = params.autoplay ? 1 : 0;
}
if (typeof params.bSupporDoubleClickFull !== 'undefined') {
this.opt.bSupporDoubleClickFull = params.bSupporDoubleClickFull;
}
if (typeof params.handleTalkSuccess !== 'undefined') {
window.EZUIKit.handleTalkSuccess = params.handleTalkSuccess;
}
if (typeof params.handleTalkError !== 'undefined') {
window.EZUIKit.handleTalkError = params.handleTalkError;
}
var id = this.opt.id;
var domElement = document.getElementById(id); // 间隙
domElement.style.fontSize = 0;
domElement.style.overflowY = 'auto';
domElement.style.position = 'relative';
/**
* 渲染iframe视频框
*/
var iframe = document.createElement('iframe');
domain = 'http://y.ys7.com:3100'
function matchIframeUrl() {
switch (_this.opt.template) {
case 'simple':
var iframeUrl = domain + "/ezopen/h5/iframe?bSupporDoubleClickFull=0&url=" + _this.opt.url.replace("?","&") + "&autoplay=" + _this.opt.autoplay + "&audio=" + _this.opt.audio + "&accessToken=" + params.accessToken + "&templete=0" + "&id=" + id + "&decoderVersion=" + _this.opt.decoderVersion;
var controlsValue = "";
if(typeof params.controls !== 'undefined' && params.controls){
console.log("typeof" ,typeof params.controls)
controlsValue = "play,voice,hd,fullScreen";
if(params.controls.length > 0){
controlsValue = params.controls.join(",");
iframeUrl += ('&controls=' + controlsValue);
}
}
if (params.websocketParams) {
iframeUrl += ('&websocketParams=' + JSON.stringify(params.websocketParams))
}
return iframeUrl;
case 'standard':
return domain + "/ezopen/h5/iframe?bSupporDoubleClickFull=0&url=" + _this.opt.url.replace("?","&") + "&autoplay=" + _this.opt.autoplay + "&audio=" + _this.opt.audio + "&accessToken=" + params.accessToken + "&templete=1" + "&id=" + id + "&decoderVersion=" + _this.opt.decoderVersion;
case 'security':
return domain + "/ezopen/h5/iframe_se?bSupporDoubleClickFull=0&url=" + _this.opt.url.replace("?","&") + "&autoplay=" + _this.opt.autoplay + "&audio=" + _this.opt.audio + "&accessToken=" + params.accessToken + "&templete=0" + "&id=" + id + "&decoderVersion=" + _this.opt.decoderVersion;
default:
return domain + "/ezopen/h5/iframe?bSupporDoubleClickFull=0&url=" + _this.opt.url.replace("?","&") + "&autoplay=" + _this.opt.autoplay + "&audio=" + _this.opt.audio + "&accessToken=" + params.accessToken + "&templete=0" + "&id=" + id + "&decoderVersion=" + _this.opt.decoderVersion;
}
}
iframe.src = matchIframeUrl(); // 默认取容器宽高
var iframeHeight = document.getElementById(id).offsetHeight;
var iframeWidth = document.getElementById(id).offsetWidth;
if (params.height) {
iframeHeight = parseInt(params.height);
if(/\%$/.test(params.height)) {
iframeWidth = document.getElementById(id).offsetWidth * (parseInt(params.height) /100);
}
}
if (params.width) {
iframeWidth = parseInt(params.width);
if(/\%$/.test(params.width)) {
iframeWidth = document.getElementById(id).offsetWidth * (parseInt(params.width) /100);
}
}
iframe.width = iframeWidth;
iframe.height = iframeHeight;
iframe.id = 'EZUIKitPlayer-' + id; // 部分iframe属性
iframe.setAttribute("allowfullscreen", true);
iframe.setAttribute("allow", "autoplay");
iframe.setAttribute("frameborder", 0);
domElement.appendChild(iframe);
var jqueryJS = _this.opt.filePath + '/js/jquery.js';
var layerJs = 'https://open.ys7.com/assets/layer/layer.js';
addJs(jqueryJS, function () {
addJs(layerJs, function () {
// });
// });
/**
* 渲染header
*/
if (matchHeaderOpt().headerContainer) {
// if (params.header && params.header instanceof Array) {
var headerContainer = document.createElement('div');
headerContainer.setAttribute('class', 'panel-top');
var controsDOM = document.createElement('div');
controsDOM.setAttribute('class', 'contros');
headerContainer.appendChild(controsDOM);
domElement.insertBefore(headerContainer, iframe);
if (matchHeaderOpt().capturePictureModule) {
// 截图
var capturePictureDOM = document.createElement('span');
capturePictureDOM.innerHTML = '<span title="截图">' + '<svg id="capturePicture" title="截图" t="1578882764585" class="icon" viewBox="0 0 1024 1024" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="5958" width="24" height="24">' + ' <path' + ' d="M887.296 315.904h-153.6c-51.2 0-68.096-102.4-119.296-102.4H392.704c-34.304 0-51.2 102.4-102.4 102.4h-153.6c-29.696 0-51.2 21.504-51.2 51.2v439.296c0 25.6 21.504 47.104 51.2 47.104h751.104c29.696 0 51.2-21.504 51.2-51.2v-435.2c-0.512-30.208-21.504-51.2-51.712-51.2zM512 768c-115.2 0-204.8-89.6-204.8-200.704s89.6-200.704 204.8-200.704 204.8 89.6 204.8 200.704-93.696 200.704-204.8 200.704z m247.296-354.304c-12.8 0-25.6-12.8-25.6-25.6s12.8-25.6 25.6-25.6 25.6 12.8 25.6 25.6c0 17.408-12.8 25.6-25.6 25.6zM256 264.704c0-8.704-8.704-16.896-16.896-16.896h-51.2c-8.704 0-16.896 8.704-16.896 16.896V281.6H256v-16.896z m256 148.992c-85.504 0-153.6 68.096-153.6 153.6s68.096 153.6 153.6 153.6 153.6-68.096 153.6-153.6-68.096-153.6-153.6-153.6z"' + ' fill="#ffffff" p-id="5959"></path>' + '</svg>' + '</span>';
capturePictureDOM.onclick = function () {
_this.capturePicture();
};
controsDOM.appendChild(capturePictureDOM);
}
console.log("matchHeaderOpt().saveModule", matchHeaderOpt().saveModule);
if (matchHeaderOpt().saveModule) {
var startSaveDOM = document.createElement('span');
startSaveDOM.innerHTML = '<span title="开始录像">' + ' <svg id="startSave" t="1578882716693" class="icon" viewBox="0 0 1024 1024" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="3782" width="24" height="24">' + ' <path' + ' d="M915.2 729.6l-128-76.8c-25.6-12.8-44.8-32-44.8-51.2V435.2c0-25.6 19.2-38.4 44.8-51.2l128-76.8c25.6-12.8 44.8 0 44.8 19.2V704c0 32-19.2 38.4-44.8 25.6z m-332.8 89.6H96c-51.2 0-89.6-38.4-89.6-89.6V332.8c0-51.2 38.4-89.6 89.6-89.6h486.4c51.2 0 89.6 38.4 89.6 89.6v396.8c0 51.2-38.4 89.6-89.6 89.6zM192 364.8c-32 6.4-57.6 32-64 64-12.8 57.6 38.4 115.2 96 102.4 32-6.4 57.6-32 64-70.4 12.8-57.6-38.4-108.8-96-96z m0 0"' + ' p-id="3783" fill="#ffffff"></path>' + ' </svg>' + '</span>';
startSaveDOM.onclick = function () {
_this.startSave();
document.getElementById('startSave').setAttribute('class', 'icon hide');
document.getElementById('stopSave').setAttribute('class', 'icon');
};
controsDOM.appendChild(startSaveDOM);
var stopSaveDOM = document.createElement('span');
stopSaveDOM.innerHTML = '<span title="结束录像">' + ' <svg id="stopSave" t="1578882716693" class="icon hide" viewBox="0 0 1024 1024" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="3782" width="24" height="24">' + ' <path' + ' d="M915.2 729.6l-128-76.8c-25.6-12.8-44.8-32-44.8-51.2V435.2c0-25.6 19.2-38.4 44.8-51.2l128-76.8c25.6-12.8 44.8 0 44.8 19.2V704c0 32-19.2 38.4-44.8 25.6z m-332.8 89.6H96c-51.2 0-89.6-38.4-89.6-89.6V332.8c0-51.2 38.4-89.6 89.6-89.6h486.4c51.2 0 89.6 38.4 89.6 89.6v396.8c0 51.2-38.4 89.6-89.6 89.6zM192 364.8c-32 6.4-57.6 32-64 64-12.8 57.6 38.4 115.2 96 102.4 32-6.4 57.6-32 64-70.4 12.8-57.6-38.4-108.8-96-96z m0 0"' + ' p-id="3783" fill="red"></path>' + ' </svg>' + ' </span>';
stopSaveDOM.onclick = function () {
_this.stopSave();
document.getElementById('stopSave').setAttribute('class', 'icon hide');
document.getElementById('startSave').setAttribute('class', 'icon');
};
controsDOM.appendChild(stopSaveDOM);
}
if (matchHeaderOpt().zoomModule) {
var enableZoomDOM = document.createElement('span');
enableZoomDOM.innerHTML = '<span title="开启电子放大">' + ' <svg id="enableZoom" t="1578882639834" class="icon" viewBox="0 0 1000 1000" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="2227" width="24" height="24">' + ' <path' + ' d="M830.6119 441.1089c0-193.7756-157.0939-350.8641-350.8775-350.8641S128.8559 247.3333 128.8559 441.1089 285.9508 791.972 479.7344 791.972 830.6119 634.8845 830.6119 441.1089zM483.2821 710.4863c-146.7975 0-265.8187-118.9953-265.8187-265.8088S336.4847 178.8697 483.2821 178.8697s265.8197 118.9953 265.8197 265.8078S630.0796 710.4863 483.2821 710.4863zM770.6031 653.5739l-72.6417 75.9485 141.6917 160.1814 82.0737-90.0739L770.6031 653.5739zM527.5849 267.4727h-88.60655762279428v132.90489048425167H306.0690340253259v88.60292721534799h132.90933675248866v132.9038911617923h88.60655762279428V488.9794719180395h132.90933675248866v-88.60292721534799H527.5849284006089V267.4726535408993z"' + ' p-id="2228" fill="#ffffff"></path>' + ' </svg>' + '</span>';
enableZoomDOM.onclick = function () {
_this.enableZoom();
document.getElementById('enableZoom').setAttribute('class', 'icon hide');
document.getElementById('closeZoom').setAttribute('class', 'icon');
};
controsDOM.appendChild(enableZoomDOM);
var closeZoomDOM = document.createElement('span');
closeZoomDOM.innerHTML = '<span title="关闭电子放大">' + ' <svg id="closeZoom" t="1578882639834" class="icon hide" viewBox="0 0 1000 1000" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="2227" width="24" height="24">' + ' <path' + ' d="M830.6119 441.1089c0-193.7756-157.0939-350.8641-350.8775-350.8641S128.8559 247.3333 128.8559 441.1089 285.9508 791.972 479.7344 791.972 830.6119 634.8845 830.6119 441.1089zM483.2821 710.4863c-146.7975 0-265.8187-118.9953-265.8187-265.8088S336.4847 178.8697 483.2821 178.8697s265.8197 118.9953 265.8197 265.8078S630.0796 710.4863 483.2821 710.4863zM770.6031 653.5739l-72.6417 75.9485 141.6917 160.1814 82.0737-90.0739L770.6031 653.5739zM527.5849 267.4727h-88.60655762279428v132.90489048425167H306.0690340253259v88.60292721534799h132.90933675248866v132.9038911617923h88.60655762279428V488.9794719180395h132.90933675248866v-88.60292721534799H527.5849284006089V267.4726535408993z"' + ' p-id="2228" fill="red"></path>' + ' </svg>' + '</span>';
closeZoomDOM.onclick = function () {
_this.closeZoom();
document.getElementById('closeZoom').setAttribute('class', 'icon hide');
document.getElementById('enableZoom').setAttribute('class', 'icon');
};
controsDOM.appendChild(closeZoomDOM);
}
}
/**
* 渲染footer
*/
/** 根据配置匹配底部渲染 */
function matchFooterOpt() {
var result = {
footerContainer: false,
talkModule: false,
broadcastModule: false,
hdModule: false,
fullScreenModule: false
};
var template = _this.opt.template;
switch (template) {
case 'simple':
if (params.footer && params.footer instanceof Array) {
var footer = params.footer;
result = {
footerContainer: true,
talkModule: footer.indexOf('talk') !== -1,
broadcastModule: footer.indexOf('broadcast') !== -1,
hdModule: footer.indexOf('hd') !== -1,
fullScreenModule: footer.indexOf('fullScreen') !== -1
};
}
break;
case 'standard':
if (params.footer && params.footer instanceof Array) {
var footer = params.footer;
result = {
footerContainer: true,
talkModule: footer.indexOf('talk') !== -1,
broadcastModule: footer.indexOf('broadcast') !== -1,
hdModule: footer.indexOf('hd') !== -1,
fullScreenModule: footer.indexOf('fullScreen') !== -1
};
}
break;
case 'security':
break;
case 'voice':
result = {
footerContainer: true,
talkModule: true,
broadcastModule: true,
hdModule: true,
fullScreenModule: true
};
break;
}
return result;
}
/** 根据配置匹配底部渲染 */
function matchHeaderOpt() {
var result = {
headerContainer: false,
capturePictureModule: false,
saveModule: false,
zoomModule: false
};
var template = _this.opt.template;
switch (template) {
case 'simple':
if (params.header && params.header instanceof Array) {
var header = params.header;
result = {
headerContainer: true,
capturePictureModule: header.indexOf('capturePicture') !== -1,
saveModule: header.indexOf('save') !== -1,
zoomModule: header.indexOf('zoom') !== -1
};
}
break;
case 'standard':
break;
case 'security':
break;
case 'voice':
result = {
headerContainer: true,
capturePictureModule: true,
saveModule: true,
zoomModule: true
};
break;
}
return result;
}
if (matchFooterOpt().footerContainer || _this.opt.plugin.indexOf('talk') !== -1) {
var recoderCSS = _this.opt.filePath + '/npm/css/recoder.css';
var recoderJs = _this.opt.filePath + '/npm/js/recoder.js';
var recorderJs = _this.opt.filePath + '/recorder.js'; // addCss()
addCss(recoderCSS, function () { });
addJs(recoderJs, function () {
addJs(recorderJs, function () { });
}); // 对讲模块
if (_this.opt.plugin.indexOf('talk') !== -1 || matchFooterOpt().talkModule) {
function apiSuccess(data) {
console.log("data", data);
if (data.code == 200) {
var apiResult = data.data;
if (apiResult) {
// 临时将https转换为websocket
var rtcTrunk = apiResult.rtcUrl;
if (rtcTrunk.indexOf("ws") === -1) {
rtcTrunk = rtcTrunk.replace("https", "wss").replace("rtcgw", "rtcgw-ws");
}
_this.opt.rtcUrl = rtcTrunk;
_this.opt.ttsUrl = "tts://" + apiResult.ttsUrl;
var talk = "talk://" + _this.opt.deviceSerial + ":0:" + _this.opt.channelNo + ":cas.ys7.com:6500";
_this.opt.talkLink = _this.opt.ttsUrl + "/" + talk;
_this.opt.stream = apiResult.stream;
console.log("_this.opt", _this.opt); // 加载依赖
if (!_this.opt.isReliesReady) {
var adapeterJS = _this.opt.filePath + '/npm/js/adapeter.js';
var janusJS = _this.opt.filePath + '/npm/js/janus.js';
var ttsJS = _this.opt.filePath + '/npm/js/tts.js';
console.log("加载jquery.js");
addJs(adapeterJS, function () {
console.log("加载adapeter.js");
addJs(janusJS, function () {
console.log("加载janus.js");
addJs(ttsJS, function () {
console.log("加载tts.js"); // 文件加载完毕;
_this.opt.isReliesReady = true;
});
});
});
} // 创建DOM
if (!document.getElementById("audioleft")) {
var audioleft = document.createElement('div');
audioleft.style.display = 'none';
audioleft.id = 'audioleft';
document.body.appendChild(audioleft);
}
if (!document.getElementById("audioright")) {
var audioright = document.createElement('div');
audioright.style.display = 'none';
audioright.id = 'audioright';
document.body.appendChild(audioright);
}
}
}
EZUIKit.opt = _this.opt;
}
function apiError(err) {
if (params.handleError) {
params.handleError(err);
}
}
request(_this.opt.apiDomain, 'POST', {
accessToken: _this.opt.accessToken,
deviceSerial: _this.opt.deviceSerial,
channelNo: _this.opt.channelNo
}, '', apiSuccess, apiError);
}
if (matchFooterOpt().footerContainer) {
// 底部容器
var footerContainer = document.createElement('div');
footerContainer.setAttribute("class", 'audio-controls');
domElement.appendChild(footerContainer);
if (matchFooterOpt().hdModule || matchFooterOpt().fullScreenModule) {
// 底部右侧元素
var rightContros = document.createElement('div');
rightContros.setAttribute('class', 'contros');
footerContainer.appendChild(rightContros);
if (matchFooterOpt().hdModule) {
// 高清-标清切换
var hdDom = document.createElement('span');
hdDom.setAttribute('id', 'video-hd');
hdDom.innerHTML = _this.opt.url.indexOf('.hd') === -1 ? '标清' : '高清';
hdDom.onclick = function () {
// 停止
if(_this.opt.videoLoading){
layer.msg("视频加载中，请稍后");
return false;
}else {
var stopPromise = _this.stop();
_this.opt.videoLoading = true;
stopPromise.then((data)=>{
_this.opt.videoLoading = false;
if (_this.opt.url.indexOf('.hd') === -1) {
_this.opt.url = _this.opt.url.replace('.live', '.hd.live');
hdDom.innerHTML = _this.opt.url.indexOf('.hd') === -1 ? '标清' : '高清';
} else {
_this.opt.url = _this.opt.url.replace('.hd.live', '.live');
hdDom.innerHTML = _this.opt.url.indexOf('.hd') === -1 ? '标清' : '高清';
}
_this.play(_this.opt.url)
})
.catch((error)=>{
console.log("error",error)
})
}
//iframe.src = domain +"/ezopen/h5/iframe?url=" + _this.opt.url.replace('.hd.live', '.live') + "&autoplay=1&audio=" + _this.opt.audio + "&accessToken=" + _this.opt.accessToken + "&templete=" + 0;
};
rightContros.appendChild(hdDom);
}
if (matchFooterOpt().fullScreenModule) {
// 声音控制
var openSoundDOM = document.createElement('span');
openSoundDOM.setAttribute('class', 'hide');
openSoundDOM.setAttribute('id', 'ezuikit-open-sound');
openSoundDOM.setAttribute('title', '打开声音');
openSoundDOM.setAttribute('style', 'vertical-align: top;');
openSoundDOM.innerHTML = '<svg t="1590476263239" class="icon" viewBox="0 0 1178 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2273" width="16" height="16"><path d="M665.6 51.2 665.6 51.2c-10.24-30.72-40.96-51.2-71.68-51.2-5.12 0-15.36 0-20.48 5.12l0 0L358.4 153.6 51.2 209.92l0 0C20.48 220.16 0 250.88 0 281.6 0 286.72 0 291.84 0 307.2l0 0 0 409.6 0 0c0 15.36 0 20.48 0 25.6 0 30.72 20.48 61.44 51.2 71.68l0 0L358.4 870.4l97.28 71.68 107.52 76.8 0 0c5.12 5.12 15.36 5.12 25.6 5.12 40.96 0 76.8-35.84 76.8-76.8 0-10.24 0-10.24 0-25.6l0 0L665.6 51.2zM563.2 870.4l-153.6-102.4-307.2-51.2L102.4 307.2l307.2-51.2 153.6-102.4L563.2 870.4z" p-id="2274" fill="#FF0000"></path><path d="M1049.6 537.6l112.64-112.64c20.48-20.48 20.48-56.32 0-76.8-20.48-20.48-56.32-20.48-76.8 0L972.8 460.8l-112.64-112.64c0 0 0 0 0 0-20.48-20.48-56.32-20.48-76.8 0 0 0 0 0 0 0-20.48 20.48-20.48 56.32 0 76.8l112.64 112.64-112.64 112.64c-20.48 20.48-20.48 56.32 0 76.8 20.48 20.48 56.32 20.48 76.8 0L972.8 614.4l112.64 112.64c20.48 20.48 56.32 20.48 76.8 0s20.48-56.32 0-76.8L1049.6 537.6z" p-id="2275" fill="#FF0000"></path></svg>';
openSoundDOM.onclick = function () {
_this.openSound(0);
openSoundDOM.setAttribute('class', 'hide');
closeSoundDOM.setAttribute('class', '');
}; // 声音控制
var closeSoundDOM = document.createElement('span');
openSoundDOM.setAttribute('id', 'ezuikit-close-sound');
closeSoundDOM.setAttribute('class', 'hide');
closeSoundDOM.setAttribute('title', '关闭声音');
closeSoundDOM.setAttribute('style', 'vertical-align: top;');
closeSoundDOM.innerHTML = '<svg t="1590414410633" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="20545" width="16" height="16"><path d="M840.533333 98.133333c-17.066667-17.066667-42.666667-17.066667-59.733333 0-17.066667 17.066667-17.066667 42.666667 0 59.733334C883.2 256 938.666667 392.533333 938.666667 533.333333c0 140.8-55.466667 277.333333-157.866667 375.466667-17.066667 17.066667-17.066667 42.666667 0 59.733333 8.533333 8.533333 21.333333 12.8 29.866667 12.8 8.533333 0 21.333333-4.266667 29.866666-12.8 115.2-110.933333 183.466667-268.8 183.466667-435.2 0-166.4-68.266667-324.266667-183.466667-435.2zM571.733333 12.8c-17.066667-8.533333-34.133333-4.266667-46.933333 8.533333L281.6 256H42.666667c-25.6 0-42.666667 17.066667-42.666667 42.666667v426.666666c0 25.6 17.066667 42.666667 42.666667 42.666667h238.933333l243.2 234.666667c8.533333 8.533333 17.066667 12.8 29.866667 12.8 4.266667 0 12.8 0 17.066666-4.266667 17.066667-8.533333 25.6-21.333333 25.6-38.4V51.2c0-17.066667-8.533333-34.133333-25.6-38.4zM512 870.4l-183.466667-179.2c-8.533333-4.266667-17.066667-8.533333-29.866666-8.533333H85.333333V341.333333h213.333334c12.8 0 21.333333-4.266667 29.866666-12.8L512 153.6v716.8z" p-id="20546" fill="#ffffff"></path><path d="M759.466667 349.866667c-12.8-21.333333-38.4-25.6-59.733334-8.533334-21.333333 12.8-25.6 38.4-8.533333 59.733334 21.333333 29.866667 34.133333 76.8 34.133333 123.733333 0 46.933333-12.8 93.866667-34.133333 123.733333-12.8 21.333333-8.533333 46.933333 8.533333 59.733334 8.533333 4.266667 17.066667 8.533333 25.6 8.533333 12.8 0 25.6-4.266667 34.133334-17.066667 34.133333-46.933333 51.2-106.666667 51.2-174.933333 0-68.266667-17.066667-128-51.2-174.933333z" p-id="20547" fill="#ffffff"></path></svg>';
closeSoundDOM.onclick = function () {
_this.closeSound(0);
openSoundDOM.setAttribute('class', '');
closeSoundDOM.setAttribute('class', 'hide');
};
rightContros.appendChild(openSoundDOM);
rightContros.appendChild(closeSoundDOM);
} // 根据当前音频配置展示
if (_this.opt.audio == 1) {
closeSoundDOM.setAttribute('class', '');
} else {
openSoundDOM.setAttribute('class', '');
_this.closeSound(0);
}
if (matchFooterOpt().fullScreenModule) {
// 全屏控制
var fullScreenDOM = document.createElement('span');
fullScreenDOM.setAttribute('title', '全屏');
fullScreenDOM.setAttribute('style', 'vertical-align: top;');
fullScreenDOM.innerHTML = '<svg id="fullScreen" t="1578020167938" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5035" width="16" height="16"> <path d="M348.373333 625.706667l-128 128-64 64v-128a33.28 33.28 0 0 0-35.413333-35.413334A33.493333 33.493333 0 0 0 85.333333 689.706667v213.333333A33.706667 33.706667 0 0 0 120.96 938.666667h213.333333a35.626667 35.626667 0 0 0 0-71.04h-128l64-64 128-128a35.2 35.2 0 0 0-49.92-49.92zM206.293333 156.373333h128a33.28 33.28 0 0 0 35.413334-35.413333A33.493333 33.493333 0 0 0 334.293333 85.333333H113.706667c-7.04 0-14.08 7.04-21.333334 14.293334a26.026667 26.026667 0 0 0-7.04 21.333333v213.333333a33.493333 33.493333 0 0 0 35.626667 35.413334 33.28 33.28 0 0 0 35.413333-35.413334v-128l192 192a35.2 35.2 0 0 0 49.92-49.92zM903.04 85.333333h-213.333333a33.493333 33.493333 0 0 0-35.413334 35.626667 33.28 33.28 0 0 0 35.413334 35.413333h128l-64 64-128 128a35.2 35.2 0 0 0 49.92 49.92l128-128 64-64v128a35.626667 35.626667 0 0 0 71.04 0v-213.333333A33.706667 33.706667 0 0 0 903.04 85.333333zM903.04 654.293333a33.28 33.28 0 0 0-35.413333 35.413334v128l-64-64-128-128a35.2 35.2 0 0 0-49.92 49.92l128 128 64 64h-128a35.626667 35.626667 0 0 0 0 71.04h213.333333A33.706667 33.706667 0 0 0 938.666667 903.04v-213.333333a33.493333 33.493333 0 0 0-35.626667-35.413334z" p-id="5036" fill="#ffffff"></path></svg>';
fullScreenDOM.onclick = function () {
_this.fullScreen();
};
rightContros.appendChild(fullScreenDOM);
}
}
if (matchFooterOpt().talkModule) {
// 对讲
var startTalkDOM = document.createElement('div');
var stopTalkDOM = document.createElement('div');
startTalkDOM.setAttribute("class", "ptp-talk off");
startTalkDOM.innerHTML = '<span title="对讲">' + '<svg t="1581930496966" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1641" width="16" height="16">' + ' <path' + ' d="M715.648 647.872c-30.208-22.336-61.568 39.36-100.992 77.44-39.36 38.08-34.112 31.488-123.392-17.088S311.488 540.224 280 491.648C248.448 443.072 265.472 424.704 265.472 424.704s78.72-62.976 97.152-81.344c18.368-18.368 13.12-30.208 13.12-30.208l-128.64-190.144c-23.616-5.184-64.32 5.12-128.576 57.6C54.208 233.088 30.592 353.856 151.296 575.68c120.768 221.824 347.84 330.752 485.568 374.08 137.856 43.328 228.416-61.696 249.408-103.68 21.056-41.984 13.12-85.312 13.12-85.312S745.856 670.208 715.648 647.872z"' + ' p-id="1642" fill="#ffffff"></path>' + ' <path' + ' d="M715.328 64C580.992 64 472.192 172.864 472.192 307.2s108.8 243.2 243.136 243.2 243.2-108.864 243.2-243.2S849.6 64 715.328 64zM715.328 461.056c-84.992 0-153.856-68.864-153.856-153.856s68.864-153.856 153.856-153.856 153.856 68.928 153.856 153.856S800.32 461.056 715.328 461.056z"' + ' p-id="1643" fill="#ffffff"></path>' + ' <path' + ' d="M777.472 277.376c-18.176 0-32.96-14.784-32.96-33.024 0-8.448 3.136-16.064 8.32-21.888-11.52-5.12-24.128-8-37.568-8-51.2 0-92.672 41.472-92.672 92.736s41.472 92.736 92.672 92.736S808.064 358.4 808.064 307.2c0-13.696-3.072-26.688-8.384-38.4C793.728 274.112 786.048 277.376 777.472 277.376zM715.328 340.928c-18.624 0-33.664-15.104-33.664-33.728 0-18.624 15.04-33.728 33.664-33.728 18.688 0 33.728 15.104 33.728 33.728C749.056 325.824 734.016 340.928 715.328 340.928z"' + ' p-id="1644" fill="#ffffff"></path>' + ' </svg>' + ' </span>' + ' <span>开启对讲</span>';
startTalkDOM.onclick = function () {
console.log("EZUIKit.state.countTimer", EZUIKit.state.countTimer);
if (EZUIKit.state.countTimer) {
window.layer.msg("语音设备正忙，请稍后重试");
return false;
}
countTime('add', 0);
console.log("开始对讲，关闭声音");
_this.closeSound(0);
console.log(_this.opt);
_this.startTalk();
this.setAttribute("class", "ptp-talk off hide");
stopTalkDOM.setAttribute("class", "ptp-talk on");
};
stopTalkDOM.setAttribute("class", "ptp-talk on hide");
stopTalkDOM.innerHTML = '<span title="对讲">' + ' <svg t="1581930496966" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1641" width="16" height="16">' + ' <path' + ' d="M715.648 647.872c-30.208-22.336-61.568 39.36-100.992 77.44-39.36 38.08-34.112 31.488-123.392-17.088S311.488 540.224 280 491.648C248.448 443.072 265.472 424.704 265.472 424.704s78.72-62.976 97.152-81.344c18.368-18.368 13.12-30.208 13.12-30.208l-128.64-190.144c-23.616-5.184-64.32 5.12-128.576 57.6C54.208 233.088 30.592 353.856 151.296 575.68c120.768 221.824 347.84 330.752 485.568 374.08 137.856 43.328 228.416-61.696 249.408-103.68 21.056-41.984 13.12-85.312 13.12-85.312S745.856 670.208 715.648 647.872z"' + ' p-id="1642" fill="#ff0000"></path>' + ' <path' + ' d="M715.328 64C580.992 64 472.192 172.864 472.192 307.2s108.8 243.2 243.136 243.2 243.2-108.864 243.2-243.2S849.6 64 715.328 64zM715.328 461.056c-84.992 0-153.856-68.864-153.856-153.856s68.864-153.856 153.856-153.856 153.856 68.928 153.856 153.856S800.32 461.056 715.328 461.056z"' + ' p-id="1643" fill="#ff0000"></path>' + ' <path' + ' d="M777.472 277.376c-18.176 0-32.96-14.784-32.96-33.024 0-8.448 3.136-16.064 8.32-21.888-11.52-5.12-24.128-8-37.568-8-51.2 0-92.672 41.472-92.672 92.736s41.472 92.736 92.672 92.736S808.064 358.4 808.064 307.2c0-13.696-3.072-26.688-8.384-38.4C793.728 274.112 786.048 277.376 777.472 277.376zM715.328 340.928c-18.624 0-33.664-15.104-33.664-33.728 0-18.624 15.04-33.728 33.664-33.728 18.688 0 33.728 15.104 33.728 33.728C749.056 325.824 734.016 340.928 715.328 340.928z"' + ' p-id="1644" fill="#ff0000"></path>' + ' </svg>' + ' </span>' + '<span>关闭对讲</span>';
stopTalkDOM.onclick = function () {
console.log(_this.opt);
_this.stopTalk();
countTime('destory', 0);
_this.openSound(0);
this.setAttribute("class", "ptp-talk on hide");
startTalkDOM.setAttribute("class", "ptp-talk off");
};
footerContainer.appendChild(startTalkDOM);
footerContainer.appendChild(stopTalkDOM);
}
if (matchFooterOpt().broadcastModule) {
var startBroadcastDOM = document.createElement('div');
var stopBroadcastDOM = document.createElement('div');
startBroadcastDOM.setAttribute("class", 'broadcast off');
stopBroadcastDOM.setAttribute("class", "broadcast on hide");
startBroadcastDOM.innerHTML = ' <span title="语音播报">' + ' <svg t="1583561695846" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1126" width="16" height="16">' + ' <path' + ' d="M513.82044445 964.38044445c-8.192 0-15.47377778-2.73066667-21.84533334-8.192 0 0-46.42133333-41.87022222-99.21422222-86.47111112-89.20177778-73.728-117.41866667-88.29155555-123.79022222-90.112H35.04355555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666V271.70133333c0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666666H246.21511111c7.28177778-2.73066667 37.31911111-15.47377778 137.44355556-91.02222222 58.25422222-43.69066667 111.04711111-86.47111111 111.04711111-86.47111112 5.46133333-4.55111111 12.74311111-7.28177778 20.02488889-7.28177778 4.55111111 0 10.01244445 0.91022222 14.56355555 3.6408889 10.92266667 5.46133333 18.20444445 17.29422222 18.20444445 30.03733333v837.40444444c0 12.74311111-7.28177778 25.48622222-19.11466667 30.94755556-5.46133333 1.82044445-10.01244445 2.73066667-14.56355555 2.73066667zM270.79111111 724.992c19.11466667 0 48.24177778 8.192 167.48088889 106.496 16.384 13.65333333 33.67822222 28.21688889 51.88266667 43.69066667l5.46133333 4.55111111V139.71911111l-5.46133333 3.64088889c-22.75555555 17.29422222-44.60088889 34.58844445-65.536 50.06222222C293.54666667 291.72622222 264.41955555 299.008 245.30488889 299.008H82.37511111c-20.02488889 0-21.84533333 12.74311111-21.84533333 26.39644445V694.04444445c0 23.66577778 6.37155555 30.03733333 28.21688889 30.03733333h180.224l1.82044444 0.91022222z m520.64711111 162.01955555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666 0-11.83288889 8.192-20.02488889 16.384-24.576 112.86755555-67.35644445 182.04444445-191.14666667 182.04444444-324.03911111 0-132.89244445-70.08711111-256.68266667-182.04444444-324.03911111-10.01244445-5.46133333-15.47377778-14.56355555-15.47377778-24.576 0-14.56355555 11.83288889-27.30666667 26.39644445-27.30666667 5.46133333 0 10.01244445 1.82044445 16.384 5.46133333 128.34133333 76.45866667 207.53066667 218.45333333 207.53066666 369.55022222 0 152.00711111-80.09955555 293.09155555-208.44088889 369.55022223-6.37155555 5.46133333-10.92266667 7.28177778-16.384 7.28177777z m-90.112-152.91733333c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666667 0-10.01244445 4.55111111-18.20444445 12.74311111-23.66577777 61.89511111-34.58844445 100.12444445-100.12444445 100.12444444-171.12177778 0-70.08711111-37.31911111-134.71288889-96.48355555-170.21155555-8.192-4.55111111-12.74311111-13.65333333-12.74311111-23.66577778 0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666667 4.55111111 0 11.83288889 2.73066667 15.47377778 4.55111111 74.63822222 44.60088889 121.96977778 127.43111111 121.96977778 215.72266667 0 90.112-48.24177778 173.85244445-125.61066667 218.45333333-1.82044445 0-9.10222222 4.55111111-15.47377778 4.55111111z"' + ' fill="#ffffff" p-id="1127"></path>' + ' </svg>' + '</span>' + '<span>语音播报</span>';
startBroadcastDOM.onclick = function () {
this.setAttribute("class", "broadcast off hide");
stopBroadcastDOM.setAttribute("class", "broadcast on");
};
stopBroadcastDOM.innerHTML = '<div class="pop-hover">' + ' <div class="pop-hover-content">' + ' <div class="vioce-list" id="voice-list">' + ' <ul class="voice-list-ul">' + ' </ul>' + ' <div id="voice-list-end"></div>' + ' </div>' + ' <div id="voice-custom" style="text-align: center;">自定义语音</div>' + ' </div>' + '</div>' + '<span title="语音播报">' + ' <svg t="1583561695846" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1126" width="16" height="16">' + ' <path' + ' d="M513.82044445 964.38044445c-8.192 0-15.47377778-2.73066667-21.84533334-8.192 0 0-46.42133333-41.87022222-99.21422222-86.47111112-89.20177778-73.728-117.41866667-88.29155555-123.79022222-90.112H35.04355555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666V271.70133333c0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666666H246.21511111c7.28177778-2.73066667 37.31911111-15.47377778 137.44355556-91.02222222 58.25422222-43.69066667 111.04711111-86.47111111 111.04711111-86.47111112 5.46133333-4.55111111 12.74311111-7.28177778 20.02488889-7.28177778 4.55111111 0 10.01244445 0.91022222 14.56355555 3.6408889 10.92266667 5.46133333 18.20444445 17.29422222 18.20444445 30.03733333v837.40444444c0 12.74311111-7.28177778 25.48622222-19.11466667 30.94755556-5.46133333 1.82044445-10.01244445 2.73066667-14.56355555 2.73066667zM270.79111111 724.992c19.11466667 0 48.24177778 8.192 167.48088889 106.496 16.384 13.65333333 33.67822222 28.21688889 51.88266667 43.69066667l5.46133333 4.55111111V139.71911111l-5.46133333 3.64088889c-22.75555555 17.29422222-44.60088889 34.58844445-65.536 50.06222222C293.54666667 291.72622222 264.41955555 299.008 245.30488889 299.008H82.37511111c-20.02488889 0-21.84533333 12.74311111-21.84533333 26.39644445V694.04444445c0 23.66577778 6.37155555 30.03733333 28.21688889 30.03733333h180.224l1.82044444 0.91022222z m520.64711111 162.01955555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666 0-11.83288889 8.192-20.02488889 16.384-24.576 112.86755555-67.35644445 182.04444445-191.14666667 182.04444444-324.03911111 0-132.89244445-70.08711111-256.68266667-182.04444444-324.03911111-10.01244445-5.46133333-15.47377778-14.56355555-15.47377778-24.576 0-14.56355555 11.83288889-27.30666667 26.39644445-27.30666667 5.46133333 0 10.01244445 1.82044445 16.384 5.46133333 128.34133333 76.45866667 207.53066667 218.45333333 207.53066666 369.55022222 0 152.00711111-80.09955555 293.09155555-208.44088889 369.55022223-6.37155555 5.46133333-10.92266667 7.28177778-16.384 7.28177777z m-90.112-152.91733333c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666667 0-10.01244445 4.55111111-18.20444445 12.74311111-23.66577777 61.89511111-34.58844445 100.12444445-100.12444445 100.12444444-171.12177778 0-70.08711111-37.31911111-134.71288889-96.48355555-170.21155555-8.192-4.55111111-12.74311111-13.65333333-12.74311111-23.66577778 0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666667 4.55111111 0 11.83288889 2.73066667 15.47377778 4.55111111 74.63822222 44.60088889 121.96977778 127.43111111 121.96977778 215.72266667 0 90.112-48.24177778 173.85244445-125.61066667 218.45333333-1.82044445 0-9.10222222 4.55111111-15.47377778 4.55111111z"' + ' fill="#ff0000" p-id="1127"></path>' + ' </svg>' + '</span>' + '<span>语音播报</span>'; // //自定义语音唤起
// document.getElementById("voice-custom").onclick = function(){
// console.log("显示自定义语音");
// }
stopBroadcastDOM.onclick = function () {
this.setAttribute("class", "broadcast on hide");
startBroadcastDOM.setAttribute("class", "broadcast off");
};
footerContainer.appendChild(startBroadcastDOM);
footerContainer.appendChild(stopBroadcastDOM); // 召唤自定义语言
document.getElementById("voice-custom").onclick = function () {
console.log("显示自定义语音");
startSpeakDOM.setAttribute('class', 'speak off');
}; // 获取语音列表
fetchVoiceList(0);
function fetchVoiceList(page) {
function apiSuccess(data) {
console.log("data", data);
if (data.code == 200) {
randerVoliceList(data.data, 5);
EZUIKit.state.page = data.page.page; // 如果用户语音列表为空
if (page == 0 && data.data.length == 0 && !EZUIKit.state.fetchDefaultList) {
// 获取用户语音为空
EZUIKit.state.fetchDefaultList = true;
fetchVoiceList(0);
}
}
}
function apiError(err) {
console.log("err", err);
}
request( domain + '/api/lapp/voice/query', 'POST', {
accessToken: _this.opt.accessToken,
pageStart: page,
pageSize: EZUIKit.state.pageSize,
default: EZUIKit.state.fetchDefaultList ? 'true' : 'false'
}, '', apiSuccess, apiError);
}
function randerVoliceList(data) {
console.log("renderVoliceList", data);
if (data && data.length > 0) {
for (var i = 0; i < data.length; i++) {
var voiceItem = document.createElement('li');
voiceItem.innerHTML = "<li class='voice-item' id='voice-item-" + i + "' data-time=" + (data[i]["duration"] || 20) + " data-url=" + data[i]["fileUrl"] + ">" + (data[i]["voiceName"].length > 10 ? data[i]["voiceName"].substr(0, 10) + "..." : data[i]["voiceName"]) + "</li>";
document.getElementsByClassName('voice-list-ul')[0].append(voiceItem); // "<li class='voice-item' id='voice-item-" + i + "' data-time=" + (data[i]["duration"] || 20) + " data-url=" + data[i]["fileUrl"] + ">" + (data[i]["voiceName"].length > 10 ? (data[i]["voiceName"].substr(0, 10) + "...") : data[i]["voiceName"]) + "</li>";
// $("#voice-list ul").append("<li class='voice-item' id='voice-item-" + i + "' data-time=" + (data[i]["duration"] || 20) + " data-url=" + data[i]["fileUrl"] + ">" + (data[i]["voiceName"].length > 10 ? (data[i]["voiceName"].substr(0, 10) + "...") : data[i]["voiceName"]) + "</li>");
voiceItem.onclick = function (e) {
console.log("点击元素", e.target, e.target.dataset.url);
var voiceUrl = e.target.dataset.url;
var time = e.target.dataset.time;
playListOfVoice(voiceUrl, time);
};
}
if (data.length === EZUIKit.state.pageSize) {
document.getElementById('voice-list-end').innerHTML = "向下滚动加载更多";
} else {
document.getElementById('voice-list-end').innerHTML = "没有更多数据了";
}
}
}
function playListOfVoice(voiceUrl, time) {
console.log("播放语音", voiceUrl, time); // decoder && decoder.closeSound(0);
function apiSuccess(data) {
console.log("data.data", data.data);
if (data.code == 200) {
// $("#startBroadcast").show();
// $("#stopBroadcast").hide();
countTime('sub', parseInt(time));
} else if (data.code == "10001") {
window.layer.msg("未找到当前语音");
} else {
window.layer.msg(data.msg || '发送失败，请稍后再试');
} // padding = false;
}
function apiError(err) {
console.log("err", err);
}
request( domain + '/api/lapp/voice/send', 'POST', {
accessToken: _this.opt.accessToken,
deviceSerial: _this.opt.deviceSerial,
channelNo: _this.opt.channelNo,
fileUrl: voiceUrl
}, '', apiSuccess, apiError);
} // 自定义语音
// 对讲
var startSpeakDOM = document.createElement('div');
var stopSpeakDOM = document.createElement('div');
startSpeakDOM.setAttribute('class', 'speak off hide');
stopSpeakDOM.setAttribute('class', 'speak on hide');
startSpeakDOM.setAttribute('id', 'startSpeak');
stopSpeakDOM.setAttribute('id', 'stopSpeak');
startSpeakDOM.innerHTML = '<span title="按住说话">' + ' <svg t="1581994757678" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1639" width="16" height="16">' + ' <path' + ' d="M757.059829 393.846154v-52.512821h262.564103v52.512821H757.059829z m-420.102564 481.367521v96.273504h175.042735a8.752137 8.752137 0 0 1 8.752137 8.752137v35.008547a8.752137 8.752137 0 0 1-8.752137 8.752137H109.401709a8.752137 8.752137 0 0 1-8.752136-8.752137v-35.008547a8.752137 8.752137 0 0 1 8.752136-8.752137h175.042735v-96.273504C129.767932 875.213675 4.376068 749.821812 4.376068 595.145299V463.863248a26.25641 26.25641 0 1 1 52.512821 0v113.777778c0 140.174222 113.637744 253.811966 253.811966 253.811965s253.811966-113.637744 253.811966-253.811965V463.863248a26.25641 26.25641 0 1 1 52.51282 0v131.282051c0 154.676513-125.391863 280.068376-280.068376 280.068376z m-26.25641-96.273504c-111.178393 0-201.299145-90.120752-201.299146-201.299145V201.299145C109.401709 90.120752 199.522462 0 310.700855 0s201.299145 90.120752 201.299145 201.299145v376.341881c0 111.178393-90.120752 201.299145-201.299145 201.299145z m691.418803-280.068376H757.059829v-52.512821h245.059829v52.512821z m-17.504273 105.025641H757.059829v-52.512821h227.555556v52.512821z m-17.504274 105.025641H757.059829v-52.512821h210.051282v52.512821z m-8.752137 105.025641H757.059829v-52.512821h201.299145v52.512821z m-17.504273 105.025641H757.059829v-52.512821h183.794872v52.512821z m-26.25641 105.025641H757.059829v-52.512821h157.538462v52.512821z"' + ' p-id="1640" fill="#ffffff"></path>' + ' </svg>' + '</span>' + '<span>按住说话</span>';
stopSpeakDOM.innerHTML = '<span title="按住说话">' + '<svg t="1581994757678" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1639" width="16" height="16">' + ' <path' + ' d="M757.059829 393.846154v-52.512821h262.564103v52.512821H757.059829z m-420.102564 481.367521v96.273504h175.042735a8.752137 8.752137 0 0 1 8.752137 8.752137v35.008547a8.752137 8.752137 0 0 1-8.752137 8.752137H109.401709a8.752137 8.752137 0 0 1-8.752136-8.752137v-35.008547a8.752137 8.752137 0 0 1 8.752136-8.752137h175.042735v-96.273504C129.767932 875.213675 4.376068 749.821812 4.376068 595.145299V463.863248a26.25641 26.25641 0 1 1 52.512821 0v113.777778c0 140.174222 113.637744 253.811966 253.811966 253.811965s253.811966-113.637744 253.811966-253.811965V463.863248a26.25641 26.25641 0 1 1 52.51282 0v131.282051c0 154.676513-125.391863 280.068376-280.068376 280.068376z m-26.25641-96.273504c-111.178393 0-201.299145-90.120752-201.299146-201.299145V201.299145C109.401709 90.120752 199.522462 0 310.700855 0s201.299145 90.120752 201.299145 201.299145v376.341881c0 111.178393-90.120752 201.299145-201.299145 201.299145z m691.418803-280.068376H757.059829v-52.512821h245.059829v52.512821z m-17.504273 105.025641H757.059829v-52.512821h227.555556v52.512821z m-17.504274 105.025641H757.059829v-52.512821h210.051282v52.512821z m-8.752137 105.025641H757.059829v-52.512821h201.299145v52.512821z m-17.504273 105.025641H757.059829v-52.512821h183.794872v52.512821z m-26.25641 105.025641H757.059829v-52.512821h157.538462v52.512821z"' + ' p-id="1640" fill="#ff0000"></path>' + '</svg>' + '</span>' + '<span>松开发送</span>';
footerContainer.appendChild(startSpeakDOM);
footerContainer.appendChild(stopSpeakDOM);
document.getElementById("voice-list").onscroll = function (e) {
var sum = this.scrollHeight;
console.log("sum", sum, this.scrollTop, document.getElementById("voice-list").clientHeight);
if (sum <= this.scrollTop + this.clientHeight) {
console.log("拖动到底，执行加载", EZUIKit.state.page);
fetchVoiceList(++EZUIKit.state.page);
}
}; // $("#voice-list").unbind("scroll").bind("scroll", function (e) {
// // console.log("e",e,this.scrollHeight, $(this).scrollTop() + $(this).height())
// var sum = this.scrollHeight;
// if (sum <= $(this).scrollTop() + $(this).height()) {
// console.log("拖动到底，执行加载", page);
// fetchVoiceList(++page);
// }
// loading = false;
// });
// time-area
var timeAreaDOM = document.createElement('div');
timeAreaDOM.setAttribute('class', 'time-area');
timeAreaDOM.setAttribute('id', 'time-area');
timeAreaDOM.innerHTML = '00:00';
footerContainer.appendChild(timeAreaDOM); // 按住说话
var recorder;
document.getElementById('startSpeak').onmousedown = function () {
if (EZUIKit.state.countTimer) {
window.layer.msg("语音设备正忙，请稍后重试");
return false;
}
console.log("按住说话");
startSpeakDOM.setAttribute('class', 'speak off hide');
stopSpeakDOM.setAttribute('class', 'speak on'); // console.log("startRecording",startRecording);
// startRecording();
voiceInit();
countTime('add', 0);
setTimeout(function () {
EZUIKit.state.recodeTime = 0;
startRecording();
}, 1000);
if (EZUIKit.state.recodeTimer) {
// 先清空计数器
clearInterval(EZUIKit.state.recodeTimer);
}
EZUIKit.state.recodeTimer = setInterval(function () {
if (EZUIKit.state.recodeTime >= 59) {
_this.stopTalk();
countTime('destory', 0);
this.setAttribute("class", "ptp-talk on hide");
startTalkDOM.setAttribute("class", "ptp-talk off");
window.layer.msg("不超过1分钟");
} else {
EZUIKit.state.recodeTime = EZUIKit.state.recodeTime + 1;
}
}, 1000);
/** 录音控制 */
var audio_context;
function startUserMedia(stream) {
var input = audio_context.createMediaStreamSource(stream);
recorder = new window.Recorder(input);
}
function startRecording() {
recorder && recorder.record();
}
function stopRecording() {
recorder && recorder.stop();
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);
window.layer.msg('No web audio support in this browser!');
}
navigator.getUserMedia({
audio: true
}, startUserMedia, function (e) {
console.log('No live audio input: ' + e);
});
}
;
}; // 松开发送
document.getElementById('stopSpeak').onmouseup = function () {
console.log("松开发送");
stopSpeakDOM.setAttribute('class', 'speak on hide');
stopSpeakFun();
function stopSpeakFun() {
countTime('destory', 0);
if (EZUIKit.state.recodeTime < 1) {
window.layer.msg("说话时间过短");
clearInterval(EZUIKit.state.recodeTimer);
return false;
}
clearInterval(EZUIKit.state.recodeTimer);
wavUpload();
}
function wavUpload() {
try {
recorder && recorder.stop(); // createAudioDom();
recorder && recorder.exportWAV(function (wav_file) {
console.log("wav_file", wav_file);
if (wav_file.size < 1000) {
window.layer.msg("录音失败，请重试"); // recodeTime = 0;
EZUIKit.state.recodeTime = 0;
return false;
} // 测试
countTime('sub', EZUIKit.state.recodeTime + 2); // 延时
var formdata = new FormData(); // form 表单 {key:value}
formdata.append("voiceFile", wav_file); // form input type="file"
formdata.append("accessToken", _this.opt.accessToken);
formdata.append("deviceSerial", _this.opt.deviceSerial);
formdata.append("channelNo", _this.opt.channelNo); // padding = true;
function apiSuccess(data) {
console.log("data.data", data.data);
if (data.code == 200) {
// $("#startBroadcast").show();
// $("#stopBroadcast").hide();
countTime('sub', EZUIKit.state.recodeTime + 2);
} else if (data.code == "10001") {
window.layer.msg("未找到当前语音");
} else {
window.layer.msg(data.msg || '发送失败，请稍后再试');
} // padding = false;
}
function apiError(err) {
console.log("err", err);
}
request(domain + '/api/lapp/voice/sendonce', 'POST', {
voiceFile: wav_file,
accessToken: _this.opt.accessToken,
deviceSerial: _this.opt.deviceSerial,
channelNo: _this.opt.channelNo
}, '', apiSuccess, apiError);
});
recorder && recorder.clear();
} catch (err) {
console.log(err);
}
}
};
}
/* 时间计数 */
function countTime(type, start) {
clearInterval(EZUIKit.state.countTimer);
if (type === 'add') {
var i = start;
EZUIKit.state.countTimer = setInterval(function () {
++i;
document.getElementById("time-area").innerHTML = formatSeconds(i);
}, 1000);
} else if (type === 'sub') {
var i = start;
EZUIKit.state.countTimer = setInterval(function () {
if (i > 0) {
i--;
document.getElementById("time-area").innerHTML = formatSeconds(i);
} else {
clearInterval(EZUIKit.state.countTimer);
EZUIKit.state.countTimer = undefined;
console.log("倒计时结束，开启声音"); // decoder.openSound(0);
}
}, 1000);
} else if (type === 'destory') {
clearInterval(EZUIKit.state.countTimer);
EZUIKit.state.countTimer = undefined;
document.getElementById("time-area").innerHTML = '00:00';
} //将秒数转换为时分秒格式
function formatSeconds(value) {
var theTime = parseInt(value); // 秒
var middle = 0; // 分
var hour = 0; // 小时
var secondV = '00';
var minV = '00';
var hourV = '00';
if (theTime > 59) {
middle = parseInt(theTime / 60);
theTime = parseInt(theTime % 60);
if (middle > 59) {
hour = parseInt(middle / 60);
middle = parseInt(middle % 60);
}
}
secondV = parseInt(theTime) > 9 ? parseInt(theTime) : '0' + parseInt(theTime);
minV = parseInt(middle) > 9 ? parseInt(middle) : '0' + parseInt(middle);
hourV = parseInt(hour) > 9 ? parseInt(hour) : '0' + parseInt(hour);
if (hour > 0) {
return hourV + ':' + minV + ':' + secondV;
} else if (middle > 0) {
return minV + ':' + secondV;
} else {
return '00:' + secondV;
}
}
}
/* 将秒数转换为时分秒格式 */
function formatSeconds(value) {
var theTime = parseInt(value); // 秒
var middle = 0; // 分
var hour = 0; // 小时
var secondV = '00';
var minV = '00';
var hourV = '00';
if (theTime > 59) {
middle = parseInt(theTime / 60);
theTime = parseInt(theTime % 60);
if (middle > 59) {
hour = parseInt(middle / 60);
middle = parseInt(middle % 60);
}
}
secondV = parseInt(theTime) > 9 ? parseInt(theTime) : '0' + parseInt(theTime);
minV = parseInt(middle) > 9 ? parseInt(middle) : '0' + parseInt(middle);
hourV = parseInt(hour) > 9 ? parseInt(hour) : '0' + parseInt(hour);
if (hour > 0) {
return hourV + ':' + minV + ':' + secondV;
} else if (middle > 0) {
return minV + ':' + secondV;
} else {
return '00:' + secondV;
}
}
}
}
})
})
// iframe 传递数据
var _this = this;
window.addEventListener("message", function (event) {
console.log("EZUIKitPlayer收到反馈", event);
var origin = event.origin;
var id = _this.opt.id;
if (event.data.type) {
switch (event.data.type) {
case 'openSound':
if (id == event.data.id && params.openSoundCallBack) {
params.openSoundCallBack(event.data);
}
break;
case 'closeSound':
if (id == event.data.id && params.closeSoundCallBack) {
params.closeSoundCallBack(event.data);
}
break;
case 'capturePicture':
if (id == event.data.id && params.capturePictureCallBack) {
params.capturePictureCallBack(event.data);
}
break;
case 'startSave':
if (id == event.data.id && params.startSaveCallBack) {
params.startSaveCallBack(event.data);
}
break;
case 'stopSave':
if (id == event.data.id && params.stopSaveCallBack) {
params.stopSaveCallBack(event.data);
}
break;
case 'fullScreen':
if (id == event.data.id && params.fullScreenCallBack) {
params.fullScreenCallBack(event.data);
}
break;
case 'getOSDTime':
if (id == event.data.id && params.getOSDTimeCallBack) {
params.getOSDTimeCallBack(event.data);
}
break;
case 'handleSuccess':
if (id == event.data.id && params.handleSuccess) {
params.handleSuccess(event.data);
}
break;
case 'handleError':
if (id == event.data.id && params.handleError) {
params.handleError(event.data);
}
break;
case 'dblclick':
if (id == event.data.id && _this.opt.bSupporDoubleClickFull) {
if(_this.opt.fullScreenStatus === 0){
_this.fullScreen();
} else {
_this.cancelFullScreen();
}
}
break;
}
}
});
// 全屏变化回调
function fullscreenchange(data) {
_this.opt.fullScreenStatus = data ? 1 : 0;
if (params.fullScreenChangeCallBack) {
params.fullScreenChangeCallBack({data:data,id: _this.opt.id});
}
}
if (typeof document.fullScreen !== "undefined") {
document.addEventListener("fullscreenchange", function() {
var e = document.fullscreen || false;
fullscreenchange(e)
})
} else if (typeof document.webkitIsFullScreen !== "undefined") {
document.addEventListener("webkitfullscreenchange", function() {
var e = document.webkitIsFullScreen || false;
fullscreenchange(e)
})
} else if (typeof document.mozFullScreen !== "undefined") {
document.addEventListener("mozfullscreenchange", function() {
var e = document.mozFullScreen || false;
fullscreenchange(e)
})
}
}; // 播放相关API
EZUIKitPlayer.prototype.play = function (data) {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
if (typeof data === 'object' && data.url) {
this.opt.url = data.url;
}
if (typeof data === 'object' && data.accessToken) {
this.opt.accessToken = data.accessToken;
}
if (typeof data === 'string') {
this.opt.url = data;
}
player.postMessage({
action: "play",
accessToken: this.opt.accessToken,
url: this.opt.url
}, domain + "/ezopen/h5/iframe");
var _this = this;
this.opt.videoLoading = true;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'handleSuccess') {
setTimeout(()=>{
_this.opt.videoLoading = false;
},1000)
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.stop = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("stop", domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'stop') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.openSound = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("openSound", domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'openSound') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.closeSound = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("closeSound", domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'closeSound') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.startSave = function (fileName) {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage({
action: "startSave",
fileName: fileName || 'default'
}, domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'startSave') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.stopSave = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("stopSave", domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'stopSave') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.fullScreen = function () {
if(this.opt.fullScreenStatus === 1){
return false
}
var _this = this;
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) {
// console.log('移动端全屏');
var width = document.documentElement.clientWidth;
var height = document.documentElement.clientHeight;
// wrapper = document.getElementById("test"),
var wrapper = document.body;//document.body 属性返回 <body> 元素， document.documentElement 属性返回 <html> 元素。
wrapper =document.getElementById(id);
var style = "";
style += "width:" + height + "px;";// 注意旋转后的宽高切换
style += "height:" + width + "px;";
style += "-webkit-transform: rotate(90deg); transform: rotate(90deg);";
// 注意旋转中点的处理
style += "-webkit-transform-origin: " + width / 2 + "px " + width / 2 + "px;";
style += "transform-origin: " + width / 2 + "px " + width / 2 + "px;";
style += 'position: fixed;top: 0;left: 0;z-index:10';
wrapper.style.cssText = style;
var cancelFullDOM = document.createElement('div');
cancelFullDOM.id = id + "cancel-full-screen"
var cancelFullDOMStyle="width:30px;height:"+height+"px;z-index:1000;position:fixed;top:0px;right:0px;";
cancelFullDOMStyle += "background-image: url(https://resource.ys7cloud.com/group1/M00/00/7E/CtwQE1-01qeAH2wAAAABOliqQ5g167.png);"
cancelFullDOMStyle += "background-size: contain;background-repeat:no-repeat;background-color:rgba(0,0,0,0.2)"
cancelFullDOM.style = cancelFullDOMStyle;
cancelFullDOM.onclick = function(){
_this.cancelFullScreen();
}
document.body.appendChild(cancelFullDOM);
setTimeout(function () {
player.postMessage('autoResize', domain + "/ezopen/h5/iframe")
}, 500)
} else {
// console.log('pc端全屏');
var requestFullScreen = function (element) {
var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;
if (requestMethod) {
requestMethod.call(element);
} else if (typeof window.ActiveXObject !== "undefined") {
var wscript = new ActiveXObject("WScript.Shell");
if (wscript !== null) {
wscript.SendKeys("{F11}");
}
}
}
requestFullScreen(document.getElementById(id));
}
if (this.params.fullScreenCallBack) {
this.params.fullScreenCallBack(this.opt.id);
}
this.opt.fullScreenStatus = 1;
};
EZUIKitPlayer.prototype.cancelFullScreen = function () {
if(this.opt.fullScreenStatus === 0){
return false
}
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) {
var width = document.getElementById(id).width;
var height = document.getElementById(id).height;
// wrapper = document.getElementById("test"),
var wrapper = document.body;//document.body 属性返回 <body> 元素， document.documentElement 属性返回 <html> 元素。
wrapper =document.getElementById(id);
var style = "";
style += "width:" + width + "px;";
style += "height:" + height + "px;";
style += "-webkit-transform: rotate(0); transform: rotate(0);";
style += "-webkit-transform-origin: 0 0;";
style += "transform-origin: 0 0;";
wrapper.style.cssText = style;
setTimeout(function () {
player.postMessage("autoResize", domain + "/ezopen/h5/iframe")
}, 500);
var cancelFullDOMId = id + "cancel-full-screen";
var cancelFullDOM = document.getElementById(cancelFullDOMId);
if(cancelFullDOM){
document.body.removeChild(cancelFullDOM)
}
} else {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
}
}
if (this.params.cancelFullScreenCallBack) {
this.params.cancelFullScreenCallBack(this.opt.id);
}
this.opt.fullScreenStatus = 0;
}
EZUIKitPlayer.prototype.capturePicture = function (fileName,isUndownload) {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage({
action: "capturePicture",
fileName: fileName || 'default',
isUndownload: isUndownload,
}, domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'capturePicture') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.enableZoom = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("enableZoom", domain + "/ezopen/h5/iframe");
};
EZUIKitPlayer.prototype.closeZoom = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("closeZoom", domain + "/ezopen/h5/iframe");
};
EZUIKitPlayer.prototype.getOSDTime = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("getOSDTime", domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'getOSDTime') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.autoResize = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("autoResize", domain + "/ezopen/h5/iframe")
};
EZUIKitPlayer.prototype.reSize = function (width,height) {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
var containerDOM = document.getElementById(this.opt.id);
containerDOM.style.width = width + 'px';
containerDOM.style.height = height + 'px';
var playDOM = document.getElementById(id);
playDOM.setAttribute("width",width);
playDOM.setAttribute("height",height);
setTimeout(function(){
player.postMessage({
action: 'autoResize',
}, domain + "/ezopen/h5/iframe");
},500)
};
EZUIKitPlayer.prototype.startTalk = function () {
console.log("执行开始对讲");
console.log(this.opt);
var _this = this;
EZUIKit.opt = this.opt;
var apiSuccess = function(data) {
if (data.code == 200) {
var apiResult = data.data;
if (apiResult) {
// 临时将https转换为websocket
var rtcTrunk = apiResult.rtcUrl;
if (rtcTrunk.indexOf("ws") === -1) {
rtcTrunk = rtcTrunk.replace("https", "wss").replace("rtcgw", "rtcgw-ws");
}
_this.opt.rtcUrl = rtcTrunk;
_this.opt.ttsUrl = "tts://" + apiResult.ttsUrl;
var talk = "talk://" + _this.opt.deviceSerial + ":0:" + _this.opt.channelNo + ":cas.ys7.com:6500";
_this.opt.talkLink = _this.opt.ttsUrl + "/" + talk;
_this.opt.stream = apiResult.stream;
window.startTalk();
}
}
}
var apiError = function() {
layer.msg("获取对讲token失败")
}
request(_this.opt.apiDomain, 'POST', {
accessToken: _this.opt.accessToken,
deviceSerial: _this.opt.deviceSerial,
channelNo: _this.opt.channelNo
}, '', apiSuccess, apiError);
};
EZUIKitPlayer.prototype.stopTalk = function () {
console.log("执行结束对讲");
window.stopTalk();
};
/**
* 视频播放器-结束
*/
EZUIKit.EZUIKitPlayer = EZUIKitPlayer;
window.EZUIKit = EZUIKit;
if (!noGlobal) {
window.EZUIKit = EZUIKit;
}
return EZUIKit;
});
\ No newline at end of file
public/datav/static/ezuikit-js/demos/base-demo/index.html 0 → 100644
View file @ fb62f717
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title>Document</title>
<script src="./ezuikit.js"></script>
</head>
<body>
<div className="demo">
<h2>视频模式使用示例：</h2>
<div id="video-container"
>
</div>
<div>
<button onClick="play()">play</button>
<button onClick="stop()">stop</button>
<button onClick="getOSDTime()">getOSDTime</button>
<button onClick="getOSDTime2()">getOSDTime2</button>
<button onClick="capturePicture()">capturePicture</button>
<button onClick="openSound()">openSound</button>
<button onClick="closeSound()">closeSound</button>
<button onClick="startSave()">startSave</button>
<button onClick="stopSave()">stopSave</button>
<button onClick="startTalk()">开始对讲</button>
<button onClick="stopTalk()">结束对讲</button>
<button onClick="fullScreen()">全屏</button>
</div>
<p style="font-style: italic;">播放多个视频，可初始化多个实例，参考：/demos/base-demo/multi-demo</p>
</div>
<script>
document.getElementById("video-container").innerHTML="";
var playr = new EZUIKit.EZUIKitPlayer({
id: 'video-container', // 视频容器ID
accessToken: 'at.24gy1xhw62tw1ciod2rkbcn2cbs0esju-2h73bhdmbw-0lzya5g-yev2hyd5z',
url: 'ezopen://open.ys7.com/203751922/1.live',
template: 'simple', // simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版；
autoplay: true,
// 视频上方头部控件
// header: ['capturePicture','save','zoom'], // 如果templete参数不为simple,该字段将被覆盖
// 视频下方底部控件
// footer: ['talk','broadcast','hd','fullScreen'], // 如果template参数不为simple,该字段将被覆盖
// audio: 1, // 是否默认开启声音 0 - 关闭 1 - 开启
plugin: ['talk'], // 加载插件，talk-对讲
// controls: true, //['play','voice','hd','fullScreen'], // 视频控制相关控件，如果template参数不为simple,该字段将被覆盖
openSoundCallBack: (data) => console.log("开启声音回调",data),
closeSoundCallBack: (data) => console.log("关闭声音回调",data),
startSaveCallBack: (data) => console.log("开始录像回调",data),
stopSaveCallBack: (data) => console.log("录像回调",data),
capturePictureCallBack: (data) => console.log("截图成功回调",data),
fullScreenCallBack: (data) => console.log("全屏回调",data),
fullScreenChangeCallBack: (data) => console.log("全屏变化回调",data),
getOSDTimeCallBack: (data) => console.log("获取OSDTime回调",data),
handleSuccess: (data) = function(){console.log("播放成功回调",data)},
handleError: (data) => console.log("播放失败回调1",data),
handleTalkSuccess: () => console.log("对讲成功回调"),
handleTalkError: (data) = function(){console.log("对讲失败",data)},
decoderVersion: "v3.4",
width:"100%",
height:219,
});
function fullScreen(){
var playPromise = playr.fullScreen();
playPromise.then((data)=>{
console.log("promise 获取 数据",data)
})
}
function play() {
var playPromise = playr.play();
playPromise.then((data)=>{
console.log("promise 获取 数据",data)
})
}
function stop() {
var stopPromise = playr.stop();
stopPromise.then((data)=>{
console.log("promise 获取 数据",data)
})
}
function getOSDTime() {
var getOSDTimePromise = playr.getOSDTime();
getOSDTimePromise.then((data)=>{
console.log("promise 获取 数据",data)
})
}
function getOSDTime2() {
var getOSDTimePromise = playr2.getOSDTime();
getOSDTimePromise.then((data)=>{
console.log("promise 获取 数据",data)
})
}
function capturePicture() {
var capturePicturePromise = playr.capturePicture();
capturePicturePromise.then((data)=>{
console.log("promise 获取 数据",data)
})
}
function openSound() {
var openSoundPromise = playr.openSound();
openSoundPromise.then((data)=>{
console.log("promise 获取 数据",data)
})
}
function closeSound() {
var closeSoundPromise = playr.closeSound();
closeSoundPromise.then((data)=>{
console.log("promise 获取 数据",data)
})
}
function startSave() {
var startSavePromise = playr.startSave();
startSavePromise.then((data)=>{
console.log("promise 获取 数据",data)
})
}
function stopSave() {
var stopSavePromise = playr.stopSave();
stopSavePromise.then((data)=>{
console.log("promise 获取 数据",data)
})
}
</script>
</body>
</html>
public/datav/static/ezuikit-js/demos/base-demo/multi-demo.html 0 → 100644
View file @ fb62f717
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title>Document</title>
<script src="./ezuikit.js"></script>
</head>
<body>
<div className="demo">
<h2>多个视频窗口模式使用示例：</h2>
<div style="display: inline-block;vertical-align: top;width: 40%;">
<h3>窗口1：</h3>
<div id="video-container" style="width:400px;">
</div>
<div>
<button onClick="play()">play</button>
<button onClick="stop()">stop</button>
<button onClick="getOSDTime()">getOSDTime</button>
<button onClick="capturePicture()">capturePicture</button>
<button onClick="openSound()">openSound</button>
<button onClick="closeSound()">closeSound</button>
<button onClick="startSave()">startSave</button>
<button onClick="stopSave()">stopSave</button>
</div>
</div>
<div style="display: inline-block;vertical-align: top;width: 40%;">
<h3>窗口2：</h3>
<div id="video-container2" style="width:400px;">
</div>
<div>
<button onClick="play2()">play</button>
<button onClick="stop2()">stop</button>
<button onClick="getOSDTime2()">getOSDTime2</button>
<button onClick="capturePicture2()">capturePicture</button>
<button onClick="openSound2()">openSound</button>
<button onClick="closeSound2()">closeSound</button>
<button onClick="startSave2()">startSave</button>
<button onClick="stopSave2()">stopSave</button>
</div>
</div>
</div>
<script>
var playr1 = new EZUIKit.EZUIKitPlayer({
id: 'video-container', // 视频容器ID
accessToken: 'xx.16xf4zx0598fciw0delqzohqxxz6u8ei-1vxaom5kzu-1lz6z9x-uboj6tj3a',
url: 'ezopen://open.ys7.com/xxx/1.live',
template: 'simple', // simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版；
autoplay: true,
// 视频上方头部控件
header: ['capturePicture', 'save', 'zoom'], // 如果templete参数不为simple,该字段将被覆盖
// 视频下方底部控件
footer: ['talk', 'broadcast', 'hd', 'fullScreen'], // 如果template参数不为simple,该字段将被覆盖
// audio: 1, // 是否默认开启声音 0 - 关闭 1 - 开启
// plugin: ['talk'], // 加载插件，talk-对讲
// controls: true, //['play','voice','hd','fullScreen'], // 视频控制相关控件，如果template参数不为simple,该字段将被覆盖
openSoundCallBack: (data) => console.log("开启声音回调", data),
closeSoundCallBack: (data) => console.log("关闭声音回调", data),
startSaveCallBack: (data) => console.log("开始录像回调", data),
stopSaveCallBack: (data) => console.log("录像回调", data),
capturePictureCallBack: (data) => console.log("截图成功回调", data),
fullScreenCallBack: (data) => console.log("全屏回调", data),
getOSDTimeCallBack: (data) => console.log("获取OSDTime回调", data),
handleSuccess: (data) = function () { console.log("播放成功回调", data) },
handleError: (data) => console.log("播放失败回调", data),
handleTalkSuccess: () => console.log("对讲成功回掉"),
handleTalkError: (data) = function () { console.log("对讲失败", data) },
width: 400,
height: 300,
});
function play() {
var playPromise = playr.play();
playPromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function stop() {
var stopPromise = playr.stop();
stopPromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function getOSDTime() {
var getOSDTimePromise = playr.getOSDTime();
getOSDTimePromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function getOSDTime2() {
var getOSDTimePromise = playr2.getOSDTime();
getOSDTimePromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function capturePicture() {
var capturePicturePromise = playr.capturePicture();
capturePicturePromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function openSound() {
var openSoundPromise = playr.openSound();
openSoundPromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function closeSound() {
var closeSoundPromise = playr.closeSound();
closeSoundPromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function startSave() {
var startSavePromise = playr.startSave();
startSavePromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function stopSave() {
var stopSavePromise = playr.stopSave();
stopSavePromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
</script>
<script>
var playr2 = new EZUIKit.EZUIKitPlayer({
id: 'video-container2', // 视频容器ID
accessToken: 'xx.16xf4zx0598fciw0delqzohqxxz6u8ei-1vxaom5kzu-1lz6z9x-uboj6tj3aa',
url: 'ezopen://open.ys7.com/xxx/1.live',
template: 'simple', // simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版；
autoplay: true,
// 视频上方头部控件
header: ['capturePicture', 'save', 'zoom'], // 如果templete参数不为simple,该字段将被覆盖
// 视频下方底部控件
footer: ['talk', 'broadcast', 'hd', 'fullScreen'], // 如果template参数不为simple,该字段将被覆盖
// audio: 1, // 是否默认开启声音 0 - 关闭 1 - 开启
// plugin: ['talk'], // 加载插件，talk-对讲
// controls: true, //['play','voice','hd','fullScreen'], // 视频控制相关控件，如果template参数不为simple,该字段将被覆盖
openSoundCallBack: (data) => console.log("开启声音回调", data),
closeSoundCallBack: (data) => console.log("关闭声音回调", data),
startSaveCallBack: (data) => console.log("开始录像回调", data),
stopSaveCallBack: (data) => console.log("录像回调", data),
capturePictureCallBack: (data) => console.log("截图成功回调", data),
fullScreenCallBack: (data) => console.log("全屏回调", data),
getOSDTimeCallBack: (data) => console.log("获取OSDTime回调", data),
handleSuccess: (data) = function () { console.log("播放成功回调", data) },
handleError: (data) => console.log("播放失败回调", data),
handleTalkSuccess: () => console.log("对讲成功回掉"),
handleTalkError: (data) = function () { console.log("对讲失败", data) },
width: 400,
height: 300,
});
function play2() {
var playPromise = playr2.play();
playPromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function stop2() {
var stopPromise = playr2.stop();
stopPromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function getOSDTime2() {
var getOSDTimePromise = playr2.getOSDTime();
getOSDTimePromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function getOSDTime2() {
var getOSDTimePromise = playr2.getOSDTime();
getOSDTimePromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function capturePicture2() {
var capturePicturePromise = playr2.capturePicture();
capturePicturePromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function openSound2() {
var openSoundPromise = playr2.openSound();
openSoundPromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function closeSound2() {
var closeSoundPromise = playr2.closeSound();
closeSoundPromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function startSave2() {
var startSavePromise = playr2.startSave();
startSavePromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
function stopSave2() {
var stopSavePromise = playr2.stopSave();
stopSavePromise.then((data) => {
console.log("promise 获取 数据", data)
})
}
</script>
</body>
</html>
\ No newline at end of file
public/datav/static/ezuikit-js/demos/react-demo/README.md 0 → 100644
View file @ fb62f717
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
## Available Scripts
In the project directory, you can run:
### `npm start`
Runs the app in the development mode.<br />
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
The page will reload if you make edits.<br />
You will also see any lint errors in the console.
### `npm test`
Launches the test runner in the interactive watch mode.<br />
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
### `npm run build`
Builds the app for production to the `build` folder.<br />
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.<br />
Your app is ready to be deployed!
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
### `npm run eject`
**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
## Learn More
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
To learn React, check out the [React documentation](https://reactjs.org/).
### Code Splitting
This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting
### Analyzing the Bundle Size
This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size
### Making a Progressive Web App
This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app
### Advanced Configuration
This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration
### Deployment
This section has moved here: https://facebook.github.io/create-react-app/docs/deployment
### `npm run build` fails to minify
This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify
public/datav/static/ezuikit-js/demos/react-demo/package.json 0 → 100644
View file @ fb62f717
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.5.0",
"@testing-library/user-event": "^7.2.1",
"axios": "^0.19.2",
"ezuikit-js": "0.1.7",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
public/datav/static/ezuikit-js/demos/react-demo/public/index.html 0 → 100644
View file @ fb62f717
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
public/datav/static/ezuikit-js/demos/react-demo/public/manifest.json 0 → 100644
View file @ fb62f717
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
public/datav/static/ezuikit-js/demos/react-demo/public/robots.txt 0 → 100644
View file @ fb62f717
# https://www.robotstxt.org/robotstxt.html
User-agent: *
Disallow:
public/datav/static/ezuikit-js/demos/react-demo/src/App.css 0 → 100644
View file @ fb62f717
.App {
text-align: center;
}
.App-logo {
height: 40vmin;
pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
.App-logo {
animation: App-logo-spin infinite 20s linear;
}
}
.App-header {
background-color: #282c34;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}
.App-link {
color: #61dafb;
}
@keyframes App-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
public/datav/static/ezuikit-js/demos/react-demo/src/App.js 0 → 100644
View file @ fb62f717
import React from 'react';
import EZUIKit from 'ezuikit-js';
import './App.css';
class App extends React.Component{
constructor(props){
super(props);
this.playr = null; //定义播放器
}
componentDidMount(){
this.playr = new EZUIKit.EZUIKitPlayer({
id: 'video-container', // 视频容器ID
accessToken: 'at.9ymd5rys4lk1zv6o2rtr51a624s9gl56-5fitodjuss-0tkvm8j-hras1ewfu',
url: 'ezopen://open.ys7.com/203751922/1.live',
template: 'security', // simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版；
// 视频上方头部控件
// header: ['capturePicture','save','zoom'], // 如果templete参数不为simple,该字段将被覆盖
// // 视频下方底部控件
// footer: ['talk','broadcast','hd','fullScreen'], // 如果template参数不为simple,该字段将被覆盖
audio: 1, // 是否默认开启声音 0 - 关闭 1 - 开启
openSoundCallBack: (data) => console.log("开启声音回调",data),
closeSoundCallBack: (data) => console.log("关闭声音回调",data),
startSaveCallBack: (data) => console.log("开始录像回调",data),
stopSaveCallBack: (data) => console.log("录像回调",data),
capturePictureCallBack: (data) => console.log("截图成功回调",data),
fullScreenCallBack: (data) => console.log("全屏回调",data),
getOSDTimeCallBack: (data) => console.log("获取OSDTime回调",data),
width:600,
height:400,
})
}
render(){
return(
<div className="demo">
<h2>视频模式使用示例：</h2>
<div id="video-container"
style={{width:600,height:600}}
>
</div>
<div>
<button onClick={()=> this.playr.stop()}>stop</button>
<button onClick={()=> this.playr.openSound()}>openSound</button>
<button onClick={()=> this.playr.closeSound()}>closeSound</button>
<button onClick={()=> this.playr.startSave()}>startSave</button>
<button onClick={()=> this.playr.stopSave()}>stopSave</button>
<button onClick={()=> this.playr.capturePicture()}>capturePicture</button>
<button onClick={()=> this.playr.fullScreen()}>fullScreen</button>
<button onClick={()=> this.playr.getOSDTime()}>getOSDTime</button>
<button onClick={()=> this.playr.startTalk()}>开始对讲</button>
<button onClick={()=> this.playr.stopTalk()}>结束对讲</button>
</div>
</div>
)
}
}
export default App;
public/datav/static/ezuikit-js/demos/react-demo/src/App.test.js 0 → 100644
View file @ fb62f717
import React from 'react';
import { render } from '@testing-library/react';
import App from './App';
test('renders learn react link', () => {
const { getByText } = render(<App />);
const linkElement = getByText(/learn react/i);
expect(linkElement).toBeInTheDocument();
});
public/datav/static/ezuikit-js/demos/react-demo/src/ezuikit/index.js 0 → 100644
View file @ fb62f717
/**
* EZUIKitPlayer for npm
*/
(function (global, factory) {
"use strict";
if (typeof module === "object" && typeof module.exports === "object") {
module.exports = global.document ?
factory(global, true) :
function (w) {
if (!w.document) {
throw new Error("EZUIPlayer requires a window with a document");
}
return factory(w);
};
} else {
factory(global);
}
// Pass this if window is not defined yet
})(typeof window !== "undefined" ? window : this, function (window, noGlobal) {
// 加载js
function addJs(filepath, callback) {
var oJs = document.createElement("script");
oJs.setAttribute("src", filepath);
oJs.onload = callback;
document.getElementsByTagName("head")[0].appendChild(oJs);
}
// 加载css
function addCss(filepath, callback) {
var oJs = document.createElement('link');
oJs.rel = 'stylesheet';
oJs.type = 'text/css';
oJs.href = filepath;
oJs.onload = callback;
document.getElementsByTagName("head")[0].appendChild(oJs);
}
// 通用请求方法
function request(url, method, params, header, success, error) {
var _url = url;
var http_request = new XMLHttpRequest();
http_request.onreadystatechange = function () {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
var _data = JSON.parse(http_request.responseText);
success(_data);
}
}
};
http_request.open(method, _url, true);
// http_request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
var data = new FormData();
for (var i in params) {
data.append(i, params[i]);
}
http_request.send(data);
};
var EZUIKit = {
EZUIKitPlayer: undefined,
EZUIKitTalk: undefined,
opt: {
apiDomain: 'https://open.ys7.com/api/lapp/live/talk/url',
filePath: 'https://open.ys7.com/assets/ezuikit_v2.6.4',
accessToken: '',
url: '',
deviceSerial: '',
channelNo: '',
id: '',
talkLink: '',
rtcUrl: '',
ttsUrl: '',
stream: '',
// 对讲插件依赖
isReliesReady: false,
template: 'simple',
audio: 0,// 声音id -1-不开启 0-第一路 1-第二路
},
state: {
countTimer: undefined,// countTime 计时器
recodeTime: 0, // 录音时间
recodeTimer: undefined, //录音时长 计时器
recodeTime: 0,
fetchDefaultList: false, // 是否拉取默认语音-当用户语音为空
page: 0, // 语音当前页
pageSize: 5,
}
}
/**
* 视频播放器-开始
*/
var domain = "https://open.ys7.com";
var EZUIKitPlayer = function (params) {
var _this = this;
console.log("params", params);
if (params.id) {
EZUIKit.opt.id = params.id;
}
if (params.accessToken) {
EZUIKit.opt.accessToken = params.accessToken;
}
if (params.url) {
EZUIKit.opt.url = params.url;
EZUIKit.opt.deviceSerial = params.url.split("/")[3];
EZUIKit.opt.channelNo = params.url.split("/")[4].split(".")[0];
}
if (params.template) {
EZUIKit.opt.template = params.template;
}
let id = EZUIKit.opt.id;
var domElement = document.getElementById(id);
// 间隙
domElement.style.fontSize = 0;
/**
* 渲染iframe视频框
*/
var iframe = document.createElement('iframe');
function matchIframeUrl() {
switch (EZUIKit.opt.template) {
case 'simple':
return "https://open.ys7.com/ezopen/h5/iframe?url=" + EZUIKit.opt.url + "&autoplay=" + EZUIKit.opt.autoplay + "&audio=" + EZUIKit.opt.audio + "&accessToken=" + params.accessToken + "&templete=0";
case 'standard':
return "https://open.ys7.com/ezopen/h5/iframe?url=" + EZUIKit.opt.url + "&autoplay=" + EZUIKit.opt.autoplay + "&audio=" + EZUIKit.opt.audio + "&accessToken=" + params.accessToken + "&templete=1";
case 'security':
return "https://open.ys7.com/ezopen/h5/iframe_se?url=" + EZUIKit.opt.url + "&autoplay=" + EZUIKit.opt.autoplay + "&audio=" + EZUIKit.opt.audio + "&accessToken=" + params.accessToken + "&templete=0";
default:
return "https://open.ys7.com/ezopen/h5/iframe?url=" + EZUIKit.opt.url + "&autoplay=" + EZUIKit.opt.autoplay + "&audio=" + EZUIKit.opt.audio + "&accessToken=" + params.accessToken + "&templete=0";
}
}
iframe.src = matchIframeUrl();
// 默认取容器宽高
var iframeHeight = document.getElementById(id).offsetHeight;
var iframeWidth = document.getElementById(id).offsetWidth;
if (params.height) {
iframeHeight = parseInt(params.height);
}
if (params.width) {
iframeWidth = parseInt(params.width);
}
iframe.width = iframeWidth;
iframe.height = iframeHeight;
iframe.id = 'EZUIKitPlayer-' + id;
// 部分iframe属性
iframe.setAttribute("allowfullscreen", true)
iframe.setAttribute("frameborder", 0)
console.log("iframe", iframe)
domElement.appendChild(iframe)
var jqueryJS = EZUIKit.opt.filePath + '/js/jquery.js';
var layerJs = 'https://open.ys7.com/assets/layer/layer.js';
var recoderCSS = EZUIKit.opt.filePath + '/npm/css/recoder.css';
addCss(recoderCSS, function () {
})
addJs(jqueryJS, function () {
addJs(layerJs, function () {
/**
* 渲染header
*/
if (matchHeaderOpt().headerContainer) {
// if (params.header && params.header instanceof Array) {
var headerContainer = document.createElement('div');
headerContainer.setAttribute('class', 'panel-top');
var controsDOM = document.createElement('div');
controsDOM.setAttribute('class', 'contros');
headerContainer.appendChild(controsDOM);
domElement.insertBefore(headerContainer, iframe);
if (matchHeaderOpt().capturePictureModule) {
// 截图
var capturePictureDOM = document.createElement('span');
capturePictureDOM.innerHTML =
'<span title="截图">'
+ '<svg id="capturePicture" title="截图" t="1578882764585" class="icon" viewBox="0 0 1024 1024" version="1.1"'
+ ' xmlns="http://www.w3.org/2000/svg" p-id="5958" width="24" height="24">'
+ ' <path'
+ ' d="M887.296 315.904h-153.6c-51.2 0-68.096-102.4-119.296-102.4H392.704c-34.304 0-51.2 102.4-102.4 102.4h-153.6c-29.696 0-51.2 21.504-51.2 51.2v439.296c0 25.6 21.504 47.104 51.2 47.104h751.104c29.696 0 51.2-21.504 51.2-51.2v-435.2c-0.512-30.208-21.504-51.2-51.712-51.2zM512 768c-115.2 0-204.8-89.6-204.8-200.704s89.6-200.704 204.8-200.704 204.8 89.6 204.8 200.704-93.696 200.704-204.8 200.704z m247.296-354.304c-12.8 0-25.6-12.8-25.6-25.6s12.8-25.6 25.6-25.6 25.6 12.8 25.6 25.6c0 17.408-12.8 25.6-25.6 25.6zM256 264.704c0-8.704-8.704-16.896-16.896-16.896h-51.2c-8.704 0-16.896 8.704-16.896 16.896V281.6H256v-16.896z m256 148.992c-85.504 0-153.6 68.096-153.6 153.6s68.096 153.6 153.6 153.6 153.6-68.096 153.6-153.6-68.096-153.6-153.6-153.6z"'
+ ' fill="#ffffff" p-id="5959"></path>'
+ '</svg>'
+ '</span>';
capturePictureDOM.onclick = function () {
_this.capturePicture();
}
controsDOM.appendChild(capturePictureDOM);
}
console.log("matchHeaderOpt().saveModule", matchHeaderOpt().saveModule)
if (matchHeaderOpt().saveModule) {
var startSaveDOM = document.createElement('span');
startSaveDOM.innerHTML =
'<span title="开始录像">'
+ ' <svg id="startSave" t="1578882716693" class="icon" viewBox="0 0 1024 1024" version="1.1"'
+ ' xmlns="http://www.w3.org/2000/svg" p-id="3782" width="24" height="24">'
+ ' <path'
+ ' d="M915.2 729.6l-128-76.8c-25.6-12.8-44.8-32-44.8-51.2V435.2c0-25.6 19.2-38.4 44.8-51.2l128-76.8c25.6-12.8 44.8 0 44.8 19.2V704c0 32-19.2 38.4-44.8 25.6z m-332.8 89.6H96c-51.2 0-89.6-38.4-89.6-89.6V332.8c0-51.2 38.4-89.6 89.6-89.6h486.4c51.2 0 89.6 38.4 89.6 89.6v396.8c0 51.2-38.4 89.6-89.6 89.6zM192 364.8c-32 6.4-57.6 32-64 64-12.8 57.6 38.4 115.2 96 102.4 32-6.4 57.6-32 64-70.4 12.8-57.6-38.4-108.8-96-96z m0 0"'
+ ' p-id="3783" fill="#ffffff"></path>'
+ ' </svg>'
+ '</span>'
startSaveDOM.onclick = function () {
_this.startSave();
document.getElementById('startSave').setAttribute('class', 'icon hide');
document.getElementById('stopSave').setAttribute('class', 'icon');
}
controsDOM.appendChild(startSaveDOM);
var stopSaveDOM = document.createElement('span');
stopSaveDOM.innerHTML =
'<span title="结束录像">'
+ ' <svg id="stopSave" t="1578882716693" class="icon hide" viewBox="0 0 1024 1024" version="1.1"'
+ ' xmlns="http://www.w3.org/2000/svg" p-id="3782" width="24" height="24">'
+ ' <path'
+ ' d="M915.2 729.6l-128-76.8c-25.6-12.8-44.8-32-44.8-51.2V435.2c0-25.6 19.2-38.4 44.8-51.2l128-76.8c25.6-12.8 44.8 0 44.8 19.2V704c0 32-19.2 38.4-44.8 25.6z m-332.8 89.6H96c-51.2 0-89.6-38.4-89.6-89.6V332.8c0-51.2 38.4-89.6 89.6-89.6h486.4c51.2 0 89.6 38.4 89.6 89.6v396.8c0 51.2-38.4 89.6-89.6 89.6zM192 364.8c-32 6.4-57.6 32-64 64-12.8 57.6 38.4 115.2 96 102.4 32-6.4 57.6-32 64-70.4 12.8-57.6-38.4-108.8-96-96z m0 0"'
+ ' p-id="3783" fill="red"></path>'
+ ' </svg>'
+ ' </span>'
stopSaveDOM.onclick = function () {
_this.stopSave();
document.getElementById('stopSave').setAttribute('class', 'icon hide');
document.getElementById('startSave').setAttribute('class', 'icon');
}
controsDOM.appendChild(stopSaveDOM);
}
if (matchHeaderOpt().zoomModule) {
var enableZoomDOM = document.createElement('span');
enableZoomDOM.innerHTML =
'<span title="开启电子放大">'
+ ' <svg id="enableZoom" t="1578882639834" class="icon" viewBox="0 0 1000 1000" version="1.1"'
+ ' xmlns="http://www.w3.org/2000/svg" p-id="2227" width="24" height="24">'
+ ' <path'
+ ' d="M830.6119 441.1089c0-193.7756-157.0939-350.8641-350.8775-350.8641S128.8559 247.3333 128.8559 441.1089 285.9508 791.972 479.7344 791.972 830.6119 634.8845 830.6119 441.1089zM483.2821 710.4863c-146.7975 0-265.8187-118.9953-265.8187-265.8088S336.4847 178.8697 483.2821 178.8697s265.8197 118.9953 265.8197 265.8078S630.0796 710.4863 483.2821 710.4863zM770.6031 653.5739l-72.6417 75.9485 141.6917 160.1814 82.0737-90.0739L770.6031 653.5739zM527.5849 267.4727h-88.60655762279428v132.90489048425167H306.0690340253259v88.60292721534799h132.90933675248866v132.9038911617923h88.60655762279428V488.9794719180395h132.90933675248866v-88.60292721534799H527.5849284006089V267.4726535408993z"'
+ ' p-id="2228" fill="#ffffff"></path>'
+ ' </svg>'
+ '</span>';
enableZoomDOM.onclick = function () {
_this.enableZoom();
document.getElementById('enableZoom').setAttribute('class', 'icon hide');
document.getElementById('closeZoom').setAttribute('class', 'icon');
}
controsDOM.appendChild(enableZoomDOM);
var closeZoomDOM = document.createElement('span');
closeZoomDOM.innerHTML =
'<span title="关闭电子放大">'
+ ' <svg id="closeZoom" t="1578882639834" class="icon hide" viewBox="0 0 1000 1000" version="1.1"'
+ ' xmlns="http://www.w3.org/2000/svg" p-id="2227" width="24" height="24">'
+ ' <path'
+ ' d="M830.6119 441.1089c0-193.7756-157.0939-350.8641-350.8775-350.8641S128.8559 247.3333 128.8559 441.1089 285.9508 791.972 479.7344 791.972 830.6119 634.8845 830.6119 441.1089zM483.2821 710.4863c-146.7975 0-265.8187-118.9953-265.8187-265.8088S336.4847 178.8697 483.2821 178.8697s265.8197 118.9953 265.8197 265.8078S630.0796 710.4863 483.2821 710.4863zM770.6031 653.5739l-72.6417 75.9485 141.6917 160.1814 82.0737-90.0739L770.6031 653.5739zM527.5849 267.4727h-88.60655762279428v132.90489048425167H306.0690340253259v88.60292721534799h132.90933675248866v132.9038911617923h88.60655762279428V488.9794719180395h132.90933675248866v-88.60292721534799H527.5849284006089V267.4726535408993z"'
+ ' p-id="2228" fill="red"></path>'
+ ' </svg>'
+ '</span>'
closeZoomDOM.onclick = function () {
_this.closeZoom();
document.getElementById('closeZoom').setAttribute('class', 'icon hide');
document.getElementById('enableZoom').setAttribute('class', 'icon');
}
controsDOM.appendChild(closeZoomDOM);
}
}
/**
* 渲染footer
*/
/** 根据配置匹配底部渲染 */
function matchFooterOpt() {
var result = {
footerContainer: false,
talkModule: false,
broadcastModule: false,
hdModule: false,
fullScreenModule: false,
}
var template = EZUIKit.opt.template;
switch (template) {
case 'simple':
if (params.footer && params.footer instanceof Array) {
var footer = params.footer;
result = {
footerContainer: true,
talkModule: footer.indexOf('talk') !== -1,
broadcastModule: footer.indexOf('broadcast') !== -1,
hdModule: footer.indexOf('hd') !== -1,
fullScreenModule: footer.indexOf('fullScreen') !== -1,
}
}
break;
case 'standard':
break;
case 'security':
break;
case 'voice':
result = {
footerContainer: true,
talkModule: true,
broadcastModule: true,
hdModule: true,
fullScreenModule: true,
}
break;
}
return result;
}
/** 根据配置匹配底部渲染 */
function matchHeaderOpt() {
var result = {
headerContainer: false,
capturePictureModule: false,
saveModule: false,
zoomModule: false,
}
var template = EZUIKit.opt.template;
switch (template) {
case 'simple':
if (params.header && params.header instanceof Array) {
var header = params.header;
result = {
headerContainer: true,
capturePictureModule: header.indexOf('capturePicture') !== -1,
saveModule: header.indexOf('save') !== -1,
zoomModule: header.indexOf('zoom') !== -1,
}
}
break;
case 'standard':
break;
case 'security':
break;
case 'voice':
result = {
headerContainer: true,
capturePictureModule: true,
saveModule: true,
zoomModule: true,
}
break;
}
return result;
}
if (matchFooterOpt().footerContainer) {
var recoderCSS = EZUIKit.opt.filePath + '/npm/css/recoder.css';
var recoderJs = EZUIKit.opt.filePath + '/npm/js/recoder.js';
var recorderJs = EZUIKit.opt.filePath + '/recorder.js';
// addCss()
addCss(recoderCSS, function () {
addJs(recoderJs, function () {
addJs(recorderJs, function () {
// 底部容器
var footerContainer = document.createElement('div');
footerContainer.setAttribute("class", 'audio-controls');
domElement.appendChild(footerContainer);
if (matchFooterOpt().hdModule || matchFooterOpt().fullScreenModule) {
// 底部右侧元素
var rightContros = document.createElement('div');
rightContros.setAttribute('class', 'contros');
footerContainer.appendChild(rightContros);
if (matchFooterOpt().hdModule) {
// 高清-标清切换
var hdDom = document.createElement('span');
hdDom.setAttribute('id', 'video-hd');
hdDom.innerHTML = EZUIKit.opt.url.indexOf('.hd') === -1 ? '标清' : '高清';
hdDom.onclick = function () {
// 停止
_this.stop();
if (EZUIKit.opt.url.indexOf('.hd') === -1) {
EZUIKit.opt.url = EZUIKit.opt.url.replace('.live', '.hd.live');
hdDom.innerHTML = EZUIKit.opt.url.indexOf('.hd') === -1 ? '标清' : '高清';
} else {
EZUIKit.opt.url = EZUIKit.opt.url.replace('.hd.live', '.live')
}
iframe.src = "https://open.ys7.com/ezopen/h5/iframe?url=" + EZUIKit.opt.url.replace('.hd.live', '.live') + "&autoplay=1&accessToken=at.bprcrj6c4pi47z4w4usxf4ce7q1ey6mi-5q5mxnkbif-1ej0zrx-frepmdcwl&templete=0";
}
rightContros.appendChild(hdDom);
}
if (matchFooterOpt().fullScreenModule) {
// 全屏控制
var fullScreenDOM = document.createElement('span');
fullScreenDOM.setAttribute('title', '全屏');
fullScreenDOM.setAttribute('style', 'vertical-align: top;');
fullScreenDOM.innerHTML = '<svg id="fullScreen" t="1578020167938" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5035" width="16" height="16"> <path d="M348.373333 625.706667l-128 128-64 64v-128a33.28 33.28 0 0 0-35.413333-35.413334A33.493333 33.493333 0 0 0 85.333333 689.706667v213.333333A33.706667 33.706667 0 0 0 120.96 938.666667h213.333333a35.626667 35.626667 0 0 0 0-71.04h-128l64-64 128-128a35.2 35.2 0 0 0-49.92-49.92zM206.293333 156.373333h128a33.28 33.28 0 0 0 35.413334-35.413333A33.493333 33.493333 0 0 0 334.293333 85.333333H113.706667c-7.04 0-14.08 7.04-21.333334 14.293334a26.026667 26.026667 0 0 0-7.04 21.333333v213.333333a33.493333 33.493333 0 0 0 35.626667 35.413334 33.28 33.28 0 0 0 35.413333-35.413334v-128l192 192a35.2 35.2 0 0 0 49.92-49.92zM903.04 85.333333h-213.333333a33.493333 33.493333 0 0 0-35.413334 35.626667 33.28 33.28 0 0 0 35.413334 35.413333h128l-64 64-128 128a35.2 35.2 0 0 0 49.92 49.92l128-128 64-64v128a35.626667 35.626667 0 0 0 71.04 0v-213.333333A33.706667 33.706667 0 0 0 903.04 85.333333zM903.04 654.293333a33.28 33.28 0 0 0-35.413333 35.413334v128l-64-64-128-128a35.2 35.2 0 0 0-49.92 49.92l128 128 64 64h-128a35.626667 35.626667 0 0 0 0 71.04h213.333333A33.706667 33.706667 0 0 0 938.666667 903.04v-213.333333a33.493333 33.493333 0 0 0-35.626667-35.413334z" p-id="5036" fill="#ffffff"></path></svg>'
fullScreenDOM.onclick = function () {
_this.fullScreen();
}
rightContros.appendChild(fullScreenDOM);
}
}
if (matchFooterOpt().talkModule) {
// 对讲
var startTalkDOM = document.createElement('div');
var stopTalkDOM = document.createElement('div');
startTalkDOM.setAttribute("class", "ptp-talk off");
startTalkDOM.innerHTML =
'<span title="对讲">'
+ '<svg t="1581930496966" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"'
+ ' p-id="1641" width="16" height="16">'
+ ' <path'
+ ' d="M715.648 647.872c-30.208-22.336-61.568 39.36-100.992 77.44-39.36 38.08-34.112 31.488-123.392-17.088S311.488 540.224 280 491.648C248.448 443.072 265.472 424.704 265.472 424.704s78.72-62.976 97.152-81.344c18.368-18.368 13.12-30.208 13.12-30.208l-128.64-190.144c-23.616-5.184-64.32 5.12-128.576 57.6C54.208 233.088 30.592 353.856 151.296 575.68c120.768 221.824 347.84 330.752 485.568 374.08 137.856 43.328 228.416-61.696 249.408-103.68 21.056-41.984 13.12-85.312 13.12-85.312S745.856 670.208 715.648 647.872z"'
+ ' p-id="1642" fill="#ffffff"></path>'
+ ' <path'
+ ' d="M715.328 64C580.992 64 472.192 172.864 472.192 307.2s108.8 243.2 243.136 243.2 243.2-108.864 243.2-243.2S849.6 64 715.328 64zM715.328 461.056c-84.992 0-153.856-68.864-153.856-153.856s68.864-153.856 153.856-153.856 153.856 68.928 153.856 153.856S800.32 461.056 715.328 461.056z"'
+ ' p-id="1643" fill="#ffffff"></path>'
+ ' <path'
+ ' d="M777.472 277.376c-18.176 0-32.96-14.784-32.96-33.024 0-8.448 3.136-16.064 8.32-21.888-11.52-5.12-24.128-8-37.568-8-51.2 0-92.672 41.472-92.672 92.736s41.472 92.736 92.672 92.736S808.064 358.4 808.064 307.2c0-13.696-3.072-26.688-8.384-38.4C793.728 274.112 786.048 277.376 777.472 277.376zM715.328 340.928c-18.624 0-33.664-15.104-33.664-33.728 0-18.624 15.04-33.728 33.664-33.728 18.688 0 33.728 15.104 33.728 33.728C749.056 325.824 734.016 340.928 715.328 340.928z"'
+ ' p-id="1644" fill="#ffffff"></path>'
+ ' </svg>'
+ ' </span>'
+ ' <span>开启对讲</span>'
startTalkDOM.onclick = function () {
console.log("EZUIKit.state.countTimer", EZUIKit.state.countTimer)
if (EZUIKit.state.countTimer) {
window.layer.msg("语音设备正忙，请稍后重试")
return false;
}
countTime('add', 0);
console.log("开始对讲，关闭声音")
_this.closeSound(0);
console.log(_this.opt)
_this.startTalk();
this.setAttribute("class", "ptp-talk off hide");
stopTalkDOM.setAttribute("class", "ptp-talk on");
}
stopTalkDOM.setAttribute("class", "ptp-talk on hide");
stopTalkDOM.innerHTML =
'<span title="对讲">'
+ ' <svg t="1581930496966" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"'
+ ' p-id="1641" width="16" height="16">'
+ ' <path'
+ ' d="M715.648 647.872c-30.208-22.336-61.568 39.36-100.992 77.44-39.36 38.08-34.112 31.488-123.392-17.088S311.488 540.224 280 491.648C248.448 443.072 265.472 424.704 265.472 424.704s78.72-62.976 97.152-81.344c18.368-18.368 13.12-30.208 13.12-30.208l-128.64-190.144c-23.616-5.184-64.32 5.12-128.576 57.6C54.208 233.088 30.592 353.856 151.296 575.68c120.768 221.824 347.84 330.752 485.568 374.08 137.856 43.328 228.416-61.696 249.408-103.68 21.056-41.984 13.12-85.312 13.12-85.312S745.856 670.208 715.648 647.872z"'
+ ' p-id="1642" fill="#ff0000"></path>'
+ ' <path'
+ ' d="M715.328 64C580.992 64 472.192 172.864 472.192 307.2s108.8 243.2 243.136 243.2 243.2-108.864 243.2-243.2S849.6 64 715.328 64zM715.328 461.056c-84.992 0-153.856-68.864-153.856-153.856s68.864-153.856 153.856-153.856 153.856 68.928 153.856 153.856S800.32 461.056 715.328 461.056z"'
+ ' p-id="1643" fill="#ff0000"></path>'
+ ' <path'
+ ' d="M777.472 277.376c-18.176 0-32.96-14.784-32.96-33.024 0-8.448 3.136-16.064 8.32-21.888-11.52-5.12-24.128-8-37.568-8-51.2 0-92.672 41.472-92.672 92.736s41.472 92.736 92.672 92.736S808.064 358.4 808.064 307.2c0-13.696-3.072-26.688-8.384-38.4C793.728 274.112 786.048 277.376 777.472 277.376zM715.328 340.928c-18.624 0-33.664-15.104-33.664-33.728 0-18.624 15.04-33.728 33.664-33.728 18.688 0 33.728 15.104 33.728 33.728C749.056 325.824 734.016 340.928 715.328 340.928z"'
+ ' p-id="1644" fill="#ff0000"></path>'
+ ' </svg>'
+ ' </span>'
+ '<span>关闭对讲</span>'
stopTalkDOM.onclick = function () {
console.log(_this.opt)
_this.stopTalk();
countTime('destory', 0);
_this.openSound(0);
this.setAttribute("class", "ptp-talk on hide");
startTalkDOM.setAttribute("class", "ptp-talk off");
}
footerContainer.appendChild(startTalkDOM);
footerContainer.appendChild(stopTalkDOM);
}
if (matchFooterOpt().broadcastModule) {
var startBroadcastDOM = document.createElement('div');
var stopBroadcastDOM = document.createElement('div');
startBroadcastDOM.setAttribute("class", 'broadcast off');
stopBroadcastDOM.setAttribute("class", "broadcast on hide");
startBroadcastDOM.innerHTML =
' <span title="语音播报">'
+ ' <svg t="1583561695846" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"'
+ ' p-id="1126" width="16" height="16">'
+ ' <path'
+ ' d="M513.82044445 964.38044445c-8.192 0-15.47377778-2.73066667-21.84533334-8.192 0 0-46.42133333-41.87022222-99.21422222-86.47111112-89.20177778-73.728-117.41866667-88.29155555-123.79022222-90.112H35.04355555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666V271.70133333c0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666666H246.21511111c7.28177778-2.73066667 37.31911111-15.47377778 137.44355556-91.02222222 58.25422222-43.69066667 111.04711111-86.47111111 111.04711111-86.47111112 5.46133333-4.55111111 12.74311111-7.28177778 20.02488889-7.28177778 4.55111111 0 10.01244445 0.91022222 14.56355555 3.6408889 10.92266667 5.46133333 18.20444445 17.29422222 18.20444445 30.03733333v837.40444444c0 12.74311111-7.28177778 25.48622222-19.11466667 30.94755556-5.46133333 1.82044445-10.01244445 2.73066667-14.56355555 2.73066667zM270.79111111 724.992c19.11466667 0 48.24177778 8.192 167.48088889 106.496 16.384 13.65333333 33.67822222 28.21688889 51.88266667 43.69066667l5.46133333 4.55111111V139.71911111l-5.46133333 3.64088889c-22.75555555 17.29422222-44.60088889 34.58844445-65.536 50.06222222C293.54666667 291.72622222 264.41955555 299.008 245.30488889 299.008H82.37511111c-20.02488889 0-21.84533333 12.74311111-21.84533333 26.39644445V694.04444445c0 23.66577778 6.37155555 30.03733333 28.21688889 30.03733333h180.224l1.82044444 0.91022222z m520.64711111 162.01955555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666 0-11.83288889 8.192-20.02488889 16.384-24.576 112.86755555-67.35644445 182.04444445-191.14666667 182.04444444-324.03911111 0-132.89244445-70.08711111-256.68266667-182.04444444-324.03911111-10.01244445-5.46133333-15.47377778-14.56355555-15.47377778-24.576 0-14.56355555 11.83288889-27.30666667 26.39644445-27.30666667 5.46133333 0 10.01244445 1.82044445 16.384 5.46133333 128.34133333 76.45866667 207.53066667 218.45333333 207.53066666 369.55022222 0 152.00711111-80.09955555 293.09155555-208.44088889 369.55022223-6.37155555 5.46133333-10.92266667 7.28177778-16.384 7.28177777z m-90.112-152.91733333c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666667 0-10.01244445 4.55111111-18.20444445 12.74311111-23.66577777 61.89511111-34.58844445 100.12444445-100.12444445 100.12444444-171.12177778 0-70.08711111-37.31911111-134.71288889-96.48355555-170.21155555-8.192-4.55111111-12.74311111-13.65333333-12.74311111-23.66577778 0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666667 4.55111111 0 11.83288889 2.73066667 15.47377778 4.55111111 74.63822222 44.60088889 121.96977778 127.43111111 121.96977778 215.72266667 0 90.112-48.24177778 173.85244445-125.61066667 218.45333333-1.82044445 0-9.10222222 4.55111111-15.47377778 4.55111111z"'
+ ' fill="#ffffff" p-id="1127"></path>'
+ ' </svg>'
+ '</span>'
+ '<span>语音播报</span>';
startBroadcastDOM.onclick = function () {
this.setAttribute("class", "broadcast off hide");
stopBroadcastDOM.setAttribute("class", "broadcast on");
}
stopBroadcastDOM.innerHTML =
'<div class="pop-hover">'
+ ' <div class="pop-hover-content">'
+ ' <div class="vioce-list" id="voice-list">'
+ ' <ul class="voice-list-ul">'
+ ' </ul>'
+ ' <div id="voice-list-end"></div>'
+ ' </div>'
+ ' <div id="voice-custom" style="text-align: center;">自定义语音</div>'
+ ' </div>'
+ '</div>'
+ '<span title="语音播报">'
+ ' <svg t="1583561695846" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"'
+ ' p-id="1126" width="16" height="16">'
+ ' <path'
+ ' d="M513.82044445 964.38044445c-8.192 0-15.47377778-2.73066667-21.84533334-8.192 0 0-46.42133333-41.87022222-99.21422222-86.47111112-89.20177778-73.728-117.41866667-88.29155555-123.79022222-90.112H35.04355555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666V271.70133333c0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666666H246.21511111c7.28177778-2.73066667 37.31911111-15.47377778 137.44355556-91.02222222 58.25422222-43.69066667 111.04711111-86.47111111 111.04711111-86.47111112 5.46133333-4.55111111 12.74311111-7.28177778 20.02488889-7.28177778 4.55111111 0 10.01244445 0.91022222 14.56355555 3.6408889 10.92266667 5.46133333 18.20444445 17.29422222 18.20444445 30.03733333v837.40444444c0 12.74311111-7.28177778 25.48622222-19.11466667 30.94755556-5.46133333 1.82044445-10.01244445 2.73066667-14.56355555 2.73066667zM270.79111111 724.992c19.11466667 0 48.24177778 8.192 167.48088889 106.496 16.384 13.65333333 33.67822222 28.21688889 51.88266667 43.69066667l5.46133333 4.55111111V139.71911111l-5.46133333 3.64088889c-22.75555555 17.29422222-44.60088889 34.58844445-65.536 50.06222222C293.54666667 291.72622222 264.41955555 299.008 245.30488889 299.008H82.37511111c-20.02488889 0-21.84533333 12.74311111-21.84533333 26.39644445V694.04444445c0 23.66577778 6.37155555 30.03733333 28.21688889 30.03733333h180.224l1.82044444 0.91022222z m520.64711111 162.01955555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666 0-11.83288889 8.192-20.02488889 16.384-24.576 112.86755555-67.35644445 182.04444445-191.14666667 182.04444444-324.03911111 0-132.89244445-70.08711111-256.68266667-182.04444444-324.03911111-10.01244445-5.46133333-15.47377778-14.56355555-15.47377778-24.576 0-14.56355555 11.83288889-27.30666667 26.39644445-27.30666667 5.46133333 0 10.01244445 1.82044445 16.384 5.46133333 128.34133333 76.45866667 207.53066667 218.45333333 207.53066666 369.55022222 0 152.00711111-80.09955555 293.09155555-208.44088889 369.55022223-6.37155555 5.46133333-10.92266667 7.28177778-16.384 7.28177777z m-90.112-152.91733333c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666667 0-10.01244445 4.55111111-18.20444445 12.74311111-23.66577777 61.89511111-34.58844445 100.12444445-100.12444445 100.12444444-171.12177778 0-70.08711111-37.31911111-134.71288889-96.48355555-170.21155555-8.192-4.55111111-12.74311111-13.65333333-12.74311111-23.66577778 0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666667 4.55111111 0 11.83288889 2.73066667 15.47377778 4.55111111 74.63822222 44.60088889 121.96977778 127.43111111 121.96977778 215.72266667 0 90.112-48.24177778 173.85244445-125.61066667 218.45333333-1.82044445 0-9.10222222 4.55111111-15.47377778 4.55111111z"'
+ ' fill="#ff0000" p-id="1127"></path>'
+ ' </svg>'
+ '</span>'
+ '<span>语音播报</span>'
// //自定义语音唤起
// document.getElementById("voice-custom").onclick = function(){
// console.log("显示自定义语音");
// }
stopBroadcastDOM.onclick = function () {
this.setAttribute("class", "broadcast on hide");
startBroadcastDOM.setAttribute("class", "broadcast off");
}
footerContainer.appendChild(startBroadcastDOM);
footerContainer.appendChild(stopBroadcastDOM);
// 召唤自定义语言
document.getElementById("voice-custom").onclick = function () {
console.log("显示自定义语音");
startSpeakDOM.setAttribute('class', 'speak off');
}
// 获取语音列表
fetchVoiceList(0);
function fetchVoiceList(page) {
function apiSuccess(data) {
console.log("data", data);
if (data.code == 200) {
randerVoliceList(data.data, 5);
EZUIKit.state.page = data.page.page;
// 如果用户语音列表为空
if (page == 0 && data.data.length == 0 && !EZUIKit.state.fetchDefaultList) {// 获取用户语音为空
EZUIKit.state.fetchDefaultList = true;
fetchVoiceList(0);
}
}
}
function apiError(err) {
console.log("err", err)
}
request(
'https://open.ys7.com/api/lapp/voice/query',
'POST',
{
accessToken: EZUIKit.opt.accessToken,
pageStart: page,
pageSize: EZUIKit.state.pageSize,
default: EZUIKit.state.fetchDefaultList ? 'true' : 'false'
},
'',
apiSuccess,
apiError
);
}
function randerVoliceList(data) {
console.log("renderVoliceList", data)
if (data && data.length > 0) {
for (var i = 0; i < data.length; i++) {
var voiceItem = document.createElement('li');
voiceItem.innerHTML = "<li class='voice-item' id='voice-item-" + i + "' data-time=" + (data[i]["duration"] || 20) + " data-url=" + data[i]["fileUrl"] + ">" + (data[i]["voiceName"].length > 10 ? (data[i]["voiceName"].substr(0, 10) + "...") : data[i]["voiceName"]) + "</li>";
document.getElementsByClassName('voice-list-ul')[0].append(voiceItem); // "<li class='voice-item' id='voice-item-" + i + "' data-time=" + (data[i]["duration"] || 20) + " data-url=" + data[i]["fileUrl"] + ">" + (data[i]["voiceName"].length > 10 ? (data[i]["voiceName"].substr(0, 10) + "...") : data[i]["voiceName"]) + "</li>";
// $("#voice-list ul").append("<li class='voice-item' id='voice-item-" + i + "' data-time=" + (data[i]["duration"] || 20) + " data-url=" + data[i]["fileUrl"] + ">" + (data[i]["voiceName"].length > 10 ? (data[i]["voiceName"].substr(0, 10) + "...") : data[i]["voiceName"]) + "</li>");
voiceItem.onclick = function (e) {
console.log("点击元素", e.target, e.target.dataset.url);
var voiceUrl = e.target.dataset.url;
var time = e.target.dataset.time;
playListOfVoice(voiceUrl, time);
}
}
if (data.length === EZUIKit.state.pageSize) {
document.getElementById('voice-list-end').innerHTML = "向下滚动加载更多";
} else {
document.getElementById('voice-list-end').innerHTML = "没有更多数据了";
}
}
}
function playListOfVoice(voiceUrl, time) {
console.log("播放语音", voiceUrl, time);
// decoder && decoder.closeSound(0);
function apiSuccess(data) {
console.log("data.data", data.data)
if (data.code == 200) {
// $("#startBroadcast").show();
// $("#stopBroadcast").hide();
countTime('sub', parseInt(time));
} else if (data.code == "10001") {
window.layer.msg("未找到当前语音")
} else {
window.layer.msg(data.msg || '发送失败，请稍后再试')
}
// padding = false;
}
function apiError(err) {
console.log("err", err)
}
request(
'https://open.ys7.com/api/lapp/voice/send',
'POST',
{
accessToken: EZUIKit.opt.accessToken,
deviceSerial: EZUIKit.opt.deviceSerial,
channelNo: EZUIKit.opt.channelNo,
fileUrl: voiceUrl,
},
'',
apiSuccess,
apiError
);
}
// 自定义语音
// 对讲
var startSpeakDOM = document.createElement('div');
var stopSpeakDOM = document.createElement('div');
startSpeakDOM.setAttribute('class', 'speak off hide');
stopSpeakDOM.setAttribute('class', 'speak on hide');
startSpeakDOM.setAttribute('id', 'startSpeak');
stopSpeakDOM.setAttribute('id', 'stopSpeak');
startSpeakDOM.innerHTML =
'<span title="按住说话">'
+ ' <svg t="1581994757678" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"'
+ ' p-id="1639" width="16" height="16">'
+ ' <path'
+ ' d="M757.059829 393.846154v-52.512821h262.564103v52.512821H757.059829z m-420.102564 481.367521v96.273504h175.042735a8.752137 8.752137 0 0 1 8.752137 8.752137v35.008547a8.752137 8.752137 0 0 1-8.752137 8.752137H109.401709a8.752137 8.752137 0 0 1-8.752136-8.752137v-35.008547a8.752137 8.752137 0 0 1 8.752136-8.752137h175.042735v-96.273504C129.767932 875.213675 4.376068 749.821812 4.376068 595.145299V463.863248a26.25641 26.25641 0 1 1 52.512821 0v113.777778c0 140.174222 113.637744 253.811966 253.811966 253.811965s253.811966-113.637744 253.811966-253.811965V463.863248a26.25641 26.25641 0 1 1 52.51282 0v131.282051c0 154.676513-125.391863 280.068376-280.068376 280.068376z m-26.25641-96.273504c-111.178393 0-201.299145-90.120752-201.299146-201.299145V201.299145C109.401709 90.120752 199.522462 0 310.700855 0s201.299145 90.120752 201.299145 201.299145v376.341881c0 111.178393-90.120752 201.299145-201.299145 201.299145z m691.418803-280.068376H757.059829v-52.512821h245.059829v52.512821z m-17.504273 105.025641H757.059829v-52.512821h227.555556v52.512821z m-17.504274 105.025641H757.059829v-52.512821h210.051282v52.512821z m-8.752137 105.025641H757.059829v-52.512821h201.299145v52.512821z m-17.504273 105.025641H757.059829v-52.512821h183.794872v52.512821z m-26.25641 105.025641H757.059829v-52.512821h157.538462v52.512821z"'
+ ' p-id="1640" fill="#ffffff"></path>'
+ ' </svg>'
+ '</span>'
+ '<span>按住说话</span>';
stopSpeakDOM.innerHTML =
'<span title="按住说话">'
+ '<svg t="1581994757678" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"'
+ ' p-id="1639" width="16" height="16">'
+ ' <path'
+ ' d="M757.059829 393.846154v-52.512821h262.564103v52.512821H757.059829z m-420.102564 481.367521v96.273504h175.042735a8.752137 8.752137 0 0 1 8.752137 8.752137v35.008547a8.752137 8.752137 0 0 1-8.752137 8.752137H109.401709a8.752137 8.752137 0 0 1-8.752136-8.752137v-35.008547a8.752137 8.752137 0 0 1 8.752136-8.752137h175.042735v-96.273504C129.767932 875.213675 4.376068 749.821812 4.376068 595.145299V463.863248a26.25641 26.25641 0 1 1 52.512821 0v113.777778c0 140.174222 113.637744 253.811966 253.811966 253.811965s253.811966-113.637744 253.811966-253.811965V463.863248a26.25641 26.25641 0 1 1 52.51282 0v131.282051c0 154.676513-125.391863 280.068376-280.068376 280.068376z m-26.25641-96.273504c-111.178393 0-201.299145-90.120752-201.299146-201.299145V201.299145C109.401709 90.120752 199.522462 0 310.700855 0s201.299145 90.120752 201.299145 201.299145v376.341881c0 111.178393-90.120752 201.299145-201.299145 201.299145z m691.418803-280.068376H757.059829v-52.512821h245.059829v52.512821z m-17.504273 105.025641H757.059829v-52.512821h227.555556v52.512821z m-17.504274 105.025641H757.059829v-52.512821h210.051282v52.512821z m-8.752137 105.025641H757.059829v-52.512821h201.299145v52.512821z m-17.504273 105.025641H757.059829v-52.512821h183.794872v52.512821z m-26.25641 105.025641H757.059829v-52.512821h157.538462v52.512821z"'
+ ' p-id="1640" fill="#ff0000"></path>'
+ '</svg>'
+ '</span>'
+ '<span>松开发送</span>';
footerContainer.appendChild(startSpeakDOM);
footerContainer.appendChild(stopSpeakDOM);
document.getElementById("voice-list").onscroll = function (e) {
var sum = this.scrollHeight;
console.log("sum", sum, this.scrollTop, document.getElementById("voice-list").clientHeight);
if (sum <= this.scrollTop + this.clientHeight) {
console.log("拖动到底，执行加载", EZUIKit.state.page);
fetchVoiceList(++EZUIKit.state.page);
}
}
// $("#voice-list").unbind("scroll").bind("scroll", function (e) {
// // console.log("e",e,this.scrollHeight, $(this).scrollTop() + $(this).height())
// var sum = this.scrollHeight;
// if (sum <= $(this).scrollTop() + $(this).height()) {
// console.log("拖动到底，执行加载", page);
// fetchVoiceList(++page);
// }
// loading = false;
// });
// time-area
var timeAreaDOM = document.createElement('div');
timeAreaDOM.setAttribute('class', 'time-area');
timeAreaDOM.setAttribute('id', 'time-area');
timeAreaDOM.innerHTML = '00:00';
footerContainer.appendChild(timeAreaDOM);
// 按住说话
var recorder;
document.getElementById('startSpeak').onmousedown = function () {
if (EZUIKit.state.countTimer) {
window.layer.msg("语音设备正忙，请稍后重试")
return false;
}
console.log("按住说话");
startSpeakDOM.setAttribute('class', 'speak off hide');
stopSpeakDOM.setAttribute('class', 'speak on');
// console.log("startRecording",startRecording);
// startRecording();
voiceInit();
countTime('add', 0);
setTimeout(() => {
EZUIKit.state.recodeTime = 0;
startRecording();
}, 1000)
if (EZUIKit.state.recodeTimer) { // 先清空计数器
clearInterval(EZUIKit.state.recodeTimer);
}
EZUIKit.state.recodeTimer = setInterval(function () {
if (EZUIKit.state.recodeTime >= 59) {
_this.stopTalk();
countTime('destory', 0);
this.setAttribute("class", "ptp-talk on hide");
startTalkDOM.setAttribute("class", "ptp-talk off");
window.layer.msg("不超过1分钟")
} else {
EZUIKit.state.recodeTime = EZUIKit.state.recodeTime + 1;
}
}, 1000);
/** 录音控制 */
var audio_context;
function startUserMedia(stream) {
var input = audio_context.createMediaStreamSource(stream);
recorder = new window.Recorder(input);
}
function startRecording() {
recorder && recorder.record();
}
function stopRecording() {
recorder && recorder.stop();
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)
window.layer.msg('No web audio support in this browser!');
}
navigator.getUserMedia({ audio: true }, startUserMedia, function (e) {
console.log('No live audio input: ' + e);
});
};
}
// 松开发送
document.getElementById('stopSpeak').onmouseup = function () {
console.log("松开发送")
stopSpeakDOM.setAttribute('class', 'speak on hide');
stopSpeakFun()
function stopSpeakFun() {
countTime('destory', 0);
if (EZUIKit.state.recodeTime < 1) {
window.layer.msg("说话时间过短");
clearInterval(EZUIKit.state.recodeTimer);
return false;
}
clearInterval(EZUIKit.state.recodeTimer);
wavUpload();
}
function wavUpload() {
try {
recorder && recorder.stop();
// createAudioDom();
recorder && recorder.exportWAV(function (wav_file) {
console.log("wav_file", wav_file);
if (wav_file.size < 1000) {
window.layer.msg("录音失败，请重试");
// recodeTime = 0;
EZUIKit.state.recodeTime = 0
return false;
}
// 测试
countTime('sub', EZUIKit.state.recodeTime + 2); // 延时
var formdata = new FormData(); // form 表单 {key:value}
formdata.append("voiceFile", wav_file); // form input type="file"
formdata.append("accessToken", EZUIKit.opt.accessToken);
formdata.append("deviceSerial", EZUIKit.opt.deviceSerial);
formdata.append("channelNo", EZUIKit.opt.channelNo);
// padding = true;
function apiSuccess(data) {
console.log("data.data", data.data)
if (data.code == 200) {
// $("#startBroadcast").show();
// $("#stopBroadcast").hide();
countTime('sub', EZUIKit.state.recodeTime + 2);
} else if (data.code == "10001") {
window.layer.msg("未找到当前语音")
} else {
window.layer.msg(data.msg || '发送失败，请稍后再试')
}
// padding = false;
}
function apiError(err) {
console.log("err", err)
}
request(
'https://open.ys7.com/api/lapp/voice/sendonce',
'POST',
{
voiceFile: wav_file,
accessToken: EZUIKit.opt.accessToken,
deviceSerial: EZUIKit.opt.deviceSerial,
channelNo: EZUIKit.opt.channelNo,
},
'',
apiSuccess,
apiError
);
});
recorder && recorder.clear();
} catch (err) {
console.log(err);
}
}
}
}
/* 时间计数 */
function countTime(type, start = 0) {
clearInterval(EZUIKit.state.countTimer);
if (type === 'add') {
var i = start;
EZUIKit.state.countTimer = setInterval(function () {
++i;
document.getElementById("time-area").innerHTML = formatSeconds(i);
}, 1000);
} else if (type === 'sub') {
var i = start;
EZUIKit.state.countTimer = setInterval(function () {
if (i > 0) {
i--;
document.getElementById("time-area").innerHTML = formatSeconds(i);
} else {
clearInterval(EZUIKit.state.countTimer);
EZUIKit.state.countTimer = undefined;
console.log("倒计时结束，开启声音");
// decoder.openSound(0);
}
}, 1000);
} else if (type === 'destory') {
clearInterval(EZUIKit.state.countTimer);
EZUIKit.state.countTimer = undefined;
document.getElementById("time-area").innerHTML = '00:00';
}
//将秒数转换为时分秒格式
function formatSeconds(value) {
var theTime = parseInt(value);// 秒
var middle = 0;// 分
var hour = 0;// 小时
var secondV = '00';
var minV = '00';
var hourV = '00'
if (theTime > 59) {
middle = parseInt(theTime / 60);
theTime = parseInt(theTime % 60);
if (middle > 59) {
hour = parseInt(middle / 60);
middle = parseInt(middle % 60);
}
}
secondV = parseInt(theTime) > 9 ? parseInt(theTime) : ('0' + parseInt(theTime));
minV = parseInt(middle) > 9 ? parseInt(middle) : ('0' + parseInt(middle));
hourV = (parseInt(hour) > 9 ? parseInt(hour) : ('0' + parseInt(hour)));
if (hour > 0) {
return hourV + ':' + minV + ':' + secondV;
} else if (middle > 0) {
return minV + ':' + secondV;
} else {
return '00:' + secondV;
}
}
}
/* 将秒数转换为时分秒格式 */
function formatSeconds(value) {
var theTime = parseInt(value);// 秒
var middle = 0;// 分
var hour = 0;// 小时
var secondV = '00';
var minV = '00';
var hourV = '00'
if (theTime > 59) {
middle = parseInt(theTime / 60);
theTime = parseInt(theTime % 60);
if (middle > 59) {
hour = parseInt(middle / 60);
middle = parseInt(middle % 60);
}
}
secondV = parseInt(theTime) > 9 ? parseInt(theTime) : ('0' + parseInt(theTime));
minV = parseInt(middle) > 9 ? parseInt(middle) : ('0' + parseInt(middle));
hourV = (parseInt(hour) > 9 ? parseInt(hour) : ('0' + parseInt(hour)));
if (hour > 0) {
return hourV + ':' + minV + ':' + secondV;
} else if (middle > 0) {
return minV + ':' + secondV;
} else {
return '00:' + secondV;
}
}
});
});
// });
})
}
})
})
var _this = this;
function apiSuccess(data) {
console.log("data", data);
if (data.code == 200) {
var apiResult = data.data;
if (apiResult) {
}
}
}
function apiError(err) {
if (params.handleError) {
params.handleError(err);
}
}
request(
EZUIKit.opt.apiDomain,
'POST',
{
accessToken: EZUIKit.opt.accessToken,
deviceSerial: EZUIKit.opt.deviceSerial,
channelNo: EZUIKit.opt.channelNo
},
'',
apiSuccess,
apiError
);
console.log("EZUIKit.opt", EZUIKit.opt)
// iframe 传递数据
window.addEventListener(
"message",
function (event) {
console.log("EZUIKitPlayer收到反馈", event);
var origin = event.origin;
if (event.data.type) {
switch (event.data.type) {
case 'openSound':
if (params.openSoundCallBack) {
params.openSoundCallBack(event.data)
}
break;
case 'closeSound':
if (params.closeSoundCallBack) {
params.closeSoundCallBack(event.data)
}
break;
case 'capturePicture':
if (params.capturePictureCallBack) {
params.capturePictureCallBack(event.data)
}
break;
case 'startSave':
if (params.startSaveCallBack) {
params.startSaveCallBack(event.data)
}
break;
case 'stopSave':
if (params.stopSaveCallBack) {
params.stopSaveCallBack(event.data)
}
break;
case 'fullScreen':
if (params.fullScreenCallBack) {
params.fullScreenCallBack(event.data)
}
break;
case 'getOSDTime':
if (params.getOSDTimeCallBack) {
params.getOSDTimeCallBack(event.data)
}
break;
}
}
})
/**
*
* 对讲模块
*/
function apiSuccess(data) {
console.log("data", data);
if (data.code == 200) {
var apiResult = data.data;
if (apiResult) {
// 临时将https转换为websocket
var rtcTrunk = apiResult.rtcUrl;
if (rtcTrunk.indexOf("ws") === -1) {
rtcTrunk = rtcTrunk.replace("https", "wss").replace("rtcgw", "rtcgw-ws");
}
EZUIKit.opt.rtcUrl = rtcTrunk;
EZUIKit.opt.ttsUrl = "tts://" + apiResult.ttsUrl;
var talk = "talk://" + EZUIKit.opt.deviceSerial + ":0:" + EZUIKit.opt.channelNo + ":cas.ys7.com:6500";
EZUIKit.opt.talkLink = EZUIKit.opt.ttsUrl + "/" + talk;
EZUIKit.opt.stream = apiResult.stream;
console.log("EZUIKit.opt", EZUIKit.opt)
// 加载依赖
if (!EZUIKit.opt.isReliesReady) {
var adapeterJS = EZUIKit.opt.filePath + '/npm/js/adapeter.js';
var janusJS = EZUIKit.opt.filePath + '/npm/js/janus.js';
var ttsJS = EZUIKit.opt.filePath + '/npm/js/tts.js';
console.log("加载jquery.js");
addJs(adapeterJS, function () {
console.log("加载adapeter.js");
addJs(janusJS, function () {
console.log("加载janus.js");
addJs(ttsJS, function () {
console.log("加载tts.js");
// 文件加载完毕;
EZUIKit.opt.isReliesReady = true;
})
})
})
}
// 创建DOM
if (!document.getElementById("audioleft")) {
var audioleft = document.createElement('div');
audioleft.style.display = 'none';
audioleft.id = 'audioleft';
document.body.appendChild(audioleft)
}
if (!document.getElementById("audioright")) {
var audioright = document.createElement('div');
audioright.style.display = 'none';
audioright.id = 'audioright';
document.body.appendChild(audioright)
}
}
}
}
function apiError(err) {
if (params.handleError) {
params.handleError(err);
}
}
request(
EZUIKit.opt.apiDomain,
'POST',
{
accessToken: EZUIKit.opt.accessToken,
deviceSerial: EZUIKit.opt.deviceSerial,
channelNo: EZUIKit.opt.channelNo
},
'',
apiSuccess,
apiError
);
}
// 播放相关API
EZUIKitPlayer.prototype.stop = function () {
var id = 'EZUIKitPlayer-' + EZUIKit.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("stop", domain + "/ezopen/h5/iframe")
}
EZUIKitPlayer.prototype.openSound = function () {
var id = 'EZUIKitPlayer-' + EZUIKit.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("openSound", domain + "/ezopen/h5/iframe");
}
EZUIKitPlayer.prototype.closeSound = function () {
var id = 'EZUIKitPlayer-' + EZUIKit.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("closeSound", domain + "/ezopen/h5/iframe")
}
EZUIKitPlayer.prototype.startSave = function () {
var id = 'EZUIKitPlayer-' + EZUIKit.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("startSave", domain + "/ezopen/h5/iframe")
}
EZUIKitPlayer.prototype.stopSave = function () {
var id = 'EZUIKitPlayer-' + EZUIKit.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("stopSave", domain + "/ezopen/h5/iframe")
}
EZUIKitPlayer.prototype.fullScreen = function () {
var id = 'EZUIKitPlayer-' + EZUIKit.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("fullScreen", domain + "/ezopen/h5/iframe")
}
EZUIKitPlayer.prototype.capturePicture = function () {
var id = 'EZUIKitPlayer-' + EZUIKit.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("capturePicture", domain + "/ezopen/h5/iframe")
}
EZUIKitPlayer.prototype.enableZoom = function () {
var id = 'EZUIKitPlayer-' + EZUIKit.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("enableZoom", domain + "/ezopen/h5/iframe")
}
EZUIKitPlayer.prototype.closeZoom = function () {
var id = 'EZUIKitPlayer-' + EZUIKit.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("closeZoom", domain + "/ezopen/h5/iframe")
}
EZUIKitPlayer.prototype.getOSDTime = function () {
var id = 'EZUIKitPlayer-' + EZUIKit.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("getOSDTime", domain + "/ezopen/h5/iframe")
}
EZUIKitPlayer.prototype.startTalk = function () {
console.log("执行开始对讲")
window.startTalk();
}
EZUIKitPlayer.prototype.stopTalk = function () {
console.log("执行结束对讲")
window.stopTalk();
}
/**
* 视频播放器-结束
*/
EZUIKit.EZUIKitPlayer = EZUIKitPlayer;
window.EZUIKit = EZUIKit;
if (!noGlobal) {
window.EZUIKit = EZUIKit;
}
return EZUIKit;
})
\ No newline at end of file
public/datav/static/ezuikit-js/demos/react-demo/src/ezuikit/package.json 0 → 100644
View file @ fb62f717
{
"name": "@ezviz/ezuikit",
"version": "0.0.1",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "yujianbo",
"license": "ISC"
}
public/datav/static/ezuikit-js/demos/react-demo/src/index.css 0 → 100644
View file @ fb62f717
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
}
public/datav/static/ezuikit-js/demos/react-demo/src/index.js 0 → 100644
View file @ fb62f717
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
document.getElementById('root')
);
// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: https://bit.ly/CRA-PWA
serviceWorker.unregister();
public/datav/static/ezuikit-js/demos/react-demo/src/logo.svg 0 → 100644
View file @ fb62f717
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3">
<g fill="#61DAFB">
<path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/>
<circle cx="420.9" cy="296.5" r="45.7"/>
<path d="M520.5 78.1z"/>
</g>
</svg>
public/datav/static/ezuikit-js/demos/react-demo/src/serviceWorker.js 0 → 100644
View file @ fb62f717
// This optional code is used to register a service worker.
// register() is not called by default.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on subsequent visits to a page, after all the
// existing tabs open on the page have been closed, since previously cached
// resources are updated in the background.
// To learn more about the benefits of this model and instructions on how to
// opt-in, read https://bit.ly/CRA-PWA
const isLocalhost = Boolean(
window.location.hostname === 'localhost' ||
// [::1] is the IPv6 localhost address.
window.location.hostname === '[::1]' ||
// 127.0.0.0/8 are considered localhost for IPv4.
window.location.hostname.match(
/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
)
);
export function register(config) {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
// The URL constructor is available in all browsers that support SW.
const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
if (publicUrl.origin !== window.location.origin) {
// Our service worker won't work if PUBLIC_URL is on a different origin
// from what our page is served on. This might happen if a CDN is used to
// serve assets; see https://github.com/facebook/create-react-app/issues/2374
return;
}
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
if (isLocalhost) {
// This is running on localhost. Let's check if a service worker still exists or not.
checkValidServiceWorker(swUrl, config);
// Add some additional logging to localhost, pointing developers to the
// service worker/PWA documentation.
navigator.serviceWorker.ready.then(() => {
console.log(
'This web app is being served cache-first by a service ' +
'worker. To learn more, visit https://bit.ly/CRA-PWA'
);
});
} else {
// Is not localhost. Just register service worker
registerValidSW(swUrl, config);
}
});
}
}
function registerValidSW(swUrl, config) {
navigator.serviceWorker
.register(swUrl)
.then(registration => {
registration.onupdatefound = () => {
const installingWorker = registration.installing;
if (installingWorker == null) {
return;
}
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
// At this point, the updated precached content has been fetched,
// but the previous service worker will still serve the older
// content until all client tabs are closed.
console.log(
'New content is available and will be used when all ' +
'tabs for this page are closed. See https://bit.ly/CRA-PWA.'
);
// Execute callback
if (config && config.onUpdate) {
config.onUpdate(registration);
}
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.');
// Execute callback
if (config && config.onSuccess) {
config.onSuccess(registration);
}
}
}
};
};
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
}
function checkValidServiceWorker(swUrl, config) {
// Check if the service worker can be found. If it can't reload the page.
fetch(swUrl, {
headers: { 'Service-Worker': 'script' },
})
.then(response => {
// Ensure service worker exists, and that we really are getting a JS file.
const contentType = response.headers.get('content-type');
if (
response.status === 404 ||
(contentType != null && contentType.indexOf('javascript') === -1)
) {
// No service worker found. Probably a different app. Reload the page.
navigator.serviceWorker.ready.then(registration => {
registration.unregister().then(() => {
window.location.reload();
});
});
} else {
// Service worker found. Proceed as normal.
registerValidSW(swUrl, config);
}
})
.catch(() => {
console.log(
'No internet connection found. App is running in offline mode.'
);
});
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready
.then(registration => {
registration.unregister();
})
.catch(error => {
console.error(error.message);
});
}
}
public/datav/static/ezuikit-js/demos/react-demo/src/setupTests.js 0 → 100644
View file @ fb62f717
// jest-dom adds custom jest matchers for asserting on DOM nodes.
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
import '@testing-library/jest-dom/extend-expect';
public/datav/static/ezuikit-js/demos/vue-demo/README.md 0 → 100644
View file @ fb62f717
# my-project
## Project setup
```
npm install
```
### Compiles and hot-reloads for development
```
npm run serve
```
### Compiles and minifies for production
```
npm run build
```
### Lints and fixes files
```
npm run lint
```
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
public/datav/static/ezuikit-js/demos/vue-demo/babel.config.js 0 → 100644
View file @ fb62f717
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
]
}
public/datav/static/ezuikit-js/demos/vue-demo/package.json 0 → 100644
View file @ fb62f717
{
"name": "my-project",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"core-js": "^3.6.4",
"ezuikit-js": "0.1.7",
"vue": "^2.6.11"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.3.0",
"@vue/cli-plugin-eslint": "~4.3.0",
"@vue/cli-service": "~4.3.0",
"babel-eslint": "^10.1.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^6.2.2",
"vue-template-compiler": "^2.6.11"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead"
]
}
public/datav/static/ezuikit-js/demos/vue-demo/public/index.html 0 → 100644
View file @ fb62f717
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
public/datav/static/ezuikit-js/demos/vue-demo/src/App.vue 0 → 100644
View file @ fb62f717
<template>
<div id="app">
<EZUIKitJs />
</div>
</template>
<script>
import EZUIKitJs from './components/EZUIKitJs.vue'
export default {
name: 'App',
components: {
EZUIKitJs
}
}
</script>
<style>
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
</style>
public/datav/static/ezuikit-js/demos/vue-demo/src/components/EZUIKitJs.vue 0 → 100644
View file @ fb62f717
<template>
<div class="hello-ezuikit-js">
<div id="video-container" style="width:600px;height:600px"></div>
<button @click="change">按钮</button>
</div>
</template>
<script>
import EZUIKit from "ezuikit-js";
var player = null;
export default {
name: "HelloWorld",
// data:function () {
// return {
// player: null,
// }
// },
props: {
msg: String
},
mounted: () => {
console.group("mounted 组件挂载完毕状态===============》");
player = new EZUIKit.EZUIKitPlayer({
autoplay: true,
id: "video-container",
accessToken:"at.ciwomi1k3lklzen416tqflyu4fm7cqvc-32g97d9qk2-15iad60-l2vw2olyd",
url: "ezopen://open.ys7.com/244640009/1.rec",
template: "simple", // simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版；
// 视频上方头部控件
//header: ["capturePicture", "save", "zoom"], // 如果templete参数不为simple,该字段将被覆盖
//plugin: ['talk'], // 加载插件，talk-对讲
// 视频下方底部控件
// footer: ["talk", "broadcast", "hd", "fullScreen"], // 如果template参数不为simple,该字段将被覆盖
// audio: 1, // 是否默认开启声音 0 - 关闭 1 - 开启
// openSoundCallBack: data => console.log("开启声音回调", data),
// closeSoundCallBack: data => console.log("关闭声音回调", data),
// startSaveCallBack: data => console.log("开始录像回调", data),
// stopSaveCallBack: data => console.log("录像回调", data),
// capturePictureCallBack: data => console.log("截图成功回调", data),
// fullScreenCallBack: data => console.log("全屏回调", data),
// getOSDTimeCallBack: data => console.log("获取OSDTime回调", data),
width: 600,
height: 400
});
// console.log("player",player);
// setTimeout(()=>{
// player.stop(); // 方法调用示例，10秒后关闭视频
// },10000)
},
methods: {
change() {
player.stop();
// 切换为直播
player.play({
url:"ezopen://open.ys7.com/244640009/1.live"
})
// setTimeout(()=>{
// player.play({
// url:"ezopen://open.ys7.com/244640009/1.live"
// })
// },1000)
},
}
};
</script>
public/datav/static/ezuikit-js/demos/vue-demo/src/main.js 0 → 100644
View file @ fb62f717
import Vue from 'vue'
import App from './App.vue'
Vue.config.productionTip = false
new Vue({
render: h => h(App),
}).$mount('#app')
public/datav/static/ezuikit-js/ezuikit.js 0 → 100644
View file @ fb62f717
"use strict";
/**
* EZUIKitPlayer for npm
*/
(function (global, factory) {
"use strict";
if (typeof module === "object" && typeof module.exports === "object") {
module.exports = global.document ? factory(global, true) : function (w) {
if (!w.document) {
throw new Error("EZUIPlayer requires a window with a document");
}
return factory(w);
};
} else {
factory(global);
} // Pass this if window is not defined yet
})(typeof window !== "undefined" ? window : void 0, function (window, noGlobal) {
// 加载js
function addJs(filepath, callback) {
var headerScript = document.getElementsByTagName('head')[0].getElementsByTagName("script");
var isReady = false;
for (var i = 0; i < headerScript.length; i++) {
if (headerScript[i].getAttribute("src") == filepath) {
isReady = true;
callback();
}
}
if (!isReady) {
var oJs = document.createElement("script");
oJs.setAttribute("src", filepath);
oJs.onload = callback;
document.getElementsByTagName("head")[0].appendChild(oJs);
}
} // 加载css
function addCss(filepath, callback) {
var headerLink = document.getElementsByTagName('head')[0].getElementsByTagName("link");
var isReady = false;
for (var i = 0; i < headerLink.length; i++) {
if (headerLink[i].getAttribute("href") == filepath) {
isReady = true;
callback();
}
}
if (!isReady) {
var oJs = document.createElement('link');
oJs.rel = 'stylesheet';
oJs.type = 'text/css';
oJs.href = filepath;
oJs.onload = callback;
document.getElementsByTagName("head")[0].appendChild(oJs);
}
} // 通用请求方法
function request(url, method, params, header, success, error) {
var _url = url;
var http_request = new XMLHttpRequest();
http_request.onreadystatechange = function () {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
var _data = JSON.parse(http_request.responseText);
success(_data);
}
}
};
http_request.open(method, _url, true); // http_request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
var data = new FormData();
for (var i in params) {
data.append(i, params[i]);
}
http_request.send(data);
}
; // 全局属性
var EZUIKit = {
EZUIKitPlayer: undefined,
EZUIKitTalk: undefined,
opt: {
apiDomain: 'https://open.ys7.com/api/lapp/live/talk/url',
filePath: 'https://open.ys7.com/assets/ezuikit_v2.6.4',
accessToken: '',
url: '',
deviceSerial: '',
channelNo: '',
id: '',
talkLink: '',
rtcUrl: '',
ttsUrl: '',
stream: '',
// 对讲插件依赖
isReliesReady: false,
template: 'simple',
plugin: [],
// 加载插件，talk-对讲
audio: 1,
// 声音id 0-不开启 1-开启
autoplay: 1,
videoLoading: false,
},
state: {
countTimer: undefined,
// countTime 计时器
recodeTime: 0,
// 录音时间
recodeTimer: undefined,
//录音时长 计时器
recodeTime: 0,
fetchDefaultList: false,
// 是否拉取默认语音-当用户语音为空
page: 0,
// 语音当前页
pageSize: 5
},
handleTalkSuccess: function(){},
handleTalkError: function(){},
};
/**
* 视频播放器-开始
*/
var domain = "https://open.ys7.com";
var filePathDomain = domain;
var EZUIKitPlayer = function EZUIKitPlayer(params) {
var _this = this;
this.opt = {
id: params.id,
apiDomain: domain + '/api/lapp/live/talk/url',
filePath: filePathDomain + '/assets/ezuikit_v2.6.4',
decoderVersion: '',
accessToken: '',
url: '',
deviceSerial: '',
channelNo: '',
talkLink: '',
rtcUrl: '',
ttsUrl: '',
stream: '',
// 对讲插件依赖
isReliesReady: false,
template: 'simple',
plugin: [],
// 加载插件，talk-对讲
audio: 1,
// 声音id 0-不开启 1-开启
autoplay: 1,
fullScreenStatus: 0,
bSupporDoubleClickFull: true,
videoLoading: false,
};
this.params = params;
if (params.id) {
this.opt.id = params.id;
}
if (params.accessToken) {
this.opt.accessToken = params.accessToken;
}
if (typeof params.audio !== 'undefined') {
this.opt.audio = params.audio;
}
if (typeof params.decoderVersion !== 'undefined') {
this.opt.decoderVersion = params.decoderVersion;
}
if (typeof params.env !== 'undefined') {
if(typeof params.env.domain !== 'undefined'){
domain = params.env.domain;
this.opt.apiDomain = domain + '/api/lapp/live/talk/url';
}
if(typeof params.env.filePathDomain !== 'undefined'){
filePathDomain = params.env.filePathDomain;
this.opt.filePathDomain = params.env.filePathDomain;
}
}
if (params.url) {
this.opt.url = params.url;
this.opt.deviceSerial = params.url.split("/")[3];
this.opt.channelNo = params.url.split("/")[4].split(".")[0];
}
if (typeof params.template !== 'undefined') {
this.opt.template = params.template;
}
if (params.plugin) {
this.opt.plugin = params.plugin;
}
if (typeof params.autoplay !== 'undefined') {
this.opt.autoplay = params.autoplay ? 1 : 0;
}
if (typeof params.bSupporDoubleClickFull !== 'undefined') {
this.opt.bSupporDoubleClickFull = params.bSupporDoubleClickFull;
}
if (typeof params.handleTalkSuccess !== 'undefined') {
window.EZUIKit.handleTalkSuccess = params.handleTalkSuccess;
}
if (typeof params.handleTalkError !== 'undefined') {
window.EZUIKit.handleTalkError = params.handleTalkError;
}
var id = this.opt.id;
var domElement = document.getElementById(id); // 间隙
domElement.style.fontSize = 0;
domElement.style.overflowY = 'auto';
domElement.style.position = 'relative';
/**
* 渲染iframe视频框
*/
var iframe = document.createElement('iframe');
function matchIframeUrl() {
switch (_this.opt.template) {
case 'simple':
var iframeUrl = domain + "/ezopen/h5/iframe?bSupporDoubleClickFull=0&url=" + _this.opt.url.replace("?","&") + "&autoplay=" + _this.opt.autoplay + "&audio=" + _this.opt.audio + "&accessToken=" + params.accessToken + "&templete=0" + "&id=" + id + "&decoderVersion=" + _this.opt.decoderVersion;
var controlsValue = "";
if(typeof params.controls !== 'undefined' && params.controls){
console.log("typeof" ,typeof params.controls)
controlsValue = "play,voice,hd,fullScreen";
if(params.controls.length > 0){
controlsValue = params.controls.join(",");
iframeUrl += ('&controls=' + controlsValue);
}
}
if (params.websocketParams) {
iframeUrl += ('&websocketParams=' + JSON.stringify(params.websocketParams))
}
return iframeUrl;
case 'standard':
return domain + "/ezopen/h5/iframe?bSupporDoubleClickFull=0&url=" + _this.opt.url.replace("?","&") + "&autoplay=" + _this.opt.autoplay + "&audio=" + _this.opt.audio + "&accessToken=" + params.accessToken + "&templete=1" + "&id=" + id + "&decoderVersion=" + _this.opt.decoderVersion;
case 'security':
return domain + "/ezopen/h5/iframe_se?bSupporDoubleClickFull=0&url=" + _this.opt.url.replace("?","&") + "&autoplay=" + _this.opt.autoplay + "&audio=" + _this.opt.audio + "&accessToken=" + params.accessToken + "&templete=0" + "&id=" + id + "&decoderVersion=" + _this.opt.decoderVersion;
default:
return domain + "/ezopen/h5/iframe?bSupporDoubleClickFull=0&url=" + _this.opt.url.replace("?","&") + "&autoplay=" + _this.opt.autoplay + "&audio=" + _this.opt.audio + "&accessToken=" + params.accessToken + "&templete=0" + "&id=" + id + "&decoderVersion=" + _this.opt.decoderVersion;
}
}
iframe.src = matchIframeUrl(); // 默认取容器宽高
var iframeHeight = document.getElementById(id).offsetHeight;
var iframeWidth = document.getElementById(id).offsetWidth;
if (params.height) {
iframeHeight = parseInt(params.height);
if(/\%$/.test(params.height)) {
iframeWidth = document.getElementById(id).offsetWidth * (parseInt(params.height) /100);
}
}
if (params.width) {
iframeWidth = parseInt(params.width);
if(/\%$/.test(params.width)) {
iframeWidth = document.getElementById(id).offsetWidth * (parseInt(params.width) /100);
}
}
iframe.width = iframeWidth;
iframe.height = iframeHeight;
iframe.id = 'EZUIKitPlayer-' + id; // 部分iframe属性
iframe.setAttribute("allowfullscreen", true);
iframe.setAttribute("allow", "autoplay");
iframe.setAttribute("frameborder", 0);
domElement.appendChild(iframe);
var jqueryJS = _this.opt.filePath + '/js/jquery.js';
var layerJs = 'https://open.ys7.com/assets/layer/layer.js';
addJs(jqueryJS, function () {
addJs(layerJs, function () {
// });
// });
/**
* 渲染header
*/
if (matchHeaderOpt().headerContainer) {
// if (params.header && params.header instanceof Array) {
var headerContainer = document.createElement('div');
headerContainer.setAttribute('class', 'panel-top');
var controsDOM = document.createElement('div');
controsDOM.setAttribute('class', 'contros');
headerContainer.appendChild(controsDOM);
domElement.insertBefore(headerContainer, iframe);
if (matchHeaderOpt().capturePictureModule) {
// 截图
var capturePictureDOM = document.createElement('span');
capturePictureDOM.innerHTML = '<span title="截图">' + '<svg id="capturePicture" title="截图" t="1578882764585" class="icon" viewBox="0 0 1024 1024" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="5958" width="24" height="24">' + ' <path' + ' d="M887.296 315.904h-153.6c-51.2 0-68.096-102.4-119.296-102.4H392.704c-34.304 0-51.2 102.4-102.4 102.4h-153.6c-29.696 0-51.2 21.504-51.2 51.2v439.296c0 25.6 21.504 47.104 51.2 47.104h751.104c29.696 0 51.2-21.504 51.2-51.2v-435.2c-0.512-30.208-21.504-51.2-51.712-51.2zM512 768c-115.2 0-204.8-89.6-204.8-200.704s89.6-200.704 204.8-200.704 204.8 89.6 204.8 200.704-93.696 200.704-204.8 200.704z m247.296-354.304c-12.8 0-25.6-12.8-25.6-25.6s12.8-25.6 25.6-25.6 25.6 12.8 25.6 25.6c0 17.408-12.8 25.6-25.6 25.6zM256 264.704c0-8.704-8.704-16.896-16.896-16.896h-51.2c-8.704 0-16.896 8.704-16.896 16.896V281.6H256v-16.896z m256 148.992c-85.504 0-153.6 68.096-153.6 153.6s68.096 153.6 153.6 153.6 153.6-68.096 153.6-153.6-68.096-153.6-153.6-153.6z"' + ' fill="#ffffff" p-id="5959"></path>' + '</svg>' + '</span>';
capturePictureDOM.onclick = function () {
_this.capturePicture();
};
controsDOM.appendChild(capturePictureDOM);
}
console.log("matchHeaderOpt().saveModule", matchHeaderOpt().saveModule);
if (matchHeaderOpt().saveModule) {
var startSaveDOM = document.createElement('span');
startSaveDOM.innerHTML = '<span title="开始录像">' + ' <svg id="startSave" t="1578882716693" class="icon" viewBox="0 0 1024 1024" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="3782" width="24" height="24">' + ' <path' + ' d="M915.2 729.6l-128-76.8c-25.6-12.8-44.8-32-44.8-51.2V435.2c0-25.6 19.2-38.4 44.8-51.2l128-76.8c25.6-12.8 44.8 0 44.8 19.2V704c0 32-19.2 38.4-44.8 25.6z m-332.8 89.6H96c-51.2 0-89.6-38.4-89.6-89.6V332.8c0-51.2 38.4-89.6 89.6-89.6h486.4c51.2 0 89.6 38.4 89.6 89.6v396.8c0 51.2-38.4 89.6-89.6 89.6zM192 364.8c-32 6.4-57.6 32-64 64-12.8 57.6 38.4 115.2 96 102.4 32-6.4 57.6-32 64-70.4 12.8-57.6-38.4-108.8-96-96z m0 0"' + ' p-id="3783" fill="#ffffff"></path>' + ' </svg>' + '</span>';
startSaveDOM.onclick = function () {
_this.startSave();
document.getElementById('startSave').setAttribute('class', 'icon hide');
document.getElementById('stopSave').setAttribute('class', 'icon');
};
controsDOM.appendChild(startSaveDOM);
var stopSaveDOM = document.createElement('span');
stopSaveDOM.innerHTML = '<span title="结束录像">' + ' <svg id="stopSave" t="1578882716693" class="icon hide" viewBox="0 0 1024 1024" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="3782" width="24" height="24">' + ' <path' + ' d="M915.2 729.6l-128-76.8c-25.6-12.8-44.8-32-44.8-51.2V435.2c0-25.6 19.2-38.4 44.8-51.2l128-76.8c25.6-12.8 44.8 0 44.8 19.2V704c0 32-19.2 38.4-44.8 25.6z m-332.8 89.6H96c-51.2 0-89.6-38.4-89.6-89.6V332.8c0-51.2 38.4-89.6 89.6-89.6h486.4c51.2 0 89.6 38.4 89.6 89.6v396.8c0 51.2-38.4 89.6-89.6 89.6zM192 364.8c-32 6.4-57.6 32-64 64-12.8 57.6 38.4 115.2 96 102.4 32-6.4 57.6-32 64-70.4 12.8-57.6-38.4-108.8-96-96z m0 0"' + ' p-id="3783" fill="red"></path>' + ' </svg>' + ' </span>';
stopSaveDOM.onclick = function () {
_this.stopSave();
document.getElementById('stopSave').setAttribute('class', 'icon hide');
document.getElementById('startSave').setAttribute('class', 'icon');
};
controsDOM.appendChild(stopSaveDOM);
}
if (matchHeaderOpt().zoomModule) {
var enableZoomDOM = document.createElement('span');
enableZoomDOM.innerHTML = '<span title="开启电子放大">' + ' <svg id="enableZoom" t="1578882639834" class="icon" viewBox="0 0 1000 1000" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="2227" width="24" height="24">' + ' <path' + ' d="M830.6119 441.1089c0-193.7756-157.0939-350.8641-350.8775-350.8641S128.8559 247.3333 128.8559 441.1089 285.9508 791.972 479.7344 791.972 830.6119 634.8845 830.6119 441.1089zM483.2821 710.4863c-146.7975 0-265.8187-118.9953-265.8187-265.8088S336.4847 178.8697 483.2821 178.8697s265.8197 118.9953 265.8197 265.8078S630.0796 710.4863 483.2821 710.4863zM770.6031 653.5739l-72.6417 75.9485 141.6917 160.1814 82.0737-90.0739L770.6031 653.5739zM527.5849 267.4727h-88.60655762279428v132.90489048425167H306.0690340253259v88.60292721534799h132.90933675248866v132.9038911617923h88.60655762279428V488.9794719180395h132.90933675248866v-88.60292721534799H527.5849284006089V267.4726535408993z"' + ' p-id="2228" fill="#ffffff"></path>' + ' </svg>' + '</span>';
enableZoomDOM.onclick = function () {
_this.enableZoom();
document.getElementById('enableZoom').setAttribute('class', 'icon hide');
document.getElementById('closeZoom').setAttribute('class', 'icon');
};
controsDOM.appendChild(enableZoomDOM);
var closeZoomDOM = document.createElement('span');
closeZoomDOM.innerHTML = '<span title="关闭电子放大">' + ' <svg id="closeZoom" t="1578882639834" class="icon hide" viewBox="0 0 1000 1000" version="1.1"' + ' xmlns="http://www.w3.org/2000/svg" p-id="2227" width="24" height="24">' + ' <path' + ' d="M830.6119 441.1089c0-193.7756-157.0939-350.8641-350.8775-350.8641S128.8559 247.3333 128.8559 441.1089 285.9508 791.972 479.7344 791.972 830.6119 634.8845 830.6119 441.1089zM483.2821 710.4863c-146.7975 0-265.8187-118.9953-265.8187-265.8088S336.4847 178.8697 483.2821 178.8697s265.8197 118.9953 265.8197 265.8078S630.0796 710.4863 483.2821 710.4863zM770.6031 653.5739l-72.6417 75.9485 141.6917 160.1814 82.0737-90.0739L770.6031 653.5739zM527.5849 267.4727h-88.60655762279428v132.90489048425167H306.0690340253259v88.60292721534799h132.90933675248866v132.9038911617923h88.60655762279428V488.9794719180395h132.90933675248866v-88.60292721534799H527.5849284006089V267.4726535408993z"' + ' p-id="2228" fill="red"></path>' + ' </svg>' + '</span>';
closeZoomDOM.onclick = function () {
_this.closeZoom();
document.getElementById('closeZoom').setAttribute('class', 'icon hide');
document.getElementById('enableZoom').setAttribute('class', 'icon');
};
controsDOM.appendChild(closeZoomDOM);
}
}
/**
* 渲染footer
*/
/** 根据配置匹配底部渲染 */
function matchFooterOpt() {
var result = {
footerContainer: false,
talkModule: false,
broadcastModule: false,
hdModule: false,
fullScreenModule: false
};
var template = _this.opt.template;
switch (template) {
case 'simple':
if (params.footer && params.footer instanceof Array) {
var footer = params.footer;
result = {
footerContainer: true,
talkModule: footer.indexOf('talk') !== -1,
broadcastModule: footer.indexOf('broadcast') !== -1,
hdModule: footer.indexOf('hd') !== -1,
fullScreenModule: footer.indexOf('fullScreen') !== -1
};
}
break;
case 'standard':
if (params.footer && params.footer instanceof Array) {
var footer = params.footer;
result = {
footerContainer: true,
talkModule: footer.indexOf('talk') !== -1,
broadcastModule: footer.indexOf('broadcast') !== -1,
hdModule: footer.indexOf('hd') !== -1,
fullScreenModule: footer.indexOf('fullScreen') !== -1
};
}
break;
case 'security':
break;
case 'voice':
result = {
footerContainer: true,
talkModule: true,
broadcastModule: true,
hdModule: true,
fullScreenModule: true
};
break;
}
return result;
}
/** 根据配置匹配底部渲染 */
function matchHeaderOpt() {
var result = {
headerContainer: false,
capturePictureModule: false,
saveModule: false,
zoomModule: false
};
var template = _this.opt.template;
switch (template) {
case 'simple':
if (params.header && params.header instanceof Array) {
var header = params.header;
result = {
headerContainer: true,
capturePictureModule: header.indexOf('capturePicture') !== -1,
saveModule: header.indexOf('save') !== -1,
zoomModule: header.indexOf('zoom') !== -1
};
}
break;
case 'standard':
break;
case 'security':
break;
case 'voice':
result = {
headerContainer: true,
capturePictureModule: true,
saveModule: true,
zoomModule: true
};
break;
}
return result;
}
if (matchFooterOpt().footerContainer || _this.opt.plugin.indexOf('talk') !== -1) {
var recoderCSS = _this.opt.filePath + '/npm/css/recoder.css';
var recoderJs = _this.opt.filePath + '/npm/js/recoder.js';
var recorderJs = _this.opt.filePath + '/recorder.js'; // addCss()
addCss(recoderCSS, function () { });
addJs(recoderJs, function () {
addJs(recorderJs, function () { });
}); // 对讲模块
if (_this.opt.plugin.indexOf('talk') !== -1 || matchFooterOpt().talkModule) {
function apiSuccess(data) {
console.log("data", data);
if (data.code == 200) {
var apiResult = data.data;
if (apiResult) {
// 临时将https转换为websocket
var rtcTrunk = apiResult.rtcUrl;
if (rtcTrunk.indexOf("ws") === -1) {
rtcTrunk = rtcTrunk.replace("https", "wss").replace("rtcgw", "rtcgw-ws");
}
_this.opt.rtcUrl = rtcTrunk;
_this.opt.ttsUrl = "tts://" + apiResult.ttsUrl;
var talk = "talk://" + _this.opt.deviceSerial + ":0:" + _this.opt.channelNo + ":cas.ys7.com:6500";
_this.opt.talkLink = _this.opt.ttsUrl + "/" + talk;
_this.opt.stream = apiResult.stream;
console.log("_this.opt", _this.opt); // 加载依赖
if (!_this.opt.isReliesReady) {
var adapeterJS = _this.opt.filePath + '/npm/js/adapeter.js';
var janusJS = _this.opt.filePath + '/npm/js/janus.js';
var ttsJS = _this.opt.filePath + '/npm/js/tts.js';
console.log("加载jquery.js");
addJs(adapeterJS, function () {
console.log("加载adapeter.js");
addJs(janusJS, function () {
console.log("加载janus.js");
addJs(ttsJS, function () {
console.log("加载tts.js"); // 文件加载完毕;
_this.opt.isReliesReady = true;
});
});
});
} // 创建DOM
if (!document.getElementById("audioleft")) {
var audioleft = document.createElement('div');
audioleft.style.display = 'none';
audioleft.id = 'audioleft';
document.body.appendChild(audioleft);
}
if (!document.getElementById("audioright")) {
var audioright = document.createElement('div');
audioright.style.display = 'none';
audioright.id = 'audioright';
document.body.appendChild(audioright);
}
}
}
EZUIKit.opt = _this.opt;
}
function apiError(err) {
if (params.handleError) {
params.handleError(err);
}
}
request(_this.opt.apiDomain, 'POST', {
accessToken: _this.opt.accessToken,
deviceSerial: _this.opt.deviceSerial,
channelNo: _this.opt.channelNo
}, '', apiSuccess, apiError);
}
if (matchFooterOpt().footerContainer) {
// 底部容器
var footerContainer = document.createElement('div');
footerContainer.setAttribute("class", 'audio-controls');
domElement.appendChild(footerContainer);
if (matchFooterOpt().hdModule || matchFooterOpt().fullScreenModule) {
// 底部右侧元素
var rightContros = document.createElement('div');
rightContros.setAttribute('class', 'contros');
footerContainer.appendChild(rightContros);
if (matchFooterOpt().hdModule) {
// 高清-标清切换
var hdDom = document.createElement('span');
hdDom.setAttribute('id', 'video-hd');
hdDom.innerHTML = _this.opt.url.indexOf('.hd') === -1 ? '标清' : '高清';
hdDom.onclick = function () {
// 停止
if(_this.opt.videoLoading){
layer.msg("视频加载中，请稍后");
return false;
}else {
var stopPromise = _this.stop();
_this.opt.videoLoading = true;
stopPromise.then((data)=>{
_this.opt.videoLoading = false;
if (_this.opt.url.indexOf('.hd') === -1) {
_this.opt.url = _this.opt.url.replace('.live', '.hd.live');
hdDom.innerHTML = _this.opt.url.indexOf('.hd') === -1 ? '标清' : '高清';
} else {
_this.opt.url = _this.opt.url.replace('.hd.live', '.live');
hdDom.innerHTML = _this.opt.url.indexOf('.hd') === -1 ? '标清' : '高清';
}
_this.play(_this.opt.url)
})
.catch((error)=>{
console.log("error",error)
})
}
//iframe.src = domain +"/ezopen/h5/iframe?url=" + _this.opt.url.replace('.hd.live', '.live') + "&autoplay=1&audio=" + _this.opt.audio + "&accessToken=" + _this.opt.accessToken + "&templete=" + 0;
};
rightContros.appendChild(hdDom);
}
if (matchFooterOpt().fullScreenModule) {
// 声音控制
var openSoundDOM = document.createElement('span');
openSoundDOM.setAttribute('class', 'hide');
openSoundDOM.setAttribute('id', 'ezuikit-open-sound');
openSoundDOM.setAttribute('title', '打开声音');
openSoundDOM.setAttribute('style', 'vertical-align: top;');
openSoundDOM.innerHTML = '<svg t="1590476263239" class="icon" viewBox="0 0 1178 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2273" width="16" height="16"><path d="M665.6 51.2 665.6 51.2c-10.24-30.72-40.96-51.2-71.68-51.2-5.12 0-15.36 0-20.48 5.12l0 0L358.4 153.6 51.2 209.92l0 0C20.48 220.16 0 250.88 0 281.6 0 286.72 0 291.84 0 307.2l0 0 0 409.6 0 0c0 15.36 0 20.48 0 25.6 0 30.72 20.48 61.44 51.2 71.68l0 0L358.4 870.4l97.28 71.68 107.52 76.8 0 0c5.12 5.12 15.36 5.12 25.6 5.12 40.96 0 76.8-35.84 76.8-76.8 0-10.24 0-10.24 0-25.6l0 0L665.6 51.2zM563.2 870.4l-153.6-102.4-307.2-51.2L102.4 307.2l307.2-51.2 153.6-102.4L563.2 870.4z" p-id="2274" fill="#FF0000"></path><path d="M1049.6 537.6l112.64-112.64c20.48-20.48 20.48-56.32 0-76.8-20.48-20.48-56.32-20.48-76.8 0L972.8 460.8l-112.64-112.64c0 0 0 0 0 0-20.48-20.48-56.32-20.48-76.8 0 0 0 0 0 0 0-20.48 20.48-20.48 56.32 0 76.8l112.64 112.64-112.64 112.64c-20.48 20.48-20.48 56.32 0 76.8 20.48 20.48 56.32 20.48 76.8 0L972.8 614.4l112.64 112.64c20.48 20.48 56.32 20.48 76.8 0s20.48-56.32 0-76.8L1049.6 537.6z" p-id="2275" fill="#FF0000"></path></svg>';
openSoundDOM.onclick = function () {
_this.openSound(0);
openSoundDOM.setAttribute('class', 'hide');
closeSoundDOM.setAttribute('class', '');
}; // 声音控制
var closeSoundDOM = document.createElement('span');
openSoundDOM.setAttribute('id', 'ezuikit-close-sound');
closeSoundDOM.setAttribute('class', 'hide');
closeSoundDOM.setAttribute('title', '关闭声音');
closeSoundDOM.setAttribute('style', 'vertical-align: top;');
closeSoundDOM.innerHTML = '<svg t="1590414410633" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="20545" width="16" height="16"><path d="M840.533333 98.133333c-17.066667-17.066667-42.666667-17.066667-59.733333 0-17.066667 17.066667-17.066667 42.666667 0 59.733334C883.2 256 938.666667 392.533333 938.666667 533.333333c0 140.8-55.466667 277.333333-157.866667 375.466667-17.066667 17.066667-17.066667 42.666667 0 59.733333 8.533333 8.533333 21.333333 12.8 29.866667 12.8 8.533333 0 21.333333-4.266667 29.866666-12.8 115.2-110.933333 183.466667-268.8 183.466667-435.2 0-166.4-68.266667-324.266667-183.466667-435.2zM571.733333 12.8c-17.066667-8.533333-34.133333-4.266667-46.933333 8.533333L281.6 256H42.666667c-25.6 0-42.666667 17.066667-42.666667 42.666667v426.666666c0 25.6 17.066667 42.666667 42.666667 42.666667h238.933333l243.2 234.666667c8.533333 8.533333 17.066667 12.8 29.866667 12.8 4.266667 0 12.8 0 17.066666-4.266667 17.066667-8.533333 25.6-21.333333 25.6-38.4V51.2c0-17.066667-8.533333-34.133333-25.6-38.4zM512 870.4l-183.466667-179.2c-8.533333-4.266667-17.066667-8.533333-29.866666-8.533333H85.333333V341.333333h213.333334c12.8 0 21.333333-4.266667 29.866666-12.8L512 153.6v716.8z" p-id="20546" fill="#ffffff"></path><path d="M759.466667 349.866667c-12.8-21.333333-38.4-25.6-59.733334-8.533334-21.333333 12.8-25.6 38.4-8.533333 59.733334 21.333333 29.866667 34.133333 76.8 34.133333 123.733333 0 46.933333-12.8 93.866667-34.133333 123.733333-12.8 21.333333-8.533333 46.933333 8.533333 59.733334 8.533333 4.266667 17.066667 8.533333 25.6 8.533333 12.8 0 25.6-4.266667 34.133334-17.066667 34.133333-46.933333 51.2-106.666667 51.2-174.933333 0-68.266667-17.066667-128-51.2-174.933333z" p-id="20547" fill="#ffffff"></path></svg>';
closeSoundDOM.onclick = function () {
_this.closeSound(0);
openSoundDOM.setAttribute('class', '');
closeSoundDOM.setAttribute('class', 'hide');
};
rightContros.appendChild(openSoundDOM);
rightContros.appendChild(closeSoundDOM);
} // 根据当前音频配置展示
if (_this.opt.audio == 1) {
closeSoundDOM.setAttribute('class', '');
} else {
openSoundDOM.setAttribute('class', '');
_this.closeSound(0);
}
if (matchFooterOpt().fullScreenModule) {
// 全屏控制
var fullScreenDOM = document.createElement('span');
fullScreenDOM.setAttribute('title', '全屏');
fullScreenDOM.setAttribute('style', 'vertical-align: top;');
fullScreenDOM.innerHTML = '<svg id="fullScreen" t="1578020167938" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5035" width="16" height="16"> <path d="M348.373333 625.706667l-128 128-64 64v-128a33.28 33.28 0 0 0-35.413333-35.413334A33.493333 33.493333 0 0 0 85.333333 689.706667v213.333333A33.706667 33.706667 0 0 0 120.96 938.666667h213.333333a35.626667 35.626667 0 0 0 0-71.04h-128l64-64 128-128a35.2 35.2 0 0 0-49.92-49.92zM206.293333 156.373333h128a33.28 33.28 0 0 0 35.413334-35.413333A33.493333 33.493333 0 0 0 334.293333 85.333333H113.706667c-7.04 0-14.08 7.04-21.333334 14.293334a26.026667 26.026667 0 0 0-7.04 21.333333v213.333333a33.493333 33.493333 0 0 0 35.626667 35.413334 33.28 33.28 0 0 0 35.413333-35.413334v-128l192 192a35.2 35.2 0 0 0 49.92-49.92zM903.04 85.333333h-213.333333a33.493333 33.493333 0 0 0-35.413334 35.626667 33.28 33.28 0 0 0 35.413334 35.413333h128l-64 64-128 128a35.2 35.2 0 0 0 49.92 49.92l128-128 64-64v128a35.626667 35.626667 0 0 0 71.04 0v-213.333333A33.706667 33.706667 0 0 0 903.04 85.333333zM903.04 654.293333a33.28 33.28 0 0 0-35.413333 35.413334v128l-64-64-128-128a35.2 35.2 0 0 0-49.92 49.92l128 128 64 64h-128a35.626667 35.626667 0 0 0 0 71.04h213.333333A33.706667 33.706667 0 0 0 938.666667 903.04v-213.333333a33.493333 33.493333 0 0 0-35.626667-35.413334z" p-id="5036" fill="#ffffff"></path></svg>';
fullScreenDOM.onclick = function () {
_this.fullScreen();
};
rightContros.appendChild(fullScreenDOM);
}
}
if (matchFooterOpt().talkModule) {
// 对讲
var startTalkDOM = document.createElement('div');
var stopTalkDOM = document.createElement('div');
startTalkDOM.setAttribute("class", "ptp-talk off");
startTalkDOM.innerHTML = '<span title="对讲">' + '<svg t="1581930496966" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1641" width="16" height="16">' + ' <path' + ' d="M715.648 647.872c-30.208-22.336-61.568 39.36-100.992 77.44-39.36 38.08-34.112 31.488-123.392-17.088S311.488 540.224 280 491.648C248.448 443.072 265.472 424.704 265.472 424.704s78.72-62.976 97.152-81.344c18.368-18.368 13.12-30.208 13.12-30.208l-128.64-190.144c-23.616-5.184-64.32 5.12-128.576 57.6C54.208 233.088 30.592 353.856 151.296 575.68c120.768 221.824 347.84 330.752 485.568 374.08 137.856 43.328 228.416-61.696 249.408-103.68 21.056-41.984 13.12-85.312 13.12-85.312S745.856 670.208 715.648 647.872z"' + ' p-id="1642" fill="#ffffff"></path>' + ' <path' + ' d="M715.328 64C580.992 64 472.192 172.864 472.192 307.2s108.8 243.2 243.136 243.2 243.2-108.864 243.2-243.2S849.6 64 715.328 64zM715.328 461.056c-84.992 0-153.856-68.864-153.856-153.856s68.864-153.856 153.856-153.856 153.856 68.928 153.856 153.856S800.32 461.056 715.328 461.056z"' + ' p-id="1643" fill="#ffffff"></path>' + ' <path' + ' d="M777.472 277.376c-18.176 0-32.96-14.784-32.96-33.024 0-8.448 3.136-16.064 8.32-21.888-11.52-5.12-24.128-8-37.568-8-51.2 0-92.672 41.472-92.672 92.736s41.472 92.736 92.672 92.736S808.064 358.4 808.064 307.2c0-13.696-3.072-26.688-8.384-38.4C793.728 274.112 786.048 277.376 777.472 277.376zM715.328 340.928c-18.624 0-33.664-15.104-33.664-33.728 0-18.624 15.04-33.728 33.664-33.728 18.688 0 33.728 15.104 33.728 33.728C749.056 325.824 734.016 340.928 715.328 340.928z"' + ' p-id="1644" fill="#ffffff"></path>' + ' </svg>' + ' </span>' + ' <span>开启对讲</span>';
startTalkDOM.onclick = function () {
console.log("EZUIKit.state.countTimer", EZUIKit.state.countTimer);
if (EZUIKit.state.countTimer) {
window.layer.msg("语音设备正忙，请稍后重试");
return false;
}
countTime('add', 0);
console.log("开始对讲，关闭声音");
_this.closeSound(0);
console.log(_this.opt);
_this.startTalk();
this.setAttribute("class", "ptp-talk off hide");
stopTalkDOM.setAttribute("class", "ptp-talk on");
};
stopTalkDOM.setAttribute("class", "ptp-talk on hide");
stopTalkDOM.innerHTML = '<span title="对讲">' + ' <svg t="1581930496966" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1641" width="16" height="16">' + ' <path' + ' d="M715.648 647.872c-30.208-22.336-61.568 39.36-100.992 77.44-39.36 38.08-34.112 31.488-123.392-17.088S311.488 540.224 280 491.648C248.448 443.072 265.472 424.704 265.472 424.704s78.72-62.976 97.152-81.344c18.368-18.368 13.12-30.208 13.12-30.208l-128.64-190.144c-23.616-5.184-64.32 5.12-128.576 57.6C54.208 233.088 30.592 353.856 151.296 575.68c120.768 221.824 347.84 330.752 485.568 374.08 137.856 43.328 228.416-61.696 249.408-103.68 21.056-41.984 13.12-85.312 13.12-85.312S745.856 670.208 715.648 647.872z"' + ' p-id="1642" fill="#ff0000"></path>' + ' <path' + ' d="M715.328 64C580.992 64 472.192 172.864 472.192 307.2s108.8 243.2 243.136 243.2 243.2-108.864 243.2-243.2S849.6 64 715.328 64zM715.328 461.056c-84.992 0-153.856-68.864-153.856-153.856s68.864-153.856 153.856-153.856 153.856 68.928 153.856 153.856S800.32 461.056 715.328 461.056z"' + ' p-id="1643" fill="#ff0000"></path>' + ' <path' + ' d="M777.472 277.376c-18.176 0-32.96-14.784-32.96-33.024 0-8.448 3.136-16.064 8.32-21.888-11.52-5.12-24.128-8-37.568-8-51.2 0-92.672 41.472-92.672 92.736s41.472 92.736 92.672 92.736S808.064 358.4 808.064 307.2c0-13.696-3.072-26.688-8.384-38.4C793.728 274.112 786.048 277.376 777.472 277.376zM715.328 340.928c-18.624 0-33.664-15.104-33.664-33.728 0-18.624 15.04-33.728 33.664-33.728 18.688 0 33.728 15.104 33.728 33.728C749.056 325.824 734.016 340.928 715.328 340.928z"' + ' p-id="1644" fill="#ff0000"></path>' + ' </svg>' + ' </span>' + '<span>关闭对讲</span>';
stopTalkDOM.onclick = function () {
console.log(_this.opt);
_this.stopTalk();
countTime('destory', 0);
_this.openSound(0);
this.setAttribute("class", "ptp-talk on hide");
startTalkDOM.setAttribute("class", "ptp-talk off");
};
footerContainer.appendChild(startTalkDOM);
footerContainer.appendChild(stopTalkDOM);
}
if (matchFooterOpt().broadcastModule) {
var startBroadcastDOM = document.createElement('div');
var stopBroadcastDOM = document.createElement('div');
startBroadcastDOM.setAttribute("class", 'broadcast off');
stopBroadcastDOM.setAttribute("class", "broadcast on hide");
startBroadcastDOM.innerHTML = ' <span title="语音播报">' + ' <svg t="1583561695846" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1126" width="16" height="16">' + ' <path' + ' d="M513.82044445 964.38044445c-8.192 0-15.47377778-2.73066667-21.84533334-8.192 0 0-46.42133333-41.87022222-99.21422222-86.47111112-89.20177778-73.728-117.41866667-88.29155555-123.79022222-90.112H35.04355555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666V271.70133333c0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666666H246.21511111c7.28177778-2.73066667 37.31911111-15.47377778 137.44355556-91.02222222 58.25422222-43.69066667 111.04711111-86.47111111 111.04711111-86.47111112 5.46133333-4.55111111 12.74311111-7.28177778 20.02488889-7.28177778 4.55111111 0 10.01244445 0.91022222 14.56355555 3.6408889 10.92266667 5.46133333 18.20444445 17.29422222 18.20444445 30.03733333v837.40444444c0 12.74311111-7.28177778 25.48622222-19.11466667 30.94755556-5.46133333 1.82044445-10.01244445 2.73066667-14.56355555 2.73066667zM270.79111111 724.992c19.11466667 0 48.24177778 8.192 167.48088889 106.496 16.384 13.65333333 33.67822222 28.21688889 51.88266667 43.69066667l5.46133333 4.55111111V139.71911111l-5.46133333 3.64088889c-22.75555555 17.29422222-44.60088889 34.58844445-65.536 50.06222222C293.54666667 291.72622222 264.41955555 299.008 245.30488889 299.008H82.37511111c-20.02488889 0-21.84533333 12.74311111-21.84533333 26.39644445V694.04444445c0 23.66577778 6.37155555 30.03733333 28.21688889 30.03733333h180.224l1.82044444 0.91022222z m520.64711111 162.01955555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666 0-11.83288889 8.192-20.02488889 16.384-24.576 112.86755555-67.35644445 182.04444445-191.14666667 182.04444444-324.03911111 0-132.89244445-70.08711111-256.68266667-182.04444444-324.03911111-10.01244445-5.46133333-15.47377778-14.56355555-15.47377778-24.576 0-14.56355555 11.83288889-27.30666667 26.39644445-27.30666667 5.46133333 0 10.01244445 1.82044445 16.384 5.46133333 128.34133333 76.45866667 207.53066667 218.45333333 207.53066666 369.55022222 0 152.00711111-80.09955555 293.09155555-208.44088889 369.55022223-6.37155555 5.46133333-10.92266667 7.28177778-16.384 7.28177777z m-90.112-152.91733333c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666667 0-10.01244445 4.55111111-18.20444445 12.74311111-23.66577777 61.89511111-34.58844445 100.12444445-100.12444445 100.12444444-171.12177778 0-70.08711111-37.31911111-134.71288889-96.48355555-170.21155555-8.192-4.55111111-12.74311111-13.65333333-12.74311111-23.66577778 0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666667 4.55111111 0 11.83288889 2.73066667 15.47377778 4.55111111 74.63822222 44.60088889 121.96977778 127.43111111 121.96977778 215.72266667 0 90.112-48.24177778 173.85244445-125.61066667 218.45333333-1.82044445 0-9.10222222 4.55111111-15.47377778 4.55111111z"' + ' fill="#ffffff" p-id="1127"></path>' + ' </svg>' + '</span>' + '<span>语音播报</span>';
startBroadcastDOM.onclick = function () {
this.setAttribute("class", "broadcast off hide");
stopBroadcastDOM.setAttribute("class", "broadcast on");
};
stopBroadcastDOM.innerHTML = '<div class="pop-hover">' + ' <div class="pop-hover-content">' + ' <div class="vioce-list" id="voice-list">' + ' <ul class="voice-list-ul">' + ' </ul>' + ' <div id="voice-list-end"></div>' + ' </div>' + ' <div id="voice-custom" style="text-align: center;">自定义语音</div>' + ' </div>' + '</div>' + '<span title="语音播报">' + ' <svg t="1583561695846" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1126" width="16" height="16">' + ' <path' + ' d="M513.82044445 964.38044445c-8.192 0-15.47377778-2.73066667-21.84533334-8.192 0 0-46.42133333-41.87022222-99.21422222-86.47111112-89.20177778-73.728-117.41866667-88.29155555-123.79022222-90.112H35.04355555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666V271.70133333c0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666666H246.21511111c7.28177778-2.73066667 37.31911111-15.47377778 137.44355556-91.02222222 58.25422222-43.69066667 111.04711111-86.47111111 111.04711111-86.47111112 5.46133333-4.55111111 12.74311111-7.28177778 20.02488889-7.28177778 4.55111111 0 10.01244445 0.91022222 14.56355555 3.6408889 10.92266667 5.46133333 18.20444445 17.29422222 18.20444445 30.03733333v837.40444444c0 12.74311111-7.28177778 25.48622222-19.11466667 30.94755556-5.46133333 1.82044445-10.01244445 2.73066667-14.56355555 2.73066667zM270.79111111 724.992c19.11466667 0 48.24177778 8.192 167.48088889 106.496 16.384 13.65333333 33.67822222 28.21688889 51.88266667 43.69066667l5.46133333 4.55111111V139.71911111l-5.46133333 3.64088889c-22.75555555 17.29422222-44.60088889 34.58844445-65.536 50.06222222C293.54666667 291.72622222 264.41955555 299.008 245.30488889 299.008H82.37511111c-20.02488889 0-21.84533333 12.74311111-21.84533333 26.39644445V694.04444445c0 23.66577778 6.37155555 30.03733333 28.21688889 30.03733333h180.224l1.82044444 0.91022222z m520.64711111 162.01955555c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666666 0-11.83288889 8.192-20.02488889 16.384-24.576 112.86755555-67.35644445 182.04444445-191.14666667 182.04444444-324.03911111 0-132.89244445-70.08711111-256.68266667-182.04444444-324.03911111-10.01244445-5.46133333-15.47377778-14.56355555-15.47377778-24.576 0-14.56355555 11.83288889-27.30666667 26.39644445-27.30666667 5.46133333 0 10.01244445 1.82044445 16.384 5.46133333 128.34133333 76.45866667 207.53066667 218.45333333 207.53066666 369.55022222 0 152.00711111-80.09955555 293.09155555-208.44088889 369.55022223-6.37155555 5.46133333-10.92266667 7.28177778-16.384 7.28177777z m-90.112-152.91733333c-14.56355555 0-26.39644445-11.83288889-26.39644444-27.30666667 0-10.01244445 4.55111111-18.20444445 12.74311111-23.66577777 61.89511111-34.58844445 100.12444445-100.12444445 100.12444444-171.12177778 0-70.08711111-37.31911111-134.71288889-96.48355555-170.21155555-8.192-4.55111111-12.74311111-13.65333333-12.74311111-23.66577778 0-14.56355555 11.83288889-27.30666667 26.39644444-27.30666667 4.55111111 0 11.83288889 2.73066667 15.47377778 4.55111111 74.63822222 44.60088889 121.96977778 127.43111111 121.96977778 215.72266667 0 90.112-48.24177778 173.85244445-125.61066667 218.45333333-1.82044445 0-9.10222222 4.55111111-15.47377778 4.55111111z"' + ' fill="#ff0000" p-id="1127"></path>' + ' </svg>' + '</span>' + '<span>语音播报</span>'; // //自定义语音唤起
// document.getElementById("voice-custom").onclick = function(){
// console.log("显示自定义语音");
// }
stopBroadcastDOM.onclick = function () {
this.setAttribute("class", "broadcast on hide");
startBroadcastDOM.setAttribute("class", "broadcast off");
};
footerContainer.appendChild(startBroadcastDOM);
footerContainer.appendChild(stopBroadcastDOM); // 召唤自定义语言
document.getElementById("voice-custom").onclick = function () {
console.log("显示自定义语音");
startSpeakDOM.setAttribute('class', 'speak off');
}; // 获取语音列表
fetchVoiceList(0);
function fetchVoiceList(page) {
function apiSuccess(data) {
console.log("data", data);
if (data.code == 200) {
randerVoliceList(data.data, 5);
EZUIKit.state.page = data.page.page; // 如果用户语音列表为空
if (page == 0 && data.data.length == 0 && !EZUIKit.state.fetchDefaultList) {
// 获取用户语音为空
EZUIKit.state.fetchDefaultList = true;
fetchVoiceList(0);
}
}
}
function apiError(err) {
console.log("err", err);
}
request( domain + '/api/lapp/voice/query', 'POST', {
accessToken: _this.opt.accessToken,
pageStart: page,
pageSize: EZUIKit.state.pageSize,
default: EZUIKit.state.fetchDefaultList ? 'true' : 'false'
}, '', apiSuccess, apiError);
}
function randerVoliceList(data) {
console.log("renderVoliceList", data);
if (data && data.length > 0) {
for (var i = 0; i < data.length; i++) {
var voiceItem = document.createElement('li');
voiceItem.innerHTML = "<li class='voice-item' id='voice-item-" + i + "' data-time=" + (data[i]["duration"] || 20) + " data-url=" + data[i]["fileUrl"] + ">" + (data[i]["voiceName"].length > 10 ? data[i]["voiceName"].substr(0, 10) + "..." : data[i]["voiceName"]) + "</li>";
document.getElementsByClassName('voice-list-ul')[0].append(voiceItem); // "<li class='voice-item' id='voice-item-" + i + "' data-time=" + (data[i]["duration"] || 20) + " data-url=" + data[i]["fileUrl"] + ">" + (data[i]["voiceName"].length > 10 ? (data[i]["voiceName"].substr(0, 10) + "...") : data[i]["voiceName"]) + "</li>";
// $("#voice-list ul").append("<li class='voice-item' id='voice-item-" + i + "' data-time=" + (data[i]["duration"] || 20) + " data-url=" + data[i]["fileUrl"] + ">" + (data[i]["voiceName"].length > 10 ? (data[i]["voiceName"].substr(0, 10) + "...") : data[i]["voiceName"]) + "</li>");
voiceItem.onclick = function (e) {
console.log("点击元素", e.target, e.target.dataset.url);
var voiceUrl = e.target.dataset.url;
var time = e.target.dataset.time;
playListOfVoice(voiceUrl, time);
};
}
if (data.length === EZUIKit.state.pageSize) {
document.getElementById('voice-list-end').innerHTML = "向下滚动加载更多";
} else {
document.getElementById('voice-list-end').innerHTML = "没有更多数据了";
}
}
}
function playListOfVoice(voiceUrl, time) {
console.log("播放语音", voiceUrl, time); // decoder && decoder.closeSound(0);
function apiSuccess(data) {
console.log("data.data", data.data);
if (data.code == 200) {
// $("#startBroadcast").show();
// $("#stopBroadcast").hide();
countTime('sub', parseInt(time));
} else if (data.code == "10001") {
window.layer.msg("未找到当前语音");
} else {
window.layer.msg(data.msg || '发送失败，请稍后再试');
} // padding = false;
}
function apiError(err) {
console.log("err", err);
}
request( domain + '/api/lapp/voice/send', 'POST', {
accessToken: _this.opt.accessToken,
deviceSerial: _this.opt.deviceSerial,
channelNo: _this.opt.channelNo,
fileUrl: voiceUrl
}, '', apiSuccess, apiError);
} // 自定义语音
// 对讲
var startSpeakDOM = document.createElement('div');
var stopSpeakDOM = document.createElement('div');
startSpeakDOM.setAttribute('class', 'speak off hide');
stopSpeakDOM.setAttribute('class', 'speak on hide');
startSpeakDOM.setAttribute('id', 'startSpeak');
stopSpeakDOM.setAttribute('id', 'stopSpeak');
startSpeakDOM.innerHTML = '<span title="按住说话">' + ' <svg t="1581994757678" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1639" width="16" height="16">' + ' <path' + ' d="M757.059829 393.846154v-52.512821h262.564103v52.512821H757.059829z m-420.102564 481.367521v96.273504h175.042735a8.752137 8.752137 0 0 1 8.752137 8.752137v35.008547a8.752137 8.752137 0 0 1-8.752137 8.752137H109.401709a8.752137 8.752137 0 0 1-8.752136-8.752137v-35.008547a8.752137 8.752137 0 0 1 8.752136-8.752137h175.042735v-96.273504C129.767932 875.213675 4.376068 749.821812 4.376068 595.145299V463.863248a26.25641 26.25641 0 1 1 52.512821 0v113.777778c0 140.174222 113.637744 253.811966 253.811966 253.811965s253.811966-113.637744 253.811966-253.811965V463.863248a26.25641 26.25641 0 1 1 52.51282 0v131.282051c0 154.676513-125.391863 280.068376-280.068376 280.068376z m-26.25641-96.273504c-111.178393 0-201.299145-90.120752-201.299146-201.299145V201.299145C109.401709 90.120752 199.522462 0 310.700855 0s201.299145 90.120752 201.299145 201.299145v376.341881c0 111.178393-90.120752 201.299145-201.299145 201.299145z m691.418803-280.068376H757.059829v-52.512821h245.059829v52.512821z m-17.504273 105.025641H757.059829v-52.512821h227.555556v52.512821z m-17.504274 105.025641H757.059829v-52.512821h210.051282v52.512821z m-8.752137 105.025641H757.059829v-52.512821h201.299145v52.512821z m-17.504273 105.025641H757.059829v-52.512821h183.794872v52.512821z m-26.25641 105.025641H757.059829v-52.512821h157.538462v52.512821z"' + ' p-id="1640" fill="#ffffff"></path>' + ' </svg>' + '</span>' + '<span>按住说话</span>';
stopSpeakDOM.innerHTML = '<span title="按住说话">' + '<svg t="1581994757678" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"' + ' p-id="1639" width="16" height="16">' + ' <path' + ' d="M757.059829 393.846154v-52.512821h262.564103v52.512821H757.059829z m-420.102564 481.367521v96.273504h175.042735a8.752137 8.752137 0 0 1 8.752137 8.752137v35.008547a8.752137 8.752137 0 0 1-8.752137 8.752137H109.401709a8.752137 8.752137 0 0 1-8.752136-8.752137v-35.008547a8.752137 8.752137 0 0 1 8.752136-8.752137h175.042735v-96.273504C129.767932 875.213675 4.376068 749.821812 4.376068 595.145299V463.863248a26.25641 26.25641 0 1 1 52.512821 0v113.777778c0 140.174222 113.637744 253.811966 253.811966 253.811965s253.811966-113.637744 253.811966-253.811965V463.863248a26.25641 26.25641 0 1 1 52.51282 0v131.282051c0 154.676513-125.391863 280.068376-280.068376 280.068376z m-26.25641-96.273504c-111.178393 0-201.299145-90.120752-201.299146-201.299145V201.299145C109.401709 90.120752 199.522462 0 310.700855 0s201.299145 90.120752 201.299145 201.299145v376.341881c0 111.178393-90.120752 201.299145-201.299145 201.299145z m691.418803-280.068376H757.059829v-52.512821h245.059829v52.512821z m-17.504273 105.025641H757.059829v-52.512821h227.555556v52.512821z m-17.504274 105.025641H757.059829v-52.512821h210.051282v52.512821z m-8.752137 105.025641H757.059829v-52.512821h201.299145v52.512821z m-17.504273 105.025641H757.059829v-52.512821h183.794872v52.512821z m-26.25641 105.025641H757.059829v-52.512821h157.538462v52.512821z"' + ' p-id="1640" fill="#ff0000"></path>' + '</svg>' + '</span>' + '<span>松开发送</span>';
footerContainer.appendChild(startSpeakDOM);
footerContainer.appendChild(stopSpeakDOM);
document.getElementById("voice-list").onscroll = function (e) {
var sum = this.scrollHeight;
console.log("sum", sum, this.scrollTop, document.getElementById("voice-list").clientHeight);
if (sum <= this.scrollTop + this.clientHeight) {
console.log("拖动到底，执行加载", EZUIKit.state.page);
fetchVoiceList(++EZUIKit.state.page);
}
}; // $("#voice-list").unbind("scroll").bind("scroll", function (e) {
// // console.log("e",e,this.scrollHeight, $(this).scrollTop() + $(this).height())
// var sum = this.scrollHeight;
// if (sum <= $(this).scrollTop() + $(this).height()) {
// console.log("拖动到底，执行加载", page);
// fetchVoiceList(++page);
// }
// loading = false;
// });
// time-area
var timeAreaDOM = document.createElement('div');
timeAreaDOM.setAttribute('class', 'time-area');
timeAreaDOM.setAttribute('id', 'time-area');
timeAreaDOM.innerHTML = '00:00';
footerContainer.appendChild(timeAreaDOM); // 按住说话
var recorder;
document.getElementById('startSpeak').onmousedown = function () {
if (EZUIKit.state.countTimer) {
window.layer.msg("语音设备正忙，请稍后重试");
return false;
}
console.log("按住说话");
startSpeakDOM.setAttribute('class', 'speak off hide');
stopSpeakDOM.setAttribute('class', 'speak on'); // console.log("startRecording",startRecording);
// startRecording();
voiceInit();
countTime('add', 0);
setTimeout(function () {
EZUIKit.state.recodeTime = 0;
startRecording();
}, 1000);
if (EZUIKit.state.recodeTimer) {
// 先清空计数器
clearInterval(EZUIKit.state.recodeTimer);
}
EZUIKit.state.recodeTimer = setInterval(function () {
if (EZUIKit.state.recodeTime >= 59) {
_this.stopTalk();
countTime('destory', 0);
this.setAttribute("class", "ptp-talk on hide");
startTalkDOM.setAttribute("class", "ptp-talk off");
window.layer.msg("不超过1分钟");
} else {
EZUIKit.state.recodeTime = EZUIKit.state.recodeTime + 1;
}
}, 1000);
/** 录音控制 */
var audio_context;
function startUserMedia(stream) {
var input = audio_context.createMediaStreamSource(stream);
recorder = new window.Recorder(input);
}
function startRecording() {
recorder && recorder.record();
}
function stopRecording() {
recorder && recorder.stop();
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);
window.layer.msg('No web audio support in this browser!');
}
navigator.getUserMedia({
audio: true
}, startUserMedia, function (e) {
console.log('No live audio input: ' + e);
});
}
;
}; // 松开发送
document.getElementById('stopSpeak').onmouseup = function () {
console.log("松开发送");
stopSpeakDOM.setAttribute('class', 'speak on hide');
stopSpeakFun();
function stopSpeakFun() {
countTime('destory', 0);
if (EZUIKit.state.recodeTime < 1) {
window.layer.msg("说话时间过短");
clearInterval(EZUIKit.state.recodeTimer);
return false;
}
clearInterval(EZUIKit.state.recodeTimer);
wavUpload();
}
function wavUpload() {
try {
recorder && recorder.stop(); // createAudioDom();
recorder && recorder.exportWAV(function (wav_file) {
console.log("wav_file", wav_file);
if (wav_file.size < 1000) {
window.layer.msg("录音失败，请重试"); // recodeTime = 0;
EZUIKit.state.recodeTime = 0;
return false;
} // 测试
countTime('sub', EZUIKit.state.recodeTime + 2); // 延时
var formdata = new FormData(); // form 表单 {key:value}
formdata.append("voiceFile", wav_file); // form input type="file"
formdata.append("accessToken", _this.opt.accessToken);
formdata.append("deviceSerial", _this.opt.deviceSerial);
formdata.append("channelNo", _this.opt.channelNo); // padding = true;
function apiSuccess(data) {
console.log("data.data", data.data);
if (data.code == 200) {
// $("#startBroadcast").show();
// $("#stopBroadcast").hide();
countTime('sub', EZUIKit.state.recodeTime + 2);
} else if (data.code == "10001") {
window.layer.msg("未找到当前语音");
} else {
window.layer.msg(data.msg || '发送失败，请稍后再试');
} // padding = false;
}
function apiError(err) {
console.log("err", err);
}
request(domain + '/api/lapp/voice/sendonce', 'POST', {
voiceFile: wav_file,
accessToken: _this.opt.accessToken,
deviceSerial: _this.opt.deviceSerial,
channelNo: _this.opt.channelNo
}, '', apiSuccess, apiError);
});
recorder && recorder.clear();
} catch (err) {
console.log(err);
}
}
};
}
/* 时间计数 */
function countTime(type, start) {
clearInterval(EZUIKit.state.countTimer);
if (type === 'add') {
var i = start;
EZUIKit.state.countTimer = setInterval(function () {
++i;
document.getElementById("time-area").innerHTML = formatSeconds(i);
}, 1000);
} else if (type === 'sub') {
var i = start;
EZUIKit.state.countTimer = setInterval(function () {
if (i > 0) {
i--;
document.getElementById("time-area").innerHTML = formatSeconds(i);
} else {
clearInterval(EZUIKit.state.countTimer);
EZUIKit.state.countTimer = undefined;
console.log("倒计时结束，开启声音"); // decoder.openSound(0);
}
}, 1000);
} else if (type === 'destory') {
clearInterval(EZUIKit.state.countTimer);
EZUIKit.state.countTimer = undefined;
document.getElementById("time-area").innerHTML = '00:00';
} //将秒数转换为时分秒格式
function formatSeconds(value) {
var theTime = parseInt(value); // 秒
var middle = 0; // 分
var hour = 0; // 小时
var secondV = '00';
var minV = '00';
var hourV = '00';
if (theTime > 59) {
middle = parseInt(theTime / 60);
theTime = parseInt(theTime % 60);
if (middle > 59) {
hour = parseInt(middle / 60);
middle = parseInt(middle % 60);
}
}
secondV = parseInt(theTime) > 9 ? parseInt(theTime) : '0' + parseInt(theTime);
minV = parseInt(middle) > 9 ? parseInt(middle) : '0' + parseInt(middle);
hourV = parseInt(hour) > 9 ? parseInt(hour) : '0' + parseInt(hour);
if (hour > 0) {
return hourV + ':' + minV + ':' + secondV;
} else if (middle > 0) {
return minV + ':' + secondV;
} else {
return '00:' + secondV;
}
}
}
/* 将秒数转换为时分秒格式 */
function formatSeconds(value) {
var theTime = parseInt(value); // 秒
var middle = 0; // 分
var hour = 0; // 小时
var secondV = '00';
var minV = '00';
var hourV = '00';
if (theTime > 59) {
middle = parseInt(theTime / 60);
theTime = parseInt(theTime % 60);
if (middle > 59) {
hour = parseInt(middle / 60);
middle = parseInt(middle % 60);
}
}
secondV = parseInt(theTime) > 9 ? parseInt(theTime) : '0' + parseInt(theTime);
minV = parseInt(middle) > 9 ? parseInt(middle) : '0' + parseInt(middle);
hourV = parseInt(hour) > 9 ? parseInt(hour) : '0' + parseInt(hour);
if (hour > 0) {
return hourV + ':' + minV + ':' + secondV;
} else if (middle > 0) {
return minV + ':' + secondV;
} else {
return '00:' + secondV;
}
}
}
}
})
})
// iframe 传递数据
var _this = this;
window.addEventListener("message", function (event) {
console.log("EZUIKitPlayer收到反馈", event);
var origin = event.origin;
var id = _this.opt.id;
if (event.data.type) {
switch (event.data.type) {
case 'openSound':
if (id == event.data.id && params.openSoundCallBack) {
params.openSoundCallBack(event.data);
}
break;
case 'closeSound':
if (id == event.data.id && params.closeSoundCallBack) {
params.closeSoundCallBack(event.data);
}
break;
case 'capturePicture':
if (id == event.data.id && params.capturePictureCallBack) {
params.capturePictureCallBack(event.data);
}
break;
case 'startSave':
if (id == event.data.id && params.startSaveCallBack) {
params.startSaveCallBack(event.data);
}
break;
case 'stopSave':
if (id == event.data.id && params.stopSaveCallBack) {
params.stopSaveCallBack(event.data);
}
break;
case 'fullScreen':
if (id == event.data.id && params.fullScreenCallBack) {
params.fullScreenCallBack(event.data);
}
break;
case 'getOSDTime':
if (id == event.data.id && params.getOSDTimeCallBack) {
params.getOSDTimeCallBack(event.data);
}
break;
case 'handleSuccess':
if (id == event.data.id && params.handleSuccess) {
params.handleSuccess(event.data);
}
break;
case 'handleError':
if (id == event.data.id && params.handleError) {
params.handleError(event.data);
}
break;
case 'dblclick':
if (id == event.data.id && _this.opt.bSupporDoubleClickFull) {
if(_this.opt.fullScreenStatus === 0){
_this.fullScreen();
} else {
_this.cancelFullScreen();
}
}
break;
}
}
});
// 全屏变化回调
function fullscreenchange(data) {
_this.opt.fullScreenStatus = data ? 1 : 0;
if (params.fullScreenChangeCallBack) {
params.fullScreenChangeCallBack({data:data,id: _this.opt.id});
}
}
if (typeof document.fullScreen !== "undefined") {
document.addEventListener("fullscreenchange", function() {
var e = document.fullscreen || false;
fullscreenchange(e)
})
} else if (typeof document.webkitIsFullScreen !== "undefined") {
document.addEventListener("webkitfullscreenchange", function() {
var e = document.webkitIsFullScreen || false;
fullscreenchange(e)
})
} else if (typeof document.mozFullScreen !== "undefined") {
document.addEventListener("mozfullscreenchange", function() {
var e = document.mozFullScreen || false;
fullscreenchange(e)
})
}
}; // 播放相关API
EZUIKitPlayer.prototype.play = function (data) {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
if (typeof data === 'object' && data.url) {
this.opt.url = data.url;
}
if (typeof data === 'object' && data.accessToken) {
this.opt.accessToken = data.accessToken;
}
if (typeof data === 'string') {
this.opt.url = data;
}
player.postMessage({
action: "play",
accessToken: this.opt.accessToken,
url: this.opt.url
}, domain + "/ezopen/h5/iframe");
var _this = this;
this.opt.videoLoading = true;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'handleSuccess') {
setTimeout(()=>{
_this.opt.videoLoading = false;
},1000)
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.stop = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("stop", domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'stop') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.openSound = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("openSound", domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'openSound') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.closeSound = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("closeSound", domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'closeSound') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.startSave = function (fileName) {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage({
action: "startSave",
fileName: fileName || 'default'
}, domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'startSave') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.stopSave = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("stopSave", domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'stopSave') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.fullScreen = function () {
if(this.opt.fullScreenStatus === 1){
return false
}
var _this = this;
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) {
// console.log('移动端全屏');
var width = document.documentElement.clientWidth;
var height = document.documentElement.clientHeight;
// wrapper = document.getElementById("test"),
var wrapper = document.body;//document.body 属性返回 <body> 元素， document.documentElement 属性返回 <html> 元素。
wrapper =document.getElementById(id);
var style = "";
style += "width:" + height + "px;";// 注意旋转后的宽高切换
style += "height:" + width + "px;";
style += "-webkit-transform: rotate(90deg); transform: rotate(90deg);";
// 注意旋转中点的处理
style += "-webkit-transform-origin: " + width / 2 + "px " + width / 2 + "px;";
style += "transform-origin: " + width / 2 + "px " + width / 2 + "px;";
style += 'position: fixed;top: 0;left: 0;z-index:10';
wrapper.style.cssText = style;
var cancelFullDOM = document.createElement('div');
cancelFullDOM.id = id + "cancel-full-screen"
var cancelFullDOMStyle="width:30px;height:"+height+"px;z-index:1000;position:fixed;top:0px;right:0px;";
cancelFullDOMStyle += "background-image: url(https://resource.ys7cloud.com/group1/M00/00/7E/CtwQE1-01qeAH2wAAAABOliqQ5g167.png);"
cancelFullDOMStyle += "background-size: contain;background-repeat:no-repeat;background-color:rgba(0,0,0,0.2)"
cancelFullDOM.style = cancelFullDOMStyle;
cancelFullDOM.onclick = function(){
_this.cancelFullScreen();
}
document.body.appendChild(cancelFullDOM);
setTimeout(function () {
player.postMessage('autoResize', domain + "/ezopen/h5/iframe")
}, 500)
} else {
// console.log('pc端全屏');
var requestFullScreen = function (element) {
var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;
if (requestMethod) {
requestMethod.call(element);
} else if (typeof window.ActiveXObject !== "undefined") {
var wscript = new ActiveXObject("WScript.Shell");
if (wscript !== null) {
wscript.SendKeys("{F11}");
}
}
}
requestFullScreen(document.getElementById(id));
}
if (this.params.fullScreenCallBack) {
this.params.fullScreenCallBack(this.opt.id);
}
this.opt.fullScreenStatus = 1;
};
EZUIKitPlayer.prototype.cancelFullScreen = function () {
if(this.opt.fullScreenStatus === 0){
return false
}
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) {
var width = document.getElementById(id).width;
var height = document.getElementById(id).height;
// wrapper = document.getElementById("test"),
var wrapper = document.body;//document.body 属性返回 <body> 元素， document.documentElement 属性返回 <html> 元素。
wrapper =document.getElementById(id);
var style = "";
style += "width:" + width + "px;";
style += "height:" + height + "px;";
style += "-webkit-transform: rotate(0); transform: rotate(0);";
style += "-webkit-transform-origin: 0 0;";
style += "transform-origin: 0 0;";
wrapper.style.cssText = style;
setTimeout(function () {
player.postMessage("autoResize", domain + "/ezopen/h5/iframe")
}, 500);
var cancelFullDOMId = id + "cancel-full-screen";
var cancelFullDOM = document.getElementById(cancelFullDOMId);
if(cancelFullDOM){
document.body.removeChild(cancelFullDOM)
}
} else {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
}
}
if (this.params.cancelFullScreenCallBack) {
this.params.cancelFullScreenCallBack(this.opt.id);
}
this.opt.fullScreenStatus = 0;
}
EZUIKitPlayer.prototype.capturePicture = function (fileName,isUndownload) {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage({
action: "capturePicture",
fileName: fileName || 'default',
isUndownload: isUndownload,
}, domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'capturePicture') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.enableZoom = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("enableZoom", domain + "/ezopen/h5/iframe");
};
EZUIKitPlayer.prototype.closeZoom = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("closeZoom", domain + "/ezopen/h5/iframe");
};
EZUIKitPlayer.prototype.getOSDTime = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("getOSDTime", domain + "/ezopen/h5/iframe");
var _this = this;
var promise = new Promise(function(resolve,reject) {
window.addEventListener("message", function (event) {
var playId = _this.opt.id;
if (playId == event.data.id && event.data.type === 'getOSDTime') {
resolve(event.data);
}
});
});
return promise;
};
EZUIKitPlayer.prototype.autoResize = function () {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
player.postMessage("autoResize", domain + "/ezopen/h5/iframe")
};
EZUIKitPlayer.prototype.reSize = function (width,height) {
var id = 'EZUIKitPlayer-' + this.opt.id;
var player = document.getElementById(id).contentWindow;
var containerDOM = document.getElementById(this.opt.id);
containerDOM.style.width = width + 'px';
containerDOM.style.height = height + 'px';
var playDOM = document.getElementById(id);
playDOM.setAttribute("width",width);
playDOM.setAttribute("height",height);
setTimeout(function(){
player.postMessage({
action: 'autoResize',
}, domain + "/ezopen/h5/iframe");
},500)
};
EZUIKitPlayer.prototype.startTalk = function () {
console.log("执行开始对讲");
console.log(this.opt);
var _this = this;
EZUIKit.opt = this.opt;
var apiSuccess = function(data) {
if (data.code == 200) {
var apiResult = data.data;
if (apiResult) {
// 临时将https转换为websocket
var rtcTrunk = apiResult.rtcUrl;
if (rtcTrunk.indexOf("ws") === -1) {
rtcTrunk = rtcTrunk.replace("https", "wss").replace("rtcgw", "rtcgw-ws");
}
_this.opt.rtcUrl = rtcTrunk;
_this.opt.ttsUrl = "tts://" + apiResult.ttsUrl;
var talk = "talk://" + _this.opt.deviceSerial + ":0:" + _this.opt.channelNo + ":cas.ys7.com:6500";
_this.opt.talkLink = _this.opt.ttsUrl + "/" + talk;
_this.opt.stream = apiResult.stream;
window.startTalk();
}
}
}
var apiError = function() {
layer.msg("获取对讲token失败")
}
request(_this.opt.apiDomain, 'POST', {
accessToken: _this.opt.accessToken,
deviceSerial: _this.opt.deviceSerial,
channelNo: _this.opt.channelNo
}, '', apiSuccess, apiError);
};
EZUIKitPlayer.prototype.stopTalk = function () {
console.log("执行结束对讲");
window.stopTalk();
};
/**
* 视频播放器-结束
*/
EZUIKit.EZUIKitPlayer = EZUIKitPlayer;
window.EZUIKit = EZUIKit;
if (!noGlobal) {
window.EZUIKit = EZUIKit;
}
return EZUIKit;
});
\ No newline at end of file
public/datav/static/ezuikit-js/package.json 0 → 100644
View file @ fb62f717
{
"_from": "ezuikit-js",
"_id": "ezuikit-js@0.2.9",
"_inBundle": false,
"_integrity": "sha1-Nus53z7V0uwVYQHMZXPDJ+Tnsg8=",
"_location": "/ezuikit-js",
"_phantomChildren": {},
"_requested": {
"type": "tag",
"registry": true,
"raw": "ezuikit-js",
"name": "ezuikit-js",
"escapedName": "ezuikit-js",
"rawSpec": "",
"saveSpec": null,
"fetchSpec": "latest"
},
"_requiredBy": [
"#DEV:/",
"#USER"
],
"_resolved": "https://registry.npmmirror.com/ezuikit-js/download/ezuikit-js-0.2.9.tgz",
"_shasum": "36eb39df3ed5d2ec156101cc6573c327e4e7b20f",
"_spec": "ezuikit-js",
"_where": "E:\\Web\\smartAgroWeb",
"author": {
"name": "yujianbo"
},
"bugs": {
"url": "https://github.com/Hikvision-Ezviz/EZUIKit-JavaScript-npm/issues"
},
"bundleDependencies": false,
"deprecated": false,
"description": "ezuikit javascript for npm",
"homepage": "https://github.com/Hikvision-Ezviz/EZUIKit-JavaScript-npm#readme",
"keywords": [
"video",
"ezuikit"
],
"license": "ISC",
"main": "ezuikit.js",
"name": "ezuikit-js",
"repository": {
"type": "git",
"url": "git+https://github.com/Hikvision-Ezviz/EZUIKit-JavaScript-npm.git"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"version": "0.2.9"
}
public/datav/watersource.html
View file @ fb62f717
......@@ -878,7 +878,7 @@
<span>站点编号</span>
<span>测站名称</span>
<span>实时雨量</span>
<span>实时雨量</span>
<span>累计雨量</span>
</dt>
<dd v-for="(item, i) in dm3.list">
<span>{{item.code}}</span>
......
vue.config.js
View file @ fb62f717
......@@ -13,137 +13,144 @@ const VUE_APP_BASE_API = process.env.VUE_APP_BASE_API;
// All configuration item explanations can be find in https://cli.vuejs.org/config/
module.exports = {
// hash 模式下可使用
// publicPath: process.env.NODE_ENV === 'development' ? '/' : './',
publicPath: '/',
outputDir: 'dist',
assetsDir: 'static',
lintOnSave: process.env.NODE_ENV === 'development',
productionSourceMap: false,
devServer: {
port: port,
host: VUE_APP_BASE_API && VUE_APP_BASE_API.split(/\/\/|:/).slice(-2)[0],
open: true,
overlay: {
warnings: false,
errors: true
},
proxy: {
'/api': {
target: process.env.VUE_APP_BASE_API,
changeOrigin: true,
pathRewrite: {
'^/api': 'api'
}
},
'/auth': {
target: process.env.VUE_APP_BASE_API,
changeOrigin: true,
pathRewrite: {
'^/auth': 'auth'
}
// hash 模式下可使用
// publicPath: process.env.NODE_ENV === 'development' ? '/' : './',
publicPath: '/',
outputDir: 'dist',
assetsDir: 'static',
lintOnSave: process.env.NODE_ENV === 'development',
productionSourceMap: false,
devServer: {
port: port,
host: VUE_APP_BASE_API && VUE_APP_BASE_API.split(/\/\/|:/).slice(-2)[0],
open: true,
overlay: {
warnings: false,
errors: true,
},
proxy: {
'/api': {
target: process.env.VUE_APP_BASE_API,
changeOrigin: true,
pathRewrite: {
'^/api': 'api'
}
},
'/auth': {
target: process.env.VUE_APP_BASE_API,
changeOrigin: true,
pathRewrite: {
'^/auth': 'auth'
}
},
'/ys7com': {
target: 'https://open.ys7.com/api/lapp/token/get', // 真实请求URl
changeOrigin: true, // 允许跨域
pathRewrite: { // 替换，通配/api的替换成/
'^/ys7com': '/'
},
},
}
},
configureWebpack: {
// provide the app's title in webpack's name field, so that
// it can be accessed in index.html to inject the correct title.
name: name,
resolve: {
alias: {
'@': resolve('src'),
'@crud': resolve('src/components/Crud')
}
},
}
},
configureWebpack: {
// provide the app's title in webpack's name field, so that
// it can be accessed in index.html to inject the correct title.
name: name,
resolve: {
alias: {
'@': resolve('src'),
'@crud': resolve('src/components/Crud')
}
},
plugins: [
// https://www.ydyno.com/archives/1260.html 使用gzip解压缩静态文件
new CompressionPlugin({
test: /\.(js|css|html)?$/i, // 压缩文件格式
filename: '[path].gz[query]', // 压缩后的文件名
algorithm: 'gzip', // 使用gzip压缩
minRatio: 0.8 // 压缩率小于1才会压缩
})
]
},
chainWebpack(config) {
config.plugins.delete('preload') // TODO: need test
config.plugins.delete('prefetch') // TODO: need test
plugins: [
// https://www.ydyno.com/archives/1260.html 使用gzip解压缩静态文件
new CompressionPlugin({
test: /\.(js|css|html)?$/i, // 压缩文件格式
filename: '[path].gz[query]', // 压缩后的文件名
algorithm: 'gzip', // 使用gzip压缩
minRatio: 0.8 // 压缩率小于1才会压缩
})
]
},
chainWebpack(config) {
config.plugins.delete('preload') // TODO: need test
config.plugins.delete('prefetch') // TODO: need test
// set svg-sprite-loader
config.module
.rule('svg')
.exclude.add(resolve('src/assets/icons'))
.end()
config.module
.rule('icons')
.test(/\.svg$/)
.include.add(resolve('src/assets/icons'))
.end()
.use('svg-sprite-loader')
.loader('svg-sprite-loader')
.options({
symbolId: 'icon-[name]'
})
.end()
// set svg-sprite-loader
config.module
.rule('svg')
.exclude.add(resolve('src/assets/icons'))
.end()
config.module
.rule('icons')
.test(/\.svg$/)
.include.add(resolve('src/assets/icons'))
.end()
.use('svg-sprite-loader')
.loader('svg-sprite-loader')
.options({
symbolId: 'icon-[name]'
})
.end()
// set preserveWhitespace
config.module
.rule('vue')
.use('vue-loader')
.loader('vue-loader')
.tap(options => {
options.compilerOptions.preserveWhitespace = true
return options
})
.end()
// set preserveWhitespace
config.module
.rule('vue')
.use('vue-loader')
.loader('vue-loader')
.tap(options => {
options.compilerOptions.preserveWhitespace = true
return options
})
.end()
config
// https://webpack.js.org/configuration/devtool/#development
.when(process.env.NODE_ENV === 'development',
config => config.devtool('cheap-source-map')
)
config
// https://webpack.js.org/configuration/devtool/#development
.when(process.env.NODE_ENV === 'development',
config => config.devtool('cheap-source-map')
)
config
.when(process.env.NODE_ENV !== 'development',
config => {
config
.plugin('ScriptExtHtmlWebpackPlugin')
.after('html')
.use('script-ext-html-webpack-plugin', [{
// `runtime` must same as runtimeChunk name. default is `runtime`
inline: /runtime\..*\.js$/
}])
.end()
config
.optimization.splitChunks({
chunks: 'all',
cacheGroups: {
libs: {
name: 'chunk-libs',
test: /[\\/]node_modules[\\/]/,
priority: 10,
chunks: 'initial' // only package third parties that are initially dependent
},
elementUI: {
name: 'chunk-elementUI', // split elementUI into a single package
priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
},
commons: {
name: 'chunk-commons',
test: resolve('src/components'), // can customize your rules
minChunks: 3, // minimum common number
priority: 5,
reuseExistingChunk: true
}
}
})
config.optimization.runtimeChunk('single')
}
)
},
transpileDependencies: [
'vue-echarts',
'resize-detector'
]
config
.when(process.env.NODE_ENV !== 'development',
config => {
config
.plugin('ScriptExtHtmlWebpackPlugin')
.after('html')
.use('script-ext-html-webpack-plugin', [{
// `runtime` must same as runtimeChunk name. default is `runtime`
inline: /runtime\..*\.js$/
}])
.end()
config
.optimization.splitChunks({
chunks: 'all',
cacheGroups: {
libs: {
name: 'chunk-libs',
test: /[\\/]node_modules[\\/]/,
priority: 10,
chunks: 'initial' // only package third parties that are initially dependent
},
elementUI: {
name: 'chunk-elementUI', // split elementUI into a single package
priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
},
commons: {
name: 'chunk-commons',
test: resolve('src/components'), // can customize your rules
minChunks: 3, // minimum common number
priority: 5,
reuseExistingChunk: true
}
}
})
config.optimization.runtimeChunk('single')
}
)
},
transpileDependencies: [
'vue-echarts',
'resize-detector'
]
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment