From 99f12e1baef91a824105d74f1c6be8bb63bcd3f1 Mon Sep 17 00:00:00 2001
From: Miroslav Pejic <miroslav.pejic.85@gmail.com>
Date: Wed, 1 Apr 2026 00:52:17 +0200
Subject: [PATCH] [mirotak] - add spin animation to room generate button

---
 .env.template              |  2 +-
 app/src/config.template.js |  2 +-
 app/src/server.js          |  2 +-
 package-lock.json          |  4 ++--
 package.json               |  2 +-
 public/css/landing.css     | 17 +++++++++++++++++
 public/js/brand.js         |  2 +-
 public/js/client.js        |  4 ++--
 public/js/common.js        |  6 ++++++
 9 files changed, 32 insertions(+), 9 deletions(-)

diff --git a/.env.template b/.env.template
index 1f6fe164..af790cb0 100644
--- a/.env.template
+++ b/.env.template
@@ -1,5 +1,5 @@
 # ====================================================
-# MiroTalk P2P v.1.7.81 - Environment Configuration
+# MiroTalk P2P v.1.7.82 - Environment Configuration
 # ====================================================
 
 # App environment
diff --git a/app/src/config.template.js b/app/src/config.template.js
index 1a737a09..d5ba22eb 100644
--- a/app/src/config.template.js
+++ b/app/src/config.template.js
@@ -2,7 +2,7 @@
 
 /**
  * ==============================================
- * MiroTalk P2P v.1.7.81 - Configuration File
+ * MiroTalk P2P v.1.7.82 - Configuration File
  * ==============================================
  *
  * This file is the central configuration source.
diff --git a/app/src/server.js b/app/src/server.js
index 6346329e..e756332d 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.7.81
+ * @version 1.7.82
  *
  */
 
diff --git a/package-lock.json b/package-lock.json
index 78e767b3..0ea9ecd2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
     "name": "mirotalk",
-    "version": "1.7.81",
+    "version": "1.7.82",
     "lockfileVersion": 3,
     "requires": true,
     "packages": {
         "": {
             "name": "mirotalk",
-            "version": "1.7.81",
+            "version": "1.7.82",
             "license": "AGPL-3.0",
             "dependencies": {
                 "@mattermost/client": "11.5.0",
diff --git a/package.json b/package.json
index 5531fc93..89eed334 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "mirotalk",
-    "version": "1.7.81",
+    "version": "1.7.82",
     "description": "A free WebRTC browser-based video call",
     "main": "server.js",
     "scripts": {
diff --git a/public/css/landing.css b/public/css/landing.css
index 56d90e2f..6619cfc0 100755
--- a/public/css/landing.css
+++ b/public/css/landing.css
@@ -1488,6 +1488,23 @@ textarea.form-input {
     color: #376df9;
 }
 
+.room-gen-btn.spin {
+    animation: roomGenSpin 0.5s cubic-bezier(0.4, 0, 0.2, 1);
+    color: #4678f9;
+}
+
+@keyframes roomGenSpin {
+    0% {
+        transform: translateY(-50%) rotate(0deg) scale(1);
+    }
+    50% {
+        transform: translateY(-50%) rotate(180deg) scale(1.25);
+    }
+    100% {
+        transform: translateY(-50%) rotate(360deg) scale(1);
+    }
+}
+
 @media (max-width: 640px) {
     .form-group-desktop .form-input {
         margin-bottom: 12px;
diff --git a/public/js/brand.js b/public/js/brand.js
index fb3426c6..703109b2 100644
--- a/public/js/brand.js
+++ b/public/js/brand.js
@@ -107,7 +107,7 @@ let brand = {
     },
     about: {
         imageUrl: '../images/mirotalk-logo.gif',
-        title: 'WebRTC P2P v1.7.81',
+        title: 'WebRTC P2P v1.7.82',
         html: `
             <button 
                 id="support-button" 
diff --git a/public/js/client.js b/public/js/client.js
index 2a197f71..58e85835 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.7.81
+ * @version 1.7.82
  *
  */
 
@@ -14599,7 +14599,7 @@ function showAbout() {
     Swal.fire({
         background: swBg,
         position: 'center',
-        title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.7.81',
+        title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.7.82',
         imageUrl: brand.about?.imageUrl && brand.about.imageUrl.trim() !== '' ? brand.about.imageUrl : images.about,
         customClass: { image: 'img-about' },
         html: `
diff --git a/public/js/common.js b/public/js/common.js
index 0d8a803d..2331079e 100644
--- a/public/js/common.js
+++ b/public/js/common.js
@@ -194,8 +194,14 @@ const adultCnt = document.getElementById('adultCnt');
 
 if (genRoomButton) {
     genRoomButton.onclick = (e) => {
+        genRoomButton.classList.remove('spin');
+        void genRoomButton.offsetWidth;
+        genRoomButton.classList.add('spin');
         genRoom();
     };
+    genRoomButton.addEventListener('animationend', () => {
+        genRoomButton.classList.remove('spin');
+    });
 }
 
 if (joinRoomButton) {