Add files via upload

ChandelAnish · Aug 24, 2024 · 387dbf8 · 387dbf8
1 parent 8d134a1
commit 387dbf8
Show file tree

Hide file tree

Showing 3 changed files with 222 additions and 0 deletions.
diff --git a/auth/assets/fusionFLOW-logo.png b/auth/assets/fusionFLOW-logo.png
diff --git a/auth/signin/index.html b/auth/signin/index.html
@@ -0,0 +1,83 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Sign In</title>
+  <link rel="icon" href="../assets/fusionFLOW-logo.png">
+  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+</head>
+</head>
+<body class="bg-body-tertiary">
+
+  <div class="d-flex align-items-center py-4" style="height: 100vh;">
+    <main class="form-signin m-auto rounded-4" style="width: 20rem; background-color: white; padding: 25px;">
+      <!-- form -->
+      <form id="signinForm">
+        <h1 class="h3 mb-3 fw-normal">Welcome back !</h1>
+
+        <div class="form-floating mb-2">
+          <input type="email" class="form-control" id="email" placeholder="[email protected]" name="email">
+          <label for="email">Email address</label>
+        </div>
+
+        <div class="form-floating">
+          <input type="password" class="form-control" id="password" placeholder="Password" name="password">
+          <label for="password">Password</label>
+        </div>
+
+        <!-- warning message -->
+        <div class="text-danger m-2 text-center" id="warningMsg" style="height: 24px;"></div>
+
+        <div class="form-check text-start my-3">
+          <input class="form-check-input" type="checkbox" value="remember-me" id="flexCheckDefault">
+          <label class="form-check-label" for="flexCheckDefault">
+            Remember me
+          </label>
+        </div>
+
+        <button class="btn btn-primary py-2" type="submit" style="width: 10rem;">Sign in</button>
+      </form>
+    </main>
+  </div>
+
+  <script>
+    document.getElementById('signinForm').addEventListener('submit', async function(e) {
+      e.preventDefault();
+      const warningMsg = document.getElementById('warningMsg');
+      warningMsg.textContent = '';
+
+      const email = document.getElementById('email').value;
+      const password = document.getElementById('password').value;
+
+      const userDetails = { email, password };
+
+      try {
+        const response = await fetch('https://fusionflow-vm59.onrender.com/signin', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json'
+          },
+          credentials: 'include',
+          body: JSON.stringify(userDetails)
+        });
+
+        const data = await response.json();
+
+        if (data.signin) {
+          window.location.href = '/';
+        } else {
+          warningMsg.textContent = data.msg;
+          if (data.msg === "User not exists") {
+            warningMsg.innerHTML += ' <a href="/signup">Sign-up</a>';
+          }
+        }
+      } catch (error) {
+        console.log(error);
+      }
+    });
+  </script>
+
+<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
+</body>
+</html>
diff --git a/auth/signup/index.html b/auth/signup/index.html
@@ -0,0 +1,139 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Sign Up to fusionFLOW</title>
+    <link rel="icon" href="../assets/fusionFLOW-logo.png">
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+  </head>
+  </head>
+  <body class="bg-body-tertiary">
+    <div class="d-flex align-items-center py-4" style="height: 100vh;">
+      <main
+        class="form-signin m-auto rounded-4"
+        style="width: 25rem; background-color: white; padding: 25px;"
+      >
+        <form id="signupForm">
+          <h1 class="h3 mb-3 fw-normal">Sign Up to fusionFLOW</h1>
+
+          <div class="form-floating mb-2">
+            <input
+              type="text"
+              class="form-control"
+              id="username"
+              placeholder="name_123"
+              name="username"
+            />
+            <label for="username">Username</label>
+          </div>
+
+          <div class="form-floating mb-2">
+            <input
+              type="email"
+              class="form-control"
+              id="email"
+              placeholder="[email protected]"
+              name="email"
+            />
+            <label for="email">Email address</label>
+          </div>
+
+          <div class="form-floating mb-2">
+            <input
+              type="password"
+              class="form-control"
+              id="password"
+              placeholder="Password"
+              name="password"
+            />
+            <label for="password">Password</label>
+          </div>
+
+          <div class="form-floating">
+            <input
+              type="password"
+              class="form-control"
+              id="confirmPassword"
+              placeholder="Password"
+              name="confirmPassword"
+            />
+            <label for="confirmPassword">Confirm Password</label>
+          </div>
+
+          <!-- warning message -->
+          <div
+            class="text-danger m-2"
+            id="warningMsg"
+            style="height: 24px; text-align: center;"
+          ></div>
+
+          <div class="form-check text-start my-3">
+            <input
+              class="form-check-input"
+              type="checkbox"
+              value="remember-me"
+              id="flexCheckDefault"
+            />
+            <label class="form-check-label" for="flexCheckDefault">
+              Remember me
+            </label>
+          </div>
+
+          <button class="btn btn-primary py-2" type="submit" style="width: 10rem;">
+            Sign up
+          </button>
+        </form>
+      </main>
+    </div>
+
+    <script>
+      document.getElementById('signupForm').addEventListener('submit', async function (e) {
+        e.preventDefault();
+        const warningMsg = document.getElementById('warningMsg');
+        warningMsg.textContent = '';
+
+        const form = e.target;
+
+        const username = form.username.value;
+        const email = form.email.value;
+        const password = form.password.value;
+        const confirmPassword = form.confirmPassword.value;
+
+        if (password !== confirmPassword) {
+          warningMsg.textContent = 'Passwords do not match';
+          return;
+        }
+
+        const userDetails = { username, email, password, confirmPassword };
+
+        const response = await signup(userDetails);
+
+        if (response.signup) {
+          window.location.href = '/signin';
+        } else {
+          warningMsg.textContent = response.msg;
+        }
+      });
+
+      async function signup(userDetails) {
+        try {
+          const response = await fetch('https://fusionflow-vm59.onrender.com/signup', {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
+            },
+            credentials: 'include',
+            body: JSON.stringify(userDetails),
+          });
+          const data = await response.json();
+          return data;
+        } catch (error) {
+          console.error(error);
+        }
+      }
+    </script>
+
+<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
+  </body>
+</html>