[mirotalk] - add extra info

miroslavpejic85 · Jul 2, 2024 · 13e44fb · 13e44fb
1 parent 8f6a8e3
commit 13e44fb
Show file tree

Hide file tree

Showing 5 changed files with 65 additions and 7 deletions.
diff --git a/app/src/server.js b/app/src/server.js
@@ -40,7 +40,7 @@ dependencies: {
  * @license For commercial use or closed source, contact us at [email protected] or purchase directly from CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-p2p-webrtc-realtime-video-conferences/38376661
  * @author  Miroslav Pejic - [email protected]
- * @version 1.3.38
+ * @version 1.3.39
  *
  */
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "mirotalk",
-    "version": "1.3.38",
+    "version": "1.3.39",
     "description": "A free WebRTC browser-based video call",
     "main": "server.js",
     "scripts": {
@@ -55,8 +55,8 @@
         "js-yaml": "^4.1.0",
         "ngrok": "^5.0.0-beta.2",
         "nodemailer": "^6.9.14",
-        "openai": "^4.52.1",
-        "qs": "^6.12.1",
+        "openai": "^4.52.2",
+        "qs": "^6.12.2",
         "socket.io": "^4.7.5",
         "swagger-ui-express": "^5.0.1",
         "uuid": "10.0.0",

diff --git a/public/css/client.css b/public/css/client.css
@@ -995,6 +995,13 @@ button:hover {
     transition: all 0.3s ease-in-out;
 }
 
+#extraInfo {
+    padding: 10px;
+    background: var(--select-bg);
+    color: #fff;
+    border-radius: 10px;
+}
+
 /*--------------------------------------------------------------
 # Settings buttons
 --------------------------------------------------------------*/

diff --git a/public/js/client.js b/public/js/client.js
@@ -15,7 +15,7 @@
  * @license For commercial use or closed source, contact us at [email protected] or purchase directly from CodeCanyon
  * @license CodeCanyon: https://codecanyon.net/item/mirotalk-p2p-webrtc-realtime-video-conferences/38376661
  * @author  Miroslav Pejic - [email protected]
- * @version 1.3.38
+ * @version 1.3.39
  *
  */
 
@@ -110,6 +110,7 @@ const wbWidth = 1200;
 const wbHeight = 600;
 
 // Peer infos
+const extraInfo = getId('extraInfo');
 const userAgent = navigator.userAgent.toLowerCase();
 const detectRtcVersion = DetectRTC.version;
 const isWebRTCSupported = DetectRTC.isWebRTCSupported;
@@ -122,6 +123,7 @@ const osVersion = DetectRTC.osVersion;
 const browserName = DetectRTC.browser.name;
 const browserVersion = DetectRTC.browser.version;
 const peerInfo = getPeerInfo();
+const thisInfo = getInfo();
 
 // Local Storage class
 const lS = new LocalStorage();
@@ -915,6 +917,48 @@ function getPeerInfo() {
     };
 }
 
+/**
+ * Get Extra info
+ * @returns object info
+ */
+function getInfo() {
+    const parser = new UAParser(userAgent);
+
+    try {
+        const parserResult = parser.getResult();
+        console.log('Info', parserResult);
+
+        // Filter out properties with 'Unknown' values
+        const filterUnknown = (obj) => {
+            const filtered = {};
+            for (const [key, value] of Object.entries(obj)) {
+                if (value && value !== 'Unknown') {
+                    filtered[key] = value;
+                }
+            }
+            return filtered;
+        };
+
+        const filteredResult = {
+            //ua: parserResult.ua,
+            browser: filterUnknown(parserResult.browser),
+            cpu: filterUnknown(parserResult.cpu),
+            device: filterUnknown(parserResult.device),
+            engine: filterUnknown(parserResult.engine),
+            os: filterUnknown(parserResult.os),
+        };
+
+        // Convert the filtered result to a readable JSON string
+        const resultString = JSON.stringify(filteredResult, null, 2);
+
+        extraInfo.innerText = resultString;
+
+        return parserResult;
+    } catch (error) {
+        console.error('Error parsing user agent:', error);
+    }
+}
+
 /**
  * Get Signaling server URL
  * @returns {string} Signaling server URL
@@ -9912,7 +9956,7 @@ function showAbout() {
     Swal.fire({
         background: swBg,
         position: 'center',
-        title: '<strong>WebRTC P2P v1.3.38</strong>',
+        title: '<strong>WebRTC P2P v1.3.39</strong>',
         imageAlt: 'mirotalk-about',
         imageUrl: images.about,
         customClass: { image: 'img-about' },

diff --git a/public/views/client.html b/public/views/client.html
@@ -700,6 +700,12 @@ <h1>Loading</h1>
                             <p>Presenter:</p>
                             <p id="isPeerPresenter">true</p>
                         </div>
+                        <br /><br />
+                        <div class="title">
+                            <i class="fa-solid fa-circle-info"></i>
+                            <p>Extra info:</p>
+                        </div>
+                        <pre id="extraInfo"></pre>
                     </div>
 
                     <div id="tabNetwork" class="tabcontent">
@@ -956,7 +962,7 @@ <h1>Loading</h1>
         - https://www.npmjs.com/package/tippy.js                            (https://github.com/atomiks/tippyjs) 
         - https://flatpickr.js.org/                                         (https://github.com/flatpickr/flatpickr)
         - https://simonwep.github.io/pickr/                                 (https://github.com/simonwep/pickr)
-
+        - https://uaparser.dev/                                             (https://github.com/faisalman/ua-parser-js)
         -->
         <script defer src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
         <script defer src="https://cdn.jsdelivr.net/npm/xss/dist/xss.min.js"></script>
@@ -976,6 +982,7 @@ <h1>Loading</h1>
         <script defer src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
         <script defer src="https://cdn.jsdelivr.net/npm/@simonwep/pickr/dist/pickr.min.js"></script>
         <script defer src="https://cdn.jsdelivr.net/npm/@simonwep/pickr/dist/pickr.es5.min.js"></script>
+        <script defer src="https://cdn.jsdelivr.net/npm/ua-parser-js@latest/dist/ua-parser.min.js"></script>
         <script defer src="/socket.io/socket.io.js"></script>
         <script defer src="../js/localStorage.js"></script>
         <script defer src="../js/helpers.js"></script>