From ce58e250944e0812622399ea286d09f95d7adf4c Mon Sep 17 00:00:00 2001
From: flifloo <flifloo@gmail.com>
Date: Wed, 29 Apr 2020 09:22:33 +0200
Subject: [PATCH] Add login/logout button on header

---
 public/css/main.css | 23 ++++++++++++++++++++++-
 routes/error.js     |  2 +-
 routes/index.js     |  2 +-
 routes/list.js      |  2 +-
 routes/login.js     |  3 ++-
 routes/notFound.js  |  2 +-
 views/layout.pug    |  6 ++++++
 7 files changed, 34 insertions(+), 6 deletions(-)

diff --git a/public/css/main.css b/public/css/main.css
index b9624b8..dbfd908 100644
--- a/public/css/main.css
+++ b/public/css/main.css
@@ -43,7 +43,7 @@ form>div {
 	margin: 0.3em;
 }
 
-.file_button::-webkit-file-upload-button, button {
+.file_button::-webkit-file-upload-button, button, .login, .logout {
 	border-radius: 0.3em;
 	border-width: 0em;
 	padding: 0.5em;
@@ -65,3 +65,24 @@ form>div {
 }
 
 
+header {
+	display: flex;
+	position: absolute;
+	right: 0;
+	margin: 0.5em;
+	align-items: center;
+	justify-content: space-between;
+}
+
+.hy {
+	margin-right: 1em;
+}
+
+.login, .logout {
+	background-color: buttonface;
+	text-decoration: none;
+	color: initial;
+	width: fit-content;
+	height: fit-content;
+}
+
diff --git a/routes/error.js b/routes/error.js
index d83df8a..0f70fdd 100644
--- a/routes/error.js
+++ b/routes/error.js
@@ -1,6 +1,6 @@
 module.exports = (err, req, res, next) => {
 	console.error(err.stack);
 	res.status(500);
-	res.render("error");
+	res.render("error", {session: req.session});
 }
 
diff --git a/routes/index.js b/routes/index.js
index 41d71b0..c0902e0 100644
--- a/routes/index.js
+++ b/routes/index.js
@@ -7,7 +7,7 @@ router.get("/", isAuth, (req, res) => {
 	if ("invalidType" in req.query) {
 		invalidType = true;
 	}
-	res.render("index", {invalidType: invalidType});
+	res.render("index", {invalidType: invalidType, session: req.session});
 });
 
 
diff --git a/routes/list.js b/routes/list.js
index 3cd147a..8f0decf 100644
--- a/routes/list.js
+++ b/routes/list.js
@@ -5,7 +5,7 @@ let fs = require("fs");
 
 router.get("/", isAuth, (req, res, next) => {
 	let images = fs.readdirSync("./images/");
-	res.render("list", {images: images});
+	res.render("list", {images: images, session: req.session});
 });
 
 
diff --git a/routes/login.js b/routes/login.js
index 1193d57..8779ce1 100644
--- a/routes/login.js
+++ b/routes/login.js
@@ -15,7 +15,7 @@ router.get("/", (req, res) => {
 		if ("path" in req.query) {
 			path = req.query.path;
 		}
-		res.render("login", {title: "login", fail: fail, path: path});
+		res.render("login", {title: "login", fail: fail, path: path, session: req.session});
 	}
 });
 
@@ -24,6 +24,7 @@ router.post("/", (req, res) => {
 		file = JSON.parse(fs.readFileSync("users.json"));
 		if (req.body.username in file && passwordHash.verify(req.body.password, file[req.body.username])) {
 			req.session.login = true;
+			req.session.username = req.body.username;
 			req.session.save();
 			if ("path" in req.query) {
 				res.redirect(req.query.path);
diff --git a/routes/notFound.js b/routes/notFound.js
index 81c0cdb..47bb630 100644
--- a/routes/notFound.js
+++ b/routes/notFound.js
@@ -3,7 +3,7 @@ let router = require("express").Router();
 
 router.use((req, res) => {
 	res.status(404);
-	res.render("404", {url: req.path});
+	res.render("404", {url: req.path, session: req.session});
 });
 
 
diff --git a/views/layout.pug b/views/layout.pug
index 18eb624..401fe1e 100644
--- a/views/layout.pug
+++ b/views/layout.pug
@@ -8,5 +8,11 @@ html(lang="en")
 			title Image Node
 		link(rel="stylesheet", href="/css/main.css")
 	body
+		header
+			if session.login
+				p.hy Hy #{session.username} !
+				a.logout(href="/logout") Logout
+			else
+				a.login(href="/login") Login
 		block content