Hide viewer stats when in offline mode. Closes #66

webroot/index.html

@@ -78,9 +78,9 @@
 
         <section id="stream-info" aria-label="Stream status" v-cloak class="flex font-mono bg-gray-900 text-indigo-200 shadow-md border-b border-gray-100 border-solid">
           <span>{{ streamStatus }}</span>
-          <span>{{ viewerCount }} {{ 'viewer' | plural(viewerCount) }}.</span>
-          <span>Max {{ sessionMaxViewerCount }} {{ 'viewer' | plural(sessionMaxViewerCount) }}.</span>
-          <span>{{ overallMaxViewerCount }} overall.</span>        
+          <span v-if="isOnline">{{ viewerCount }} {{ 'viewer' | plural(viewerCount) }}.</span>
+          <span v-if="isOnline">Max {{ sessionMaxViewerCount }} {{ 'viewer' | plural(sessionMaxViewerCount) }}.</span>
+          <span v-if="isOnline">{{ overallMaxViewerCount }} overall.</span>
         </section>
      </main>
 

webroot/js/app.js

@@ -51,6 +51,7 @@ class Owncast {
         sessionMaxViewerCount: 0,
         streamStatus: MESSAGE_OFFLINE, // Default state.
         viewerCount: 0,
+        isOnline: false,
   
         // from config
         appVersion: '',
@@ -281,6 +282,7 @@ class Owncast {
 
   // stop status timer and disable chat after some time.
   handleOfflineMode() {
+    this.vueApp.isOnline = false;
     clearInterval(this.streamDurationTimer);
     this.vueApp.streamStatus = MESSAGE_OFFLINE;
     if (this.streamStatus) {
@@ -293,6 +295,7 @@ class Owncast {
   // play video!
   handleOnlineMode() {
     this.vueApp.playerOn = true;
+    this.vueApp.isOnline = true;
     this.vueApp.streamStatus = MESSAGE_ONLINE;
 
     this.player.startPlayer();