Setup chat UI

Signed-off-by: Emmy D'Anello <emmy.danello@animath.fr>

chat/static/chat.js

@@ -4,6 +4,9 @@
     await Notification.requestPermission()
 })()
 
+let channels = {}
+let selected_channel_id = null
+
 /**
  * Display a new notification with the given title and the given body.
  * @param title The title of the notification
@@ -18,6 +21,33 @@ function showNotification(title, body, timeout = 5000) {
     return notif
 }
 
+function selectChannel(channel_id) {
+    let channel = channels[channel_id]
+    if (!channel) {
+        console.error('Channel not found:', channel_id)
+        return
+    }
+
+    selected_channel_id = channel_id
+
+    let channelTitle = document.getElementById('channel-title')
+    channelTitle.innerText = channel['name']
+
+    let messageInput = document.getElementById('input-message')
+    messageInput.disabled = !channel['write_access']
+}
+
+function setChannels(new_channels) {
+    channels = {}
+    for (let channel of new_channels) {
+        channels[channel['id']] = channel
+    }
+
+    if (new_channels && (!selected_channel_id || !channels[selected_channel_id])) {
+        selectChannel(Object.keys(channels)[0])
+    }
+}
+
 document.addEventListener('DOMContentLoaded', () => {
     /**
      * Process the received data from the server.
@@ -25,7 +55,15 @@ document.addEventListener('DOMContentLoaded', () => {
      */
     function processMessage(data) {
         // TODO Implement chat protocol
-        console.log(data)
+        switch (data['type']) {
+            case 'fetch_channels':
+                setChannels(data['channels'])
+                break
+            default:
+                console.log(data)
+                console.error('Unknown message type:', data['type'])
+                break
+        }
     }
 
     function setupSocket(nextDelay = 1000) {