146 lines
5.7 KiB
Text
146 lines
5.7 KiB
Text
<html>
|
|
<head>
|
|
<meta name="viewport" content="width=device-width height=device-height initial-scale=1">
|
|
<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.`%>" />
|
|
<title><%=post.title%> - <%=webname%></title>
|
|
<style>
|
|
html {
|
|
background-color: #202020;
|
|
color: #cccccc;
|
|
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;
|
|
}
|
|
|
|
post .content a {
|
|
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;
|
|
}
|
|
|
|
h6 {
|
|
margin: 0;
|
|
padding-top: 5px;
|
|
display: block;
|
|
}
|
|
|
|
pre {
|
|
overflow-x: scroll;
|
|
}
|
|
|
|
pre.inline {
|
|
display: inline;
|
|
}
|
|
|
|
button {
|
|
padding: 10px;
|
|
border-radius: 3px;
|
|
border: 1px solid #000000;
|
|
background-color: #000000;
|
|
color: #ffffff;
|
|
}
|
|
|
|
textarea {
|
|
min-height: 25vh;
|
|
width: 100%;
|
|
color: #ffffff;
|
|
background-color: #303040;
|
|
border: 3px solid #000000;
|
|
}
|
|
|
|
input {
|
|
color: #ffffff;
|
|
background-color: #303040;
|
|
border: 3px solid #000000;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<a style="position: fixed; bottom: 10px; right: 10px;" href="/"><button type="button">Home</button></a>
|
|
<div class="posts">
|
|
<%- (function(){
|
|
let ret = ''
|
|
let mainPost = post
|
|
let id = ''
|
|
function recurse(post) {
|
|
|
|
const makeForm = id == comment || postid == -1
|
|
const date = post.timestamp ? new Date(post.timestamp) : null
|
|
ret +=
|
|
`<post><div class="content">${date ? (`<h6>${date.toUTCString()}</h6>`) : ''}<h3>${post.author.replaceAll('<','<').replaceAll('>','>')}: ${post.title.replaceAll('<','<').replaceAll('>','>')}</h3>` +
|
|
post.content.replaceAll('<','<').replaceAll('>','>')
|
|
.replaceAll('[* ', '<i>').replaceAll(' *]', '</i>')
|
|
.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>')
|
|
.replaceAll('["\n', '<pre>').replaceAll('\n"]', '</pre>')
|
|
.replaceAll('["" \n', '<pre>').replaceAll('\n ""]', '</pre>')
|
|
.replaceAll('\n', '<br/>')
|
|
.replaceAll(/(https?:\/\/[^ \n]+)/g, '<a href="$1" target="blank">$1</a>')
|
|
if (postid != -1 || id == '') {
|
|
if(makeForm) {
|
|
if(postid != -1)
|
|
ret += `<a href="/post/${postid}">[Nevermind]</a>`
|
|
ret +=
|
|
`</div><post><div class="content"><form><label>` +
|
|
`<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>` +
|
|
`</label></form></div></post>`
|
|
}
|
|
else
|
|
ret += `<a href="/comment/${postid}/${id}">[Reply]</a> </div>`
|
|
}
|
|
else
|
|
ret += `<a href="/post/${id}">[Open]</a></div>`
|
|
for(let i = post.comments.length - 1; i >= 0; i--) {
|
|
const pid = id
|
|
id += i + '_'
|
|
recurse(post.comments[i])
|
|
id = pid
|
|
}
|
|
ret += '</post>'
|
|
}
|
|
|
|
recurse(post)
|
|
return ret
|
|
})() %>
|
|
</div>
|
|
<body>
|
|
<html>
|