sugary/LarpixClient
1
0
Fork 0
forked from olcxjas-softworks/LarpixClient
Code Pull requests Activity

Account creation and login now works

Browse source
This commit is contained in:
olcxja 2026-04-30 14:36:10 +02:00
commit 5e01e5d459
4 changed files with 320 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

150
login/index.html
View file

@ -181,7 +181,7 @@
<div class="input-group">
<label for="login-username">Username</label>
<input type="text" id="login-username" placeholder="vince_null" autocomplete="username">
<input type="text" id="login-username" placeholder="username" autocomplete="username">
</div>
<div class="input-group">
@ -221,6 +221,7 @@
<div class="input-group">
<label for="reg-password">Password</label>
<input type="password" id="reg-password" placeholder="Create password" autocomplete="new-password">
<p class="red mininote">Remember to use a strong password! It will be used to encrypt your keys</p>
</div>
<div class="input-group">
@ -246,12 +247,17 @@
<p>Prove you are a human.</p>
</div>
<div class="captcha-img">
<img src="https://miro.medium.com/0*obnHri9w__4Cmhbj.jpg" alt="Captcha" id="captcha-image-src">
<img src="https://miro.medium.com/0*obnHri9w__4Cmhbj.jpg" alt="Captcha" id="captcha-image">
</div>
<form id="form-captcha">
<div class="input-group">
<label for="captcha-input">Enter Code</label>
<input type="text" id="captcha-input" placeholder="Type what you see" autocomplete="off">
<label for="captcha-input">Captcha code</label>
<input type="text" id="captcha-input" placeholder="Captcha code" autocomplete="off">
</div>
<div class="input-group">
<label for="regkey-input">Invitation code</label>
<input type="text" id="regkey-input" placeholder="Invitation code" autocomplete="off">
</div>
<button type="submit" class="submit-button">
Verify
@ -274,17 +280,26 @@
const container = document.getElementById('auth-container');
const toRegister = document.getElementById('to-register');
const toLogin = document.getElementById('to-login');
const backToReg = document.getElementById('back-to-reg');
const formLogin = document.getElementById('form-login');
const formRegister = document.getElementById('form-register');
const formCaptcha = document.getElementById('form-captcha');
const registerHost = document.getElementById("reg-host");
const registerUsername = document.getElementById("reg-username");
const registerPassword = document.getElementById("reg-password");
const registerPasswordConfirm = document.getElementById("reg-password");
const loginHost = document.getElementById("login-host");
const loginUsername = document.getElementById("login-username");
const loginPassword = document.getElementById("login-password");
const captchaCode = document.getElementById("captcha-input");
const regKeyInput = document.getElementById("regkey-input");
toRegister.addEventListener('click', () => {
container.className = 'auth-container show-register';
});
@ -297,22 +312,125 @@
container.className = 'auth-container show-register';
});
formLogin.addEventListener('submit', (e) => {
formLogin.addEventListener('submit', async (e) => {
e.preventDefault();
console.log("Login");
try {
url = `${window.location.protocol}//${loginHost.value}/_larpix`;
let res = await Auth(loginUsername.value, loginPassword.value);
if (res == "Login successful")
{
showNotification(res, "success", 3500);
await delay(1000);
localStorage.setItem("username", loginUsername.value);
localStorage.setItem("password", loginPassword.value);
localStorage.setItem("host", loginHost.value);
window.location.href = "../";
}
else
{
showNotification(res, "error", 3500);
}
} catch (error) {
console.log(error);
showNotification("Something went wrong...", "error", 3500);
container.className = 'auth-container';
}
});
formRegister.addEventListener('submit', (e) => {
formRegister.addEventListener('submit', async (e) => {
e.preventDefault();
container.className = 'auth-container show-captcha';
try {
url = `${window.location.protocol}//${registerHost.value}/_larpix`;
if (!registerUsername.value || registerUsername.value.trim() === '') {
showNotification("Username cannot be empty", "error");
container.className = 'auth-container show-register';
return;
}
if (!registerPassword.value || registerPassword.value.trim() === '') {
showNotification("Password cannot be empty", "error");
container.className = 'auth-container show-register';
return;
}
let dataarray = keyDataFromServerJson(await fetchAsync(`${url}/createaccount?step=init`));
var sharedkey = await calcCommunicationKeyClient(dataarray[0], dataarray[1], dataarray[2]);
sharedpvkey = sharedkey[1];
createId = dataarray[3];
const captchaimage = await fetch(`${url}/createaccount?step=register`, {
method: 'POST',
body: JSON.stringify({
pubClient: sharedkey[0],
idKey: createId,
username: await encrypt(registerUsername.value, sharedpvkey),
password: await encrypt(await hashSHA3_512(registerPassword.value), sharedpvkey)
})
});
const clone = captchaimage.clone();
const res = await captchaimage.text();
try {
const imageBlob = await clone.blob();
if (!imageBlob.type.startsWith("image/")) {
throw new Error();
}
const imageObjectURL = URL.createObjectURL(imageBlob);
document.getElementById('captcha-image').src = imageObjectURL;
container.className = 'auth-container show-captcha';
} catch (error) {
console.log(error);
if (res.length > 64 || res.length <= 1) {
throw new Error();
}
showNotification(res, "error", 3500);
container.className = 'auth-container show-register';
}
} catch (error) {
console.log(error);
showNotification("Something went wrong...", "error", 3500);
container.className = 'auth-container show-register';
}
});
formCaptcha.addEventListener('submit', (e) => {
formCaptcha.addEventListener('submit', async (e) => {
e.preventDefault();
const captchaValue = document.getElementById('captcha-input').value;
if(captchaValue) {
alert("Verify " + captchaValue);
try {
const captchaValue = document.getElementById('captcha-input').value;
if (captchaValue) {
let res = await fetchPost(`${url}/createaccount?step=finish`, JSON.stringify({
idKey: createId,
captcha: captchaValue,
regKey: regKeyInput.value
}));
if (res.length > 64 || res.length <= 1) {
throw new Error();
}
if (res.toLowerCase().includes("incorrect")) {
showNotification(res, "error", 3500);
container.className = 'auth-container show-register';
} else if (res.toLowerCase().includes("created")) {
showNotification(res, "success", 3500);
await delay(1000);
localStorage.setItem("username", registerUsername.value);
localStorage.setItem("password", registerPassword.value);
localStorage.setItem("host", registerHost.value);
window.location.href = "../";
} else {
showNotification(res, "info", 3500);
container.className = 'auth-container show-register';
}
}
} catch (error) {
showNotification("Something went wrong...", "error", 3500);
container.className = 'auth-container show-register';
}
});
</script>