[mirotalksfu] - fix VideoAI preview on mobile, update dep

miroslavpejic85 · Jul 2, 2024 · 7ea29cf · 7ea29cf
1 parent 926e64d
commit 7ea29cf
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 10 deletions.
diff --git a/app/src/Server.js b/app/src/Server.js
@@ -44,7 +44,7 @@ dependencies: {
  * @license For commercial or closed source, contact us at [email protected] or purchase directly via CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
  * @author  Miroslav Pejic - [email protected]
- * @version 1.4.79
+ * @version 1.4.80
  *
  */
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "mirotalksfu",
-    "version": "1.4.79",
+    "version": "1.4.80",
     "description": "WebRTC SFU browser-based video calls",
     "main": "Server.js",
     "scripts": {
@@ -74,7 +74,7 @@
         "ngrok": "^5.0.0-beta.2",
         "nodemailer": "^6.9.14",
         "openai": "^4.52.2",
-        "qs": "6.12.1",
+        "qs": "6.12.2",
         "socket.io": "4.7.5",
         "swagger-ui-express": "5.0.1",
         "uuid": "10.0.0",

diff --git a/public/js/Room.js b/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 [email protected] or purchase directly via CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
  * @author  Miroslav Pejic - [email protected]
- * @version 1.4.79
+ * @version 1.4.80
  *
  */
 
@@ -4071,7 +4071,7 @@ function showAbout() {
         imageUrl: image.about,
         customClass: { image: 'img-about' },
         position: 'center',
-        title: 'WebRTC SFU v1.4.79',
+        title: 'WebRTC SFU v1.4.80',
         html: `
         <br />
         <div id="about">

diff --git a/public/js/RoomClient.js b/public/js/RoomClient.js
@@ -9,7 +9,7 @@
  * @license For commercial or closed source, contact us at [email protected] or purchase directly via CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
  * @author  Miroslav Pejic - [email protected]
- * @version 1.4.79
+ * @version 1.4.80
  *
  */
 
@@ -7040,8 +7040,10 @@ class RoomClient {
                                 VideoAI.avatar = avatarDataArr[0];
                                 VideoAI.avatarName = avatarDataArr[1];
                                 VideoAI.avatarVoice = avatarDataArr[2] ? avatarDataArr[2] : '';
-                                avatarVideoAIPreview.src = avatarUi.video_url.grey;
+
+                                avatarVideoAIPreview.setAttribute('src', avatarUi.video_url.grey);
                                 avatarVideoAIPreview.play();
+
                                 console.log('Avatar image click event', {
                                     avatar,
                                     avatarUi,
@@ -7052,10 +7054,14 @@ class RoomClient {
                             div.append(hr);
                             div.append(label);
                             avatarVideoAIcontainer.append(div);
+
                             // Show the first available free avatar
                             if (showFreeAvatars && avatarUi.pose_name === 'Kristin in Black Suit') {
-                                avatarVideoAIPreview.src = avatarUi.video_url.grey;
-                                avatarVideoAIPreview.play();
+                                avatarVideoAIPreview.setAttribute('src', avatarUi.video_url.grey);
+                                avatarVideoAIPreview.playsInline = true;
+                                avatarVideoAIPreview.autoplay = true;
+                                avatarVideoAIPreview.controls = true;
+                                avatarVideoAIPreview.volume = 0.5;
                             }
                         }
                     });

diff --git a/public/views/Room.html b/public/views/Room.html
@@ -633,6 +633,7 @@ <h1>Loading</h1>
                                     </td>
                                 </tr>
                             </table>
+                            <hr />
                         </div>
                         <br />
                     </div>
@@ -883,7 +884,7 @@ <h1>Loading</h1>
 
                     <div id="tabVideoAI" class="tabcontent">
                         <div class="avatarsVideoAI">
-                            <video id="avatarVideoAIPreview" src="" controls="yes"></video>
+                            <video id="avatarVideoAIPreview"></video>
                             <hr />
                             <table class="settingsTable">
                                 <tr id="avatars">