Skip to content

Commit 831108c

Browse files
authored
Update account.html
1 parent 44371b7 commit 831108c

File tree

1 file changed

+94
-61
lines changed

1 file changed

+94
-61
lines changed

account.html

Lines changed: 94 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -109,43 +109,67 @@
109109
return encoded;
110110
}
111111

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];
143120
} else {
144-
mainText.innerHTML = `<p>Error loading order data.</p>`;
121+
decoded += char;
145122
}
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+
});
146144

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>`;
149173
}
150174
};
151175

@@ -199,45 +223,54 @@
199223
window.location.href = authUrl;
200224
}, 2000);
201225
}
226+
227+
// Logout function
228+
function logout() {
229+
localStorage.removeItem('loggedIn');
230+
localStorage.removeItem('username');
231+
window.location.href = 'login.html';
232+
}
202233
</script>
203234
</head>
204235
<body>
205236
<!-- Header Content -->
206237
<div class="text header">
207238
<h1>Scratch Authentication</h1>
208239
</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>
210243

211244
<!-- Main Content -->
212245
<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>
223256

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>
234267

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>
240274
</div>
241-
</div>
242275
</body>
243276
</html>

0 commit comments

Comments
 (0)