调整监控控制

This commit is contained in:
2022-03-02 14:43:04 +08:00
parent a6660cdb6a
commit c1e8d1714c
7 changed files with 90 additions and 1941 deletions

View File

@@ -18,23 +18,38 @@
<div class="layui-body" style="left: 200px;overflow:auto;">
<div id="side"></div>
<div class="myDiy">
<video id="myVideo" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto" width="1080"
height="708" data-setup='{}'>
<source id="source" src="/nas/door/cctv.do" type="application/x-mpegURL">
</video>
<button id="myButton" type="button" class="button layui-btn-radius layui-btn layui-btn-lg layui-btn-normal">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
</button>
<button id="myRecord" type="button" class="button layui-btn-radius layui-btn layui-btn-lg layui-btn-normal">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
</button>
<div class="myVideo">
<video id="myVideo" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto"
width="1080"
height="708" data-setup='{}'>
<source id="source" src="/nas/door/cctv.do" type="application/x-mpegURL">
</video>
</div>
<div class="myButtons">
<button id="reboot" type="button"
class="button layui-btn layui-btn layui-btn-normal">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
</button>
<button id="down" type="button"
class="button layui-btn layui-btn-normal">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
</button>
<button id="up" type="button" class="button layui-btn layui-btn-normal">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
</button>
<div style="margin-top: 10px"></div>
<button id="warning" type="button" class="button layui-btn layui-btn-normal">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
</button>
</div>
</div>
<div id="footer"></div>
</div>
</div>
</body>
<script src="/layui/layui.js"></script>
<script src="/js/jquery-3.2.1.js"></script>
@@ -49,7 +64,7 @@
$('#side').load("/html/body/nas/side.html");
let token = getParam('token');
let myVideo= videojs('myVideo', {
let myVideo = videojs('myVideo', {
bigPlayButton: true,
@@ -62,38 +77,26 @@
})
$('#myButton').click(function () {
$.get('/door/set.do?status=open', function (ret) {
if (ret === "1") {
let index = layer.load(2, {shade: [0.45, '#57606f']});
load(index)
}
})
$('#reboot').click(function () {
config('reboot')
})
$('#myRecord').mousedown(function () {
console.log("down")
startRecording()
$('#up').mousedown(function () {
config('up')
})
$('#myRecord').mouseup(function () {
console.log("up")
stopRecording()
$('#down').mouseup(function () {
config('down')
})
$('#warning').mouseup(function () {
config('warning')
})
function load(index) {
$.get("/door/status.do", function (ret) {
if (ret === "1") {
layer.close(index)
layer.msg("已开门")
} else {
load(index)
}
function config(status) {
$.post("/door/set.do", {status: status}, function (json) {
layer.msg(json.msg)
});
}
var audio_context;
var recorder;
let audio_context;
function startUserMedia(stream) {
var input = audio_context.createMediaStreamSource(stream);
@@ -104,55 +107,9 @@
//input.connect(audio_context.destination);
__log('Input connected to audio context destination.');
recorder = new Recorder(input, {
numChannels: 1
});
__log('Recorder initialised.');
}
function startRecording() {
recorder && recorder.record();
__log('Recording...');
}
function stopRecording() {
recorder && recorder.stop();
__log('Stopped recording.');
// create WAV download link using audio data blob
createDownloadLink();
recorder.clear();
}
function createDownloadLink() {
console.log("check audio...")
recorder && recorder.exportWAV(function (blob) {
console.log('get vudio')
var formData = new FormData()
console.log(Object.prototype.toString.call(blob))
formData.append('audio', blob, new Date().toISOString() + '.wav')
$.ajax({
url: '/door/audio.do',
type: 'POST',
//contentType: 'application/octet-stream',
contentType: false,
processData: false, // 增加这一行,不处理参数
data: formData,
success: function (result) {
console.log(result)
}
})
// var url = URL.createObjectURL(blob);
// var hf = document.createElement('a');
// hf.href = url;
// hf.download = new Date().toISOString() + '.wav';
// hf.innerHTML = hf.download;
// hf.click()
// console.log(url)
});
}
function __log(log) {
console.log(log)
@@ -184,15 +141,25 @@
</script>
<style>
.myDiy {
width: 20%;
width: 100%;
height: 300px;
margin-top: 10px;
margin-left: 15%;
float: left;
}
.myVideo {
width: 70%;
float: left;
}
.myButtons {
width: 30%;
float: right;
}
.button {
width: 100px;
height: 100px;
font-size: 1em;
}
</style>