diff --git a/web/assets/js/bs5.dashboard-base.js b/web/assets/js/bs5.dashboard-base.js
index 7baa8552..927ec1d1 100644
--- a/web/assets/js/bs5.dashboard-base.js
+++ b/web/assets/js/bs5.dashboard-base.js
@@ -201,7 +201,11 @@ function formattedTimeForFilename(time,utcConvert,timeFormat){
if(utcConvert)theMoment = theMoment.clone().utc()
return theMoment.format(timeFormat ? timeFormat : 'YYYY-MM-DDTHH:mm:ss')
}
-
+function setPromiseTimeout(timeoutAmount){
+ return new Promise((resolve) => {
+ setTimeout(resolve,timeoutAmount)
+ })
+}
function checkCorrectPathEnding(x){
var length=x.length
if(x.charAt(length-1)!=='/'){
diff --git a/web/assets/js/bs5.liveGrid.js b/web/assets/js/bs5.liveGrid.js
index a75896b8..2bcf4651 100644
--- a/web/assets/js/bs5.liveGrid.js
+++ b/web/assets/js/bs5.liveGrid.js
@@ -540,7 +540,7 @@ function initiateLiveGridPlayer(monitor,subStreamChannel){
loadedPlayer.signal = setInterval(function(){
signalCheckLiveStream({
mid: monitorId,
- checkSpeed: 1000,
+ checkSpeed: 3000,
})
},signalCheckInterval);
}
@@ -736,6 +736,7 @@ function signalCheckLiveStream(options){
var monitorDetails = monitorConfig.details
var checkCount = 0
var base64Data = null;
+ var base64Length = 0;
var checkSpeed = options.checkSpeed || 1000
var subStreamChannel = monitorConfig.subStreamChannel
var streamType = subStreamChannel ? monitorDetails.substream ? monitorDetails.substream.output.stream_type : 'hls' : monitorDetails.stream_type
@@ -760,50 +761,51 @@ function signalCheckLiveStream(options){
})
}
}
- function executeCheck(){
- switch(streamType){
- case'b64':
- monitorItem.resize()
- break;
- case'hls':case'flv':case'mp4':
- if(monitorItem.find('video')[0].paused){
- failedStreamCheck()
- }else{
- succeededStreamCheck()
- }
- break;
- default:
- if(dashboardOptions().jpeg_on === true){return}
- getSnapshot({
- monitor: loadedMonitors[monitorId],
- },function(url){
- base64Data = url;
- setTimeout(function(){
- getSnapshot({
- monitor: loadedMonitors[monitorId],
- },function(url){
- if(base64Data === url){
- if(checkCount < 3){
- ++checkCount;
- setTimeout(function(){
- executeCheck();
- },checkSpeed)
- }else{
- failedStreamCheck()
- }
- }else{
- succeededStreamCheck()
- }
- });
- },checkSpeed)
- });
- break;
+ async function executeCheck(){
+ try{
+ switch(streamType){
+ case'b64':
+ monitorItem.resize()
+ break;
+ // case'hls':case'flv':case'mp4':
+ // if(monitorItem.find('video')[0].paused){
+ // failedStreamCheck()
+ // }else{
+ // succeededStreamCheck()
+ // }
+ // break;
+ default:
+ if(dashboardOptions().jpeg_on === true){return}
+ var firstSnapshot = await getSnapshot({
+ monitor: loadedMonitors[monitorId],
+ });
+ // console.log(firstSnapshot)
+ base64Data = firstSnapshot.url
+ base64Length = firstSnapshot.fileSize
+ await setPromiseTimeout(checkSpeed)
+ var secondSnapshot = await getSnapshot({
+ monitor: loadedMonitors[monitorId],
+ });
+ // console.log(secondSnapshot)
+ // console.log('----')
+ var secondSnapLength = secondSnapshot.fileSize
+ var hasFailed = base64Data === secondSnapshot.url || base64Length === secondSnapLength;
+ if(hasFailed){
+ failedStreamCheck()
+ }else{
+ succeededStreamCheck()
+ }
+ break;
+ }
+ $.each(onSignalCheckLiveStreamExtensions,function(n,extender){
+ extender(streamType,monitorItem)
+ })
+ }catch(err){
+ console.log('signal check ERROR', err)
+ failedStreamCheck()
}
- $.each(onSignalCheckLiveStreamExtensions,function(n,extender){
- extender(streamType,monitorItem)
- })
}
- executeCheck();
+ executeCheck()
}catch(err){
console.log(err)
var errorStack = err.stack;
diff --git a/web/assets/js/bs5.monitorsUtils.js b/web/assets/js/bs5.monitorsUtils.js
index af8b0a80..1971b5f1 100644
--- a/web/assets/js/bs5.monitorsUtils.js
+++ b/web/assets/js/bs5.monitorsUtils.js
@@ -51,73 +51,85 @@ function setCosmeticMonitorInfo(monitorConfig){
}
function getSnapshot(options,cb){
- var image_data
- var url
- var monitor = options.mon || options.monitor || options
- var targetElement = $(options.targetElement || `[data-mid="${monitor.mid}"].monitor_item .stream-element`)
- var details = safeJsonParse(monitor.details)
- var streamType = details.stream_type;
- if(window.jpegModeOn !== true){
- function completeAction(image_data,width,height){
- var len = image_data.length
- var arraybuffer = new Uint8Array( len )
- for (var i = 0; i < len; i++) {
- arraybuffer[i] = image_data.charCodeAt(i)
- }
- try {
- var blob = new Blob([arraybuffer], {type: 'application/octet-stream'})
- } catch (e) {
- var bb = new (window.WebKitBlobBuilder || window.MozBlobBuilder)
- bb.append(arraybuffer);
- var blob = bb.getBlob('application/octet-stream');
- }
- url = (window.URL || window.webkitURL).createObjectURL(blob)
- cb(url,image_data,width,height)
- try{
- setTimeout(function(){
- URL.revokeObjectURL(url)
- },10000)
- }catch(er){}
+ return new Promise((resolve,reject) => {
+ function endAction(url,image_data,width,height,fileSize){
+ if(cb)cb(url,image_data,width,height,fileSize);
+ resolve({
+ url,
+ image_data,
+ width,
+ height,
+ fileSize
+ });
}
- switch(streamType){
- case'hls':
- case'flv':
- case'mp4':
- getVideoSnapshot(targetElement[0],function(base64,video_data,width,height){
- completeAction(video_data,width,height)
- })
- break;
- case'mjpeg':
- $('#temp').html('')
- var c = $('#temp canvas')[0]
- var img = $('img',targetElement.contents())[0]
- c.width = img.width
- c.height = img.height
- var ctx = c.getContext('2d')
- ctx.drawImage(img, 0, 0,c.width,c.height)
- completeAction(atob(c.toDataURL('image/jpeg').split(',')[1]),c.width,c.height)
- break;
- case'b64':
- var c = targetElement[0]
- var ctx = c.getContext('2d')
- completeAction(atob(c.toDataURL('image/jpeg').split(',')[1]),c.width,c.height)
- break;
- case'jpeg':
- url = targetElement.attr('src')
- image_data = new Image()
- image_data.src = url
- cb(url,image_data,image_data.width,image_data.height)
- break;
+ var image_data
+ var url
+ var monitor = options.mon || options.monitor || options
+ var targetElement = $(options.targetElement || `[data-mid="${monitor.mid}"].monitor_item .stream-element`)
+ var details = safeJsonParse(monitor.details)
+ var streamType = details.stream_type;
+ if(window.jpegModeOn !== true){
+ function completeAction(image_data,width,height){
+ var len = image_data.length
+ var arraybuffer = new Uint8Array( len )
+ for (var i = 0; i < len; i++) {
+ arraybuffer[i] = image_data.charCodeAt(i)
+ }
+ try {
+ var blob = new Blob([arraybuffer], {type: 'application/octet-stream'})
+ } catch (e) {
+ var bb = new (window.WebKitBlobBuilder || window.MozBlobBuilder)
+ bb.append(arraybuffer);
+ var blob = bb.getBlob('application/octet-stream');
+ }
+ url = (window.URL || window.webkitURL).createObjectURL(blob)
+ endAction(url,image_data,width,height,arraybuffer.length)
+ try{
+ setTimeout(function(){
+ URL.revokeObjectURL(url)
+ },10000)
+ }catch(er){}
+ }
+ switch(streamType){
+ case'hls':
+ case'flv':
+ case'mp4':
+ getVideoSnapshot(targetElement[0],function(base64,video_data,width,height){
+ completeAction(video_data,width,height)
+ })
+ break;
+ case'mjpeg':
+ $('#temp').html('')
+ var c = $('#temp canvas')[0]
+ var img = $('img',targetElement.contents())[0]
+ c.width = img.width
+ c.height = img.height
+ var ctx = c.getContext('2d')
+ ctx.drawImage(img, 0, 0,c.width,c.height)
+ completeAction(atob(c.toDataURL('image/jpeg').split(',')[1]),c.width,c.height)
+ break;
+ case'b64':
+ var c = targetElement[0]
+ var ctx = c.getContext('2d')
+ completeAction(atob(c.toDataURL('image/jpeg').split(',')[1]),c.width,c.height)
+ break;
+ case'jpeg':
+ url = targetElement.attr('src')
+ image_data = new Image()
+ image_data.src = url
+ endAction(url,image_data,image_data.width,image_data.height,0)
+ break;
+ }
+ $.each(onGetSnapshotByStreamExtensions,function(n,extender){
+ extender(streamType,targetElement,completeAction,cb)
+ })
+ }else{
+ url = targetElement.attr('src')
+ image_data = new Image()
+ image_data.src = url
+ endAction(url,image_data,image_data.width,image_data.height,0)
}
- $.each(onGetSnapshotByStreamExtensions,function(n,extender){
- extender(streamType,targetElement,completeAction,cb)
- })
- }else{
- url = targetElement.attr('src')
- image_data = new Image()
- image_data.src = url
- cb(url,image_data,image_data.width,image_data.height)
- }
+ })
}
function getVideoSnapshot(videoElement,cb){
var image_data