keep the chat enabled on timer (#1313)

* keep the chat enabled on timer

* fix chat deactivation of stream stop

* simplify the chat status logic

* Use strict inequality

Co-authored-by: gingervitis <omqmail@gmail.com>

* Use strict inequality

Co-authored-by: gingervitis <omqmail@gmail.com>

Co-authored-by: gingervitis <omqmail@gmail.com>

webroot/js/app-standalone-chat.js

@@ -33,7 +33,7 @@ export default class StandaloneChat extends Component {
       accessToken: null,
       username: null,
       isRegistering: false,
-      streamOnline: false, // stream is active/online
+      streamOnline: null, // stream is active/online
       lastDisconnectTime: null,
       configData: {
         loading: true,
@@ -126,27 +126,36 @@ export default class StandaloneChat extends Component {
     }
     const { online, lastDisconnectTime } = status;
 
-    if (status.online && !curStreamOnline) {
-      // stream has just come online.
-      this.handleOnlineMode();
-    } else if (!status.online && curStreamOnline) {
-      // stream has just flipped offline.
-      this.handleOfflineMode();
-    }
-
     this.setState({
       lastDisconnectTime,
       streamOnline: online,
     });
+
+    if (status.online !== curStreamOnline) {
+      if (status.online) {
+        // stream has just come online.
+        this.handleOnlineMode();
+      } else {
+        // stream has just flipped offline or app just got loaded and stream is offline.
+        this.handleOfflineMode(lastDisconnectTime);
+      }
+    }
   }
 
   // stop status timer and disable chat after some time.
-  handleOfflineMode() {
+  handleOfflineMode(lastDisconnectTime) {
+    if (lastDisconnectTime) {
       const remainingChatTime =
         TIMER_DISABLE_CHAT_AFTER_OFFLINE -
-      (Date.now() - new Date(this.state.lastDisconnectTime));
+        (Date.now() - new Date(lastDisconnectTime));
       const countdown = remainingChatTime < 0 ? 0 : remainingChatTime;
+      if (countdown > 0) {
+        this.setState({
+          chatInputEnabled: true,
+        });
+      }
       this.disableChatInputTimer = setTimeout(this.disableChatInput, countdown);
+    }
     this.setState({
       streamOnline: false,
     });

webroot/js/app.js

@@ -76,7 +76,7 @@ export default class App extends Component {
       extraPageContent: '',
 
       playerActive: false, // player object is active
-      streamOnline: false, // stream is active/online
+      streamOnline: null, // stream is active/online
       isPlaying: false, // player is actively playing video
 
       // status
@@ -259,14 +259,16 @@ export default class App extends Component {
       lastDisconnectTime,
     });
 
-    if (status.online && !curStreamOnline) {
+    if (status.online !== curStreamOnline) {
+      if (status.online) {
         // stream has just come online.
         this.handleOnlineMode();
-    } else if (!status.online && curStreamOnline) {
-      // stream has just flipped offline.
+      } else {
+        // stream has just flipped offline or app just got loaded and stream is offline.
         this.handleOfflineMode(lastDisconnectTime);
       }
     }
+  }
 
   // when videojs player is ready, start polling for stream
   handlePlayerReady() {
@@ -304,6 +306,11 @@ export default class App extends Component {
         TIMER_DISABLE_CHAT_AFTER_OFFLINE -
         (Date.now() - new Date(lastDisconnectTime));
       const countdown = remainingChatTime < 0 ? 0 : remainingChatTime;
+      if (countdown > 0) {
+        this.setState({
+          chatInputEnabled: true,
+        });
+      }
       this.disableChatInputTimer = setTimeout(this.disableChatInput, countdown);
     }