修改默认条数
This commit is contained in:
parent
c8523d2109
commit
d2b60bc7b0
|
|
@ -1,5 +1,9 @@
|
|||
let layer, form, util, dtree, videoTree;
|
||||
//默认播放窗口
|
||||
let winDom = 'videoPlayer1';
|
||||
let videoDom="windowbox1";
|
||||
let nowDmoScree=1;
|
||||
let playList=[];
|
||||
layui.config({
|
||||
base: "../../plugin/layui-v2.9.7/layui/dtree/", //此处路径请自行处理, 可以使用绝对路径
|
||||
}).extend({
|
||||
|
|
@ -27,8 +31,13 @@ layui.config({
|
|||
puid = puid.substring(0, puid.length - 2);
|
||||
if (puid) {
|
||||
parent.layer.msg("视频加载中,请稍候...", { icon: 16, scrollbar: false, time: 1000, });
|
||||
QXPlayVideo(puid, '0', winDom)
|
||||
playControl();
|
||||
let newobj=getPlay(puid,getWindBox(),0);
|
||||
playList.push(newobj);
|
||||
console.log("4444");
|
||||
console.log(playList);
|
||||
playVideList();
|
||||
// QXPlayVideo(puid, '0', winDom)
|
||||
// playControl();
|
||||
videoObject.devCode = puid;
|
||||
} else {
|
||||
return parent.layer.msg('请选择球机', { icon: 7 });
|
||||
|
|
@ -64,3 +73,43 @@ layui.config({
|
|||
}
|
||||
});
|
||||
});
|
||||
|
||||
/**
|
||||
* 获取播放对象
|
||||
* @param puid
|
||||
* @param widBox
|
||||
* @param state
|
||||
*/
|
||||
function getPlay(puid,widBox,state){
|
||||
let playData={};
|
||||
playData.puid=puid;
|
||||
playData.windBox=widBox;
|
||||
playData.state=state;
|
||||
return playData;
|
||||
}
|
||||
|
||||
//否则返回 最后一个box 进行替换
|
||||
function getWindBox(){
|
||||
for (let j = 1; j <= nowDmoScree; j++) {
|
||||
let noCz=true;
|
||||
let winBox2="videoPlayer"+j;
|
||||
for (let i = 0; i < playList.length; i++) {
|
||||
var widBox=playList[i].windBox;
|
||||
if(widBox==winBox2){
|
||||
noCz=false;
|
||||
}
|
||||
}
|
||||
if(noCz){
|
||||
return winBox2;
|
||||
}
|
||||
}
|
||||
if(playList.length>nowDmoScree){
|
||||
console.log(playList[0].windBox)
|
||||
destoryVideo(playList[0].flvPlayer)
|
||||
playList.pop();
|
||||
}
|
||||
let obj=playList[0]
|
||||
playList.pop();
|
||||
return obj.windBox;
|
||||
|
||||
}
|
||||
|
|
@ -34,9 +34,11 @@ function loadVideoTree() {
|
|||
item.title = '<img src="../../img/video/ball_online.png"><span data-mtpis="'+item.title+'">' + titleName + '</span>'
|
||||
if(isPlay){
|
||||
let puid = item.id.replace('QJ', '').split("-")[0];
|
||||
QXPlayVideo(puid, '0', winDom)
|
||||
playControl();
|
||||
videoObject.devCode = puid;
|
||||
playList.push(getPlay(puid,winDom,0));
|
||||
playVideList();
|
||||
// QXPlayVideo(puid, '0', winDom)
|
||||
// playControl();
|
||||
// videoObject.devCode = puid;
|
||||
isPlay=false;
|
||||
}
|
||||
} else {
|
||||
|
|
@ -60,6 +62,32 @@ function loadVideoTree() {
|
|||
}
|
||||
}
|
||||
|
||||
function oneVideo(){
|
||||
for (let i = 2; i < 5; i++) {
|
||||
document.getElementById("windowbox" + i).style.cssText = "width: 48.5%;height: 48.8%;";
|
||||
document.getElementById("videoPlayer"+i).style.cssText = "width: 100%;height: 100%;";
|
||||
$('.video'+i+'-dimensions').css("width", "100%");
|
||||
$('.video'+i+'-dimensions').css("height", "100%");
|
||||
document.getElementById("windowbox" + i).style.display = "none";
|
||||
}
|
||||
document.getElementById("windowbox" + 1).style.cssText = "width: 100%;height: 100%;";
|
||||
document.getElementById("videoPlayer"+1).style.cssText = "width: 100%;height: 100%;";
|
||||
nowDmoScree=1;
|
||||
while (playList.length > nowDmoScree) {
|
||||
console.log(playList[0].windBox)
|
||||
destoryVideo(playList[0].flvPlayer);
|
||||
playList.pop();
|
||||
}
|
||||
//播放
|
||||
for (let i = 0; i <playList.length ; i++) {
|
||||
if( playList[i].state!=1){
|
||||
flvPlayer= QXPlayVideo(playList[i].puid, '0', playList[i].windBox);
|
||||
playList[i].flvPlayer=flvPlayer;
|
||||
playList[i].state=1;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
function fourVideo(){
|
||||
for (let i = 1; i < 5; i++) {
|
||||
document.getElementById("windowbox" + i).style.cssText = "width: 48.5%;height: 48.8%;";
|
||||
|
|
@ -68,8 +96,36 @@ function fourVideo(){
|
|||
$('.video'+i+'-dimensions').css("height", "100%");
|
||||
document.getElementById("windowbox" + i).style.display = "block";
|
||||
}
|
||||
|
||||
nowDmoScree=4;
|
||||
console.log(nowDmoScree);
|
||||
if(playList.length>nowDmoScree){
|
||||
playList=playList.slice(-nowDmoScree);
|
||||
}
|
||||
for (let i = 0; i <playList.length ; i++) {
|
||||
QXPlayVideo(playList[i].puid, '0', playList[i].windBox);
|
||||
playControl();
|
||||
}
|
||||
for (var i = 5; i <= 9; i++) {
|
||||
document.getElementById("windowbox" + i).style.display = "none";
|
||||
}
|
||||
console.log("1")
|
||||
|
||||
}
|
||||
|
||||
|
||||
function playVideList(){
|
||||
console.log(playList)
|
||||
if(playList.length>nowDmoScree){
|
||||
playList=playList.slice(-nowDmoScree);
|
||||
}
|
||||
console.log(playList)
|
||||
for (let i = 0; i <playList.length ; i++) {
|
||||
if( playList[i].state!=1){
|
||||
flvPlayer= QXPlayVideo(playList[i].puid, '0', playList[i].windBox);
|
||||
playList[i].flvPlayer=flvPlayer;
|
||||
playList[i].state=1;
|
||||
}
|
||||
|
||||
}
|
||||
console.log(playList);
|
||||
}
|
||||
|
|
@ -75,7 +75,9 @@ function getQXConnect() {
|
|||
*/
|
||||
function QXPlayVideo(puId, idx, dom) {
|
||||
//播视频接口
|
||||
destoryVideo(flvPlayer);
|
||||
console.log(flvPlayer);
|
||||
console.log(dom);
|
||||
// destoryVideo(flvPlayer);
|
||||
let url = qxUrl + "stream.flv?puid=" + puId + "&idx=" + idx + "&stream=0&token=" + qxToken;
|
||||
if (flvjs.isSupported()) {
|
||||
let videoElement = document.getElementById(dom);
|
||||
|
|
@ -87,44 +89,49 @@ function QXPlayVideo(puId, idx, dom) {
|
|||
url: url, // => 视频流地址
|
||||
stashInitialSize: 128 // 减少首桢显示等待时长
|
||||
}, {
|
||||
enableWorker: false, //不启用分离线程
|
||||
enableStashBuffer: false, //关闭IO隐藏缓冲区
|
||||
reuseRedirectedURL: true, //重用301/302重定向url，用于随后的请求，如查找、重新连接等。
|
||||
autoCleanupSourceBuffer: true, //自动清除缓存
|
||||
fixAudioTimestampGap: false//false才会音视频同步
|
||||
enableWorker: false,
|
||||
autoCleanupSourceBuffer: true, //清理缓冲区
|
||||
enableStashBuffer: false,
|
||||
stashInitialSize: 128, // 减少首桢显示等待时长
|
||||
statisticsInfoReportInterval: 600
|
||||
});
|
||||
flvPlayer.attachMediaElement(videoElement);
|
||||
flvPlayer.load();
|
||||
//init3D();
|
||||
flvPlayer.on(flvjs.Events.ERROR, (errorType, errorDetail, errorInfo) => {
|
||||
if (flvPlayer) {
|
||||
//播放失败销毁窗口
|
||||
destoryVideo(flvPlayer);
|
||||
videoObject.playState = false;
|
||||
}
|
||||
});
|
||||
flvPlayer.on(flvjs.Events.SCRIPTDATA_ARRIVED, (errorType, errorDetail, errorInfo) => {
|
||||
if (flvPlayer) {
|
||||
videoObject.playState = true;
|
||||
// $('.noVideoMask').css('background-image', 'none')
|
||||
//视频断流、延迟处理
|
||||
$('#' + dom).attr("ontimeupdate", "progress(event)")
|
||||
recordVideo();
|
||||
}
|
||||
});
|
||||
// 【重要事件监听】http请求建立好后，该事件会一直监听flvjs实例
|
||||
flvPlayer.on(flvjs.Events.STATISTICS_INFO, (res) => {
|
||||
if (this.leaveRouter || this.changeLampPost) { // 离开路由或切换设备
|
||||
// 销毁实例
|
||||
destoryVideo(flvPlayer);
|
||||
videoObject.playState = false;
|
||||
}
|
||||
});
|
||||
flvPlayer.play();
|
||||
// flvPlayer.on(flvjs.Events.ERROR, (errorType, errorDetail, errorInfo) => {
|
||||
// if (flvPlayer) {
|
||||
// //播放失败销毁窗口
|
||||
// destoryVideo(flvPlayer);
|
||||
// videoObject.playState = false;
|
||||
// }
|
||||
// });
|
||||
|
||||
|
||||
setTimeout(function () {
|
||||
flvPlayer.play();
|
||||
}, 200);
|
||||
// flvPlayer.on(flvjs.Events.SCRIPTDATA_ARRIVED, (errorType, errorDetail, errorInfo) => {
|
||||
// if (flvPlayer) {
|
||||
// videoObject.playState = true;
|
||||
// // $('.noVideoMask').css('background-image', 'none')
|
||||
// //视频断流、延迟处理
|
||||
// $('#' + dom).attr("ontimeupdate", "progress(event)")
|
||||
// recordVideo();
|
||||
// }
|
||||
// });
|
||||
// // 【重要事件监听】http请求建立好后，该事件会一直监听flvjs实例
|
||||
// flvPlayer.on(flvjs.Events.STATISTICS_INFO, (res) => {
|
||||
// if (this.leaveRouter || this.changeLampPost) { // 离开路由或切换设备
|
||||
// // 销毁实例
|
||||
// destoryVideo(flvPlayer);
|
||||
// videoObject.playState = false;
|
||||
// }
|
||||
// });
|
||||
// flvPlayer.play();
|
||||
|
||||
}
|
||||
|
||||
|
||||
return flvPlayer;
|
||||
}
|
||||
}
|
||||
function init3D() {
|
||||
|
|
|
|||
|
|
@ -112,7 +112,7 @@
|
|||
<div id="video-box">
|
||||
<div id="balla" class="split split-horizontal">
|
||||
<div style="margin-left: 50%">
|
||||
<button onclick="onVideo()">1</button>
|
||||
<button onclick="oneVideo()">1</button>
|
||||
<button onclick="fourVideo()">4</button>
|
||||
</div>
|
||||
<div class="layout" style="width: 100%;height: 100%;flex-wrap: wrap;">
|
||||
|
|
|
|||
Loading…
Reference in New Issue