[mirotalksfu] - #169 fix private messaging when new peer joins the room

public/js/Room.js

@@ -11,7 +11,7 @@ if (location.href.substr(0, 5) !== 'https') location.href = 'https' + location.h
  * @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
  * @author  Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.5.87
+ * @version 1.5.88
  *
  */
 
@@ -3932,12 +3932,14 @@ function getParticipantsList(peers) {
 
     // CHAT-GPT
     if (chatGPT) {
+        const chatgpt_active = rc.chatPeerName === 'ChatGPT' ? ' active' : '';
+
         li = `
         <li 
             id="ChatGPT" 
             data-to-id="ChatGPT"
             data-to-name="ChatGPT"
-            class="clearfix" 
+            class="clearfix${chatgpt_active}" 
             onclick="rc.showPeerAboutAndMessages(this.id, 'ChatGPT', event)"
         >
             <img 
@@ -3951,12 +3953,14 @@ function getParticipantsList(peers) {
         </li>`;
     }
 
+    const public_chat_active = rc.chatPeerName === 'all' ? ' active' : '';
+
     // ALL
     li += `
     <li id="all"
         data-to-id="all"
         data-to-name="all"
-        class="clearfix active" 
+        class="clearfix${public_chat_active}" 
         onclick="rc.showPeerAboutAndMessages(this.id, 'all', event)"
     >
         <img 
@@ -4032,6 +4036,8 @@ function getParticipantsList(peers) {
         const peer_id = peer_info.peer_id;
         const avatarImg = getParticipantAvatar(peer_name);
 
+        const peer_chat_active = rc.chatPeerId === peer_id ? ' active' : '';
+
         // NOT ME
         if (socket.id !== peer_id) {
             // PRESENTER HAS MORE OPTIONS
@@ -4041,7 +4047,7 @@ function getParticipantsList(peers) {
                     id='${peer_id}'
                     data-to-id="${peer_id}" 
                     data-to-name="${peer_name}"
-                    class="clearfix" 
+                    class="clearfix${peer_chat_active}" 
                     onclick="rc.showPeerAboutAndMessages(this.id, '${peer_name}', event)"
                 >
                     <img
@@ -4117,7 +4123,7 @@ function getParticipantsList(peers) {
                     id='${peer_id}' 
                     data-to-id="${peer_id}"
                     data-to-name="${peer_name}"
-                    class="clearfix" 
+                    class="clearfix${peer_chat_active}" 
                     onclick="rc.showPeerAboutAndMessages(this.id, '${peer_name}', event)"
                 >
                 <img 
@@ -4494,7 +4500,7 @@ function showAbout() {
         imageUrl: image.about,
         customClass: { image: 'img-about' },
         position: 'center',
-        title: 'WebRTC SFU v1.5.87',
+        title: 'WebRTC SFU v1.5.88',
         html: `
         <br />
         <div id="about">

public/js/RoomClient.js

@@ -9,7 +9,7 @@
  * @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
  * @author  Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.5.87
+ * @version 1.5.88
  *
  */
 
@@ -235,6 +235,8 @@ class RoomClient {
         this.chatMessageNotifyDelay = 10000; // ms
         this.chatMessageSpamCount = 0;
         this.chatMessageSpamCountToBan = 10;
+        this.chatPeerId = 'all';
+        this.chatPeerName = 'all';
 
         // HeyGen Video AI
         this.videoAIContainer = null;
@@ -3704,7 +3706,7 @@ class RoomClient {
             }
             this.chatCenter();
             this.sound('open');
-            this.showPeerAboutAndMessages('all', 'all');
+            this.showPeerAboutAndMessages(this.chatPeerId, this.chatPeerName);
         }
         isParticipantsListOpen = !isParticipantsListOpen;
         this.isChatOpen = !this.isChatOpen;
@@ -7442,6 +7444,9 @@ class RoomClient {
     showPeerAboutAndMessages(peer_id, peer_name, event = null) {
         this.hidePeerMessages();
 
+        this.chatPeerId = peer_id;
+        this.chatPeerName = peer_name;
+
         const chatAbout = this.getId('chatAbout');
         const participant = this.getId(peer_id);
         const participantsList = this.getId('participantsList');