129 lines
4.1 KiB
Plaintext
129 lines
4.1 KiB
Plaintext
<%@ page language="java" pageEncoding="UTF-8"%>
|
|
<style type="text/css">
|
|
.select2-container .select2-selection--single{
|
|
height:34px;
|
|
line-height: 34px;
|
|
}
|
|
.select2-selection__arrow{
|
|
margin-top:3px;
|
|
}
|
|
</style>
|
|
<script type="text/javascript">
|
|
var websocket = null;
|
|
var restartDialog;
|
|
//判断当前浏览器是否支持WebSocket
|
|
if ('WebSocket' in window) {
|
|
var time = '${time}';
|
|
if(time==null || time==''){
|
|
time="now";
|
|
}
|
|
$.post(ext.contextPath + '/work/camera/getCameraById.do',{id:'${id}'},function(data){
|
|
var camera = JSON.parse(data);
|
|
websocket = new WebSocket("${ws}/videoWebSocket/"+camera.type+"/"+camera.url+"/"+camera.username+"/"+camera.password+"/"+camera.channel+"/"+time+"/${uuid}/standard");
|
|
websocket.onerror = function () {
|
|
};
|
|
|
|
//连接成功建立的回调方法
|
|
websocket.onopen = function () {
|
|
console.info('消息滚动websocker开启');
|
|
}
|
|
//接收到消息的回调方法
|
|
websocket.onmessage = function (event) {
|
|
// var result= JSON.parse(event.data);
|
|
$("#show_video").attr("src", event.data);
|
|
}
|
|
websocket.onclose = function () {
|
|
closeWebSocket();
|
|
}
|
|
})
|
|
//websocket = new WebSocket(ext.basePath.replace("http","ws")+"/videoWebSocket/${id}/"+time+"/${uuid}");
|
|
}
|
|
else {
|
|
alert('当前浏览器 Not support websocket')
|
|
}
|
|
|
|
//连接发生错误的回调方法
|
|
// websocket.onerror = function () {
|
|
// };
|
|
|
|
//连接成功建立的回调方法
|
|
// websocket.onopen = function () {
|
|
// console.info('消息滚动websocker开启');
|
|
// }
|
|
|
|
//接收到消息的回调方法
|
|
// websocket.onmessage = function (event) {
|
|
// var result= JSON.parse(event.data);
|
|
// $("#show_video").attr("src", "data:image/*;base64," + result.data);
|
|
// }
|
|
|
|
//连接关闭的回调方法
|
|
// websocket.onclose = function () {
|
|
// closeWebSocket();
|
|
// }
|
|
|
|
|
|
|
|
//关闭WebSocket连接
|
|
function closeWebSocket() {
|
|
websocket.onclose = function () {}; // disable onclose handler first
|
|
websocket.close();
|
|
}
|
|
|
|
/*function max(id){
|
|
$('#'+id).width($('#'+id).width()*1.5);
|
|
$('#'+id).height($('#'+id).height()*1.5);
|
|
}*/
|
|
function doClose() {
|
|
$.post(ext.contextPath + '/work/camera/closeRPCWebSocket.do',{id:'${id}',time:time,uuid:'${uuid}'},function(){
|
|
})
|
|
closeModal('subModal');
|
|
//location.reload();
|
|
}
|
|
|
|
function domin(){
|
|
$('#modal-content').width(600);
|
|
$('#modal-content').height(450);
|
|
$('#show_video').width(540);
|
|
$('#show_video').height(300);
|
|
}
|
|
|
|
function domid(){
|
|
$('#modal-content').width(720);
|
|
$('#modal-content').height(540);
|
|
$('#show_video').width(660);
|
|
$('#show_video').height(390);
|
|
}
|
|
|
|
function domax(){
|
|
$('#modal-content').width(860);
|
|
$('#modal-content').height(675);
|
|
$('#show_video').width(820);
|
|
$('#show_video').height(520);
|
|
}
|
|
|
|
</script>
|
|
<div class="modal fade" id="subModal" >
|
|
<div class="modal-dialog">
|
|
<div class="modal-content" id="modal-content" style="width:600px;height:450px;">
|
|
<div class="modal-header">
|
|
<h4 class="modal-title">视频展示</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div style="padding: 0px">
|
|
<!-- <p style="font-size: 20px;color: #0a7491;font-weight: bold;font-family: 楷体">视频显示</p> -->
|
|
<img id="show_video" style="width: 540px;height: 300px;border:1px solid black;" src="" alt="正在加载。。。">
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-default" onclick="domin()">小</button>
|
|
<button type="button" class="btn btn-default" onclick="domid()">中</button>
|
|
<button type="button" class="btn btn-default" onclick="domax()">大</button>
|
|
<button type="button" class="btn btn-default" onclick="doClose()">关闭</button>
|
|
</div>
|
|
</div>
|
|
<!-- /.modal-content -->
|
|
</div>
|
|
<!-- /.modal-dialog -->
|
|
</div>
|