feat: add typing indicator with glow animation and event broadcasting

Implement real-time typing indicator feature across frontend and backend. Add `set_typing` RPC method in `RPCView` that broadcasts typing events with user details to a fixed channel. Introduce `typeLock`, `typeListener`, and `set_typing` method in `App` class to periodically send typing status. Update `Socket` to emit custom events from incoming data. Add CSS `glow` keyframe animation and apply it to user avatars in `web.html` when `set_typing` event is received.

src/snek/templates/web.html

@@ -24,7 +24,7 @@
 
 <script type="module">
     import { app } from "/app.js";
-
+    import { Schedule } from "/schedule.js";
     const channelUid = "{{ channel.uid.value }}";
 
     function getInputField(){
@@ -40,7 +40,9 @@
                     app.rpc.sendMessage(channelUid, message);
                     e.target.value = '';
                 }
-            }
+	    }else{
+		app.rpc.set_typing(channelUid)
+	    }
         });
         document.querySelector("upload-button").addEventListener("upload",function(e){
             getInputField().focus();
@@ -74,6 +76,30 @@
             }
         });
 
+	 function triggerGlow(uid) {
+	 	document.querySelectorAll(".avatar").forEach((el)=>{
+		   const div = el.closest('a');
+		   if(el.href.indexOf(uid)!=-1){
+			el.classList.add('glow')
+		    	let originalColor = el.style.backgroundColor 
+			//console.error(originalColor)
+			//el.style.backgroundColor = 'black'
+			setTimeout(()=>{
+			//	el.style.backgroundColor = originalColor
+			//	console.error(el.style.backgroundColor)
+				el.classList.remove('glow')
+			},1200)
+		    }
+
+	      })
+ 	
+    	}
+	app.ws.addEventListener("set_typing",(data)=>{
+		triggerGlow(data.data.user_uid)	
+
+	})
+		
+
         const chatInput = document.querySelector(".chat-area")
         chatInput.addEventListener("drop", async (e) => {
             e.preventDefault();