Automatically update the list of members of the call

assets/js/common/ws.js

@@ -221,6 +221,14 @@ class UserWebSocket {
 				SendEvent("commentDeleted", msg.data);
 				break;
 
+			case "user_joined_call":
+				SendEvent("userJoinedCall", msg.data);
+				break;
+
+			case "user_left_call":
+				SendEvent("userLeftCall", msg.data);
+				break;
+
 			default:
 				console.error("WS Unspported kind of message!", msg);
 				break;

assets/js/components/calls/controller.js

@@ -76,6 +76,21 @@ class CallsController {
 	}
 }
 
+document.addEventListener("userJoinedCall", (e) => {
+	const detail = e.detail;
+
+	if(OpenConversations.has(detail.callID))
+		OpenConversations.get(detail.callID).AddMember(detail.userID)
+})
+
+document.addEventListener("userLeftCall", (e) => {
+	const detail = e.detail;
+
+	if(OpenConversations.has(detail.callID))
+		OpenConversations.get(detail.callID).RemoveMember(detail.userID)
+})
+
+
 document.addEventListener("wsClosed", () => {
 	// Close all the current conversations
 	OpenConversations.forEach((v) => v.Close(false))

assets/js/components/calls/window.js

@@ -185,11 +185,27 @@ class CallWindow extends CustomEvents {
 	async AddMember(userID) {
 		
 		// Apply user information
-		createElem2({
+		const el = createElem2({
 			appendTo: this.membersArea,
 			type: "span",
 			innerHTML: (await user(userID)).fullName
 		});
+		el.setAttribute("data-call-member-name-id", userID)
+
+	}
+
+
+	/**
+	 * Remove a user from a call
+	 * 
+	 * @param {number} userID The ID of the target user
+	 */
+	async RemoveMember(userID) {
+		
+		// Remove user name
+		const el = this.membersArea.querySelector("[data-call-member-name-id=\""+userID+"\"]")
+		if(el)
+			el.remove()
 
 	}
 }