Added sound.

src/snek/static/app.js

@@ -263,7 +263,10 @@ class NotificationAudio {
         this.schedule = new Schedule(timeout);
     }
 
-    sounds = ["/audio/soundfx.d_beep3.mp3"];
+    sounds = [
+        "/audio/soundfx.d_beep3.mp3",
+        "/audio/mention1.wav"
+    ];
 
     play(soundIndex = 0) {
         this.schedule.delay(() => {

src/snek/templates/web.html

@@ -116,22 +116,27 @@
 
     setInterval(updateTimes, 1000);
 
+    function isMention(message){
+        const mentionText = '@{{ user.username.value }}';
+        return message.toLowerCase().includes(mentionText);
+    }
+    
     app.addEventListener("channel-message", (data) => {
         if (data.channel_uid !== channelUid) return;
 
         if (data.username !== "{{ user.username.value }}") {
+            if(isMention(data.message)){
+                app.playSound(1);
+            }else{
             app.playSound(0);
             }
+        }
         
         const messagesContainer = document.querySelector(".chat-messages");
         const lastMessage = messagesContainer.querySelector(".message:last-child"); 
         const doScrollDownBecauseLastMessageIsVisible = !lastMessage || isElementVisible(lastMessage);
 
         const message = document.createElement("div");
-        message.dataset.color = data.color;
-        message.dataset.created_at = data.created_at;
-        message.dataset.user_nick = data.user_nick;
-        message.dataset.uid = data.uid;
         message.innerHTML = data.html;
         document.querySelector(".chat-messages").appendChild(message.firstChild);
         updateLayout(doScrollDownBecauseLastMessageIsVisible);