Code standardisation

Signed-off-by: Eoghan Conlon <eoghanconlon73@skynet.ie>
This commit is contained in:
eoghanconlon73 2023-09-18 12:18:33 +01:00
parent 2e72c1deaf
commit c9e91ba1be
6 changed files with 120 additions and 111 deletions

View file

@ -8,18 +8,19 @@
</head> </head>
<body> <body>
<div id="title"> <div id="title">
<a href="./"><img src="images/sharky_vector_svg.svg" alt="Picture of Sharky, the mascot of skynet" width="145" height="81.56"/> </a> <a href="./"><img src="images/sharky_vector_svg.svg" alt="Picture of Sharky, the mascot of skynet" width="145"
height="81.56"/> </a>
<h1>Skynet Password Reset & Sign-up service</h1> <h1>Skynet Password Reset & Sign-up service</h1>
</div> </div>
<div class="boxes"> <div class="boxes">
<h2><a href="./signup.html">Sign-up Page</a></h2> <h2><a href="./signup.html">Sign-up Page</a></h2>
<p>Please use this if you have yet to activate an account on Skynet before.</p> <p>Please use this if you have yet to activate an account on Skynet before.</p>
<h2><a href="password.html">Password Reset</a></h2> <h2><a href="password.html">Password Reset</a></h2>
<p>Please use this service if you ever forget your skynet password</p> <p>Please use this service if you ever forget your skynet password</p>
<h2><a href="modify.html">User modification</a></h2> <h2><a href="modify.html">User modification</a></h2>
<p> <p>
Please use this service to modify your user data (email, login ssh key, etc.) Please use this service to modify your user data (email, login ssh key, etc.)
</p> </p>
</div> </div>
<!--testing2--> <!--testing2-->

View file

@ -8,13 +8,14 @@
</head> </head>
<body> <body>
<div id="title"> <div id="title">
<a href="./"><img src="images/sharky_vector_svg.svg" alt="Picture of Sharky, the mascot of skynet" width="145" height="81.56"/> </a> <a href="./"><img src="images/sharky_vector_svg.svg" alt="Picture of Sharky, the mascot of skynet" width="145"
height="81.56"/> </a>
<h1>Skynet Password Reset & Sign-up service</h1> <h1>Skynet Password Reset & Sign-up service</h1>
</div> </div>
<div class="boxes"> <div class="boxes">
<h2>User modification page</h2> <h2>User modification page</h2>
<p>Use this page to modify your account. Please remember to select a field before submitting the form</p> <p>Use this page to modify your account. Please remember to select a field before submitting the form</p>
<form id="reset"> <form id="reset">
<table id="table"> <table id="table">
<tr> <tr>
<td><label for="user">Username</label></td> <td><label for="user">Username</label></td>
@ -25,7 +26,7 @@
<td><input type="password" id="pass" name="pass"/> <br/></td> <td><input type="password" id="pass" name="pass"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td><label for="field">Field</label> </td> <td><label for="field">Field</label></td>
<td> <td>
<select onchange="selectField()" id="field"> <select onchange="selectField()" id="field">
<option value="" selected="selected">Please select an option</option> <option value="" selected="selected">Please select an option</option>
@ -39,14 +40,14 @@
</tr> </tr>
<tr> <tr>
<td><label for="value">Value</label></td> <td><label for="value">Value</label></td>
<td><input type="text" id="value" name="value"/> <br/> </td> <td><input type="text" id="value" name="value"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td colspan="2"><input type="Submit" value="Submit"/></td> <td colspan="2"><input type="Submit" value="Submit"/></td>
</tr> </tr>
</table> </table>
</form> </form>
<p id="formStatus"></p> <p id="formStatus"></p>
</div> </div>
<footer> <footer>
UL Computer Society 2023-<span id="year">2023</span> UL Computer Society 2023-<span id="year">2023</span>
@ -71,7 +72,7 @@
}).then(res => { }).then(res => {
if (res.status === 200) { if (res.status === 200) {
let temp = res.json(); let temp = res.json();
if(temp.result === 'error'){ if (temp.result === 'error') {
document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>${temp.error}</span>`; document.getElementById('formStatus').innerHTML = `<span style='background-color: red; color: white'>${temp.error}</span>`;
} else { } else {
document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success</span>"; document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success</span>";
@ -87,10 +88,10 @@
} }
} }
function selectField(){ function selectField() {
const field = document.getElementById('field').value; const field = document.getElementById('field').value;
const value = document.getElementById('value'); const value = document.getElementById('value');
if(field === 'mail'){ if (field === 'mail') {
value.type = 'email'; value.type = 'email';
} else { } else {
value.type = 'text'; value.type = 'text';

View file

@ -1,43 +1,44 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en-ie"> <html lang="en-ie">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8"/>
<title>Password reset</title> <title>Password reset</title>
<link rel="icon" type="image/png" href="images/favicon/favicon-16x16.png" /> <link rel="icon" type="image/png" href="images/favicon/favicon-16x16.png"/>
<link rel="stylesheet" type="text/css" href="stylesheets/index.css"/> <link rel="stylesheet" type="text/css" href="stylesheets/index.css"/>
</head> </head>
<body> <body>
<div id="title"> <div id="title">
<a href="./"><img src="images/sharky_vector_svg.svg" alt="Picture of Sharky, the mascot of skynet" width="145" height="81.56"/> </a> <a href="./"><img src="images/sharky_vector_svg.svg" alt="Picture of Sharky, the mascot of skynet" width="145"
height="81.56"/> </a>
<h1>Skynet Password Reset & Sign-up service</h1> <h1>Skynet Password Reset & Sign-up service</h1>
</div> </div>
<div class="boxes"> <div class="boxes">
<h2>Password Reset</h2> <h2>Password Reset</h2>
<p>Please use this page to reset you password should you need to change it.</p> <p>Please use this page to reset you password should you need to change it.</p>
<form id="reset"> <form id="reset">
<table id="table"> <table id="table">
<tr> <tr>
<td><label for="user">Username</label></td> <td><label for="user">Username</label></td>
<td><input type="text" id="user" name="user" /> <br /></td> <td><input type="text" id="user" name="user"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td><label for="pass">Old Password</label></td> <td><label for="pass">Old Password</label></td>
<td><input type="password" id="pass" name="pass" /> <br /></td> <td><input type="password" id="pass" name="pass"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td><label for="newPW1">New Password</label></td> <td><label for="newPW1">New Password</label></td>
<td><input type="password" id="newPW1" name="newPW" /> <br /></td> <td><input type="password" id="newPW1" name="newPW"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td><label for="newPW2">Confirm</label></td> <td><label for="newPW2">Confirm</label></td>
<td><input type="password" id="newPW2" name="newPWConfirm" /> <br /> </td> <td><input type="password" id="newPW2" name="newPWConfirm"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td colspan="2"><input type="Submit" value="Submit" /></td> <td colspan="2"><input type="Submit" value="Submit"/></td>
</tr> </tr>
</table> </table>
</form> </form>
<p id="formStatus"></p> <p id="formStatus"></p>
</div> </div>
<footer> <footer>
UL Computer Society 2023-<span id="year">2023</span> UL Computer Society 2023-<span id="year">2023</span>
@ -46,22 +47,22 @@
const formEl = document.getElementById("reset"); const formEl = document.getElementById("reset");
formEl.addEventListener('submit', (listener) => formHandler(listener)); formEl.addEventListener('submit', (listener) => formHandler(listener));
function formHandler(listener){ function formHandler(listener) {
listener.preventDefault(); listener.preventDefault();
const formData = new FormData(formEl); const formData = new FormData(formEl);
const user = formData.get("user"); const user = formData.get("user");
const pass = formData.get("pass"); const pass = formData.get("pass");
const newPW = formData.get("newPW"); const newPW = formData.get("newPW");
if(newPW === formData.get("newPWConfirm")){ if (newPW === formData.get("newPWConfirm")) {
const object = {user: user, pass: pass, field: "userPassword", value: newPW} const object = {user: user, pass: pass, field: "userPassword", value: newPW}
fetch('https://api.account.skynet.ie/ldap/update', { fetch('https://api.account.skynet.ie/ldap/update', {
method: 'POST', method: 'POST',
body: JSON.stringify(object), body: JSON.stringify(object),
mode: "cors" mode: "cors"
}).then(res => { }).then(res => {
if(res.status === 200) { if (res.status === 200) {
document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success</span>"; document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success</span>";
} else if (res.status === 500){ } else if (res.status === 500) {
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failure</span>"; document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failure</span>";
} else { } else {
document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failure: Failed to communicate to server</span>"; document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failure: Failed to communicate to server</span>";

View file

@ -8,17 +8,19 @@
</head> </head>
<body> <body>
<div id="title"> <div id="title">
<a href="./"><img src="images/sharky_vector_svg.svg" alt="Picture of Sharky, the mascot of skynet" width="145" height="81.56"/> </a> <a href="./"><img src="images/sharky_vector_svg.svg" alt="Picture of Sharky, the mascot of skynet" width="145"
height="81.56"/> </a>
<h1>Skynet Password Reset & Sign-up service</h1> <h1>Skynet Password Reset & Sign-up service</h1>
</div> </div>
<div class="boxes"> <div class="boxes">
<h2>Register</h2> <h2>Register</h2>
<p>Thank you for signing up for your free skynet account. Please complete the process by filling in the form below</p> <p>Thank you for signing up for your free skynet account. Please complete the process by filling in the form
<form id="register"> below</p>
<form id="register">
<table id="table"> <table id="table">
<tr> <tr>
<td><label for="user">Username</label></td> <td><label for="user">Username</label></td>
<td><input type="text" id="user" name="user"/> <br/> </td> <td><input type="text" id="user" name="user"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td><label for="pass">Password</label></td> <td><label for="pass">Password</label></td>
@ -26,13 +28,13 @@
</tr> </tr>
<tr> <tr>
<td><label for="confirm">Confirm</label></td> <td><label for="confirm">Confirm</label></td>
<td><input type="password" id="confirm" name="confirm"/> </td> <td><input type="password" id="confirm" name="confirm"/></td>
</tr> </tr>
<tr> <tr>
<td colspan="2"> <input type="Submit" value="Submit"/> </td> <td colspan="2"><input type="Submit" value="Submit"/></td>
</tr> </tr>
</table> </table>
</form> </form>
</div> </div>
<p id="formStatus"></p> <p id="formStatus"></p>
<footer> <footer>

View file

@ -39,22 +39,25 @@
</head> </head>
<body> <body>
<div id="title"> <div id="title">
<a href="./"><img src="images/sharky_vector_svg.svg" alt="Picture of Sharky, the mascot of skynet" width="145" height="81.56"/> </a> <a href="./"><img src="images/sharky_vector_svg.svg" alt="Picture of Sharky, the mascot of skynet" width="145"
height="81.56"/> </a>
<h1>Skynet Password Reset & Sign-up service</h1> <h1>Skynet Password Reset & Sign-up service</h1>
</div> </div>
<div class="boxes"> <div class="boxes">
<h2>Welcome to Skynet</h2> <h2>Welcome to Skynet</h2>
<p> <p>
Skynet is a server cluster that the UL Computer Society runs. If you previously had an account and need to activate <br /> Skynet is a server cluster that the UL Computer Society runs. If you previously had an account and need to
it please click <a href="./modify.html">here</a> to set a contact email address for your account. IF you are a new <br /> activate <br/>
it please click <a href="./modify.html">here</a> to set a contact email address for your account. IF you are a
new <br/>
user, please fill in the form below with the email that you use on ul wolves. user, please fill in the form below with the email that you use on ul wolves.
</p> </p>
<form id="register"> <form id="register">
<label for="mail">Email address</label> <label for="mail">Email address</label>
<input type="email" id="mail" name="email"/> <br/> <input type="email" id="mail" name="email"/> <br/>
<input type="submit" value="Submit"/> <input type="submit" value="Submit"/>
</form> </form>
<p id="formStatus"></p> <p id="formStatus"></p>
</div> </div>
<footer> <footer>
UL Computer Society 2023-<span id="year">2023</span> UL Computer Society 2023-<span id="year">2023</span>

View file

@ -1,8 +1,9 @@
/* General styling */ /* General styling */
body{ body {
background-image: url(../images/backgroundsharkycoin.png); background-image: url(../images/backgroundsharkycoin.png);
text-align: center; text-align: center;
} }
/* Title bar */ /* Title bar */
#title { #title {
display: inline-flex; display: inline-flex;
@ -22,6 +23,6 @@ body{
margin-bottom: 3%; margin-bottom: 3%;
} }
#table{ #table {
display: inline; display: inline;
} }