Start to show call members

assets/css/components/calls/window.css

@@ -41,3 +41,16 @@
 .call-window .head a {
 	color: inherit;
 }
+
+.call-window .members-area {
+	color: white;
+	font-size: 80%;
+	text-align: center;
+	display: flex;
+	flex-direction: row;
+	justify-content: center;
+}
+
+.call-window .members-area span {
+	margin: 0px 5px;
+}

assets/js/common/shorcuts.js

@@ -197,6 +197,16 @@ function userInfo(userID, force = false) {
     });
 }
 
+/**
+ * Get information about a user (new User class)
+ * 
+ * @param {Number} userID target user id
+ * @returns {Promise<User>} Information about the user
+ */
+async function user(userID) {
+    return new User(await userInfo(userID))
+}
+
 /**
  * Display message on browser console
  * 

assets/js/components/calls/window.js

@@ -58,11 +58,31 @@ class CallWindow extends CustomEvents {
 
 			this.makeWindowDraggable();
 
+
+			// Create members area
+			this.membersArea = createElem2({
+				appendTo: this.rootEl,
+				type: "div",
+				class: "members-area"
+			})
+
+
+
 			// Join the call
 			await ws("calls/join", {
 				convID: this.conv.ID
 			})
 
+			// Get the list of members of the call
+			const currMembersList = await ws("calls/members", {
+				callID: this.conv.ID
+			})
+
+			// Apply this list of user
+			for(const user of currMembersList)
+				if(user != userID())
+					await this.AddMember(user)
+
 		} catch(e) {
 			console.error(e)
 			notify("Could not initialize call!", "danger");
@@ -156,4 +176,20 @@ class CallWindow extends CustomEvents {
 		if(propagate)
 			this.emitEvent("close");
 	}
+
+	/**
+	 * Add a member to this call
+	 * 
+	 * @param {number} userID The ID of the target member
+	 */
+	async AddMember(userID) {
+		
+		// Apply user information
+		createElem2({
+			appendTo: this.membersArea,
+			type: "span",
+			innerHTML: (await user(userID)).fullName
+		});
+
+	}
 }