Login/registration

PixelsetDev · Jun 11, 2024 · 324e69d · 324e69d
1 parent a27533c
commit 324e69d
Show file tree

Hide file tree

Showing 9 changed files with 109 additions and 24 deletions.
diff --git a/Assets/CSS/Dev.css b/Assets/CSS/Dev.css
@@ -11,10 +11,9 @@ header {
     @apply lg:px-16 md:px-8 sm:px-4 px-2;
 }
 
-nav {
-    @apply flex space-x-4 py-2;
-    @apply lg:px-16 md:px-8 sm:px-4 px-2;
-}
+nav { @apply flex space-x-2 py-2 lg:px-16 md:px-8 sm:px-4 px-2; }
+nav>a { @apply px-2 py-1; }
+nav>a:not(.nobtn) { @apply bg-neutral-200 hover:bg-neutral-100 transition duration-200; }
 
 footer {
     @apply text-center txt-xs;
@@ -54,4 +53,6 @@ label { @apply txt-xs; }
 
 .card-yellow { @apply card bg-amber-500 hover:bg-amber-400 text-white font-bold; }
 
-.req { @apply text-red-500; }
+.req { @apply text-red-500; }
+
+.error { @apply bg-red-200 border-l-2 border-red-700 text-red-700 px-2 py-1; }
diff --git a/Assets/CSS/Dist.css b/Assets/CSS/Dist.css
@@ -716,8 +716,8 @@ nav{
 
 nav > :not([hidden]) ~ :not([hidden]){
   --tw-space-x-reverse: 0;
-  margin-right: calc(1rem * var(--tw-space-x-reverse));
-  margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
+  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
+  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
 }
 
 nav{
@@ -748,6 +748,28 @@ nav{
   }
 }
 
+nav>a{
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+}
+
+nav>a:not(.nobtn){
+  --tw-bg-opacity: 1;
+  background-color: rgb(229 229 229 / var(--tw-bg-opacity));
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 200ms;
+}
+
+nav>a:not(.nobtn):hover{
+  --tw-bg-opacity: 1;
+  background-color: rgb(245 245 245 / var(--tw-bg-opacity));
+}
+
 footer{
   text-align: center;
   font-size: 0.75rem;
@@ -1336,6 +1358,20 @@ label{
   color: rgb(239 68 68 / var(--tw-text-opacity));
 }
 
+.error{
+  border-left-width: 2px;
+  --tw-border-opacity: 1;
+  border-color: rgb(185 28 28 / var(--tw-border-opacity));
+  --tw-bg-opacity: 1;
+  background-color: rgb(254 202 202 / var(--tw-bg-opacity));
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+  --tw-text-opacity: 1;
+  color: rgb(185 28 28 / var(--tw-text-opacity));
+}
+
 @media (min-width: 768px){
   .md\:col-span-2{
     grid-column: span 2 / span 2;
@@ -1347,6 +1383,10 @@ label{
 }
 
 @media (min-width: 1024px){
+  .lg\:col-span-2{
+    grid-column: span 2 / span 2;
+  }
+
   .lg\:grid-cols-2{
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }

diff --git a/Processes/POST/Login.php b/Processes/POST/Login.php
@@ -6,4 +6,24 @@
 $Session = new Session();
 $SQL = new SQL(DB_HOST, DB_USER, DB_PASS, DB_NAME);
 
-$Session->Login('');
+if (isset($_POST['email']) && isset($_POST['password'])) {
+    $query = $SQL->Query("SELECT * FROM `users` WHERE `email` = '".$SQL->Escape($_POST['email'])."'");
+
+    if ($query->num_rows == 0) {
+        header('Location: /login?error=incorrect');
+        exit;
+    }
+
+    $info = $query->fetch_assoc();
+
+    if (!password_verify($_POST['password'], $info['password'])) {
+        header('Location: /login?error=incorrect');
+        exit;
+    }
+
+    $Auth = new Session();
+    $Auth->Login($info['uuid']);
+
+    header('Location: /dashboard');
+    exit;
+}
diff --git a/Processes/POST/Register.php b/Processes/POST/Register.php
@@ -12,6 +12,7 @@
 $surname = trim($_POST['surname']);
 $phone = trim($_POST['phone']);
 $dob = trim($_POST['dob']);
+var_dump($dob);
 
 if (COLLECT_GENDER) {
     $gender = trim($_POST['gender']);
@@ -29,9 +30,9 @@
 
 $email = trim($_POST['email']);
 $password = trim($_POST['password']);
-$confirmPassword = trim($_POST['confirm_password']);
+$confirmPassword = trim($_POST['confirmpassword']);
 
-if ($password !== $confirmPassword) {
+if ($password != $confirmPassword) {
     header('Location: /register?error=password');
     exit;
 }
@@ -52,7 +53,7 @@
         NULL
     )
 ")) {
-    header('Location: /register?error=db');
+    header('Location: /register?error=database');
     exit;
 }
 
@@ -72,9 +73,9 @@
         '{$SQL->Escape($pronouns)}'
     )
 ")) {
-    header('Location: /register?error=db');
+    header('Location: /register?error=database');
     exit;
 }
 
-header('Location: /dashboard');
+header('Location: /login');
 exit;
diff --git a/Settings.php b/Settings.php
@@ -1,7 +1,9 @@
 <?php
 
+const CONTACT_DETAILS = 'our HR team';
+
 const DB_HOST = 'localhost';
-const DB_USER = '';
+const DB_USER = 'root';
 const DB_PASS = '';
 const DB_NAME = 'PeopleHive';
 

diff --git a/Views/Include/Nav.php b/Views/Include/Nav.php
@@ -1,6 +1,6 @@
 <nav>
-    <a href="/" class="font-black flex-grow"><?= WEBSITE_NAME; ?></a>
-    <a href="/jobs">Jobs</a>
+    <a href="/" class="font-black flex-grow nobtn"><?= WEBSITE_NAME; ?></a>
+    <a href="/jobs">Vacancies</a>
     <a href="/login">Login</a>
     <a href="/register">Register</a>
 </nav>
diff --git a/Views/Login.php b/Views/Login.php
@@ -13,18 +13,27 @@
         </header>
 
         <main>
-            <form action="/auth/login" method="POST" class="grid gap-4">
+            <?php
+            if (isset($_GET['error'])) {
+                $error = match ($_GET['error']) {
+                    'incorrect' => 'Username or password is incorrect.',
+                    default => 'An unexpected error occurred. Please try again.',
+                }
+                ?>
+                <div class="error"><?= $error; ?></div><br>
+            <?php } ?>
+            <form action="/auth/login" method="POST" class="grid lg:grid-cols-2 gap-4">
                 <div class="grid">
-                    <label for="username">Username</label>
-                    <input type="text" name="username" id="username">
+                    <label for="email">Email address <sup class="req">*</sup></label>
+                    <input type="email" name="email" id="email">
                 </div>
 
                 <div class="grid">
-                    <label for="password">Password</label>
+                    <label for="password">Password <sup class="req">*</sup></label>
                     <input type="password" name="password" id="password">
                 </div>
 
-                <input type="submit" value="Login">
+                <input type="submit" value="Login" class="lg:col-span-2">
             </form>
         </main>
 

diff --git a/Views/Register.php b/Views/Register.php
@@ -13,6 +13,16 @@
         </header>
 
         <main>
+            <?php
+            if (isset($_GET['error'])) {
+                $error = match ($_GET['error']) {
+                    'password' => 'Password and confirm password do not match.',
+                    'database' => 'An issue was encountered whilst accessing the database, please contact '.CONTACT_DETAILS.' for assistance.',
+                    default => 'An unexpected error occurred. Please try again.',
+                }
+            ?>
+                <div class="error"><?= $error; ?></div><br>
+            <?php } ?>
             <form action="/auth/register" method="POST" class="grid gap-4">
                 <h3>Your information</h3>
                 <p class="text-xs italic">
@@ -37,8 +47,8 @@
                         <input type="tel" name="phone" id="phone" required>
                     </div>
                     <div class="grid">
-                        <label for="phone">Date of Birth <sup class="req">*</sup></label>
-                        <input type="date" name="phone" id="phone" required>
+                        <label for="dob">Date of Birth <sup class="req">*</sup></label>
+                        <input type="date" name="dob" id="dob" required>
                     </div>
                     <?php if (COLLECT_GENDER) { ?>
                     <div class="grid">
@@ -104,7 +114,7 @@
 
                 <?php } ?>
 
-                <input type="submit" value="Login">
+                <input type="submit" value="Register">
             </form>
         </main>
 

diff --git a/index.php b/index.php
@@ -1,3 +1,5 @@
 <?php
 
+session_start();
+
 require_once __DIR__ . '/autoload.php';