|
109 | 109 | return encoded;
|
110 | 110 | }
|
111 | 111 |
|
112 |
| - // On page load, check if the user is logged in |
113 |
| - window.onload = function () { |
114 |
| - if (localStorage.getItem('loggedIn') === 'true') { |
115 |
| - const username = localStorage.getItem('username'); |
116 |
| - const textElements = document.querySelectorAll('.text'); |
117 |
| - const loggedIn = document.getElementById('loggedIn'); |
118 |
| - const tlogged = document.getElementById('hide'); |
119 |
| - const mainText = document.getElementById('mainText') |
120 |
| - |
121 |
| - // Hide all elements with the class "text" |
122 |
| - textElements.forEach(function (element) { |
123 |
| - element.style.display = 'none'; |
124 |
| - }) |
125 |
| - const res = await fetch(`https://scratchgems.onrender.com/api/data/${username}`); |
126 |
| - if (!res.ok) { |
127 |
| - throw new Error('Failed to fetch data'); |
128 |
| - } |
129 |
| - const data = await res.json(); |
130 |
| - |
131 |
| - // Show the welcome message |
132 |
| - loggedIn.style.display = 'block'; |
133 |
| - loggedIn.textContent = `Welcome to your account, ${username}!`; |
134 |
| - tlogged.style.display = 'none'; |
135 |
| - |
136 |
| - if (data && data.pendingorders !== undefined && data.completedorders !== undefined) { |
137 |
| - mainText.innerHTML = ` |
138 |
| - <p>Pending Orders: ${data.pendingorders}</p> |
139 |
| - <br> |
140 |
| - <p>Completed Orders: ${data.completedorders}</p> |
141 |
| - <br> |
142 |
| - `; |
| 112 | + // Decode the username using the generated key |
| 113 | + function decodeUsername(encodedUsername, key) { |
| 114 | + const baseKey = 'abcdefghijklmnopqrstuvwxyz0123456789'; |
| 115 | + let decoded = ''; |
| 116 | + for (let char of encodedUsername) { |
| 117 | + let index = key.indexOf(char); |
| 118 | + if (index !== -1) { |
| 119 | + decoded += baseKey[index]; |
143 | 120 | } else {
|
144 |
| - mainText.innerHTML = `<p>Error loading order data.</p>`; |
| 121 | + decoded += char; |
145 | 122 | }
|
| 123 | + } |
| 124 | + return decoded; |
| 125 | + } |
| 126 | + |
| 127 | + // On page load, check if the user is logged in |
| 128 | + window.onload = async function () { |
| 129 | + try { |
| 130 | + if (localStorage.getItem('loggedIn') === 'true') { |
| 131 | + const usernameEncoded = localStorage.getItem('username'); |
| 132 | + const key = generateKeyFromCode(secretCode); |
| 133 | + const username = decodeUsername(usernameEncoded, key); |
| 134 | + |
| 135 | + const textElements = document.querySelectorAll('.text'); |
| 136 | + const loggedIn = document.getElementById('loggedIn'); |
| 137 | + const tlogged = document.getElementById('hide'); |
| 138 | + const mainText = document.getElementById('mainText'); |
| 139 | + |
| 140 | + // Hide all elements with the class "text" |
| 141 | + textElements.forEach(function (element) { |
| 142 | + element.style.display = 'none'; |
| 143 | + }); |
146 | 144 |
|
147 |
| - } else { |
148 |
| - checkAuth(); |
| 145 | + const res = await fetch(`https://scratchgems.onrender.com/api/data/${username}`); |
| 146 | + if (!res.ok) { |
| 147 | + throw new Error('Failed to fetch data'); |
| 148 | + } |
| 149 | + const data = await res.json(); |
| 150 | + |
| 151 | + // Show the welcome message |
| 152 | + loggedIn.style.display = 'block'; |
| 153 | + loggedIn.textContent = `Welcome to your account, ${username}!`; |
| 154 | + tlogged.style.display = 'none'; |
| 155 | + |
| 156 | + if (data && data.pendingorders !== undefined && data.completedorders !== undefined) { |
| 157 | + mainText.innerHTML = ` |
| 158 | + <p>Pending Orders: ${data.pendingorders}</p> |
| 159 | + <br> |
| 160 | + <p>Completed Orders: ${data.completedorders}</p> |
| 161 | + <br> |
| 162 | + `; |
| 163 | + } else { |
| 164 | + mainText.innerHTML = `<p>Error loading order data.</p>`; |
| 165 | + } |
| 166 | + } else { |
| 167 | + checkAuth(); |
| 168 | + } |
| 169 | + } catch (error) { |
| 170 | + console.error(error); |
| 171 | + const mainText = document.getElementById('mainText'); |
| 172 | + mainText.innerHTML = `<p>Something went wrong! Please try again later.</p>`; |
149 | 173 | }
|
150 | 174 | };
|
151 | 175 |
|
|
199 | 223 | window.location.href = authUrl;
|
200 | 224 | }, 2000);
|
201 | 225 | }
|
| 226 | + |
| 227 | + // Logout function |
| 228 | + function logout() { |
| 229 | + localStorage.removeItem('loggedIn'); |
| 230 | + localStorage.removeItem('username'); |
| 231 | + window.location.href = 'login.html'; |
| 232 | + } |
202 | 233 | </script>
|
203 | 234 | </head>
|
204 | 235 | <body>
|
205 | 236 | <!-- Header Content -->
|
206 | 237 | <div class="text header">
|
207 | 238 | <h1>Scratch Authentication</h1>
|
208 | 239 | </div>
|
209 |
| - <div id="loggedIn" class="header" style="display: none;"></div> |
| 240 | + <div id="loggedIn" class="header" style="display: none;"> |
| 241 | + <button onclick="logout()">Logout</button> |
| 242 | + </div> |
210 | 243 |
|
211 | 244 | <!-- Main Content -->
|
212 | 245 | <div id="mainText" class="text content"></div>
|
213 |
| - <div id="hide" class="text content"> |
214 |
| - <div class="text content"> |
215 |
| - <h2>Welcome! Please log in to continue.</h2> |
216 |
| - <button onclick="registerScratchAuth()">Sign In With ScratchAuth</button> |
217 |
| - <p id="scratchMessage" class="message" aria-live="polite"></p> |
218 |
| - <p> |
219 |
| - Please note: You will be redirected to an external site (ScratchAuth) for authentication. Once there, |
220 |
| - choose the "Cloud Data" option for the quickest sign-in method. |
221 |
| - </p> |
222 |
| - </div> |
| 246 | + <div id="hide" class="text content"> |
| 247 | + <div class="text content"> |
| 248 | + <h2>Welcome! Please log in to continue.</h2> |
| 249 | + <button onclick="registerScratchAuth()">Sign In With ScratchAuth</button> |
| 250 | + <p id="scratchMessage" class="message" aria-live="polite"></p> |
| 251 | + <p> |
| 252 | + Please note: You will be redirected to an external site (ScratchAuth) for authentication. Once there, |
| 253 | + choose the "Cloud Data" option for the quickest sign-in method. |
| 254 | + </p> |
| 255 | + </div> |
223 | 256 |
|
224 |
| - <!-- APIAuth Section --> |
225 |
| - <div class="text container"> |
226 |
| - <h2>Login Using APIAuth</h2> |
227 |
| - <button onclick="registerApiAuth()">Login With APIAuth (Made by |
228 |
| - <a href="https://scratch.mit.edu/users/kRxZy_kRxZy/" target="_blank" class="kRxZy-link">kRxZy_kRxZy</a>)</button> |
229 |
| - <p id="apiMessage" class="message" aria-live="polite"></p> |
230 |
| - <p> |
231 |
| - APIAuth, made by <a href="https://scratch.mit.edu/users/kRxZy_kRxZy/" target="_blank" class="kRxZy-link">kRxZy_kRxZy</a>, is the next generation of Scratch Authentication. |
232 |
| - </p> |
233 |
| - </div> |
| 257 | + <!-- APIAuth Section --> |
| 258 | + <div class="text container"> |
| 259 | + <h2>Login Using APIAuth</h2> |
| 260 | + <button onclick="registerApiAuth()">Login With APIAuth (Made by |
| 261 | + <a href="https://scratch.mit.edu/users/kRxZy_kRxZy/" target="_blank" class="kRxZy-link">kRxZy_kRxZy</a>)</button> |
| 262 | + <p id="apiMessage" class="message" aria-live="polite"></p> |
| 263 | + <p> |
| 264 | + APIAuth, made by <a href="https://scratch.mit.edu/users/kRxZy_kRxZy/" target="_blank" class="kRxZy-link">kRxZy_kRxZy</a>, is the next generation of Scratch Authentication. |
| 265 | + </p> |
| 266 | + </div> |
234 | 267 |
|
235 |
| - <!-- Report Issue Section --> |
236 |
| - <div class="text container"> |
237 |
| - <a href="https://github.com/Scratch-Coding-Hut/Scratch-Coding-Hut.github.io/issues/new"> |
238 |
| - <button>Having trouble signing in? Report an issue</button> |
239 |
| - </a> |
| 268 | + <!-- Report Issue Section --> |
| 269 | + <div class="text container"> |
| 270 | + <a href="https://github.com/Scratch-Coding-Hut/Scratch-Coding-Hut.github.io/issues/new"> |
| 271 | + <button>Having trouble signing in? Report an issue</button> |
| 272 | + </a> |
| 273 | + </div> |
240 | 274 | </div>
|
241 |
| - </div> |
242 | 275 | </body>
|
243 | 276 | </html>
|
0 commit comments