diff --git a/web/js/MonitorStream.js b/web/js/MonitorStream.js index 7db6c38c0..9e64812f5 100644 --- a/web/js/MonitorStream.js +++ b/web/js/MonitorStream.js @@ -233,13 +233,7 @@ function MonitorStream(monitorData) { if (-1 != p.indexOf('go2rtc')) { } else if (-1 != p.indexOf('rtsp2web')) { - if (-1 != p.indexOf('_hls')) { - this.RTSP2WebType = 'HLS'; - } else if (-1 != p.indexOf('_mse')) { - this.RTSP2WebType = 'MSE'; - } else if (-1 != p.indexOf('_webrtc')) { - this.RTSP2WebType = 'WebRTC'; - } + this.setRTSP2WebType(p); } else if (-1 != p.indexOf('janus')) { } @@ -255,6 +249,16 @@ function MonitorStream(monitorData) { return this.player = p; }; + this.setRTSP2WebType = function(player) { + if (-1 != player.indexOf('_hls')) { + this.RTSP2WebType = 'HLS'; + } else if (-1 != player.indexOf('_mse')) { + this.RTSP2WebType = 'MSE'; + } else if (-1 != player.indexOf('_webrtc')) { + this.RTSP2WebType = 'WebRTC'; + } + }; + this.manageAvailablePlayersOptions = function(action, opt) { if (action == 'disable') { opt.setAttribute('disabled', ''); @@ -265,7 +269,7 @@ function MonitorStream(monitorData) { } }; - this.manageAvailablePlayers = function() { + this.manageAvailablePlayers = function(candidate = '') { const selectPlayers = document.querySelector('[id="player"][name="codec"]'); const opts = selectPlayers.options; @@ -290,13 +294,12 @@ function MonitorStream(monitorData) { } } } - let selectedPlayerOption = selectPlayers.options[selectPlayers.selectedIndex]; + let selectedPlayerOption = opts[selectPlayers.selectedIndex]; if (selectedPlayerOption) { if (selectedPlayerOption.value == '') { // Perhaps "Auto" is left from the previous monitor, we will change it according to the cookies. - const zmWatchPlayer = getCookie('zmWatchPlayer'); - if (zmWatchPlayer) { - selectPlayers.value = zmWatchPlayer; + if (candidate !== "" && candidate !== undefined && candidate !== null) { + selectPlayers.value = candidate; selectedPlayerOption = selectPlayers.options[selectPlayers.selectedIndex]; } } @@ -305,7 +308,7 @@ function MonitorStream(monitorData) { selectPlayers.value = ''; // Auto } } - this.player = selectPlayers.value; + this.setPlayer(selectPlayers.value); }; this.element = null; @@ -1999,6 +2002,9 @@ function MonitorStream(monitorData) { this.kill(); return; } + if (!this.RTSP2WebType) { // This could happen, for example, on the Zones page, where `setPlayer` is not executed. + this.setRTSP2WebType(this.player); + } if (-1 !== this.player.indexOf('hls')) { const hlsUrl = rtsp2webModUrl; hlsUrl.pathname = "/stream/" + this.id + "/channel/" + numericChannel + "/hls/live/index.m3u8"; @@ -2009,6 +2015,12 @@ function MonitorStream(monitorData) { hlsUrl = "http://" + rtsp2webModUrl + "/stream/" + this.id + "/channel/0/hls/live/index.m3u8"; } */ + if (typeof Hls === 'undefined') { + console.warn("The HLS library is not loaded"); + this.streamErrorRegistration(true); + this.restart(this.currentChannelStream); + return; + } if (Hls.isSupported()) { // Save the playback session ID so asynchronous HLS callbacks // can ignore events from obsolete playback sessions. diff --git a/web/skins/classic/views/js/watch.js b/web/skins/classic/views/js/watch.js index 3aade242e..61c438c06 100644 --- a/web/skins/classic/views/js/watch.js +++ b/web/skins/classic/views/js/watch.js @@ -890,8 +890,7 @@ function handleMouseLeave(event) { function streamStart(monitor = null) { monitorStream = new MonitorStream(monitor ? monitor : monitorData[monIdx]); - monitorStream.manageAvailablePlayers(); - monitorStream.setPlayer($j('#player').val()); + monitorStream.manageAvailablePlayers(getCookie('zmWatchPlayer')); monitorStream.setBottomElement(document.getElementById('bottomBlock')); const cookieMuted = getCookie('zmWatchMuted'); monitorStream.muted = (cookieMuted === null || cookieMuted === 'true') ? true : false; // default to muted @@ -1459,7 +1458,7 @@ function changePlayer() { monitorStream.destroyVolumeSlider(); streamCmdStop(); // takes care of button state and calls stream.kill() - monitorStream.setPlayer($j('#player').val()); + monitorStream.setPlayer(player); setChannelStream(); setTimeout(function() { streamCmdPlay(true); diff --git a/web/skins/classic/views/js/zone.js b/web/skins/classic/views/js/zone.js index 1b376bda5..baa280ddc 100644 --- a/web/skins/classic/views/js/zone.js +++ b/web/skins/classic/views/js/zone.js @@ -659,7 +659,9 @@ function changePlayer() { for (let i = 0, length = monitors.length; i < length; i++) { monitors[i].stop(); monitors[i].setPlayer(player); - monitors[i].start(); + setTimeout(function() { + monitors[i].start(); + }, 200); } } @@ -812,14 +814,11 @@ function initPage() { console.log('Analyse button not found'); } - var cookiePlayer = getCookie('zmZonePlayer'); + const cookiePlayer = getCookie('zmZonePlayer'); for ( let i = 0, length = monitorData.length; i < length; i++ ) { monitors[i] = new MonitorStream(monitorData[i]); - monitors[i].manageAvailablePlayers(); - if (cookiePlayer !== undefined && cookiePlayer !== null) { - monitors[i].setPlayer(cookiePlayer); - } + monitors[i].manageAvailablePlayers(cookiePlayer); monitors[i].setButton('analyseBtn', analyseBtn); monitors[i].setStreamScale(); monitors[i].show_analyse_frames(analyse_frames); @@ -934,4 +933,4 @@ document.onvisibilitychange = () => { } }; -window.addEventListener('DOMContentLoaded', initPage); +window.addEventListener('DOMContentLoaded', initPage); \ No newline at end of file diff --git a/web/skins/classic/views/zone.php b/web/skins/classic/views/zone.php index 2a5aa9a2a..f3d36b4dd 100644 --- a/web/skins/classic/views/zone.php +++ b/web/skins/classic/views/zone.php @@ -419,6 +419,11 @@ if ($monitor->JanusEnabled()) { if ($monitor->Go2RTCEnabled()) { echo ''.PHP_EOL; } +if ($monitor->Go2RTCEnabled() || $monitor->RTSP2WebEnabled()) { +?> + +