Refactor. Recovery into its own directory

2023-08-08 19:15:51 +01:00 · 2023-08-08 19:15:51 +01:00 · 4915d83035
commit 4915d83035
parent 798783470f
1 changed files with 1 additions and 1 deletions
--- a/src/recovery/password.html
+++ b/src/recovery/password.html
@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<html lang="en-ie">
+<head>
+    <meta charset="UTF-8"/>
+    <title>Account Recovery</title>
+    <link rel="icon" type="image/png" href="../images/favicon/favicon-16x16.png"/>
+</head>
+<body>
+<form id="recovery">
+    <label for="options">Options</label>
+    <select onChange="selectField()" id="options">
+        <option value="" selected="selected">Please select an option</option>
+        <option value="user">Username</option>
+        <option value="email">Email</option>
+    </select> <br />
+    <label for="value">Value</label>
+    <input type="text" id="value" name="value" /> <br />
+    <input type="submit" value="submit" />
+</form>
+<p id="formStatus"></p>
+<footer>
+    UL Computer Society 2023-<span id="year">2023</span>
+</footer>
+<script>
+    const formEl = document.getElementById('recovery');
+    formEl.addEventListener('submit', (listener) => formHandler(listener));
+
+    function formHandler(listener){
+        listener.preventDefault();
+        const option = document.getElementById('options').value.toString();
+        if(option === ''){
+            alert("Need to implement this");
+        } else {
+            const formData = new FormData(formEl);
+            const value = formData.get('value');
+            let object;
+            if (option === 'email'){
+                object = { email: value };
+            } else {
+                object = { user: value };
+            }
+            fetch('https://api.account.skynet.ie/ldap/recover/password', {
+                method: 'POST',
+                body: JSON.stringify(object),
+                mode: "cors"
+            }).then(res => {
+                if(res.status === 200){
+                    document.getElementById('formStatus').innerHTML = "<span style='background-color: green; color: white'>Success</span>";
+                } else if (res.status === 500){
+                    document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failure</span>";
+                } else {
+                    document.getElementById('formStatus').innerHTML = "<span style='background-color: red; color: white'>Failure: Failed to communicate to server</span>";
+                }
+            }).catch(() => {
+                document.getElementById('formStatus').innerHTML = "<span style='background-color: yellow; color: black'>Please try again</span>";
+            })
+        }
+    }
+
+    function selectField(){
+        const field = document.getElementById('options').value;
+        const inputEl = document.getElementById('value');
+        if(field === "email"){
+            inputEl.type = 'email';
+        } else {
+            inputEl.type = 'text';
+        }
+    }
+</script>
+</body>
+<script>
+    document.getElementById('year').textContent = new Date().getFullYear().toString()
+</script>
+</html>