Updated 4 files, added 2 files and deleted bot.zip (automated)

1 files changed, 56 insertions, 34 deletions

diff --git a/launcher/client/index.html b/launcher/client/index.html
index 00813c7..79d70b2 100644
--- a/launcher/client/index.html
+++ b/launcher/client/index.html
@@ -4,48 +4,60 @@
     <meta charset="UTF-8">
     <title>Chatroom</title>
     <style>
-        #loader-circle-1, #loader-circle-2, #loader-circle-3 {
-            animation-name: opacity;
-            animation-timing-function: linear;
-            animation-duration: 1.2s;
-            animation-fill-mode: forwards;
-            animation-iteration-count: infinite;
-        }
-
-        #loader-circle-2 {
-            animation-delay: .25s;
-        }
+        @keyframes loaded-1 {
+            0% {
+                background-color: #111111;
+            }
 
-        #loader-circle-3 {
-            animation-delay: .5s;
+            100% {
+                background-color: #1ABCB9;
+            }
         }
 
-        @keyframes opacity {
+        @keyframes loaded-2 {
             0% {
-                opacity: 0;
-            }
-            50% {
-                opacity: 1;
+                opacity: .3;
+                filter: drop-shadow(0 0 0 transparent);
             }
+
             100% {
-                opacity: 0;
+                opacity: 1;
+                filter: drop-shadow(0 0 15px rgba(0, 0, 0, .5));
             }
         }
+
+        body.loaded {
+            animation-name: loaded-1;
+            animation-duration: .5s;
+            animation-iteration-count: 1;
+            animation-fill-mode: forwards;
+            animation-direction: normal;
+            animation-play-state: running;
+            animation-timing-function: ease-in-out;
+        }
+
+        body.loaded #ic {
+            animation-name: loaded-2;
+            animation-duration: .5s;
+            animation-iteration-count: 1;
+            animation-fill-mode: forwards;
+            animation-direction: normal;
+            animation-play-state: running;
+            animation-timing-function: ease-in-out;
+        }
     </style>
     <script>
         const { ipcRenderer } = require('electron');
 
         ipcRenderer.on('local', (_, data) => {
-            loadApp(data);
+            download(data);
         });
 
         ipcRenderer.on('download', (_) => {
-            download();
+            download(null);
         });
 
-        function download() {
-            document.getElementById("status").innerText = "Downloading application... 0%";
-
+        function download(data) {
             const axios = require('./node_modules/axios/dist/node/axios.cjs');
             const fs = require("fs");
             const zlib = require("zlib");
@@ -56,18 +68,18 @@
             fs.mkdirSync(tempDir);
 
             function downloadClient() {
+                document.getElementById("progress-outer").style.display = "";
+
                 return new Promise(async (res) => {
                     const response = await axios({
                         url: "http://51.68.173.117:21938/update/client.lctpk?_" + require('crypto').randomBytes(64).toString("hex"),
                         method: 'GET',
                         responseType: 'blob',
                         onDownloadProgress: (event) => {
-                            document.getElementById("status").innerText = "Downloading application... " + Math.round(((event.loaded / event.total) / 2) * 100) + "%";
+                            document.getElementById("progress").style.width = ((event.loaded / event.total) * 100) + "%";
                         }
                     });
 
-                    document.getElementById("status").innerText = "Extracting...";
-
                     res(JSON.parse(zlib.brotliDecompressSync(Buffer.from(await response.data.arrayBuffer())).toString()).map(i => {
                         if (i['content']) i['content'] = zlib.brotliDecompressSync(Buffer.from(i['content'], "base64"));
                         if (i['hash']) i['hash'] = crypto.createHash("sha256").update(i['content']).digest("base64") === i['hash'];
@@ -80,7 +92,6 @@
                 let _client = await downloadClient();
                 let files = [..._client];
 
-                document.getElementById("status").innerText = "Installing application... 0%";
                 let total = files.length;
                 let index = 0;
 
@@ -97,12 +108,19 @@
                     }
 
                     index++;
-                    document.getElementById("status").innerText = "Installing application... " + Math.round((index / total) * 100) + "%";
+                    document.getElementById("progress").style.width = ((index / total) * 100) + "%";
                 }
 
-                document.getElementById("status").innerText = "Starting...";
+                document.getElementById("progress-outer").style.display = "none";
+                document.body.classList.add("loaded");
 
-                loadApp(tempDir + "/client");
+                setTimeout(() => {
+                    if (data) {
+                        loadApp(data);
+                    } else {
+                        loadApp(tempDir + "/client");
+                    }
+                }, 1500);
             })();
         }
 
@@ -116,7 +134,7 @@
 
     <div style="position: fixed; inset: 0; z-index: 999; display: flex; align-items: center; justify-content: center; text-align: center;">
         <div>
-            <svg style="opacity: .25;" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 203.96 171.05">
+            <svg id="ic" style="opacity: .3; width: 64px;" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 203.96 171.05">
                 <defs>
                     <style>
                         .cls-1 {
@@ -126,8 +144,12 @@
                 </defs>
                 <path class="cls-1" d="M40.49,144.2c-3.75-2.02-6.68-4.84-8.77-8.44-2.09-3.61-3.14-7.51-3.14-11.69v-45.47l-22.73-12.55c-2.04-1.14-3.53-2.56-4.45-4.27-.93-1.71-1.39-3.6-1.39-5.69s.46-3.92,1.39-5.71c.93-1.79,2.41-3.27,4.45-4.47L84.66,2.81c1.73-1.01,3.52-1.73,5.36-2.17s3.74-.65,5.68-.65,3.83,.22,5.68,.65,3.63,1.15,5.36,2.17l91.37,49.8c1.86,.95,3.29,2.32,4.32,4.13,1.02,1.8,1.53,3.75,1.53,5.83v61.06c0,3.18-1.12,5.88-3.36,8.12s-4.94,3.36-8.12,3.36-5.88-1.12-8.12-3.36c-2.24-2.24-3.36-4.94-3.36-8.12v-55.21l-18.19,10.18v45.47c0,4.19-1.05,8.08-3.14,11.69-2.09,3.61-5.02,6.42-8.77,8.44l-44.17,24.03c-1.73,1.01-3.52,1.73-5.36,2.17-1.84,.43-3.74,.65-5.68,.65s-3.83-.22-5.68-.65c-1.84-.43-3.63-1.15-5.36-2.17l-44.17-24.03Zm55.21-55.43l60.63-32.91L95.7,23.17,35.29,55.86l60.41,32.91Zm0,59.11l44.17-23.82v-33.56l-33.13,18.4c-1.73,1.01-3.5,1.73-5.3,2.17-1.8,.43-3.72,.65-5.74,.65s-3.93-.22-5.74-.65-3.57-1.15-5.3-2.17l-33.13-18.4v33.56l44.17,23.82Z"/>
             </svg>
-            <br>
-            <p style="color: white; opacity: .25; font-family: system-ui, -apple-system, sans-serif;" id="status">Starting...</p>
+        </div>
+    </div>
+
+    <div style="position: fixed; bottom: 75px; left: 0; right: 0;">
+        <div id="progress-outer" style="display: none; background-color: rgba(255,255,255,0.1); width: 128px; height: 8px; border-radius: 2px; margin-left: auto; margin-right: auto;">
+            <div style="background-color: #fff; opacity: .3; width: 0; height: 8px; border-radius: 2px;" id="progress"></div>
         </div>
     </div>
 </body>