Skip to content

Commit c9a7a0c

Browse files
mcgdjmcgdj
authored
Update account.html
Fixed some serious security issues concerning hackers and Scratch passwords. Uses API to check for valid Scratch username and generates a key to the server. Next, I'll work on if you forgot your password.
1 parent 5492fe2 commit c9a7a0c

File tree

1 file changed

+51
-215
lines changed

1 file changed

+51
-215
lines changed

‎account.html

Lines changed: 51 additions & 215 deletions
Original file line numberDiff line numberDiff line change
@@ -1,223 +1,59 @@
11
<!DOCTYPE html>
22
<html>
3-
<head>
4-
<style>
5-
body {
6-
overflow-x: hidden;
7-
font-family: Sans-Serif;
8-
margin: 0;
9-
}
10-
11-
.menu-container {
12-
position: relative;
13-
display: flex;
14-
align-items: center;
15-
margin-bottom: 20px;
16-
background: #c04d4d;
17-
color: #ffffff;
18-
padding: 20px;
19-
z-index: 1;
20-
-webkit-user-select: none;
21-
user-select: none;
22-
box-sizing: border-box;
23-
}
24-
25-
.menu-logo {
26-
line-height: 0;
27-
margin: 0 20px;
28-
}
29-
30-
.menu-logo img {
31-
max-height: 40px;
32-
max-width: 100px;
33-
flex-shrink: 0;
34-
}
35-
36-
.menu-container a {
37-
text-decoration: none;
38-
color: #ffffff;
39-
transition: color 0.3s ease;
40-
}
41-
42-
.menu-container a:hover {
43-
color: #50e3c2;
44-
}
45-
46-
.menu-container input {
47-
display: block;
48-
width: 35px;
49-
height: 25px;
50-
position: absolute;
51-
cursor: pointer;
52-
opacity: 0;
53-
z-index: 2;
54-
}
55-
56-
.menu-container span {
57-
display: block;
58-
width: 33px;
59-
height: 4px;
60-
margin-bottom: 5px;
61-
background: #ffffff;
62-
border-radius: 3px;
63-
transition: all 0.5s;
64-
}
65-
66-
.menu {
67-
display: none;
68-
position: absolute;
69-
right: 0;
70-
top: 60px;
71-
background: #ffffff;
72-
padding: 20px;
73-
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
74-
}
75-
76-
.menu ul {
77-
list-style: none;
78-
padding: 0;
79-
}
80-
81-
.menu li {
82-
padding: 10px 0;
83-
}
84-
85-
.auth-container {
86-
display: none;
87-
padding: 20px;
88-
background: #f4f4f4;
89-
text-align: center;
90-
}
91-
92-
.account-container {
93-
display: none;
94-
padding: 20px;
95-
background: #e6f7ff;
96-
text-align: center;
97-
}
98-
99-
button {
100-
background-color: #c04d4d;
101-
color: white;
102-
border: none;
103-
padding: 10px 15px;
104-
font-size: 16px;
105-
cursor: pointer;
106-
border-radius: 5px;
107-
transition: background 0.3s;
108-
}
109-
110-
button:hover {
111-
background-color: #a03d3d;
112-
}
113-
114-
input {
115-
padding: 8px;
116-
font-size: 16px;
117-
width: 80%;
118-
max-width: 300px;
119-
}
120-
121-
@media (max-width: 767px) {
122-
.menu {
123-
width: 100%;
124-
right: 0;
125-
text-align: center;
126-
}
127-
}
128-
</style>
129-
<title>My Account | Coding Hut</title>
130-
</head>
131-
<body>
132-
<nav class="menu-container">
133-
<input type="checkbox" id="menu-toggle" />
134-
<span></span>
135-
<span></span>
136-
<span></span>
137-
<a href="https://scratch-coding-hut.github.io" class="menu-logo">
138-
<img src="https://i.postimg.cc/6qgPbyGH/temp-Image-BJ164c.avif" alt="Coding Hut" />
139-
</a>
140-
<div class="menu" id="menu">
141-
<ul>
142-
<li><a href="https://scratch-coding-hut.github.io">Home</a></li>
143-
<li><a href="https://scratch-coding-hut.github.io/about">About</a></li>
144-
<li><a href="https://scratch.mit.edu/discuss/topic/652178/">Scratch Forum</a></li>
145-
<li><a href="https://scratch-coding-hut.github.io/sitemaplinks">More...</a></li>
146-
<li><a href="#" id="account-link">My Account</a></li>
147-
</ul>
148-
</div>
149-
</nav>
150-
151-
<h1><center><b>My Account</b></center></h1>
152-
<h2 id="welcomeText">Sign in with Scratch and unlock special services on the Coding Hut website.</h2>
153-
<button id="toggleAuth">Sign Up / Sign In</button>
154-
155-
<div class="auth-container" id="authContainer">
156-
<h2>Sign Up / Sign In</h2>
157-
<label>Username:</label><br>
158-
<input type="text" id="username" placeholder="Enter username"/><br /><br />
159-
<label>Password:</label><br>
160-
<input type="password" id="password" placeholder="Enter password"/><br /><br />
161-
<button id="submitAuth">Submit</button>
162-
</div>
163-
164-
<div class="account-container" id="accountContainer">
165-
<h2>Welcome, <span id="displayUsername"></span>!</h2>
166-
<p>Thank you for signing in. You now have access to exclusive content and features.</p>
167-
<button id="logout">Logout</button>
168-
</div>
169-
3+
<head>
4+
<title>Login | Scratch Auth</title>
1705
<script>
171-
// Toggle the mobile menu
172-
document.getElementById("menu-toggle").addEventListener("click", function() {
173-
const menu = document.getElementById("menu");
174-
menu.style.display = menu.style.display === "block" ? "none" : "block";
175-
});
176-
177-
// Toggle the authentication form
178-
document.getElementById("toggleAuth").addEventListener("click", function() {
179-
const authContainer = document.getElementById("authContainer");
180-
authContainer.style.display = authContainer.style.display === "block" ? "none" : "block";
181-
});
182-
183-
// Handle form submission
184-
document.getElementById("submitAuth").addEventListener("click", function() {
185-
const username = document.getElementById("username").value.trim();
186-
const password = document.getElementById("password").value.trim();
187-
188-
if (username === "" || password === "") {
189-
alert("Please enter both username and password.");
190-
return;
6+
async function registerUser() {
7+
const username = document.getElementById("username").value.trim();
8+
if (!username) {
9+
alert("Please enter a Scratch username.");
10+
return;
11+
}
12+
13+
const response = await fetch("server.php", {
14+
method: "POST",
15+
headers: { "Content-Type": "application/x-www-form-urlencoded" },
16+
body: `username=${encodeURIComponent(username)}`
17+
});
18+
19+
const data = await response.json();
20+
if (data.error) {
21+
alert(data.error);
22+
} else {
23+
localStorage.setItem("privateKey", data.privateKey);
24+
alert("Your private key has been generated and saved locally. Keep it safe!");
25+
}
19126
}
19227

193-
// Store username in session storage
194-
sessionStorage.setItem("username", username);
195-
196-
// Show account container and hide auth form
197-
document.getElementById("authContainer").style.display = "none";
198-
document.getElementById("toggleAuth").style.display = "none";
199-
document.getElementById("accountContainer").style.display = "block";
200-
document.getElementById("displayUsername").innerText = username;
201-
document.getElementById("welcomeText").innerText = `Welcome, ${username}!`;
202-
});
203-
204-
// Check if the user is already signed in
205-
window.onload = function() {
206-
const savedUsername = sessionStorage.getItem("username");
207-
if (savedUsername) {
208-
document.getElementById("authContainer").style.display = "none";
209-
document.getElementById("toggleAuth").style.display = "none";
210-
document.getElementById("accountContainer").style.display = "block";
211-
document.getElementById("displayUsername").innerText = savedUsername;
212-
document.getElementById("welcomeText").innerText = `Welcome, ${savedUsername}!`;
28+
async function authenticateUser() {
29+
const privateKey = localStorage.getItem("privateKey");
30+
if (!privateKey) {
31+
alert("No private key found. Please register first.");
32+
return;
33+
}
34+
35+
const response = await fetch("server.php", {
36+
method: "POST",
37+
headers: { "Content-Type": "application/x-www-form-urlencoded" },
38+
body: `challengeResponse=${btoa(privateKey)}`
39+
});
40+
41+
const data = await response.json();
42+
if (data.success) {
43+
alert("Authentication successful!");
44+
window.location.href = "dashboard.html"; // Redirect if needed
45+
} else {
46+
alert(data.error);
47+
}
21348
}
214-
};
215-
216-
// Logout function
217-
document.getElementById("logout").addEventListener("click", function() {
218-
sessionStorage.removeItem("username");
219-
location.reload();
220-
});
22149
</script>
222-
</body>
50+
</head>
51+
<body>
52+
<h1>Scratch Authentication</h1>
53+
<label>Scratch Username:</label>
54+
<input type="text" id="username" placeholder="Enter your Scratch username" />
55+
<button onclick="registerUser()">Register</button>
56+
<br /><br />
57+
<button onclick="authenticateUser()">Login with Key</button>
58+
</body>
22359
</html>

0 commit comments

Comments
 (0)