From 11bfcaacec2598cf1b520d8f43ce0c009f9f954c Mon Sep 17 00:00:00 2001
From: Miroslav Pejic <miroslav.pejic.85@gmail.com>
Date: Wed, 3 Dec 2025 11:00:39 +0100
Subject: [PATCH] [mirotalk] - move participants cmd

---
 .env.template              |  2 +-
 app/src/config.template.js |  2 +-
 app/src/server.js          |  2 +-
 package-lock.json          | 12 ++++-----
 package.json               |  4 +--
 public/js/brand.js         |  2 +-
 public/js/client.js        | 47 +++++++++++++++++++++++++-------
 public/views/client.html   | 55 ++++++++++++++++++++++++++++----------
 8 files changed, 90 insertions(+), 36 deletions(-)

diff --git a/.env.template b/.env.template
index cdec4f41..65e71f3a 100644
--- a/.env.template
+++ b/.env.template
@@ -1,5 +1,5 @@
 # ====================================================
-# MiroTalk P2P v.1.6.67 - Environment Configuration
+# MiroTalk P2P v.1.6.68 - Environment Configuration
 # ====================================================
 
 # App environment
diff --git a/app/src/config.template.js b/app/src/config.template.js
index e253bd31..05a789f6 100644
--- a/app/src/config.template.js
+++ b/app/src/config.template.js
@@ -2,7 +2,7 @@
 
 /**
  * ==============================================
- * MiroTalk P2P v.1.6.67 - Configuration File
+ * MiroTalk P2P v.1.6.68 - Configuration File
  * ==============================================
  *
  * Branding and customizations require a license:
diff --git a/app/src/server.js b/app/src/server.js
index 37a4f06e..6fc14e08 100755
--- a/app/src/server.js
+++ b/app/src/server.js
@@ -45,7 +45,7 @@ dependencies: {
  * @license For commercial use or closed source, contact us at license.mirotalk@gmail.com or purchase directly from CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-p2p-webrtc-realtime-video-conferences/38376661
  * @author  Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.6.67
+ * @version 1.6.68
  *
  */
 
diff --git a/package-lock.json b/package-lock.json
index 4d3c4bb1..aeaaed1e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
     "name": "mirotalk",
-    "version": "1.6.67",
+    "version": "1.6.68",
     "lockfileVersion": 3,
     "requires": true,
     "packages": {
         "": {
             "name": "mirotalk",
-            "version": "1.6.67",
+            "version": "1.6.68",
             "license": "AGPL-3.0",
             "dependencies": {
                 "@mattermost/client": "11.1.0",
@@ -40,7 +40,7 @@
                 "mocha": "^11.7.5",
                 "node-fetch": "^3.3.2",
                 "nodemon": "^3.1.11",
-                "prettier": "3.7.3",
+                "prettier": "3.7.4",
                 "proxyquire": "^2.1.3",
                 "should": "^13.2.3",
                 "sinon": "^21.0.0"
@@ -5289,9 +5289,9 @@
             }
         },
         "node_modules/prettier": {
-            "version": "3.7.3",
-            "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.7.3.tgz",
-            "integrity": "sha512-QgODejq9K3OzoBbuyobZlUhznP5SKwPqp+6Q6xw6o8gnhr4O85L2U915iM2IDcfF2NPXVaM9zlo9tdwipnYwzg==",
+            "version": "3.7.4",
+            "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.7.4.tgz",
+            "integrity": "sha512-v6UNi1+3hSlVvv8fSaoUbggEM5VErKmmpGA7Pl3HF8V6uKY7rvClBOJlH6yNwQtfTueNkGVpOv/mtWL9L4bgRA==",
             "dev": true,
             "license": "MIT",
             "bin": {
diff --git a/package.json b/package.json
index 07077eb9..41f5e3b3 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "mirotalk",
-    "version": "1.6.67",
+    "version": "1.6.68",
     "description": "A free WebRTC browser-based video call",
     "main": "server.js",
     "scripts": {
@@ -72,7 +72,7 @@
         "mocha": "^11.7.5",
         "node-fetch": "^3.3.2",
         "nodemon": "^3.1.11",
-        "prettier": "3.7.3",
+        "prettier": "3.7.4",
         "proxyquire": "^2.1.3",
         "should": "^13.2.3",
         "sinon": "^21.0.0"
diff --git a/public/js/brand.js b/public/js/brand.js
index 551b3541..5853b50a 100644
--- a/public/js/brand.js
+++ b/public/js/brand.js
@@ -77,7 +77,7 @@ let brand = {
     },
     about: {
         imageUrl: '../images/mirotalk-logo.gif',
-        title: 'WebRTC P2P v1.6.67',
+        title: 'WebRTC P2P v1.6.68',
         html: `
             <button 
                 id="support-button" 
diff --git a/public/js/client.js b/public/js/client.js
index ec555a3e..55d2c5ee 100644
--- a/public/js/client.js
+++ b/public/js/client.js
@@ -15,7 +15,7 @@
  * @license For commercial use or closed source, contact us at license.mirotalk@gmail.com or purchase directly from CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-p2p-webrtc-realtime-video-conferences/38376661
  * @author  Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.6.67
+ * @version 1.6.68
  *
  */
 
@@ -299,6 +299,8 @@ const msgerCPHeader = getId('msgerCPHeader');
 const msgerCPCloseBtn = getId('msgerCPCloseBtn');
 const msgerCPList = getId('msgerCPList');
 const searchPeerBarName = getId('searchPeerBarName');
+const msgerCPDropDownMenuBtn = getId('msgerCPDropDownMenuBtn');
+const msgerCPDropDownContent = getId('msgerCPDropDownContent');
 
 // Caption section
 const captionDraggable = getId('captionDraggable');
@@ -322,7 +324,6 @@ const tabVideoBtn = getId('tabVideoBtn');
 const tabAudioBtn = getId('tabAudioBtn');
 const tabVideoShareBtn = getId('tabVideoShareBtn');
 const tabRecordingBtn = getId('tabRecordingBtn');
-const tabParticipantsBtn = getId('tabParticipantsBtn');
 const tabProfileBtn = getId('tabProfileBtn');
 const tabShortcutsBtn = getId('tabShortcutsBtn');
 const tabNetworkBtn = getId('tabNetworkBtn');
@@ -5482,11 +5483,13 @@ function setChatRoomBtn() {
         toggleChatDropDownMenu();
     });
 
+    // dropdown msgerCP menu
+    msgerCPDropDownMenuBtn.addEventListener('click', () => {
+        toggleMsgerCPDropDownMenu();
+    });
+
     // show msger participants section
     msgerCPBtn.addEventListener('click', (e) => {
-        if (!thereArePeerConnections()) {
-            return toastMessage('info', 'No participants detected', '', 'top');
-        }
         elemDisplay(msgerCP, true, 'flex');
     });
 
@@ -6421,9 +6424,6 @@ function setupMySettings() {
     tabRecordingBtn.addEventListener('click', (e) => {
         openTab(e, 'tabRecording');
     });
-    tabParticipantsBtn.addEventListener('click', (e) => {
-        openTab(e, 'tabParticipants');
-    });
     tabProfileBtn.addEventListener('click', (e) => {
         openTab(e, 'tabProfile');
     });
@@ -8622,6 +8622,12 @@ function toggleChatDropDownMenu() {
         : (msgerDropDownContent.style.display = 'block');
 }
 
+function toggleMsgerCPDropDownMenu() {
+    msgerCPDropDownContent.style.display === 'block'
+        ? (msgerCPDropDownContent.style.display = 'none')
+        : (msgerCPDropDownContent.style.display = 'block');
+}
+
 /**
  * Chat maximize
  */
@@ -10866,7 +10872,7 @@ function disableAllPeers(element) {
     }
     Swal.fire({
         background: swBg,
-        position: 'center',
+        position: 'top',
         imageUrl: element == 'audio' ? images.audioOff : images.videoOff,
         title: element == 'audio' ? 'Mute everyone except yourself?' : 'Hide everyone except yourself?',
         text:
@@ -13076,7 +13082,7 @@ function showAbout() {
     Swal.fire({
         background: swBg,
         position: 'center',
-        title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.6.67',
+        title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.6.68',
         imageUrl: brand.about?.imageUrl && brand.about.imageUrl.trim() !== '' ? brand.about.imageUrl : images.about,
         customClass: { image: 'img-about' },
         html: `
@@ -13677,6 +13683,27 @@ function handleDropdownHover() {
         msgerDropDownContent.addEventListener('mouseleave', hideChatDropdown);
     }
 
+    // Handle MsgerCP dropdown menu hover
+    if (msgerCPDropDownMenuBtn && msgerCPDropDownContent) {
+        let msgerCPTimeoutId;
+
+        const showMsgerCPDropdown = () => {
+            clearTimeout(msgerCPTimeoutId);
+            elemDisplay(msgerCPDropDownContent, true, 'block');
+        };
+
+        const hideMsgerCPDropdown = () => {
+            msgerCPTimeoutId = setTimeout(() => {
+                elemDisplay(msgerCPDropDownContent, false);
+            }, 200);
+        };
+
+        msgerCPDropDownMenuBtn.addEventListener('mouseenter', showMsgerCPDropdown);
+        msgerCPDropDownMenuBtn.addEventListener('mouseleave', hideMsgerCPDropdown);
+        msgerCPDropDownContent.addEventListener('mouseenter', () => clearTimeout(msgerCPTimeoutId));
+        msgerCPDropDownContent.addEventListener('mouseleave', hideMsgerCPDropdown);
+    }
+
     // Handle Whiteboard dropdown menu hover
     if (whiteboardDropDownMenuBtn && whiteboardDropdownMenu) {
         let wbTimeoutId;
diff --git a/public/views/client.html b/public/views/client.html
index 7022a85e..773ada7d 100755
--- a/public/views/client.html
+++ b/public/views/client.html
@@ -279,6 +279,47 @@ access to use this app.
                     <header id="msgerCPHeader" class="msger-private-header">
                         <div class="msger-header-title"><i class="fas fa-users"></i> Participants</div>
                         <div class="msger-header-options">
+                            <!-- More options -->
+                            <div id="tabRoomParticipants" class="dropdown-custom">
+                                <button
+                                    class="dropdown-toggle-custom"
+                                    type="button"
+                                    id="msgerCPDropDownMenuBtn"
+                                    data-bs-toggle="dropdown-custom"
+                                    aria-expanded="false"
+                                >
+                                    <i class="fas fa-ellipsis-v"></i>
+                                </button>
+                                <ul
+                                    id="msgerCPDropDownContent"
+                                    class="dropdown-menu-custom"
+                                    aria-labelledby="msgerCPDropDownMenuBtn"
+                                >
+                                    <li>
+                                        <button id="captionEveryoneBtn">
+                                            <i class="fas fa-play"></i> Start captions
+                                        </button>
+                                    </li>
+                                    <li>
+                                        <button id="captionEveryoneStopBtn">
+                                            <i class="fas fa-stop"></i> Stop captions
+                                        </button>
+                                    </li>
+                                    <li>
+                                        <button id="muteEveryoneBtn">
+                                            <i class="fas fa-microphone"></i> Mute everyone
+                                        </button>
+                                    </li>
+                                    <li>
+                                        <button id="hideEveryoneBtn"><i class="fas fa-video"></i> Hide everyone</button>
+                                    </li>
+                                    <li>
+                                        <button id="ejectEveryoneBtn">
+                                            <i class="fas fa-right-from-bracket"></i> Eject everyone
+                                        </button>
+                                    </li>
+                                </ul>
+                            </div>
                             <button id="msgerCPCloseBtn" class="fas fa-times"></button>
                         </div>
                     </header>
@@ -374,9 +415,6 @@ access to use this app.
                     <button id="tabVideoShareBtn" class="fab fa-youtube tablinks">
                         <p class="tabButtonText">Media</p>
                     </button>
-                    <button id="tabParticipantsBtn" class="fa-solid fa-users tablinks">
-                        <p class="tabButtonText">Participants</p>
-                    </button>
                     <button id="tabProfileBtn" class="fa-solid fa-user tablinks">
                         <p class="tabButtonText">Profile</p>
                     </button>
@@ -641,17 +679,6 @@ access to use this app.
                             <i class="fa-solid fa-users"></i>
                             <p id="peersCount"></p>
                         </div>
-                        <br />
-                        <div id="tabRoomParticipants">
-                            <br />
-                            <button id="captionEveryoneBtn"><i class="fas fa-play"></i>&nbsp;Start captions</button>
-                            <button id="captionEveryoneStopBtn"><i class="fas fa-stop"></i>&nbsp;Stop captions</button>
-                            <button id="muteEveryoneBtn"><i class="fas fa-microphone"></i>&nbsp;Mute everyone</button>
-                            <button id="hideEveryoneBtn"><i class="fas fa-video"></i>&nbsp;Hide everyone</button>
-                            <button id="ejectEveryoneBtn">
-                                <i class="fas fa-right-from-bracket"></i>&nbsp;Eject everyone
-                            </button>
-                        </div>
                     </div>
 
                     <div id="tabShortcuts" class="tabcontent">