Add server status check

This commit is contained in:
olcxja 2026-04-30 21:05:30 +02:00
commit e908702025
3 changed files with 105 additions and 21 deletions

View file

@ -176,7 +176,8 @@
<form id="form-login">
<div class="input-group">
<label for="login-host">Server Host</label>
<input type="text" id="login-host" placeholder="example.com" autocomplete="url">
<input type="text" id="login-host" placeholder="example.com" autocomplete="url" onchange="loginHostChanged()">
<p class="mininote serverstatus">Connecting...</p>
</div>
<div class="input-group">
@ -210,7 +211,8 @@
<form id="form-register">
<div class="input-group">
<label for="reg-host">Server Host</label>
<input type="text" id="reg-host" placeholder="example.com" autocomplete="url">
<input type="text" id="reg-host" placeholder="example.com" autocomplete="url" onchange="regHostChanged()">
<p class="mininote serverstatus">Connecting...</p>
</div>
<div class="input-group">
@ -229,7 +231,7 @@
<input type="password" id="reg-confirm" placeholder="Repeat password" autocomplete="new-password">
</div>
<button type="submit" class="submit-button">
<button type="submit" class="submit-button" id="register-button">
Sign Up
</button>
</form>
@ -255,7 +257,7 @@
<input type="text" id="captcha-input" placeholder="Captcha code" autocomplete="off">
</div>
<div class="input-group">
<div class="input-group" id="regkey-group">
<label for="regkey-input">Invitation code</label>
<input type="text" id="regkey-input" placeholder="Invitation code" autocomplete="off">
</div>
@ -299,6 +301,9 @@
const loginPassword = document.getElementById("login-password");
const captchaCode = document.getElementById("captcha-input");
const regKeyInput = document.getElementById("regkey-input");
const registerButton = document.getElementById("register-button");
const regKeyGroup = document.getElementById("regkey-group");
toRegister.addEventListener('click', () => {
container.className = 'auth-container show-register';
@ -345,6 +350,9 @@
formRegister.addEventListener('submit', async (e) => {
e.preventDefault();
try {
captchaCode.value = "";
regKeyInput.value = "";
url = `${window.location.protocol}//${registerHost.value}/_larpix`;
if (!registerUsername.value || registerUsername.value.trim() === '') {
@ -357,6 +365,11 @@
container.className = 'auth-container show-register';
return;
}
if (registerPassword.value != registerPasswordConfirm.value) {
showNotification("Passwords do not match", "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];
@ -401,7 +414,7 @@
try {
const captchaValue = document.getElementById('captcha-input').value;
const captchaValue = captchaCode.value;
if (captchaValue) {
let res = await fetchPost(`${url}/createaccount?step=finish`, JSON.stringify({
idKey: createId,
@ -433,6 +446,53 @@
container.className = 'auth-container show-register';
}
});
async function regHostChanged()
{
loginHost.value = registerHost.value;
await updateLoginForm(registerHost.value);
}
async function loginHostChanged()
{
registerHost.value = loginHost.value;
await updateLoginForm(loginHost.value);
}
async function updateLoginForm(host)
{
try {
let serverInfo = await getServerInfo(host);
if (serverInfo["registration"] == "disabled")
{
registerButton.innerHTML = "Registration disabled";
}
else if (serverInfo["registration"] == "enabled")
{
registerButton.innerHTML = "Sign up";
regKeyGroup.style.display = "";
}
else if (serverInfo["registration"] == "code")
{
regKeyGroup.style.display = "none";
}
setServerStatus("Server pinged", "green");
}
catch(error)
{
console.log(error);
setServerStatus("Can't ping this server", "red");
}
}
function setServerStatus(status, color)
{
let elements = document.getElementsByClassName("serverstatus");
for (let i = 0;i < elements.length;i++) {
elements[i].className = `mininote serverstatus ${status} ${color}`;
elements[i].innerHTML = status;
}
}
loginHostChanged();
</script>
</body>
</html>