Update account.html

Made this thing work again because Github didn't serve my PHP.

Author: mcgdj

account.html

@@ -11,97 +11,22 @@
             padding: 0;
             background-color: #f4f4f4;
         }
-
         .header {
             background-color: #c04d4d;
             color: white;
             text-align: center;
             padding: 20px;
         }
-
-        .header h1 {
-            margin: 0;
-        }
-
-        .menu-container {
-            position: relative;
-            display: flex;
-            justify-content: space-between;
-            background: #c04d4d;
-            padding: 20px;
-            color: #fff;
-            box-sizing: border-box;
-        }
-
-        .menu-logo img {
-            max-height: 40px;
-            max-width: 100px;
-        }
-
-        .menu-container a {
-            text-decoration: none;
-            color: #ffffff;
-            transition: color 0.3s ease;
-        }
-
-        .menu-container a:hover {
-            color: #50e3c2;
-        }
-
-        .menu ul {
-            list-style: none;
-            display: flex;
-            padding: 0;
-            margin: 0;
-        }
-
-        .menu li {
-            padding: 0 20px;
-            font-size: 22px;
-        }
-
         .content {
             padding: 20px;
             text-align: center;
         }
-
-        .logout-btn {
-            background-color: #c04d4d;
-            color: white;
-            padding: 10px 20px;
-            border: none;
-            cursor: pointer;
-            font-size: 16px;
-            margin-top: 20px;
-        }
-
-        .logout-btn:hover {
-            background-color: #a03b3b;
-        }
-
-        /* Form Styles */
-        input[type="text"] {
+        input[type="text"], button {
             padding: 10px;
             margin: 10px 0;
             font-size: 16px;
-            border: 1px solid #ccc;
-            width: 250px;
-            border-radius: 4px;
-        }
-
-        button {
-            background-color: #50e3c2;
-            color: white;
-            padding: 10px 20px;
-            font-size: 16px;
-            border: none;
-            cursor: pointer;
             border-radius: 4px;
         }
-
-        button:hover {
-            background-color: #3ec1a0;
-        }
     </style>
     <script>
         async function registerUser() {
@@ -110,88 +35,62 @@
                 alert("Please enter a Scratch username.");
                 return;
             }
-
-            const response = await fetch("server.php", {
-                method: "POST",
-                headers: { "Content-Type": "application/x-www-form-urlencoded" },
-                body: `username=${encodeURIComponent(username)}`
-            });
-
-            const data = await response.json();
-            if (data.error) {
-                alert(data.error);
-            } else {
-                localStorage.setItem("privateKey", data.privateKey);
-                alert("Your private key has been generated and saved locally. Keep it safe!");
-            }
+            
+            const privateKey = Math.random().toString(36).substr(2, 10);
+            localStorage.setItem("privateKey", privateKey);
+            alert(`Post this key on your Scratch profile: ${privateKey}`);
         }
 
         async function authenticateUser() {
+            const username = document.getElementById("username").value.trim();
             const privateKey = localStorage.getItem("privateKey");
-            if (!privateKey) {
-                alert("No private key found. Please register first.");
+            if (!username || !privateKey) {
+                alert("Make sure you have registered and saved your key.");
                 return;
             }
-
-            const response = await fetch("server.php", {
-                method: "POST",
-                headers: { "Content-Type": "application/x-www-form-urlencoded" },
-                body: `challengeResponse=${btoa(privateKey)}`
-            });
-
+            
+            const response = await fetch(`https://api.scratch.mit.edu/users/${username}/`);
             const data = await response.json();
-            if (data.success) {
+            
+            if (data.profile?.bio.includes(privateKey)) {
                 alert("Authentication successful!");
-                window.location.href = "#dashboard"; // Redirect to dashboard
+                document.getElementById("login").style.display = "none";
+                document.getElementById("dashboard").style.display = "block";
             } else {
-                alert(data.error);
+                alert("Key not found in bio. Make sure you've posted it and try again.");
             }
         }
 
         function logout() {
-            // Clear the private key from local storage
             localStorage.removeItem("privateKey");
-
-            // Redirect to login page
-            window.location.href = "#login"; // Redirect to login page
+            document.getElementById("dashboard").style.display = "none";
+            document.getElementById("login").style.display = "block";
         }
     </script>
 </head>
 <body>
-    <!-- Login Form -->
     <div id="login">
         <div class="header">
             <h1>Scratch Authentication</h1>
         </div>
-
         <div class="content">
             <label for="username">Scratch Username:</label>
             <input type="text" id="username" placeholder="Enter your Scratch username" />
             <br />
             <button onclick="registerUser()">Register</button>
             <br /><br />
-            <button onclick="authenticateUser()">Login with Key</button>
+            <button onclick="authenticateUser()">Login with Scratch</button>
         </div>
     </div>
-
-    <!-- Dashboard -->
+    
     <div id="dashboard" style="display: none;">
         <div class="header">
             <h1>Welcome to Your Dashboard!</h1>
         </div>
-
         <div class="content">
-            <p>You're successfully logged in with your private key. You can now access your personalized settings and manage your account.</p>
-            <button class="logout-btn" onclick="logout()">Logout</button>
+            <p>You're successfully logged in!</p>
+            <button onclick="logout()">Logout</button>
         </div>
     </div>
-
-    <script>
-        // Check if user is already authenticated
-        if (localStorage.getItem("privateKey")) {
-            document.getElementById("login").style.display = "none";
-            document.getElementById("dashboard").style.display = "block";
-        }
-    </script>
 </body>
 </html>