feat: Moved the JS out of the password recovery_reset page into its own file
Related to #9
This commit is contained in:
parent
eec783bd77
commit
ae433303b8
2 changed files with 58 additions and 50 deletions
|
@ -17,7 +17,7 @@
|
||||||
<p>
|
<p>
|
||||||
Enter a new password for your Skynet account below.
|
Enter a new password for your Skynet account below.
|
||||||
</p>
|
</p>
|
||||||
<form id="reset">
|
<form id="form">
|
||||||
<table id="table">
|
<table id="table">
|
||||||
<tr>
|
<tr>
|
||||||
<td><label for="pass1">New Password</label> </td>
|
<td><label for="pass1">New Password</label> </td>
|
||||||
|
@ -28,59 +28,12 @@
|
||||||
<td><input id="pass2" name="confirm" type="password"/> <br/> </td>
|
<td><input id="pass2" name="confirm" type="password"/> <br/> </td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td colspan="2"><input type="submit"/> </td>
|
<td colspan="2"><input id="button" type="submit"/> </td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
</form>
|
</form>
|
||||||
<p id="formStatus"></p>
|
<p id="formStatus"></p>
|
||||||
<script>
|
<script src="password_reset.js"></script>
|
||||||
const formEl = document.getElementById("reset");
|
|
||||||
formEl.addEventListener('submit', (listener) => formHandler(listener));
|
|
||||||
const url = new URL(window.location.href);
|
|
||||||
const urlParam = new URLSearchParams(url.search);
|
|
||||||
const auth = urlParam.get("auth");
|
|
||||||
|
|
||||||
async function formHandler(listener) {
|
|
||||||
listener.preventDefault();
|
|
||||||
|
|
||||||
// reset
|
|
||||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Please wait.</span>";
|
|
||||||
|
|
||||||
const formData = new FormData(formEl);
|
|
||||||
const pass = formData.get("password");
|
|
||||||
const confirm = formData.get("confirm");
|
|
||||||
|
|
||||||
if (pass !== confirm) {
|
|
||||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failure: Passwords don't match</span>";
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
let url = "https://api.account.skynet.ie/ldap/recover/password/auth";
|
|
||||||
let req;
|
|
||||||
try {
|
|
||||||
req = await fetch(url, {
|
|
||||||
method: 'POST',
|
|
||||||
body: JSON.stringify({auth: auth, pass: pass}),
|
|
||||||
mode: "cors"
|
|
||||||
});
|
|
||||||
} catch (e) {
|
|
||||||
document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>${e}</span>`;
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (req.status !== 200) {
|
|
||||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failure</span>";
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
let data = await req.json();
|
|
||||||
if (data.result === 'error') {
|
|
||||||
document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>${data.error}</span>`;
|
|
||||||
} else {
|
|
||||||
document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success</span>";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
</main>
|
</main>
|
||||||
<footer class="page-footer">
|
<footer class="page-footer">
|
||||||
UL Computer Society 2023-<span id="year">2023</span>
|
UL Computer Society 2023-<span id="year">2023</span>
|
||||||
|
|
55
src/recovery/password_reset.js
Normal file
55
src/recovery/password_reset.js
Normal file
|
@ -0,0 +1,55 @@
|
||||||
|
const form = document.getElementById("form");
|
||||||
|
form.addEventListener('submit', formHandler);
|
||||||
|
|
||||||
|
const form_status = document.getElementById("formStatus");
|
||||||
|
|
||||||
|
const button = document.getElementById("button");
|
||||||
|
button.addEventListener('submit', formHandler);
|
||||||
|
|
||||||
|
async function formHandler(listener) {
|
||||||
|
listener.preventDefault();
|
||||||
|
|
||||||
|
// reset
|
||||||
|
form_status.innerHTML = "<span style='background-color: green; color: white'>Please wait.</span>";
|
||||||
|
|
||||||
|
const formData = new FormData(form);
|
||||||
|
const pass = formData.get("password");
|
||||||
|
const confirm = formData.get("confirm");
|
||||||
|
|
||||||
|
if (pass !== confirm) {
|
||||||
|
form_status.innerHTML = "<span style='background-color: red; color: white'>Failure: Passwords don't match</span>";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const urlParam = new URLSearchParams(new URL(window.location.href).search);
|
||||||
|
const auth = urlParam.get("auth");
|
||||||
|
|
||||||
|
if(!auth){
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
let url = "https://api.account.skynet.ie/ldap/recover/password/auth";
|
||||||
|
let req;
|
||||||
|
try {
|
||||||
|
req = await fetch(url, {
|
||||||
|
method: 'POST',
|
||||||
|
body: JSON.stringify({auth: auth, pass: pass}),
|
||||||
|
mode: "cors"
|
||||||
|
});
|
||||||
|
} catch (e) {
|
||||||
|
form_status.innerHTML = `<span style='background-color: red; color: white'>${e}</span>`;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (req.status !== 200) {
|
||||||
|
form_status.innerHTML = "<span style='background-color: red; color: white'>Failure</span>";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
let data = await req.json();
|
||||||
|
if (data.result === 'error') {
|
||||||
|
form_status.innerHTML = `<span style='background-color: red; color: white'>${data.error}</span>`;
|
||||||
|
} else {
|
||||||
|
form_status.innerHTML = "<span style='background-color: green; color: white'>Success</span>";
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in a new issue