theforum/views/post.ejs

153 lines
6 KiB
Text
Raw Normal View History

2022-01-17 08:04:31 +01:00
<html>
<head>
2022-01-17 11:30:55 +01:00
<meta name="viewport" content="width=device-width height=device-height initial-scale=1">
2022-01-17 21:00:47 +01:00
<meta property="og:site_name" content="<%=webname%>" />
<meta property="og:title" content="<%=post.title.replaceAll('"','')%>" />
<meta property="og:description" content="<%=`A post by ${post.author.replaceAll('"','')} with ${post.comments.length} comments.`%>" />
2022-01-17 08:04:31 +01:00
<title><%=post.title%> - <%=webname%></title>
<style>
html {
background-color: #202020;
2022-01-17 12:14:04 +01:00
color: #cccccc;
2022-01-17 08:04:31 +01:00
font-family: sans-serif;
}
a {
color: #ffffff;
text-decoration: none;
}
div.posts {
margin: auto;
display: block;
width: fit-content;
}
post .content {
max-width: min(70vw, max(50vw, 100em));
background-color: #202030;
display: block;
padding: 0 5px 5px 5px;
border: 1px solid #808080;
}
2022-01-19 09:08:36 +01:00
post .content .controls {
2022-01-17 08:04:31 +01:00
display: block;
text-align: right;
}
post {
display: block;
margin-left: 5px;
padding-left: 5px;
border-left: 2px solid #808080;
padding-bottom: 5px;
padding-top: 5px;
}
h3 {
display: block;
margin-top: 5px;
}
2022-01-17 17:58:18 +01:00
h6 {
2022-01-17 17:59:31 +01:00
margin: 0;
padding-top: 5px;
2022-01-17 17:58:18 +01:00
display: block;
}
2022-01-17 08:04:31 +01:00
pre {
overflow-x: scroll;
}
pre.inline {
display: inline;
}
button {
padding: 10px;
border-radius: 3px;
border: 1px solid #000000;
background-color: #000000;
color: #ffffff;
}
2022-01-17 11:37:59 +01:00
textarea {
min-height: 25vh;
2022-01-17 15:13:31 +01:00
width: 100%;
2022-01-17 15:44:46 +01:00
color: #ffffff;
2022-01-17 15:48:48 +01:00
background-color: #303040;
border: 3px solid #000000;
2022-01-17 15:44:46 +01:00
}
input {
color: #ffffff;
2022-01-17 15:48:48 +01:00
background-color: #303040;
border: 3px solid #000000;
2022-01-17 11:37:59 +01:00
}
2022-01-19 16:37:28 +01:00
block {
display: block;
}
2022-01-17 08:04:31 +01:00
</style>
</head>
<body>
2022-01-19 16:36:44 +01:00
<%-email ? `<block style="text-align: center; width: 100%;">Please send any inquiries to ${email}.</block><br/>` : ''%>
2022-01-17 10:59:34 +01:00
<a style="position: fixed; bottom: 10px; right: 10px;" href="/"><button type="button">Home</button></a>
2022-01-17 08:04:31 +01:00
<div class="posts">
<%- (function(){
2022-01-17 09:18:39 +01:00
let ret = ''
2022-01-17 08:04:31 +01:00
let mainPost = post
2022-01-17 10:38:09 +01:00
let id = ''
2022-01-17 08:04:31 +01:00
function recurse(post) {
const makeForm = id == comment || postid == -1
2022-01-17 17:53:00 +01:00
const date = post.timestamp ? new Date(post.timestamp) : null
2022-01-17 09:16:01 +01:00
ret +=
2022-01-17 17:53:00 +01:00
`<post><div class="content">${date ? (`<h6>${date.toUTCString()}</h6>`) : ''}<h3>${post.author.replaceAll('<','&lt;').replaceAll('>','&gt;')}: ${post.title.replaceAll('<','&lt;').replaceAll('>','&gt;')}</h3>` +
2022-01-17 08:04:31 +01:00
post.content.replaceAll('<','&lt;').replaceAll('>','&gt;')
.replaceAll('[* ', '<i>').replaceAll(' *]', '</i>')
2022-01-19 07:42:10 +01:00
.replaceAll(/(https?:\/\/[^ \n]+)/g, '<a href="$1" target="_blank">$1</a>')
2022-01-17 08:04:31 +01:00
.replaceAll('[** ', '<b>').replaceAll(' **]', '</b>')
.replaceAll('[*** ', '<b><i>').replaceAll(' ***]', '</i></b>')
.replaceAll('[_ ', '<u>').replaceAll(' _]', '</u>')
.replaceAll('[*_ ', '<i><u>').replaceAll(' _*]', '</u></i>')
.replaceAll('[**_ ', '<b><u>').replaceAll(' _**]', '</u></b>')
.replaceAll('[***_ ', '<b><i><u>').replaceAll(' _***]', '</u></i></b>')
.replaceAll('[" ', '<pre class="inline">').replaceAll(' "]', '</pre>')
2022-01-17 20:22:33 +01:00
.replaceAll('["\n', '<pre>').replaceAll('\n"]', '</pre>')
.replaceAll('["" \n', '<pre>').replaceAll('\n ""]', '</pre>')
.replaceAll('\n', '<br/>')
2022-01-19 09:08:36 +01:00
ret += '<div class="controls">'
2022-01-17 10:38:09 +01:00
if (postid != -1 || id == '') {
2022-01-17 08:04:31 +01:00
if(makeForm) {
if(postid != -1)
2022-01-19 09:08:36 +01:00
ret += `<a href="/post/${postid}">[Nevermind]</a>`
2022-01-17 09:16:01 +01:00
ret +=
2022-01-19 12:32:19 +01:00
`</div></div><post><div class="content"><form><label>` +
2022-01-17 18:23:34 +01:00
`<h3><input type="username" name="name" value="Anonymous" required>: <input type="text" name="title" placeholder="Title" required></h3>` +
`<textarea name="content" placeholder="So basically, ..." required></textarea><br/><br/><button type="submit">Submit</button>` +
2022-01-19 12:32:19 +01:00
`</label></form></div></post><div>`
2022-01-17 08:04:31 +01:00
}
else
2022-01-19 09:08:36 +01:00
ret += `<a href="/comment/${postid}/${id}">[Reply]</a> </div>`
2022-01-17 08:04:31 +01:00
}
else
2022-01-19 09:08:36 +01:00
ret += `<a href="/post/${id}">[Open]</a></div>`
ret += '</div>'
2022-01-17 10:38:09 +01:00
for(let i = post.comments.length - 1; i >= 0; i--) {
const pid = id
id += i + '_'
2022-01-17 09:31:53 +01:00
recurse(post.comments[i])
2022-01-17 10:38:09 +01:00
id = pid
2022-01-17 08:04:31 +01:00
}
2022-01-17 09:16:01 +01:00
ret += '</post>'
2022-01-17 08:04:31 +01:00
}
2022-01-17 09:17:52 +01:00
recurse(post)
2022-01-17 09:31:53 +01:00
return ret
2022-01-17 08:04:31 +01:00
})() %>
</div>
<body>
<html>