Added in editor login feature to login into editor

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

dist/api/.htaccess

@@ -0,0 +1,4 @@
+RewriteEngine On
+RewriteCond %{REQUEST_FILENAME} !-f
+RewriteCond %{REQUEST_FILENAME} !-d
+RewriteRule ^ index.php [QSA,L]

dist/api/index.php

@@ -1,4 +1,5 @@
 <?php
+
 session_start();
 ////////////////// Index file //////////////
 /// Creates base routes and runs         ///
@@ -8,13 +9,16 @@ session_start();
 require "../vendor/autoload.php";
 include "timelineData.php";
 include "projectData.php";
+include "user.php";
 use api\projectData;
 use api\timelineData;
+use api\user;
 use Psr\Http\Message\ResponseInterface as Response;
 use Psr\Http\Message\ServerRequestInterface as Request;
 use Selective\SameSiteCookie\SameSiteCookieConfiguration;
 use Slim\Factory\AppFactory;
 use Selective\SameSiteCookie\SameSiteCookieMiddleware;
+use Slim\Handlers\Strategies\RequestHandler;
 
 // Start slim
 $app = AppFactory::create();
@@ -29,42 +33,38 @@ $app->add(new SameSiteCookieMiddleware($ssConfig));
 // for error checking
 $errorMiddleware = $app->addErrorMiddleware(true, true, true);
 
+// set base path for all routes
 $app->setBasePath("/api");
 
+// return all responses as JSON
+$app->add(function($request, $handler) {
+    $response = $handler->handle($request);
+    return $response->withHeader('Content-Type', 'application/json');
+});
+
 $timelineData = new timelineData();
 $projectData = new projectData();
+$user = new user();
 
 $app->get("/timelineData/{timeline}", function (Request $request, Response $response, array $args)
 {
     global $timelineData;
-    $json = $result = "";
 
     //check if route is available if it is get the data
     //otherwise return an error
     if($args["timeline"] == "edu")
     {
-        $result = $timelineData->getEduData();
+        return $response->getBody()->write(json_encode($timelineData->getEduData()));
     }
-    else if($args["timeline"] == "work")
+    
+    if($args["timeline"] == "work")
     {
-        $result = $timelineData->getWorkData();
+        return $response->getBody()->write(json_encode($timelineData->getWorkData()));
     }
-    else
-    {
-        $result = array(array("errorMessage" => "Error, timeline data not found"));
-    }
-
-    $json = json_encode($result);
-
-    $response->getBody()->write($json);
-    //if it is an error give a 404 code since it can't find the data
-    if(array_key_exists("errorMessage", $result))
-    {
-        $response = $response->withStatus(404);
-    }
-
-    //use content type json to indicate json data on frontend.
-    return $response->withHeader("Content-Type", "application/json");
+    
+    // something went wrong
+    $response->getBody()->write(json_encode(array("errorMessage" => "Error, timeline data not found")));
+    return $response->withStatus(404);
 });
 
 $app->get('/projectData', function (Request $request, Response $response)
@@ -83,7 +83,7 @@ $app->get('/projectData', function (Request $request, Response $response)
     }
 
     //use content type json to indicate json data on frontend.
-    return $response->withHeader("Content-Type", "application/json");
+    return $response;
 });
 
 $app->post('/contact', function (Request $request, Response $response)
@@ -92,20 +92,19 @@ $app->post('/contact', function (Request $request, Response $response)
     if(empty($data["fName"]) || empty($data["lName"]) || empty($data["email"]) || empty($data["subject"]) || empty($data["message"]))
     {
       $response->getBody()->write(json_encode(array("errorMessage" => "Please fill out all the fields")));
-      $response = $response->withStatus(400);
-      return $response->withHeader("Content-Type", "application/json");
+      return $response->withStatus(400);
     }
     
     if (!filter_var($data["email"], FILTER_VALIDATE_EMAIL)) 
     {
       $response->getBody()->write(json_encode(array("errorMessage" => "Email is not the correct format")));
       $response = $response->withStatus(400);
-      return $response->withHeader("Content-Type", "application/json");
+      return $response;
     }
     
     // email form filler/conatcter
-    $headers1 = "From: noreply@rohitpai.tech\r\n";
-    $headers1 .= "Reply-To: rohit@rohitpai.tech\r\n";
+    $headers1 = "From: noreply@rohitpai.co.uk\r\n";
+    $headers1 .= "Reply-To: rohit@rohitpai.co.uk\r\n";
     $headers1 .= "MIME-Version: 1.0\r\n";
     $headers1 .= "Content-Type: text/html; charset=UTF-8\r\n";
     
@@ -176,7 +175,7 @@ $app->post('/contact', function (Request $request, Response $response)
         </table>
         <br>
         <hr>
-        <p>Regards, <br> Rohit Pai <br> <a href=\"mailto:rohit@rohitpai.tech\">rohit@rohitpai.tech</a>
+        <p>Regards, <br> Rohit Pai <br> <a href=\"mailto:rohit@rohitpai.co.uk\">rohit@rohitpai.co.uk</a>
     </body>
     </html>
     ";
@@ -184,7 +183,7 @@ $app->post('/contact', function (Request $request, Response $response)
     mail($data["email"], $data["subject"], $message1, $headers1);
     
     // email to me
-    $headers2 = "From: noreply@rohitpai.tech\r\n";
+    $headers2 = "From: noreply@rohitpai.co.uk\r\n";
     $headers2 .= "Reply-To: {$data['email']}\r\n";
     $headers2 .= "MIME-Version: 1.0\r\n";
     $headers2 .= "Content-Type: text/html; charset=UTF-8\r\n";
@@ -256,8 +255,51 @@ $app->post('/contact', function (Request $request, Response $response)
     </html>
     ";
     
-    mail("rohit@rohitpai.tech", "{$data['fName']} {$data['lName']} filled in the form", $message2, $headers2);
+    mail("rohit@rohitpai.co.uk", "{$data['fName']} {$data['lName']} filled in the form", $message2, $headers2);
     return $response->withStatus(201);
 });
 
-$app->run();
+$app->post('/user/login', function (Request $request, Response $response) {
+    
+    global $user;
+    
+    // get request data
+    $data = $request->getParsedBody();
+    
+    if (empty($data["username"]) || empty($data["password"])) 
+    {
+        // uh oh user sent empty data
+        return $response->withStatus(400);
+    }
+
+    if ($user->checkUser($data["username"], $data["password"]))
+    {
+        // yay user is logged in
+        $_SESSION["token"] = $user->createToken();
+        $_SESSION["username"] = $data["username"];
+        return $response;
+    }
+    return $response->withStatus(401);
+});
+
+$app->get('/user/isLoggedIn', function (Request $request, Response $response) {
+    
+    global $user;
+
+    if (empty($_SESSION["token"]) && empty($_SESSION["username"])) 
+    {
+        // uh oh user not logged in
+        return $response->withStatus(401);
+    }
+
+    if (empty($_SESSION["token"]))
+    {
+        // user is logged in but no token was created
+        $_SESSION["token"] = $user->createToken();
+        return $response;
+    } 
+    
+    return $response->getBody()->write(json_encode(array("token" => $_SESSION["token"])));
+});
+
+$app->run();

dist/api/projectData.php

@@ -10,7 +10,7 @@ require_once "./config.php";
  */
 class projectData
 {
-    function getProjectData()
+    function getProjectData(): array
     {
         $conn = dbConn();
         $stmt = $conn->prepare("SELECT title, isMainProject, information, imgLocation, projectLink, githubLink FROM projects order by date LIMIT 4;");
@@ -23,9 +23,6 @@ class projectData
         {
             return $result;
         }
-        else
-        {
-            return array(array("errorMessage" => "Error, project data not found"));
-        }
+        return array("errorMessage" => "Error, project data not found");
     }
-}
+}

dist/api/timelineData.php

@@ -10,7 +10,7 @@ require_once "./config.php";
  */
 class timelineData
 {
-    function getEduData()
+    function getEduData(): array
     {
         $conn = dbConn();
         $stmt = $conn->prepare("SELECT DATE_FORMAT(startPeriod, '%b, %Y') as startPeriod, DATE_FORMAT(endPeriod, '%b, %Y') as endPeriod, grade, course  FROM edu ORDER BY startPeriod DESC;");
@@ -23,13 +23,10 @@ class timelineData
         {
             return $result;
         }
-        else 
-        {
-            return array("errorMessage" => "Error, edu data not found");
-        }
+        return array("errorMessage" => "Error, edu data not found");
     }
     
-    function getWorkData()
+    function getWorkData(): array
     {
         $conn = dbConn();
         $stmt = $conn->prepare("SELECT DATE_FORMAT(startPeriod, '%b, %Y') as startPeriod, DATE_FORMAT(endPeriod, '%b, %Y') as endPeriod, companyName, area, title  FROM work ORDER BY work.startPeriod DESC;");
@@ -42,10 +39,7 @@ class timelineData
         {
             return $result;
         }
-        else 
-        {
-            return array("errorMessage" => "Error, work data not found");
-        }
+        return array("errorMessage" => "Error, work data not found");
     }
     
     

dist/api/user.php

@@ -0,0 +1,38 @@
+<?php
+namespace api;
+use PDO;
+
+require_once "./config.php";
+
+/**
+ * User Class
+ * Define all functions which either check, update or delete user data
+ */
+class user
+{
+    function checkUser($username, $password): bool
+    {
+        $conn = dbConn();
+        $stmt = $conn->prepare("SELECT * FROM users WHERE username = :username");
+        $stmt->bindParam(":username", $username);
+        $stmt->execute();
+        
+        // set the resulting array to associative
+        $result = $stmt->fetchAll(PDO::FETCH_ASSOC);
+        
+        if ($result)
+        {
+            if (password_verify($password, $result[0]["password"]))
+            {
+                return true;
+            }
+            return false;
+        }
+        return false;
+    }
+
+    function createToken(): string
+    {
+        return uniqid("rpe-");
+    }
+}

dist/editor/editor.html

@@ -0,0 +1 @@
+<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Editor</title></head><body><h1>Editor</h1><script src="js/editor.js"></script></body></html>

dist/editor/index.html

@@ -0,0 +1 @@
+<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Editor</title><link rel="stylesheet" href="css/main.css"></head><body><main><div id="login"><h1>Login To Editor</h1><form action="" method="POST"><div class="formControl"><label for="username">Username</label> <input type="text" id="username" name="username" required></div><div class="formControl"><label for="password">Password</label> <input type="password" id="password" name="password" required></div><div class="error hidden" id="loginError"><button class="close" type="button">&times;</button><div></div></div><input type="submit" value="Submit"></form></div></main><script src="js/index.js"></script></body></html>

dist/editor/js/editor.js

@@ -0,0 +1 @@
+document.addEventListener("DOMContentLoaded",(e=>{fetch("/api/user/isLoggedIn").then((e=>{e.ok||(window.location.href="./")}))}));

dist/editor/js/index.js

@@ -0,0 +1 @@
+function showErrorMessage(e){document.querySelector("#loginError").classList.remove("hidden"),document.querySelector("#loginError div").innerText=e}document.addEventListener("DOMContentLoaded",(e=>{fetch("/api/user/isLoggedIn").then((e=>{e.ok&&(window.location.href="./editor.html")}))})),document.querySelector("#login form").addEventListener("submit",(e=>{e.preventDefault();let r=new FormData;if(e.target.username.value.length>0&&e.target.password.value.length>0)return r.append("username",e.target.username.value),r.append("password",e.target.password.value),void fetch("/api/user/login",{method:"POST",body:r}).then((e=>{e.ok?window.location.href="./editor.html":400!==e.status?(document.querySelector("#loginError").classList.remove("hidden"),document.querySelector("#loginError div").innerHTML="Invalid username or password"):showErrorMessage("Please type in a username and password.")}));document.querySelector("#loginError").classList.remove("hidden"),document.querySelector("#loginError div").innerHTML="Please type in a username and password"})),document.querySelector("#loginError .close").addEventListener("click",(()=>document.querySelector("#loginError").classList.toggle("hidden")));

dist/editor/js/main.js

@@ -0,0 +1 @@
+function showErrorMessage(e){document.querySelector("#loginError").classList.remove("hidden"),document.querySelector("#loginError div").innerText=e}document.addEventListener("DOMContentLoaded",(e=>{fetch("/api/user/isLoggedIn").then((e=>{e.ok&&(window.location.href="./editor.html")}))})),document.querySelector("#login form").addEventListener("submit",(e=>{e.preventDefault();let r=new FormData;if(e.target.username.value.length>0&&e.target.password.value.length>0)return r.append("username",e.target.username.value),r.append("password",e.target.password.value),void fetch("/api/user/login",{method:"POST",body:r}).then((e=>{e.ok?window.location.href="./editor.html":400!==e.status?(document.querySelector("#loginError").classList.remove("hidden"),document.querySelector("#loginError div").innerHTML="Invalid username or password"):showErrorMessage("Please type in a username and password.")}));document.querySelector("#loginError").classList.remove("hidden"),document.querySelector("#loginError div").innerHTML="Please type in a username and password"})),document.querySelector("#loginError .close").addEventListener("click",(()=>document.querySelector("#loginError").classList.toggle("hidden")));