Added in base code for reset email

Signed-off-by: rodude123 <rodude123@gmail.com>

src/editor/js/index.js

@@ -1,5 +1,5 @@
 
-document.addEventListener("DOMContentLoaded", e => 
+document.addEventListener("DOMContentLoaded", _ => 
 {
     // check if the user is logged in and if so load the editor
     fetch("/api/user/isLoggedIn").then(res => 
@@ -11,10 +11,20 @@ document.addEventListener("DOMContentLoaded", e =>
     });
 });
 
-function showErrorMessage(message) 
+function showErrorMessage(message, form) 
 {
-    document.querySelector("#loginError").classList.remove("hidden");
-    document.querySelector("#loginError div").innerText = message;
+    document.querySelector(`#${form}Error`).classList.remove("hidden");
+    document.querySelector(`#${form}Error div`).innerText = message;
+}
+
+function switchView(from, to)
+{
+    document.querySelector(from).classList.toggle("shown");
+    setTimeout(() => document.querySelector(from).style.transform = "translateX(150vw)", 500);
+    setTimeout(() => document.querySelector(from).style.display = "none", 500);
+    setTimeout(() => document.querySelector(to).style.removeProperty("display"), 200);
+    setTimeout(() => document.querySelector(to).classList.toggle("shown"), 300);
+    setTimeout(() => document.querySelector(to).style.removeProperty("transform"), 400);
 }
 
 document.querySelector("#login form").addEventListener("submit", e => 
@@ -38,17 +48,71 @@ document.querySelector("#login form").addEventListener("submit", e =>
             }
             if (res.status === 400)
             {
-                showErrorMessage("Please type in a username and password.");
+                showErrorMessage("Please type in a username and password.", "login");
                 return;
             }
-            document.querySelector("#loginError").classList.remove("hidden");
-            document.querySelector("#loginError div").innerHTML = "Invalid username or password";
+            showErrorMessage("Invalid username or password.", "login");
         });
        return; 
     }
-    document.querySelector("#loginError").classList.remove("hidden");
-    document.querySelector("#loginError div").innerHTML = "Please type in a username and password";
+    showErrorMessage("Please type in a username and password.", "login");
 });
 
 document.querySelector("#loginError .close").addEventListener("click", () =>
     document.querySelector("#loginError").classList.toggle("hidden"));
+
+// showing and hiding different forms
+
+document.querySelector("#resetPwd").addEventListener("click", () =>
+{
+    switchView("#login", "#resetPassword");
+});
+
+document.querySelector("#loginBtn").addEventListener("click", () =>
+{
+    switchView("#resetPassword", "#login");
+});
+
+document.querySelector("#resetPassword form").addEventListener("submit", e =>
+{
+    e.preventDefault();
+    let resetData = new FormData();
+    if (e.target.email === "")
+    {
+       showErrorMessage("Please type in your email.", "reset");
+       return;
+    }
+    window.email = e.target.email.value;
+    resetData.append("email", e.target.email.value);
+    fetch(`/api/user/checkResetEmail/${e.target.email.value}`).then(res =>
+    {
+        if (res.ok)
+        {
+            // show check code form 
+            switchView("#resetPassword", "#checkResetCode");
+        }
+        showErrorMessage("Invalid email.", "reset");
+    });
+});
+
+document.querySelector("#checkResetCode form").addEventListener("submit", e =>
+{
+    e.preventDefault();
+    let resetCode = new FormData();
+    if (e.target.code.value === "")
+    {
+        showErrorMessage("Please type in your reset code.", "check");
+        return;
+    }
+    resetCode.append("code", e.target.code.value);
+    fetch(`/api/user/checkResetCode//${e.target.code.value}`).then(res =>
+    {
+        if (res.ok)
+        {
+            // show reset password form
+            switchView("#checkResetCode", "#changePassword");
+        }
+        showErrorMessage("Invalid code.", "resetCode");
+    });
+
+});