diff --git a/static/build/index.js b/static/build/index.js
new file mode 100644
index 0000000..122ad60
--- /dev/null
+++ b/static/build/index.js
@@ -0,0 +1,112 @@
+document.addEventListener("DOMContentLoaded", function () {
+ const signupForm = document.forms.signupForm;
+ const loginForm = document.forms.loginForm;
+
+ const submitBtn = document.getElementById("submitBtn");
+
+ signupForm.addEventListener("input", function () {
+ const formIsValid = signupForm.checkValidity();
+ submitBtn.disabled = !formIsValid;
+ });
+
+ loginForm.addEventListener("submit", function (event) {
+ event.preventDefault(); // Prevent the form from being submitted normally
+ submitLogin();
+ });
+
+ var urlParams = new URLSearchParams(window.location.search);
+ if (urlParams.has('login')) {
+ console.log("login parameter")
+ $('#loginModal').modal('show');
+ }
+ else if (urlParams.has('signup')) {
+ $('#signupModal').modal('show');
+ console.log("signup parameter")
+ }
+});
+
+const usernameInput = document.getElementById("signup-username");
+usernameInput.addEventListener("blur", function () {
+ checkUsernameAvailability();
+});
+
+
+
+function checkUsernameAvailability() {
+ const usernameInput = document.getElementById("signup-username");
+ const availabilityDiv = document.getElementById("usernameAvailability");
+
+ // Get the value of the username input
+ const username = usernameInput.value;
+
+ // Check if the input value meets the required pattern
+ const usernameRegex = new RegExp(usernameInput.pattern);
+ if (!usernameRegex.test(username)) {
+ availabilityDiv.innerHTML = "";
+ return; // Exit the function if the username is not valid
+ }
+ // Send an AJAX request to the server
+ const xhr = new XMLHttpRequest();
+ xhr.open("GET", "/checkusername?username=" + username, true);
+ xhr.onreadystatechange = function () {
+ if (xhr.readyState === 4 && xhr.status === 200) {
+ const response = JSON.parse(xhr.responseText);
+ const isAvailable = response.available;
+ if (!isAvailable) {
+ availabilityDiv.innerHTML = "Username is available.";
+ } else {
+ availabilityDiv.innerHTML = "Username is not available.";
+ }
+ }
+ };
+ xhr.send();
+}
+
+function sleep(ms) {
+ return new Promise(resolve => setTimeout(resolve, ms));
+}
+function submitLogin() {
+
+ // Get the values of the username and password fields
+ const username = loginForm.elements.username.value;
+ const password = loginForm.elements.login_password.value;
+
+ // Create a new FormData object and append the values
+ const formData = new FormData();
+ formData.append("username", username);
+ formData.append("password", password);
+ // Send the login request as form data
+ const xhr = new XMLHttpRequest();
+ xhr.open("POST", "/login", true);
+
+ xhr.onreadystatechange = function () {
+ if (xhr.readyState === 4) {
+ if (xhr.status === 200) {
+ // Login successful, redirect to home page
+ console.log("Waiting for redirect...")
+ window.location.href = "/home";
+ } else {
+ // Login failed, display the error message
+ const response = JSON.parse(xhr.responseText);
+ const loginErrorDiv = document.getElementById("login-error");
+ loginErrorDiv.textContent = response.error;
+ }
+ }
+ };
+ xhr.send(formData);
+ // Disable the button to prevent multiple clicks
+ loginButton.disabled = true;
+
+ // Show the spinner
+ const spinner = document.createElement('i');
+ spinner.classList.add('fas', 'fa-spinner', 'fa-spin');
+ loginButton.innerHTML = '';
+ loginButton.appendChild(spinner);
+
+ // Enable the button and remove the spinner after 5 seconds
+ setTimeout(function () {
+ loginButton.disabled = false;
+ loginButton.innerHTML = 'Login';
+ }, 5000);
+ sleep(5000).then(() => { loginButton.disabled = false; });
+};
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
index 53a8bc9..f9ff5b8 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -232,124 +232,9 @@
Report Issues
-
-
-
+