Commit d2cac297 authored by 陈珊's avatar 陈珊

fix

parent 53d68390
<!DOCTYPE html>
<html style="font-size: 100px !important;">
<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">
<title></title>
<script src="../static/js/hlk/h5player.min.js"></script>
<script src="../static/js/hlk/moment.js"></script>
<style>
*{
padding: 0;
margin: 0;
}
.content{
width: 100vw;
height: 100vh;
}
</style>
</head>
<body>
<div class="content" id="player"></div>
</body>
<script>
function getQueryParams() {
// 获取URL参数部分
const queryString = window.location.search;
// 创建一个URLSearchParams对象来解析参数
const urlParams = new URLSearchParams(queryString);
// 创建一个对象来存储参数
const params = {};
// 遍历所有参数并存储到对象中
for (const [key, value] of urlParams.entries()) {
params[key] = value;
}
return params;
}
var wssurl = decodeURIComponent(getQueryParams().wssurl);
var player;
console.log(wssurl);
createPlayer();
function createPlayer(){
player = new window.JSPlugin({
szId: 'player',
szBasePath: "/hlk/",
iMaxSplit: 1,
iCurrentSplit: 1,
openDebug: true,
oStyle: {
borderSelect: '#000000',
}
})
player.JS_SetWindowControlCallback({
windowEventSelect: function (iWndIndex) { //插件选中窗口回调
console.log('windowSelect callback: ', iWndIndex);
},
pluginErrorHandler: function (iWndIndex, iErrorCode, oError) { //插件错误回调
console.log('pluginError callback: ', iWndIndex, iErrorCode, oError);
},
windowEventOver: function (iWndIndex) { //鼠标移过回调
//console.log(iWndIndex);
},
windowEventOut: function (iWndIndex) { //鼠标移出回调
//console.log(iWndIndex);
},
windowEventUp: function (iWndIndex) { //鼠标mouseup事件回调
//console.log(iWndIndex);
},
windowFullCcreenChange: function (bFull) { //全屏切换回调
console.log('fullScreen callback: ', bFull);
},
firstFrameDisplay: function (iWndIndex, iWidth, iHeight) { //首帧显示回调
console.log('firstFrame loaded callback: ', iWndIndex, iWidth, iHeight);
},
performanceLack: function () { //性能不足回调
console.log('performanceLack callback: ');
}
});
startPlay();
}
function startPlay(){
player.JS_Play(wssurl, { playURL:wssurl,mode:0}, 0).then(
() => { console.log('realplay success') },
e => { console.error(e)}
);
}
</script>
\ No newline at end of file
...@@ -15,6 +15,8 @@ ...@@ -15,6 +15,8 @@
<script src="../static/plugin/layui/layui.js"></script> <script src="../static/plugin/layui/layui.js"></script>
<script src="../static/js/public.js?vt=1.0.1"></script> <script src="../static/js/public.js?vt=1.0.1"></script>
<script src="../static/js/swiper.min.js"></script> <script src="../static/js/swiper.min.js"></script>
<script src="../static/js/hlk/h5player.min.js"></script>
<script src="../static/js/hlk/moment.js"></script>
</head> </head>
<body> <body>
......
...@@ -492,7 +492,7 @@ ...@@ -492,7 +492,7 @@
margin: 0.1rem; margin: 0.1rem;
} }
.popup-info video { .popup-info .video {
width: 100%; width: 100%;
height: 75%; height: 75%;
} }
......
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
var loading var loading
var projectData = ''; var projectData = '';
var player = '';
var map = { var map = {
getMap: function (data) { getMap: function (data) {
var options = { var options = {
...@@ -230,6 +231,7 @@ var map = { ...@@ -230,6 +231,7 @@ var map = {
// 直播 // 直播
getSnapPictures: function (pile_id, equ_no, is_online) { getSnapPictures: function (pile_id, equ_no, is_online) {
if (is_online == '1') { if (is_online == '1') {
loading = layer.load(1);
$.ajax({ $.ajax({
url: baseURL + "GetSnapPictures.ashx", url: baseURL + "GetSnapPictures.ashx",
type: "post", type: "post",
...@@ -240,9 +242,12 @@ var map = { ...@@ -240,9 +242,12 @@ var map = {
type: '' type: ''
}, },
success: function (data) { success: function (data) {
showPopup(data.data[0].url, '直播'); layer.close(loading);
// showPopup(data.data[0].url, '直播');
map.getPlay(data.data[0].url, '直播')
}, },
error: function (jqXHR) { error: function (jqXHR) {
layer.close(loading);
console.log("发生错误:" + jqXHR.status); console.log("发生错误:" + jqXHR.status);
} }
}) })
...@@ -250,6 +255,64 @@ var map = { ...@@ -250,6 +255,64 @@ var map = {
layer.msg('该设备不在线'); layer.msg('该设备不在线');
} }
}, },
// 播放
getPlay: function (url, title) {
$("#popup-info").html('');
$("#popup-info").html(`
<div id="player" style="width: 100%; height: 90%;"></div>
`);
showPopup('', title);
map.createPlayer(url);
},
createPlayer(url){
player = new window.JSPlugin({
szId: 'player',
szBasePath: "/hlk/",
iMaxSplit: 1,
iCurrentSplit: 1,
openDebug: true,
oStyle: {
borderSelect: '#000000',
}
})
player.JS_SetWindowControlCallback({
windowEventSelect: function (iWndIndex) { //插件选中窗口回调
console.log('windowSelect callback: ', iWndIndex);
},
pluginErrorHandler: function (iWndIndex, iErrorCode, oError) { //插件错误回调
console.log('pluginError callback: ', iWndIndex, iErrorCode, oError);
},
windowEventOver: function (iWndIndex) { //鼠标移过回调
//console.log(iWndIndex);
},
windowEventOut: function (iWndIndex) { //鼠标移出回调
//console.log(iWndIndex);
},
windowEventUp: function (iWndIndex) { //鼠标mouseup事件回调
//console.log(iWndIndex);
},
windowFullCcreenChange: function (bFull) { //全屏切换回调
console.log('fullScreen callback: ', bFull);
},
firstFrameDisplay: function (iWndIndex, iWidth, iHeight) { //首帧显示回调
console.log('firstFrame loaded callback: ', iWndIndex, iWidth, iHeight);
},
performanceLack: function () { //性能不足回调
console.log('performanceLack callback: ');
}
});
map.getLiveAddress(url);
},
getLiveAddress(url){
loading = layer.load(1);
map.startPlay(url);
},
startPlay(playURL){
player.JS_Play(playURL, { playURL:playURL,mode:0}, 0).then(
() => { console.log('realplay success') ;layer.close(loading);},
e => { console.error(e) ;layer.close(loading);}
);
},
// 回放 // 回放
getHistoryvideo: function (equ_no, date, type = 0) { getHistoryvideo: function (equ_no, date, type = 0) {
loading = layer.load(1); loading = layer.load(1);
...@@ -273,10 +336,10 @@ var map = { ...@@ -273,10 +336,10 @@ var map = {
getHistoryvideoHtml: function (data, date, equ_no, type) { getHistoryvideoHtml: function (data, date, equ_no, type) {
layer.close(loading); layer.close(loading);
console.log(data, type); console.log(data, type);
if (data.data.historyvideo_url) { if (data.data && data.data.historyvideo_url) {
$("#popup-info").html(''); $("#popup-info").html('');
$("#popup-info").html(` $("#popup-info").html(`
<video controls preload="auto" autoplay="autoplay"> <video class='video' controls preload="auto" autoplay="autoplay">
<source src="${data.data.historyvideo_url}" type="video/mp4" /> <source src="${data.data.historyvideo_url}" type="video/mp4" />
</video> </video>
<div class='flex-item'> <div class='flex-item'>
...@@ -361,16 +424,16 @@ var getLeftdata = { ...@@ -361,16 +424,16 @@ var getLeftdata = {
return (` return (`
<div class="ac-item" id="panel-${i}-${index}" onclick="$('#zjxx .ac-item').removeClass('active');$('#panel-${i}-${index}').addClass('active');"> <div class="ac-item" id="panel-${i}-${index}" onclick="$('#zjxx .ac-item').removeClass('active');$('#panel-${i}-${index}').addClass('active');">
<div class="item" data-mapx='${item2.mapx}' data-mapy='${item2.mapy}' data-gps_isvalid='${item2.gps_isvalid}' data-index1 = '${i}' data-index2 = '${index}'> <div class="item" data-mapx='${item2.mapx}' data-mapy='${item2.mapy}' data-gps_isvalid='${item2.gps_isvalid}' data-index1 = '${i}' data-index2 = '${index}'>
<div class="value" ${item2.end_time ? `onclick="$('.content .right-item').html('');layer.msg('暂无最新抓拍信息');"` : `onclick="getRightdata.GetSnapPictures(${item2.pile_id}, ${item2.SceneTask_id})"`}> <div class="value" ${item2.end_time ? `onclick="$('.content .right-item').html('');layer.msg('暂无最新抓拍信息');"` : `onclick="getRightdata.GetSnapPictures('${item2.pile_id}', '${item2.SceneTask_id}')"`}>
<p>桩号:${item2.pile_no}<span style='margin-left:.15rem'>${item2.test_type}</span></p> <p>桩号:${item2.pile_no}<span style='margin-left:.15rem'>${item2.test_type}</span></p>
<p></p>设备:${item2.MachineId}</p> <p></p>设备:${item2.MachineId}</p>
</div> </div>
<div class="status"> <div class="status">
<p class="dw icon_font icon-icon_dw_lx-01 ${item2.gps_isvalid == 1 ? 'zx' : ''}"></p> <p class="dw icon_font icon-icon_dw_lx-01 ${item2.gps_isvalid == 1 ? 'zx' : ''}"></p>
${item2.end_time ? `<p class="icon_font icon-icon_jk_lx-01" onclick="$('.content .right-item').html('');layer.msg('暂无最新抓拍信息');"></p>` : `<p class="icon_font icon-icon_jk_lx-01 ${item2.monitor_isvalid == 1 ? 'zx' : ''}" onclick="getRightdata.GetSnapPictures(${item2.pile_id}, ${item2.SceneTask_id})"></p>`} ${item2.end_time ? `<p class="icon_font icon-icon_jk_lx-01" onclick="$('.content .right-item').html('');layer.msg('暂无最新抓拍信息');"></p>` : `<p class="icon_font icon-icon_jk_lx-01 ${item2.monitor_isvalid == 1 ? 'zx' : ''}" onclick="getRightdata.GetSnapPictures('${item2.pile_id}', '${item2.SceneTask_id}')"></p>`}
</div> </div>
</div> </div>
<div class="panel-time" data-mapx='${item2.mapx}' data-mapy='${item2.mapy}' data-gps_isvalid='${item2.gps_isvalid}' onclick="getRightdata.GetSnapPictures(${item2.pile_id}, ${item2.SceneTask_id})">${item2.test_start_time ? `<p>检测开始时间:${item2.test_start_time}</p>` : ''}${item2.test_end_time ? `<p style="margin-top: .08rem;">检测结束时间:${item2.test_end_time}</p>` : ''}${item2.data_start_time ? `<p style="margin-top: .08rem;">数据上传时间:${item2.data_start_time}</p>` : ''}${item2.data_end_time ? `<p style="margin-top: .08rem;">数据结束时间:${item2.data_end_time}</p>` : ''}</div> <div class="panel-time" data-mapx='${item2.mapx}' data-mapy='${item2.mapy}' data-gps_isvalid='${item2.gps_isvalid}' onclick="getRightdata.GetSnapPictures('${item2.pile_id}', '${item2.SceneTask_id}')">${item2.test_start_time ? `<p>检测开始时间:${item2.test_start_time}</p>` : ''}${item2.test_end_time ? `<p style="margin-top: .08rem;">检测结束时间:${item2.test_end_time}</p>` : ''}${item2.data_start_time ? `<p style="margin-top: .08rem;">数据上传时间:${item2.data_start_time}</p>` : ''}${item2.data_end_time ? `<p style="margin-top: .08rem;">数据结束时间:${item2.data_end_time}</p>` : ''}</div>
</div> </div>
`) `)
}).join('') }).join('')
...@@ -424,7 +487,7 @@ var getRightdata = { ...@@ -424,7 +487,7 @@ var getRightdata = {
<p class="blue-text" onclick="getRightdata.getHistoryPic('${item.equ_no ? item.equ_no : ''}')">历史抓拍</p> <p class="blue-text" onclick="getRightdata.getHistoryPic('${item.equ_no ? item.equ_no : ''}')">历史抓拍</p>
</div> </div>
<div class="panel-info"> <div class="panel-info">
${item.img ? '<img src=' + item.img + ' onclick="map.getSnapPictures(' + item.pile_id + ', ' + item.equ_no + ', ' + item.is_online + ')" />' : "<div class='noData'>暂无数据</div>"} ${item.img ? `<img src='${item.img}' onclick="map.getSnapPictures('${item.pile_id}', '${item.equ_no}', '${item.is_online}')" />` : "<div class='noData'>暂无数据</div>"}
</div> </div>
</div> </div>
`; `;
......
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