-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathserver.js
130 lines (112 loc) · 3.98 KB
/
server.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
const express = require("express");
const server = express();
const staticHandler = express.static("public");
server.use(staticHandler);
// array of posts
let postsArray = [
{ "user-name": "Miah", message: "Looking for some cows, can anyone help me?", time: "17:20", date: "13/01/2022"},
{ "user-name": "Orian", message: "Moo too!", time: "16:45", date: "13/01/2022"},
{ "user-name": "Oli", message: "First Moo!", time: "13:20", date: "13/01/2022"},
];
let cowPost = "";
let cowPostList = "";
// serve homepage with existing posts and form
server.get("/", (request, response) => {
cowPostList = "";
postsArray.forEach((post) => {
cowPost = `<li>
<div>
<p> ${post.time} </p>
<p> ${post.date} </p>
<p>🐮 Username: ${post["user-name"]}</p>
<p>🔔 Message: ${post["message"]} </p>
</div>
<form action="/delete-posts" method="POST">
<button name="${post["user-name"]}" value="${
post["message"]
}">Delete me! 💩</button>
</form>
</li>`;
cowPostList += cowPost;
});
const form = `<form method="POST">
<label for="user-name">Username</label>
<input required id="user-name" type="text" name="user-name" />
<label for="message">Cow-post</label>
<textarea required id="message" type="text" name="message"></textarea>
<input required value="Send cow-post! 🤠" type="submit" />
</form>`;
const html = `<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Moo-Net</title>
<link rel="stylesheet" type="text/css" href="/style.css" />
<link rel="icon" type="image/png" href="/moonet-logo.png" />
</head>
<body>
<h1>Moo-net</h1>
<img src="/moonet-logo.png" alt="moon-net cow logo">
<h2>A blog site like no udder!</h2>
<section>
${form}</section>
<ul>${cowPostList}</ul>
<footer>Support us!</footer>
</body>
</html>`;
response.send(html);
});
// get body parser to parse request body
const bodyParser = express.urlencoded();
// create new cowPost from user post
// add cowPost to the postsArray
server.post("/", bodyParser, (request, response) => { let cowPostObj = Object.assign({}, request.body);
cowPostObj.message.replace(/>/g, "<");
cowPostObj.date = getCurrDate();
cowPostObj.time = getCurrTime();
postsArray.unshift(cowPostObj);
response.redirect("/");
});
server.post("/delete-posts", bodyParser, (request, response) => {
const userName = Object.keys(request.body)[0];
const message = Object.values(request.body)[0];
postsArray = postsArray.filter((post) => {
// get all the users messages that are not equal to the current user name
if (post["user-name"] === userName && post["message"] !== message) {
return post;
}
// return all messages that do not have the same user
if (post["user-name"] !== userName) {
return post;
}
});
response.redirect("/");
});
server.use((request, response) => {
const htmlError = `<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Moo-Net</title>
<link rel="stylesheet" type="text/css" href="/404.css" />
</head>
<body>
<h1>Moo! This page is not found</h1>
</body>
</html>`;
response.status(404).send(htmlError);
});
function getCurrDate() {
const date = new Date();
return date.toLocaleString('en-GB', {year: "numeric", month: "2-digit", day: "2-digit"});
}
function getCurrTime() {
const date = new Date();
return date.toLocaleString("en-GB", {hour: "2-digit", minute: "2-digit"});
}
const PORT = process.env.PORT || 3000;
server.listen(PORT, () => console.log(`listening on ${PORT}`));