fixes stream overlay

plugins/overlay/plugin.js

@@ -7,7 +7,7 @@ class overlayPlugin extends plugin {
         html, body {
             background: none;
         }
-        video, #bg {
+        #bg, #bgvid {
             visibility: hidden !important;
         }
         </style>`;

public/js/display.js

@@ -340,9 +340,10 @@ function showBackgroundOnly() {
 }
 
 function checkStream(serverOptions) {
-    if (serverOptions.isStreaming && streamStarted === false) {
+    if (serverOptions.isStreaming) {
         if (flvjs.isSupported()) {
-            var videoElement = document.getElementById('bgvid');
+            $("#stream").show();
+            var videoElement = document.getElementById('stream');        
             flvPlayer = flvjs.createPlayer({
                 type: 'flv',
                 url: serverOptions.streamSource
@@ -352,10 +353,10 @@ function checkStream(serverOptions) {
                 flvPlayer.volume = videoVolume;
                 flvPlayer.load();
                 flvPlayer.play();
-                showBackgroundOnly();
                 streamStarted = true;
                 return true;
             } catch (err) {
+                $('#stream').hide();
                 console.log(err);
                 streamStarted = false;
                 return false;
@@ -373,6 +374,7 @@ function checkStream(serverOptions) {
             }
             return false;
         }
+        $("#stream").hide();
         return false;
     }
     return true;

views/display.twig

@@ -24,6 +24,8 @@
     
 
     <div id="networkstatus" class="noselect animated"><i class="spinner loading icon"></i></div>
+    
+    <video id="stream" class="fsimage" poster=""></video>
 
     <div id="helperLayer" class="gpu animated"></div>
 
@@ -38,7 +40,8 @@
         <img id="bgimg" class="fsimage" src="/img/wait.png"/>
     </div>
 
-    <video loop autoplay id="bgvid" class="fsimage" poster=""></video>
+    <video loop autoplay id="bgvid" class="fsimage" poster="">
+    </video>
 
     <script>
         var socket = io("{{ config.serverUrl }}:{{ config.serverListenPort }}/display-{{ displayId }}");

views/layout/view.twig

@@ -10,6 +10,12 @@
             background: #000;
             height: 100vh;
         }
+        #stream {
+            display: none;
+            z-index: 100;
+            height: 100vh;
+            width: 100vw;
+        }
     </style>
 
     {% block header %}{% endblock %}