From b1632c4c87050f1c1e7833c2ce841b8446dfa48f Mon Sep 17 00:00:00 2001
From: SinTan1729 <sayantan.santra689@gmail.com>
Date: Wed, 29 May 2024 09:52:21 -0500
Subject: [PATCH] fix: Fixed some UI visibility related stuff

---
 resources/index.html       |  4 ++--
 resources/static/script.js | 20 ++++++++++++--------
 2 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/resources/index.html b/resources/index.html
index b62a349..e0a4235 100644
--- a/resources/index.html
+++ b/resources/index.html
@@ -40,7 +40,7 @@
                     <input type="text" name="shortUrl" id="shortUrl" placeholder="Only a-z, 0-9, - and _ are allowed"
                         pattern="[a-z0-9\-_]+" title="Only a-z, 0-9, - and _ are allowed"/>
                 </div>
-                <div class="pure-controls">
+                <div class="pure-controls" id="controls">
                     <button class="pure-button pure-button-primary">Shorten!</button>
                     <p id="alert-box">&nbsp;</p>
                 </div>
@@ -48,7 +48,7 @@
         </form>
 
         <p id="loading-text">Loading links table...</p>
-        <table class="pure-table" hidden>
+        <table class="pure-table" id="table-box" hidden>
             <caption>Active links</caption>
             <br />
             <thead>
diff --git a/resources/static/script.js b/resources/static/script.js
index 16e47fe..79b3eac 100644
--- a/resources/static/script.js
+++ b/resources/static/script.js
@@ -44,6 +44,7 @@ const refreshData = async () => {
     let res = await fetch(prepSubdir("/api/all"));
     if (!res.ok) {
         let errorMsg = await res.text();
+        document.getElementById("url-table").innerHTML = '';
         console.log(errorMsg);
         if (errorMsg == "Using public mode.") {
             document.getElementById("admin-button").hidden = false;
@@ -67,30 +68,30 @@ const displayData = async (data) => {
     admin_button.href = "javascript:logOut()";
     admin_button.hidden = false;
 
-    table_box = document.querySelector(".pure-table");
+    table_box = document.getElementById("table-box");
     loading_text = document.getElementById("loading-text");
+    const table = document.getElementById("url-table");
 
     if (data.length == 0) {
         table_box.hidden = true;
-        loading_text.hidden = true;
         loading_text.innerHTML = "No active links.";
+        loading_text.hidden = false;
     }
     else {
-        loading_text.style.display = "none";
-        const table = document.querySelector("#url-table");
+        loading_text.hidden = true;
         if (!window.isSecureContext) {
             const shortUrlHeader = document.getElementById("short-url-header");
             shortUrlHeader.innerHTML = "Short URL<br>(right click and copy)";
         }
         table_box.hidden = false;
-        table.innerHTML = ''; // Clear
+        table.innerHTML = '';
         data.forEach(tr => table.appendChild(TR(tr, site)));
     }
 }
 
 const showAlert = async (text, col) => {
     document.getElementById("alert-box")?.remove();
-    const controls = document.querySelector(".pure-controls");
+    const controls = document.getElementById("controls");
     const alertBox = document.createElement("p");
     alertBox.id = "alert-box";
     alertBox.style.color = col;
@@ -228,7 +229,8 @@ const submitLogin = () => {
     }).then(res => {
         if (res.ok) {
             document.getElementById("container").style.filter = "blur(0px)"
-            document.getElementById("login-dialog").remove();
+            document.getElementById("login-dialog").close();
+            password.value = '';
             refreshData();
         } else {
             const wrongPassBox = document.getElementById("wrong-pass");
@@ -242,7 +244,9 @@ const submitLogin = () => {
 const logOut = async () => {
     let reply = await fetch(prepSubdir("/api/logout"), {method: "DELETE"}).then(res => res.text());
     console.log(reply);
-    location.reload();
+    document.getElementById("table-box").hidden = true;
+    document.getElementById("loading-text").hidden = false;
+    refreshData();
 }
 
 (async () => {