Active viewer PING controller. Closes #790 (#990)

webroot/js/app-video-only.js

@@ -19,6 +19,7 @@ import {
 import {
   URL_CONFIG,
   URL_STATUS,
+  URL_VIEWER_PING,
   TIMER_STATUS_UPDATE,
   TIMER_STREAM_DURATION_COUNTER,
   TEMP_IMAGE,
@@ -117,6 +118,12 @@ export default class VideoOnly extends Component {
         this.handleOfflineMode();
         this.handleNetworkingError(`Stream status: ${error}`);
       });
+
+      // Ping the API to let them know we're an active viewer
+      fetch(URL_VIEWER_PING).catch((error) => {
+        this.handleOfflineMode();
+        this.handleNetworkingError(`Viewer PING error: ${error}`);
+      });
   }
 
   setConfigData(data = {}) {

webroot/js/app.js

@@ -42,6 +42,7 @@ import {
   URL_CONFIG,
   URL_OWNCAST,
   URL_STATUS,
+  URL_VIEWER_PING,
   WIDTH_SINGLE_COL,
 } from './utils/constants.js';
 
@@ -186,6 +187,12 @@ export default class App extends Component {
         this.handleOfflineMode();
         this.handleNetworkingError(`Stream status: ${error}`);
       });
+
+    // Ping the API to let them know we're an active viewer
+    fetch(URL_VIEWER_PING).catch((error) => {
+      this.handleOfflineMode();
+      this.handleNetworkingError(`Viewer PING error: ${error}`);
+    });
   }
 
   setConfigData(data = {}) {

webroot/js/utils/constants.js

@@ -4,6 +4,7 @@ export const URL_STATUS = `/api/status`;
 export const URL_CHAT_HISTORY = `/api/chat`;
 export const URL_CUSTOM_EMOJIS = `/api/emoji`;
 export const URL_CONFIG = `/api/config`;
+export const URL_VIEWER_PING = `/api/ping`;
 
 // TODO: This directory is customizable in the config.  So we should expose this via the config API.
 export const URL_STREAM = `/hls/stream.m3u8`;