rodude123/my-portfolio
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added in base code for reset email

Browse Source 
Signed-off-by: rodude123 <rodude123@gmail.com>
This commit is contained in:
Rohit Pai
2022-08-07 22:34:31 +01:00
parent c28e02279a
commit d8e16e8de1
16 changed files with 411 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/api/index.php
+60 -7
View File
@@ -39,7 +39,7 @@ $app->setBasePath("/api");
// return all responses as JSON
$app->add(function($request, $handler) {
$response = $handler->handle($request);
return $response->withHeader('Content-Type', 'application/json');
return $response->withHeader("Content-Type", "application/json");
});
$timelineData = new timelineData();
@@ -54,12 +54,14 @@ $app->get("/timelineData/{timeline}", function (Request $request, Response $resp
//otherwise return an error
if($args["timeline"] == "edu")
{
return $response->getBody()->write(json_encode($timelineData->getEduData()));
$response->getBody()->write(json_encode($timelineData->getEduData()));
return $response;
}
if($args["timeline"] == "work")
{
return $response->getBody()->write(json_encode($timelineData->getWorkData()));
$response->getBody()->write(json_encode($timelineData->getWorkData()));
return $response;
}
// something went wrong
@@ -67,7 +69,7 @@ $app->get("/timelineData/{timeline}", function (Request $request, Response $resp
return $response->withStatus(404);
});
$app->get('/projectData', function (Request $request, Response $response)
$app->get("/projectData", function (Request $request, Response $response)
{
global $projectData;
@@ -86,7 +88,7 @@ $app->get('/projectData', function (Request $request, Response $response)
return $response;
});
$app->post('/contact', function (Request $request, Response $response)
$app->post("/contact", function (Request $request, Response $response)
{
$data = $request->getParsedBody();
if(empty($data["fName"]) || empty($data["lName"]) || empty($data["email"]) || empty($data["subject"]) || empty($data["message"]))
@@ -259,7 +261,7 @@ $app->post('/contact', function (Request $request, Response $response)
return $response->withStatus(201);
});
$app->post('/user/login', function (Request $request, Response $response) {
$app->post("/user/login", function (Request $request, Response $response) {
global $user;
@@ -282,7 +284,7 @@ $app->post('/user/login', function (Request $request, Response $response) {
return $response->withStatus(401);
});
$app->get('/user/isLoggedIn', function (Request $request, Response $response) {
$app->get("/user/isLoggedIn", function (Request $request, Response $response) {
global $user;
@@ -302,4 +304,55 @@ $app->get('/user/isLoggedIn', function (Request $request, Response $response) {
return $response->getBody()->write(json_encode(array("token" => $_SESSION["token"])));
});
$app->get("/user/checkResetEmail/{email}", function (Request $request, Response $response, array $args)
{
global $user;
if (empty($args["email"]))
{
// uh oh sent empty data
return $response->withStatus(400);
}
if ($user->checkEmail($args["email"]))
{
// yay email does exist
$token = $user->sendResetEmail($args["email"]);
$_SESSION["resetToken"] = $token;
$_SESSION["resetEmail"] = $args["email"];
return $response;
}
return $response->withStatus(404);
});
$app->get("/user/resendEmail", function (Request $request, Response $response)
{
if (empty($_SESSION["resetToken"]))
{
// uh oh not authorized to resend email
return $response->withStatus(401);
}
global $user;
$user->sendResetEmail($_SESSION["resetEmail"]);
return $response;
});
$app->get("/user/checkResetCode/{code}", function (Request $request, Response $response, array $args)
{
global $user;
if (empty($args["code"]))
{
// uh oh sent empty data
return $response->withStatus(400);
}
if ($_SESSION["resetToken"] === $args["code"])
{
// yay, code code matches
return $response;
}
return $response->withStatus(401);
});
$app->run();
src/api/timelineData.php
-1
View File
@@ -42,5 +42,4 @@ class timelineData
return array("errorMessage" => "Error, work data not found");
}
}
src/api/user.php
+46
View File
@@ -35,4 +35,50 @@ class user
{
return uniqid("rpe-");
}
function checkEmail($email): bool
{
$conn = dbConn();
$stmt = $conn->prepare("SELECT * FROM users WHERE email = :email");
$stmt->bindParam(":email", $email);
$stmt->execute();
// set the resulting array to associative
$result = $stmt->fetchAll(PDO::FETCH_ASSOC);
if ($result)
{
return true;
}
return false;
}
function sendResetEmail($email): string
{
//generate a random token and email the address
$token = $this->createToken();
$headers1 = "From: noreply@rohitpai.co.uk\r\n";
$headers1 .= "MIME-Version: 1.0\r\n";
$headers1 .= "Content-Type: text/html; charset=UTF-8\r\n";
$message = "
<!doctype html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0'>
<meta http-equiv='X-UA-Compatible' content='ie=edge'>
<title>Document</title>
</head>
<body>
<h1>Reset Password Verification Code</h1>
<br>
<p>Please enter the following code to reset your password: $token</p>
</body>
</html>
";
mail($email, "Reset Password Verification Code", $message, $headers1);
return $token;
}
}
src/css/templateStyles.css
+5 -6
View File
@@ -65,13 +65,17 @@ h2 {
a.btn, form input[type="submit"] {
text-decoration: none;
display: inline-block;
padding: 1rem 2rem;
padding: 1em 2em;
border-radius: 0.625em;
border: 0.3215em solid var(--primaryDefault);
color: #FFFFFF;
text-align: center;
}
form input[type="submit"] {
padding: 1.1em 2em;
}
a.btn:hover, form input[type="submit"]:hover {
border: 0.3215em solid var(--primaryHover);
}
@@ -121,11 +125,6 @@ form .formControl {
width: 100%;
}
form input[type="submit"] {
margin-top: 1em;
align-self: flex-start;
}
form .formControl input:not([type="submit"]), form .formControl textarea {
width: 100%;
border: 4px solid var(--primaryDefault);
src/editor/css/login.css
+39 -4
View File
@@ -17,7 +17,7 @@ main {
background-image: radial-gradient(var(--primaryDefault), hsl(80, 50%, 30%));
}
div#login {
div.container {
display: flex;
flex-direction: column;
justify-content: center;
@@ -28,9 +28,28 @@ div#login {
-moz-border-radius: 1em;
border-radius: 1em;
box-shadow: 0 6px 4px 0 var(--mutedBlack);
-webkit-transform: translateX(-150vw);
-moz-transform: translateX(-150vw);
-ms-transform: translateX(-150vw);
-o-transform: translateX(-150vw);
transform: translateX(-150vw);
-webkit-transition: transform 400ms ease-in-out;
-moz-transition: transform 400ms ease-in-out;
-ms-transition: transform 400ms ease-in-out;
-o-transition: transform 400ms ease-in-out;
transition: transform 400ms ease-in-out;
overflow: hidden;
}
div#login form {
div.container.shown {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
div.container form {
display: flex;
flex-direction: column;
justify-content: center;
@@ -40,7 +59,7 @@ div#login form {
div#login #password {
font-family: Verdana, serif;
letter-spacing: 0.125em;
letter-spacing: 0.125em;
}
div#login input[type=submit]{
@@ -97,4 +116,20 @@ div.error.hidden {
div.error button:hover {
text-shadow: -1px 2px var(--mutedBlack);
}
}
div.btnContainer {
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
div.btnContainer a:not(.btn) {
color: #000000;
}
div.btnContainer a.btn {
align-self: flex-end;
}
src/editor/index.html
+75 -2
View File
@@ -3,11 +3,13 @@
<head>
<meta charset="UTF-8">
<title>Editor</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<main>
<div id="login">
<div id="login" class="container shown">
<h1>Login To Editor</h1>
<form action="" method="POST">
@@ -27,7 +29,78 @@
<div></div>
</div>
<input type="submit" value="Submit">
<div class="btnContainer">
<input type="submit" value="Submit" class="btn btnPrimary boxShadowIn boxShadowOut">
<a href="#" id="resetPwd">Reset Password</a>
</div>
</form>
</div>
<div id="resetPassword" class="container" style="display: none; transform: translateX(150vw)">
<h1>Reset Password</h1>
<form action="#" method="POST">
<div class="formControl">
<label for="email">Email</label>
<input type="email" id="email" name="email">
</div>
<div class="error hidden" id="resetError">
<button class="close" type="button">&times;</button>
<div></div>
</div>
<div class="btnContainer">
<input type="submit" value="Submit" class="btn btnPrimary boxShadowIn boxShadowOut">
<a href="#" class="loginBtn btn btnPrimary boxShadowIn boxShadowOut" id="loginBtn">Login</a>
</div>
</form>
</div>
<div id="checkResetCode" class="container" style="display: none; transform: translateX(150vw)">
<h1>Check Reset Code</h1>
<form action="#" method="POST">
<div class="formControl">
<label for="code">Code</label>
<input type="text" id="code" name="code">
</div>
<div class="error hidden" id="codeError">
<button class="close" type="button">&times;</button>
<div></div>
</div>
<div class="btnContainer">
<input type="submit" value="Submit" class="btn btnPrimary boxShadowIn boxShadowOut">
<a href="#" class="loginBtn btn btnPrimary boxShadowIn boxShadowOut" id="resendEmail">Resend Email</a>
</div>
</form>
</div>
<div id="changePassword" class="container" style="display: none; transform: translateX(150vw)">
<h1>Reset Password</h1>
<form action="" method="POST">
<div class="formControl">
<label for="pass">Password</label>
<input type="password" name="pass" id="pass">
</div>
<div class="formControl">
<label for="rePass">Password</label>
<input type="password" name="rePass" id="rePass">
</div>
<div class="error hidden" id="changeError">
<button class="close">&times;</button>
<div></div>
</div>
<div class="btnContainer">
<input type="submit" value="Submit" class="btn btnPrimary boxShadowIn boxShadowOut">
<a href="#" class="loginBtn btn btnPrimary boxShadowIn boxShadowOut">Login</a>
</div>
</form>
</div>
</main>
src/editor/js/index.js
+73 -9
View File
@@ -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");
});
});