change to updateUI

index.html

@@ -30,7 +30,6 @@
         text-align: right;
         margin-top: 10px;
       }
-
       .logout-container button {
         width: auto;
         min-width: 120px;
@@ -110,7 +109,7 @@
       <label for="newPassword">Password:</label>
       <input type="password" id="newPassword" class="form-control">
 
-            <div>
+      <div id="adminCheckboxContainer">
         <input type="checkbox" id="isAdmin">
         <label for="isAdmin">Grant Admin Access</label>
       </div>
@@ -121,22 +120,41 @@
   </div>
   
   <script>
+    // Global flag to determine if we are in setup mode.
+    window.setupMode = false;
+
     document.addEventListener("DOMContentLoaded", function () {
       checkAuthentication();
 
       function updateUI(data) {
+        if (data.setup) {
+          // In setup mode, show the Add User Modal and hide other UI elements.
+          document.getElementById("loginForm").style.display = "none";
+          document.getElementById("uploadForm").style.display = "none";
+          document.getElementById("fileListContainer").style.display = "none";
+          document.getElementById("logoutBtn").style.display = "none";
+          document.getElementById("addUserBtn").style.display = "none";
+          // Pre-check and disable the admin checkbox.
+          document.getElementById("isAdmin").checked = true;
+          document.getElementById("isAdmin").disabled = true;
+          // Optionally hide the container (since it's always admin in setup mode).
+          document.getElementById("adminCheckboxContainer").style.display = "none";
+          document.getElementById("addUserModal").style.display = "block";
+          window.setupMode = true;
+          return;
+        }
+        
+        // Normal authenticated user flow.
         if (data.authenticated) {
           document.getElementById("loginForm").style.display = "none";
           document.getElementById("uploadForm").style.display = "block";
           document.getElementById("fileListContainer").style.display = "block";
           document.getElementById("logoutBtn").style.display = "block";
-
           if (data.isAdmin) {
             document.getElementById("addUserBtn").style.display = "block";
           } else {
             document.getElementById("addUserBtn").style.display = "none";
           }
-
           loadFileList();
         } else {
           document.getElementById("loginForm").style.display = "block";
@@ -170,7 +188,7 @@
         .then(response => response.json())
         .then(data => {
           if (data.success) {
-                    updateUI({ authenticated: true, isAdmin: data.isAdmin }); // Update UI immediately
+            updateUI({ authenticated: true, isAdmin: data.isAdmin });
           } else {
             alert("Login failed: " + (data.error || "Unknown error"));
           }
@@ -192,14 +210,20 @@
       document.getElementById("saveUserBtn").addEventListener("click", function () {
         const newUsername = document.getElementById("newUsername").value.trim();
         const newPassword = document.getElementById("newPassword").value.trim();
-            const isAdmin = document.getElementById("isAdmin").checked;
+        // In setup mode, ignore the checkbox value (always admin)
+        const isAdmin = window.setupMode ? true : document.getElementById("isAdmin").checked;
 
         if (!newUsername || !newPassword) {
           alert("Username and password are required!");
           return;
         }
 
-            fetch("addUser.php", {
+        let url = "addUser.php";
+        if (window.setupMode) {
+          url += "?setup=1";
+        }
+
+        fetch(url, {
           method: "POST",
           headers: { "Content-Type": "application/json" },
           body: JSON.stringify({ username: newUsername, password: newPassword, isAdmin })
@@ -209,7 +233,8 @@
           if (data.success) {
             alert("User added successfully!");
             closeAddUserModal();
-                    checkAuthentication(); // Refresh UI after adding user
+            // If this was the setup, reload the page to show the login form.
+            window.location.reload(true);
           } else {
             alert("Error: " + (data.error || "Could not add user"));
           }
@@ -230,9 +255,11 @@
         document.getElementById("newUsername").value = "";
         document.getElementById("newPassword").value = "";
         document.getElementById("isAdmin").checked = false;
+        document.getElementById("isAdmin").disabled = false;
+        document.getElementById("adminCheckboxContainer").style.display = "block";
       }
     });
-</script>
+  </script>
 
 </body>
 </html>