From 32974f0ebcedb13979f82be6e814b048c489a0d6 Mon Sep 17 00:00:00 2001
From: Miroslav Pejic <miroslav.pejic.85@gmail.com>
Date: Thu, 13 Apr 2023 09:18:26 +0200
Subject: [PATCH] [mirotalksfu] - add genRoom UUID4

---
 public/views/landing.html | 28 +++++++++++++++++++++++-----
 public/views/newroom.html | 28 +++++++++++++++++++++++-----
 2 files changed, 46 insertions(+), 10 deletions(-)
diff --git a/public/views/landing.html b/public/views/landing.html
index 5af93469..d6417af8 100644
--- a/public/views/landing.html
+++ b/public/views/landing.html
@@ -45,15 +45,13 @@
         <!-- StyleSheet -->
 
         <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" href="../css/landing.css" />
 
         <!-- Js scripts -->
 
         <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>
-
-        <!-- xss -->
-
         <script src="https://rawgit.com/leizongmin/js-xss/master/dist/xss.js"></script>
     </head>
     <body class="is-boxed has-animations">
@@ -127,6 +125,11 @@
                                             value=""
                                             style="border-radius: 6px"
                                         />
+                                        <button
+                                            id="genRoomButton"
+                                            class="button button-primary br-6 mr-8 mb-8 fas fa-arrows-rotate"
+                                            onclick="genRoom()"
+                                        ></button>
                                         <button
                                             id="joinRoomButton"
                                             class="button button-primary pulse"
@@ -141,9 +144,24 @@
                                                     joinRoom();
                                                 }
                                             };
+                                            function genRoom() {
+                                                document.getElementById('roomName').value = getUUID4();
+                                            }
+                                            function getUUID4() {
+                                                return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, (c) =>
+                                                    (
+                                                        c ^
+                                                        (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))
+                                                    ).toString(16),
+                                                );
+                                            }
                                             function joinRoom() {
-                                                let roomName = filterXSS(document.getElementById('roomName').value);
-                                                window.location.href = '/join/' + roomName;
+                                                const roomName = filterXSS(document.getElementById('roomName').value);
+                                                if (roomName) {
+                                                    window.location.href = '/join/' + roomName;
+                                                } else {
+                                                    alert('Room name empty!\nPlease pick a room name.');
+                                                }
                                             }
                                         </script>
                                     </div>
diff --git a/public/views/newroom.html b/public/views/newroom.html
index 2abc1ceb..eb6b6b55 100755
--- a/public/views/newroom.html
+++ b/public/views/newroom.html
@@ -45,15 +45,13 @@
         <!-- StyleSheet -->
 
         <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" href="../css/landing.css" />
 
         <!-- Js scripts -->
 
         <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>
-
-        <!-- xss -->
-
         <script src="https://rawgit.com/leizongmin/js-xss/master/dist/xss.js"></script>
     </head>
     <body class="is-boxed has-animations">
@@ -126,6 +124,11 @@
                                             value=""
                                             style="border-radius: 6px"
                                         />
+                                        <button
+                                            id="genRoomButton"
+                                            class="button button-primary br-6 mr-8 mb-8 fas fa-arrows-rotate"
+                                            onclick="genRoom()"
+                                        ></button>
                                         <button
                                             id="joinRoomButton"
                                             class="button button-primary pulse"
@@ -140,9 +143,24 @@
                                                     joinRoom();
                                                 }
                                             };
+                                            function genRoom() {
+                                                document.getElementById('roomName').value = getUUID4();
+                                            }
+                                            function getUUID4() {
+                                                return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, (c) =>
+                                                    (
+                                                        c ^
+                                                        (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))
+                                                    ).toString(16),
+                                                );
+                                            }
                                             function joinRoom() {
-                                                let roomName = filterXSS(document.getElementById('roomName').value);
-                                                window.location.href = '/join/' + roomName;
+                                                const roomName = filterXSS(document.getElementById('roomName').value);
+                                                if (roomName) {
+                                                    window.location.href = '/join/' + roomName;
+                                                } else {
+                                                    alert('Room name empty!\nPlease pick a room name.');
+                                                }
                                             }
                                         </script>
                                     </div>
