Use endpoint for chat history instead of websocket (#67)

* Change placeholder when chat is disabled

* Use the /chat endpoint for bulk chat history population instead of websocket. For #47

* Force LiveUI/seek bar during live to show. Closes #11.

* Change pulling chat history into app.js

* Force new messages to have visability = true

webroot/js/app.js

@@ -86,6 +86,8 @@ class Owncast {
       onError: this.handlePlayerError,
     });
     this.player.init();
+
+    this.getChatHistory();
   };
 
   setConfigData(data) {
@@ -132,17 +134,21 @@ class Owncast {
         return; 
       }
       const message = new Message(model);
-      const existing = this.vueApp.messages.filter(function (item) {
-        return item.id === message.id;
-      })
-      if (existing.length === 0 || !existing) {
-        this.vueApp.messages = [...this.vueApp.messages, message];
-      }
+      this.addMessage(message);
     };
     this.websocket = ws;
     this.messagingInterface.setWebsocket(this.websocket);
   };
 
+  addMessage(message) {
+    const existing = this.vueApp.messages.filter(function (item) {
+      return item.id === message.id;
+    })
+    if (existing.length === 0 || !existing) {
+      this.vueApp.messages = [...this.vueApp.messages, message];
+    }
+  }
+
   // fetch /config data
   getConfig() {
     fetch(URL_CONFIG)
@@ -276,4 +282,18 @@ class Owncast {
     this.handleOfflineMode();
     // stop timers?
   };
+
+  async getChatHistory() {
+    const url = "/chat";
+    const response = await fetch(url);
+    const data = await response.json();
+    const messages = data.map(function (message) {
+      return new Message(message);
+    })
+    this.setChatHistory(messages);
+  }
+
+  setChatHistory(messages) {
+    this.vueApp.messages = messages;
+  }
 };

webroot/js/message.js

@@ -81,6 +81,7 @@ class MessagingInterface {
 		} else {
 			this.tagAppContainer.classList.add('desktop');
 		}
+
 	}
 
 	setWebsocket(socket) {