[mirotalksfu] - replace alert with sweetalert

miroslavpejic85 · Jan 12, 2025 · 4215cca · 4215cca
1 parent 1056322
commit 4215cca
Show file tree

Hide file tree

Showing 10 changed files with 41 additions and 15 deletions.
diff --git a/app/src/Server.js b/app/src/Server.js
@@ -55,7 +55,7 @@ dev dependencies: {
  * @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.6.98
+ * @version 1.6.99
  *
  */
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "mirotalksfu",
-    "version": "1.6.98",
+    "version": "1.6.99",
     "description": "WebRTC SFU browser-based video calls",
     "main": "Server.js",
     "scripts": {

diff --git a/public/js/Common.js b/public/js/Common.js
@@ -224,11 +224,11 @@ function joinRoom() {
     const roomValid = isValidRoomName(roomName);
 
     if (!roomName) {
-        alert('Room name empty!\nPlease pick a room name.');
+        popup('warning', 'Room name empty!\nPlease pick a room name.');
         return;
     }
     if (!roomValid) {
-        alert('Invalid Room name!\nPath traversal pattern detected!');
+        popup('warning', 'Invalid Room name!\nPath traversal pattern detected!');
         return;
     }
 

diff --git a/public/js/Login.js b/public/js/Login.js
@@ -87,20 +87,20 @@ function login() {
             })
             .catch(function (error) {
                 console.error(error);
-                alert('Unauthorized');
+                popup('warning', 'Invalid credentials. Please try again.');
             });
         return;
     }
     if (!username && !password) {
-        alert('Username and Password required');
+        popup('warning', 'Username and Password required');
         return;
     }
     if (!username) {
-        alert('Username required');
+        popup('warning', 'Username required');
         return;
     }
     if (!password) {
-        alert('Password required');
+        popup('warning', 'Password required');
         return;
     }
 }

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 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.6.98
+ * @version 1.6.99
  *
  */
 
@@ -4904,7 +4904,7 @@ function showAbout() {
         imageUrl: image.about,
         customClass: { image: 'img-about' },
         position: 'center',
-        title: 'WebRTC SFU v1.6.98',
+        title: 'WebRTC SFU v1.6.99',
         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 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.6.98
+ * @version 1.6.99
  *
  */
 

diff --git a/public/js/Utils.js b/public/js/Utils.js
@@ -0,0 +1,15 @@
+'use strict';
+
+function popup(icon, text, position = 'center') {
+    Swal.fire({
+        background: '#1D2026',
+        position: position,
+        icon: icon,
+        text: text,
+        color: '#FFFFFF',
+        confirmButtonColor: '#1A84F5',
+        showClass: { popup: 'animate__animated animate__fadeInDown' },
+        hideClass: { popup: 'animate__animated animate__fadeOutUp' },
+    });
+}
+//...
diff --git a/public/views/landing.html b/public/views/landing.html
@@ -39,6 +39,7 @@
 
         <!-- StyleSheet -->
 
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
         <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans:400,600" />
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" />
         <link rel="stylesheet" type="text/css" href="../css/landing.css" />
@@ -52,6 +53,7 @@
         <script defer src="../js/Brand.js"></script>
         <script async src="../js/Umami.js"></script>
 
+        <script defer src="https://cdn.jsdelivr.net/npm/sweetalert2@11.4.8"></script>
         <script src="https://unpkg.com/animejs@3.0.1/lib/anime.min.js"></script>
         <script src="https://unpkg.com/scrollreveal@4.0.0/dist/scrollreveal.min.js"></script>
         <script src="https://cdn.jsdelivr.net/npm/xss/dist/xss.min.js"></script>
@@ -628,8 +630,9 @@ <h3 class="tac">Our advertisers</h3>
             </footer>
         </div>
 
-        <script defer src="../js/Landing.js"></script>
+        <script defer src="../js/Utils.js"></script>
         <script defer src="../js/Common.js"></script>
+        <script defer src="../js/Landing.js"></script>
         <script async defer src="https://buttons.github.io/buttons.js"></script>
     </body>
 </html>
diff --git a/public/views/login.html b/public/views/login.html
@@ -56,6 +56,10 @@
             crossorigin="anonymous"
         ></script>
 
+        <!-- https://animate.style 4 using for swal fadeIn-Out -->
+
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
+
         <!-- Js scripts -->
 
         <script defer src="../js/Brand.js"></script>
@@ -65,12 +69,13 @@
         <script src="https://unpkg.com/scrollreveal@4.0.0/dist/scrollreveal.min.js"></script>
 
         <!-- xss -->
-
         <script src="https://cdn.jsdelivr.net/npm/xss/dist/xss.min.js"></script>
 
         <!-- axios -->
-
         <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
+
+        <!-- sweetalert -->
+        <script defer src="https://cdn.jsdelivr.net/npm/sweetalert2@11.4.8"></script>
     </head>
     <body class="is-boxed has-animations">
         <div class="body-wrap">
@@ -250,6 +255,7 @@ <h1 class="hero-title mt-0">
             </footer>
         </div>
 
+        <script defer src="../js/Utils.js"></script>
         <script defer src="../js/Login.js"></script>
         <script defer src="../js/Landing.js"></script>
         <script async defer src="https://buttons.github.io/buttons.js"></script>

diff --git a/public/views/newroom.html b/public/views/newroom.html
@@ -38,7 +38,7 @@
         <meta id="ogUrl" property="og:url" content="https://sfu.mirotalk.com" />
 
         <!-- StyleSheet -->
-
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
         <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans:400,600" />
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" />
         <link rel="stylesheet" type="text/css" href="../css/landing.css" />
@@ -48,6 +48,7 @@
         <script defer src="../js/Brand.js"></script>
         <script async src="../js/Umami.js"></script>
 
+        <script defer src="https://cdn.jsdelivr.net/npm/sweetalert2@11.4.8"></script>
         <script src="https://unpkg.com/animejs@3.0.1/lib/anime.min.js"></script>
         <script src="https://unpkg.com/scrollreveal@4.0.0/dist/scrollreveal.min.js"></script>
         <script src="https://cdn.jsdelivr.net/npm/xss/dist/xss.min.js"></script>
@@ -244,6 +245,7 @@ <h3 class="section-title mt-0">
             </footer>
         </div>
 
+        <script defer src="../js/Utils.js"></script>
         <script defer src="../js/Landing.js"></script>
         <script defer src="../js/Common.js"></script>
         <script async defer src="https://buttons.github.io/buttons.js"></script>