Skynet/ldap_frontend
6
0
Fork 0
Code Issues 3 Pull requests 1 Projects Releases Packages Wiki Activity Actions

fmt: tidied up a good chunk

Browse source
This commit is contained in:
silver 2023-09-27 02:24:15 +01:00
parent d864a3bafd
commit d97ecde7fc
10 changed files with 128 additions and 98 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

66
src/index.html
View file

@ -3,34 +3,56 @@
<head> <head>
<meta charset="UTF-8"/> <meta charset="UTF-8"/>
<title>Skynet Self Service</title> <title>Skynet Self Service</title>
<link rel="icon" type="image/png" href="./images/favicon/favicon-16x16.png"/> <link href="./images/favicon/favicon-16x16.png" rel="icon" type="image/png"/>
<link rel="stylesheet" type="text/css" href="./stylesheets/index.css"/> <link href="./stylesheets/index.css" rel="stylesheet" type="text/css"/>
</head> </head>
<body> <body>
<div class="wrapper"> <div class="wrapper">
<header class="page-header"> <header class="page-header">
<img src="./images/sharky.svg" alt="Sharky, our mascot" width="145" height="81.56"/> <img alt="Sharky, our mascot" height="81.56" src="./images/sharky.svg" width="145"/>
<h1>Skynet self service</h1> <h1>Skynet Self Service</h1>
</header> </header>
<main class="page-body"> <main class="page-body">
<h2><a href="./signup.html">Sign-up</a></h2> <section>
<p>Please use this if you have yet to activate an account on Skynet before.</p> <h2>
<h2><a href="./password.html">Change Password</a></h2> <a href="./signup.html">Sign-up</a>
<p>Please use this service to change your skynet password</p> </h2>
<h2><a href="./modify.html">Account modification</a></h2> <p>
<p> Please use this if you have yet to activate an account on Skynet before.
Please use this service to modify your user data (email, login ssh key, etc.) </p>
</p> </section>
<h2><a href="./recovery/username.html">Forgot your username?</a></h2> <section>
<p> <h2>
Please use this service to get a reminder email with your skynet username <a href="./password.html">Change Password</a>
</p> </h2>
<h2> <p>
<a href="./recovery/password.html">Forgot your password?</a> Please use this service to change your Skynet password
</h2> </p>
<p> </section>
Please use this service to reset your password. <section>
</p> <h2>
<a href="./modify.html">Account modification</a>
</h2>
<p>
Please use this service to modify your user data (email, login ssh key, etc.)
</p>
</section>
<section>
<h2>
<a href="./recovery/username.html">Forgot your username?</a>
</h2>
<p>
Please use this service to get a reminder email with your Skynet username
</p>
</section>
<section>
<h2>
<a href="./recovery/password.html">Forgot your password?</a>
</h2>
<p>
Please use this service to reset your password.
</p>
</section>
</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>

22
src/modify.html
View file

@ -3,33 +3,35 @@
<head> <head>
<meta charset="UTF-8"/> <meta charset="UTF-8"/>
<title>Modify Account</title> <title>Modify Account</title>
<link rel="icon" type="image/png" href="./images/favicon/favicon-16x16.png"/> <link href="./images/favicon/favicon-16x16.png" rel="icon" type="image/png"/>
<link rel="stylesheet" type="text/css" href="./stylesheets/index.css"/> <link href="./stylesheets/index.css" rel="stylesheet" type="text/css"/>
</head> </head>
<body> <body>
<div class="wrapper"> <div class="wrapper">
<header class="page-header"> <header class="page-header">
<img src="./images/sharky.svg" alt="Picture of Sharky, the mascot of skynet" width="145" height="81.56"/> <img alt="Sharky, our mascot" height="81.56" src="./images/sharky.svg" width="145"/>
<h1>Skynet self service</h1> <h1>Skynet Self Service</h1>
</header> </header>
<main class="page-body"> <main class="page-body">
<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>
Modify details of your Skynet account.
</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 id="user" name="user" type="text"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td><label for="pass">Password</label></td> <td><label for="pass">Password</label></td>
<td><input type="password" id="pass" name="pass"/> <br/></td> <td><input id="pass" name="pass" type="password"/> <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 id="field" onchange="selectField()">
<option value="" selected="selected">Please select an option</option> <option selected="selected" value="">Please select an option</option>
<option value="mail">Email</option> <option value="mail">Email</option>
<option value="sshPublicKey">SSH key</option> <option value="sshPublicKey">SSH key</option>
<option value="cn">First name & Surname</option> <option value="cn">First name & Surname</option>
@ -40,7 +42,7 @@
</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 id="value" name="value" type="text"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td colspan="2"><input type="Submit" value="Submit"/></td> <td colspan="2"><input type="Submit" value="Submit"/></td>

20
src/password.html
View file

@ -3,35 +3,37 @@
<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 href="./images/favicon/favicon-16x16.png" rel="icon" type="image/png"/>
<link rel="stylesheet" type="text/css" href="./stylesheets/index.css"/> <link href="./stylesheets/index.css" rel="stylesheet" type="text/css"/>
</head> </head>
<body> <body>
<div class="wrapper"> <div class="wrapper">
<header class="page-header"> <header class="page-header">
<img src="./images/sharky.svg" alt="Picture of Sharky, the mascot of skynet" width="145" height="81.56"/> <img alt="Sharky, our mascot" height="81.56" src="./images/sharky.svg" width="145"/>
<h1>Skynet self service</h1> <h1>Skynet Self Service</h1>
</header> </header>
<main class="page-body"> <main class="page-body">
<h2>Password Change</h2> <h2>Password Change</h2>
<p>Please use this page to change your Skynet password.</p> <p>
Change your Skynet password.
</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 id="user" name="user" type="text"/> <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 id="pass" name="pass" type="password"/> <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 id="newPW1" name="newPW" type="password"/> <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 id="newPW2" name="newPWConfirm" type="password"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td colspan="2"><input type="Submit" value="Submit"/></td> <td colspan="2"><input type="Submit" value="Submit"/></td>

18
src/recovery/password.html
View file

@ -3,30 +3,32 @@
<head> <head>
<meta charset="UTF-8"/> <meta charset="UTF-8"/>
<title>Account Recovery</title> <title>Account Recovery</title>
<link rel="icon" type="image/png" href="../images/favicon/favicon-16x16.png"/> <link href="../images/favicon/favicon-16x16.png" rel="icon" type="image/png"/>
<link rel="stylesheet" type="text/css" href="../stylesheets/index.css"/> <link href="../stylesheets/index.css" rel="stylesheet" type="text/css"/>
</head> </head>
<body> <body>
<div class="wrapper"> <div class="wrapper">
<header class="page-header"> <header class="page-header">
<img src="../images/sharky.svg" alt="Sharky, our mascot" width="145" height="81.56"/> <img alt="Sharky, our mascot" height="81.56" src="../images/sharky.svg" width="145"/>
<h1>Skynet self service</h1> <h1>Skynet Self Service</h1>
</header> </header>
<main class="page-body"> <main class="page-body">
<h2>Forgot Password</h2> <h2>Forgot Password</h2>
<p>Please use this page to request a password reset link to your linked email.</p> <p>
Request a password reset sent to your linked email.
</p>
<form id="recovery"> <form id="recovery">
<table id="table"> <table id="table">
<tr> <tr>
<td><label for="username">Username</label></td> <td><label for="username">Username</label></td>
<td><input type="text" id="username" name="username"/> <br/></td> <td><input id="username" name="username" type="text"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td>Or<br/></td> <td>Or<br/></td>
</tr> </tr>
<tr> <tr>
<td><label for="email">Email</label></td> <td><label for="email">Email</label></td>
<td><input type="text" id="email" name="email"/> <br/></td> <td><input id="email" name="email" type="text"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td colspan="2"><input type="submit" value="submit"/></td> <td colspan="2"><input type="submit" value="submit"/></td>
@ -42,7 +44,7 @@
listener.preventDefault(); listener.preventDefault();
// reset teh form status // reset teh form status
document.getElementById('formStatus').innerHTML = ""; document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Please wait.</span>";
const formData = new FormData(formEl); const formData = new FormData(formEl);
const username = formData.get('username').trim(); const username = formData.get('username').trim();

18
src/recovery/password_reset.html
View file

@ -3,23 +3,25 @@
<head> <head>
<meta charset="UTF-8"/> <meta charset="UTF-8"/>
<title>Account Recovery</title> <title>Account Recovery</title>
<link rel="icon" type="image/png" href="../images/favicon/favicon-16x16.png"/> <link href="../images/favicon/favicon-16x16.png" rel="icon" type="image/png"/>
<link rel="stylesheet" type="text/css" href="../stylesheets/index.css"/> <link href="../stylesheets/index.css" rel="stylesheet" type="text/css"/>
</head> </head>
<body> <body>
<div class="wrapper"> <div class="wrapper">
<header class="page-header"> <header class="page-header">
<img src="../images/sharky.svg" alt="Sharky, our mascot" width="145" height="81.56"/> <img alt="Sharky, our mascot" height="81.56" src="../images/sharky.svg" width="145"/>
<h1>Skynet self service</h1> <h1>Skynet Self Service</h1>
</header> </header>
<main class="page-body"> <main class="page-body">
<h1>Password Recovery</h1> <h1>Password Recovery</h1>
<p>Please enter a new password for your skynet account below</p> <p>
Enter a new password for your Skynet account below.
</p>
<form id="reset"> <form id="reset">
<label for="pass1">Password</label> <label for="pass1">Password</label>
<input type="password" id="pass1" name="password"/> <br/> <input id="pass1" name="password" type="password"/> <br/>
<label for="pass2">Confirm</label> <label for="pass2">Confirm</label>
<input type="password" id="pass2" name="confirm"/> <br/> <input id="pass2" name="confirm" type="password"/> <br/>
<input type="submit"/> <input type="submit"/>
</form> </form>
<p id="formStatus"></p> <p id="formStatus"></p>
@ -34,7 +36,7 @@
listener.preventDefault(); listener.preventDefault();
// reset // reset
document.getElementById('formStatus').innerHTML = ""; document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Please wait.</span>";
const formData = new FormData(formEl); const formData = new FormData(formEl);
const pass = formData.get("password"); const pass = formData.get("password");

12
src/recovery/ssh-request.html
View file

@ -3,22 +3,22 @@
<head> <head>
<meta charset="UTF-8"/> <meta charset="UTF-8"/>
<title>Account Recovery</title> <title>Account Recovery</title>
<link rel="icon" type="image/png" href="../images/favicon/favicon-16x16.png"/> <link href="../images/favicon/favicon-16x16.png" rel="icon" type="image/png"/>
<link rel="stylesheet" type="text/css" href="../stylesheets/index.css"/> <link href="../stylesheets/index.css" rel="stylesheet" type="text/css"/>
</head> </head>
<body> <body>
<div class="wrapper"> <div class="wrapper">
<header class="page-header"> <header class="page-header">
<img src="../images/sharky.svg" alt="Sharky, our mascot" width="145" height="81.56"/> <img alt="Sharky, our mascot" height="81.56" src="../images/sharky.svg" width="145"/>
<h1>Skynet self service</h1> <h1>Skynet Self Service</h1>
</header> </header>
<main class="page-body"> <main class="page-body">
<h1>SSH key recovery</h1> <h1>SSH key recovery</h1>
<form id="form"> <form id="form">
<label for="user">Username</label> <label for="user">Username</label>
<input type="text" id="user" name="user"/> <br/> <input id="user" name="user" type="text"/> <br/>
<label for="mail">Email</label> <label for="mail">Email</label>
<input type="email" id="mail" name="mail"/> <br/> <input id="mail" name="mail" type="email"/> <br/>
<input type="submit"/> <input type="submit"/>
</form> </form>
<p id="formStatus"></p> <p id="formStatus"></p>

18
src/recovery/username.html
View file

@ -3,24 +3,26 @@
<head> <head>
<meta charset="UTF-8"/> <meta charset="UTF-8"/>
<title>Account Recovery</title> <title>Account Recovery</title>
<link rel="icon" type="image/png" href="../images/favicon/favicon-16x16.png"/> <link href="../images/favicon/favicon-16x16.png" rel="icon" type="image/png"/>
<link rel="stylesheet" type="text/css" href="../stylesheets/index.css"/> <link href="../stylesheets/index.css" rel="stylesheet" type="text/css"/>
</head> </head>
<body> <body>
<div class="wrapper"> <div class="wrapper">
<header class="page-header"> <header class="page-header">
<img src="../images/sharky.svg" alt="Sharky, our mascot" width="145" height="81.56"/> <img alt="Sharky, our mascot" height="81.56" src="../images/sharky.svg" width="145"/>
<h1>Skynet self service</h1> <h1>Skynet Self Service</h1>
</header> </header>
<main class="page-body"> <main class="page-body">
<div class="boxes"> <div class="boxes">
<h2>Forgot Username</h2> <h2>Forgot Username</h2>
<p>Please use this page to get a reminder email with your skynet username in it.</p> <p>
Get a reminder email of your Skynet username.
</p>
<form id="reset"> <form id="reset">
<table id="table"> <table id="table">
<tr> <tr>
<td><label for="email">Email Address</label></td> <td><label for="email">Email Address</label></td>
<td><input type="text" id="email" name="email"/> <br/></td> <td><input id="email" name="email" type="text"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td colspan="2"><input type="Submit" value="Submit"/></td> <td colspan="2"><input type="Submit" value="Submit"/></td>
@ -35,6 +37,10 @@
function formHandler(listener) { function formHandler(listener) {
listener.preventDefault(); listener.preventDefault();
// reset
document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Please wait.</span>";
const formData = new FormData(formEl); const formData = new FormData(formEl);
const email = formData.get("email"); const email = formData.get("email");
const object = {email: email}; const object = {email: email};

21
src/register.html
View file

@ -3,32 +3,35 @@
<head> <head>
<meta charset="UTF-8"/> <meta charset="UTF-8"/>
<title>Skynet Register</title> <title>Skynet Register</title>
<link rel="icon" type="image/png" href="./images/favicon/favicon-16x16.png"/> <link href="./images/favicon/favicon-16x16.png" rel="icon" type="image/png"/>
<link rel="stylesheet" type="text/css" href="./stylesheets/index.css"/> <link href="./stylesheets/index.css" rel="stylesheet" type="text/css"/>
</head> </head>
<body> <body>
<div class="wrapper"> <div class="wrapper">
<header class="page-header"> <header class="page-header">
<img src="./images/sharky.svg" alt="Picture of Sharky, the mascot of skynet" width="145" height="81.56"/> <img alt="Sharky, our mascot" height="81.56" src="./images/sharky.svg" width="145"/>
<h1>Skynet self service</h1> <h1>Skynet Self Service</h1>
</header> </header>
<main class="page-body"> <main class="page-body">
<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 <p>
below</p> Thank you for signing up for your Skynet account.
<br/>
Please complete the process by filling in the form below.
</p>
<form id="register"> <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 id="user" name="user" type="text"/> <br/></td>
</tr> </tr>
<tr> <tr>
<td><label for="pass">Password</label></td> <td><label for="pass">Password</label></td>
<td><input type="password" id="pass" name="pass" minlength="8" maxlength="254"/> <br/></td> <td><input id="pass" maxlength="254" minlength="8" name="pass" type="password"/> <br/></td>
</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 id="confirm" name="confirm" type="password"/></td>
</tr> </tr>
<tr> <tr>
<td colspan="2"><input type="Submit" value="Submit"/></td> <td colspan="2"><input type="Submit" value="Submit"/></td>

28
src/signup.html
View file

@ -3,8 +3,8 @@
<head> <head>
<meta charset="UTF-8"/> <meta charset="UTF-8"/>
<title>Skynet Sign-up</title> <title>Skynet Sign-up</title>
<link rel="icon" type="image/png" href="images/favicon/favicon-16x16.png"/> <link href="images/favicon/favicon-16x16.png" rel="icon" type="image/png"/>
<link rel="stylesheet" type="text/css" href="stylesheets/index.css"/> <link href="stylesheets/index.css" rel="stylesheet" type="text/css"/>
<style> <style>
/* Taken from the W3 schools loader tutorial */ /* Taken from the W3 schools loader tutorial */
.loader { .loader {
@ -17,16 +17,6 @@
animation: spin 20s linear; animation: spin 20s linear;
} }
/* Safari */
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
}
}
@keyframes spin { @keyframes spin {
0% { 0% {
transform: rotate(0deg); transform: rotate(0deg);
@ -40,21 +30,19 @@
<body> <body>
<div class="wrapper"> <div class="wrapper">
<header class="page-header"> <header class="page-header">
<img src="./images/sharky.svg" alt="Picture of Sharky, the mascot of skynet" width="145" height="81.56"/> <img alt="Sharky, our mascot" height="81.56" src="./images/sharky.svg" width="145"/>
<h1>Skynet self service</h1> <h1>Skynet Self Service</h1>
</header> </header>
<main class="page-body"> <main class="page-body">
<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 If you previously had an account please <a href="./modify.html">set your email</a> to be the same as UL Wolves.
activate <br/> <br/>
it please click <a href="./modify.html">here</a> to set a contact email address for your account. IF you are a If you are a new user, please fill in the form below with the email that you use on ul wolves.
new <br/>
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 id="mail" name="email" type="email"/> <br/>
<input type="submit" value="Submit"/> <input type="submit" value="Submit"/>
</form> </form>
<p id="formStatus"></p> <p id="formStatus"></p>

3
src/stylesheets/index.css
View file

@ -60,16 +60,19 @@ html, body {
box-sizing: border-box; box-sizing: border-box;
height: 100%; height: 100%;
} }
.wrapper { .wrapper {
box-sizing: border-box; box-sizing: border-box;
min-height: 100%; min-height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.page-header, .page-footer { .page-header, .page-footer {
flex-grow: 0; flex-grow: 0;
flex-shrink: 0; flex-shrink: 0;
} }
.page-body { .page-body {
flex-grow: 1; flex-grow: 1;
} }