diff options
Diffstat (limited to 'static')
-rw-r--r-- | static/bottom.html | 7 | ||||
-rw-r--r-- | static/faq.html | 2 | ||||
-rw-r--r-- | static/index.html | 15 | ||||
-rw-r--r-- | static/js/footerscript.js | 4 | ||||
-rw-r--r-- | static/js/posts.js | 66 | ||||
-rw-r--r-- | static/main.html | 20 | ||||
-rw-r--r-- | static/manage.html | 49 | ||||
-rw-r--r-- | static/nadmin.html | 37 | ||||
-rw-r--r-- | static/ncatalog.html | 47 | ||||
-rw-r--r-- | static/notfound.png | bin | 0 -> 96599 bytes | |||
-rw-r--r-- | static/npost.html | 17 | ||||
-rw-r--r-- | static/nposts.html | 11 | ||||
-rw-r--r-- | static/posts.html | 66 | ||||
-rw-r--r-- | static/sensitive.png | bin | 0 -> 3737 bytes | |||
-rw-r--r-- | static/top.html | 1 |
15 files changed, 232 insertions, 110 deletions
diff --git a/static/bottom.html b/static/bottom.html index c058b14..28750c8 100644 --- a/static/bottom.html +++ b/static/bottom.html @@ -1,16 +1,17 @@ {{ define "bottom" }} -<div id="reply-box" class="popup-box" style="display: none; "> +<div id="reply-box" class="popup-box" style="display: none;"> <div id="reply-header" style="display: inline-block; width: 370px; z-index: 0; cursor: move;"></div><div id="reply-close" style="display: inline-block; float: right;"><a href="javascript:closeReply()">[X]</a></div> <form id="reply-post" action="/post" method="post" enctype="multipart/form-data"> <input id="reply-name" name="name" size="43" type="text" placeholder="Name" maxlength="100"> <input id="reply-options" name="options" size="43" type="text" placeholder="Options" maxlength="100"> <textarea id="reply-comment" name="comment" rows="12" cols="54" style="width: 396px;" maxlength="2000"></textarea> <input id="reply-file" name="file" type="file"> - <input id="reply-submit" type="submit" value="Reply" style="float: right;"> + <input id="reply-submit" type="submit" value="Reply" style="float: right;"><br><br> <input type="hidden" id="inReplyTo-box" name="inReplyTo" value="{{ .Board.InReplyTo }}"> <input type="hidden" id="sendTo" name="sendTo" value="{{ .Board.To }}"> <input type="hidden" id="boardName" name="boardName" value="{{ .Board.Name }}"> <input type="hidden" id="captchaCode" name="captchaCode" value="{{ .Board.CaptchaCode }}"> + <input type="checkbox" name="sensitive"><span>Mark attachment as sensitive</span><br><br> <div style="width: 202px; margin: 0 auto; padding-top: 12px;"> <label for="captcha">Captcha:</label><br> <input style="display: inline-block;" type="text" id="captcha" name="captcha" autocomplete="off"><br> @@ -29,7 +30,7 @@ <input id="report-submit" type="submit" value="Report" style="float: right;"> <input type="hidden" id="report-inReplyTo-box" name="id" value="{{ .Board.InReplyTo }}"> <input type="hidden" id="sendTo" name="sendTo" value="{{ .Board.To }}"> - <input type="hidden" id="boardName" name="boardName" value="{{ .Board.Name }}"> + <input type="hidden" id="boardName" name="board" value="{{ .Board.Name }}"> <input type="hidden" name="close" value="0"> <input type="hidden" id="captchaCode" name="captchaCode" value="{{ .Board.CaptchaCode }}"> <div style="width: 202px; margin: 0 auto; padding-top: 12px;"> diff --git a/static/faq.html b/static/faq.html index 66c053d..4398466 100644 --- a/static/faq.html +++ b/static/faq.html @@ -20,7 +20,7 @@ <p>click on "No." next to a post to view its thread.</p> <h4>Uploading files</h4> - <p>max file size is 7MB. the supported file types are "image/gif","image/jpeg","image/png","image/svg+xml","image/webp","image/avif","image/apng","video/mp4","video/ogg","video/webm","audio/mpeg","audio/ogg","audio/wav", "audio/wave", "audio/x-wav". these were choosen based on browser support for embeding.</p> + <p>max file size is 7MB. the supported file types are "image/gif","image/jpeg","image/png","image/webp","image/apng","video/mp4","video/ogg","video/webm","audio/mpeg","audio/ogg","audio/wav","audio/wave","audio/x-wav". these were choosen based on browser support for embeding.</p> <h4>JavaScript why?</h4> <p>a version of the client with no javascript will be made eventually. current version requires it, because of basic functionality needed. no libraries or frameworks for javascript is used besides ECMAScript, just basic selection of DOM elements and modifying their styling. maybe someone would be willing to make a client that uses no javascript.</p> diff --git a/static/index.html b/static/index.html index 2840a83..1cd206b 100644 --- a/static/index.html +++ b/static/index.html @@ -1,4 +1,19 @@ {{ define "header" }} +<title>{{ .Title }}</title> +<meta name="description" content="{{ .Message }}"> + +<meta property="og:locale" content="en_US" /> +<meta property="og:type" content="website" /> +<meta property="og:url" content="{{ .Board.Domain }}"> +<meta property="og:site_name" content="{{ .Board.Actor.PreferredUsername }}" /> + +<meta property="og:title" content="{{ .Title }}"> +<meta property="og:description" content="{{ .Message }}"> + +<meta name="twitter:title" content="{{ .Title }}"> +<meta name="twitter:description" content="{{ .Message }}"> +<meta name="twitter:card" content="summary_large_image"> + {{ end }} {{ define "top" }}{{ end }} diff --git a/static/js/footerscript.js b/static/js/footerscript.js index b68c3b4..a63f422 100644 --- a/static/js/footerscript.js +++ b/static/js/footerscript.js @@ -3,6 +3,10 @@ var imgArray = [].slice.call(imgs); imgArray.forEach(function(img, i){ img.addEventListener("click", function(e){ + var id = img.getAttribute("id") + var media = document.getElementById("media-" + id) + var sensitive = document.getElementById("sensitive-" + id) + if(img.getAttribute("enlarge") == "0") { var attachment = img.getAttribute("attachment") diff --git a/static/js/posts.js b/static/js/posts.js index 592a35d..06aab77 100644 --- a/static/js/posts.js +++ b/static/js/posts.js @@ -26,6 +26,8 @@ function shortURL(actorName, url) { re = /.+\//g; temp = re.exec(url) + + var output if(stripTransferProtocol(temp[0]) == stripTransferProtocol(actorName) + "/") { @@ -39,11 +41,8 @@ function shortURL(actorName, url) re = /\w+$/g; - u = re.exec(short); - - return u; + output = re.exec(short); }else{ - var short = url.replace("https://", ""); short = short.replace("http://", ""); short = short.replace("www.", ""); @@ -64,10 +63,10 @@ function shortURL(actorName, url) v = re.exec(str) - v = "f" + v[0] + "-" + u - - return v; + output = "f" + v[0] + "-" + u } + + return output } function shortImg(url) @@ -113,7 +112,7 @@ function getBoardId(url) function convertContent(actorName, content, opid) { - var re = /(>>)(https:\/\/|http:\/\/)?(www\.)?.+\/\w+/gm; + var re = /(>>)(https?:\/\/)?(www\.)?.+\/\w+/gm; var match = content.match(re); var newContent = content; if(match) @@ -125,23 +124,60 @@ function convertContent(actorName, content, opid) { isOP = " (OP)"; } - - newContent = newContent.replace(quote, '<a class="reply" title="' + link + '" href="'+ (actorName) + "/" + shortURL(actorName, opid) + '#' + shortURL(actorName, link) + '";">>>' + shortURL(actorName, link) + isOP + '</a>'); + + var q = link + + if(document.getElementById(link + "-content") != null) { + q = document.getElementById(link + "-content").innerText; + q = q.replaceAll('>', '/\>') + q = q.replaceAll('"', '') + q = q.replaceAll("'", "") + } + newContent = newContent.replace(quote, '<a class="reply" title="' + q + '" href="'+ (actorName) + "/" + shortURL(actorName, opid) + '#' + shortURL(actorName, link) + '";">>>' + shortURL(actorName, link) + isOP + '</a>'); }) } - re = /^>.+/gm; + re = /^(\s+)?>.+/gm; match = newContent.match(re); if(match) { match.forEach(function(quote, i) { + newContent = newContent.replace(quote, '<span class="quote">' + quote + '</span>'); }) } - return newContent + return newContent.replaceAll('/\>', '>') +} + +function convertContentNoLink(actorName, content, opid) +{ + var re = /(>>)(https?:\/\/)?(www\.)?.+\/\w+/gm; + var match = content.match(re); + var newContent = content; + if(match) + { + match.forEach(function(quote, i){ + var link = quote.replace('>>', '') + var isOP = "" + if(link == opid) + { + isOP = " (OP)"; + } + + var q = link + + if(document.getElementById(link + "-content") != null) { + q = document.getElementById(link + "-content").innerText; + } + + newContent = newContent.replace(quote, '>>' + shortURL(actorName, link) + isOP); + }) + } + newContent = newContent.replaceAll("'", "") + return newContent.replaceAll('"', '') } function closeReply() @@ -184,11 +220,11 @@ function quote(actorName, opid, id) if(id == "reply") { var h = document.getElementById(id + "-content").offsetTop - 548; } else { - var h = document.getElementById(id + "-content").offsetTop - 448; + var h = document.getElementById(id + "-content").offsetTop - 348; } - box.setAttribute("style", "display: block; position: absolute; width: 400px; height: 550px; z-index: 9; top: " + h + "px; left: " + w + "px; padding: 5px;"); + box.setAttribute("style", "display: block; position: absolute; width: 400px; height: 600px; z-index: 9; top: " + h + "px; left: " + w + "px; padding: 5px;"); if (inReplyTo.value != opid) @@ -212,7 +248,7 @@ function report(actorName, id) var inReplyTo = document.getElementById("report-inReplyTo-box"); var w = window.innerWidth / 2 - 200; - var h = document.getElementById(id + "-content").offsetTop - 448; + var h = document.getElementById(id + "-content").offsetTop - 348; box.setAttribute("style", "display: block; position: absolute; width: 400px; height: 480px; z-index: 9; top: " + h + "px; left: " + w + "px; padding: 5px;"); diff --git a/static/main.html b/static/main.html index 5c39a40..91d8344 100644 --- a/static/main.html +++ b/static/main.html @@ -1,10 +1,13 @@ {{ define "layout" }} <!DOCTYPE html> <html> - <meta name="viewport" content="width=device-width, initial-scale=1"> <head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <meta name="keywords" content="Federated Imageboard based on Activtypub"> + <meta property="og:locale" content="en_US" /> + <meta property="og:type" content="website" /> <link rel="icon" type="image/png" href="/static/favicon.png"> - <title>{{ .Title }}</title> <style> a, a:link, a:visited, a:hover, a:active { text-decoration: none @@ -19,7 +22,7 @@ } body { - {{ if .Board.Post.Actor.Restricted }} + {{ if .Board.Restricted }} background-color: #eef2fe; color: black; {{ else }} @@ -29,7 +32,7 @@ } .popup-box { - {{ if .Board.Post.Actor.Restricted }} + {{ if .Board.Restricted }} border: 4px solid #d3caf0; background-color: #eff5ff; {{ else }} @@ -43,7 +46,7 @@ } .reply { - {{ if .Board.Post.Actor.Restricted }} + {{ if .Board.Restricted }} color:#af0a0f; {{ else }} color:#000080; @@ -51,7 +54,7 @@ } .post { - {{ if .Board.Post.Actor.Restricted }} + {{ if .Board.Restricted }} background-color: #d5daf0; {{ else }} background-color: #f0e0d6; @@ -59,12 +62,15 @@ } :target > div > .post { - {{ if .Board.Post.Actor.Restricted }} + {{ if .Board.Restricted }} background-color: #d6bad0; {{ else }} background-color: #f0c0b0; {{ end }} } + .tripcode { + color: #117743; + } </style> {{ template "header" . }} </head> diff --git a/static/manage.html b/static/manage.html index 570c0f5..4fb417f 100644 --- a/static/manage.html +++ b/static/manage.html @@ -9,10 +9,10 @@ <!-- <div><a href="/{{ .Key }}/deleteboard?name={{ .Board.Name }}">[Delete Board]</a></div> --> <ul style="display: inline-block; padding: 0;"> {{ if .IsLocal }} - <li style="display: inline-block;"><a href="javascript:show('following')">[ Subscribed ]</a></li> - <li style="display: inline-block;"><a href="javascript:show('followers')">[ Subscribers ]</a></li> + <li style="display: inline-block;"><a href="#following">[ Subscribed ]</a></li> + <li style="display: inline-block;"><a href="#followers">[ Subscribers ]</a></li> {{ end }} - <li style="display: inline-block;"><a href="javascript:show('reported')">[ Reported ]</a></li> + <li style="display: inline-block;"><a href="#reported">[ Reported ]</a></li> </ul> </div> <a href="/{{ .Board.Name }}">[Return]</a> @@ -20,25 +20,24 @@ {{ $board := .Board }} {{ $key := .Key }} {{ if .IsLocal }} -<div id="following"> - <h4>Subscribed</h4> + +<div id="following" class="popup-box" style="margin-bottom: 25px; margin-top: 5px; padding: 12px;"> + <h4 style="margin: 0; margin-bottom: 5px;">Subscribed</h4> <form id="follow-form" action="/{{ .Key }}/{{ .Board.Name }}/follow" method="post" enctype="application/x-www-form-urlencoded"> - <label>Subscribe:</label><br> - <input id="follow" name="follow" style="margin-bottom: 12px;" placeholder="https://server.fchan.xyz/g"></input> + <input id="follow" name="follow" style="margin-bottom: 12px;" placeholder="https://fchan.xyz/g"></input> <input type="submit" value="Subscribe"><br> <input type="hidden" name="actor" value="{{ $board.Actor.Id }}"> - </form> - <ul style="display: inline-block; padding: 0; margin: 0;"> - + </form> + <ul style="display: inline-block; padding: 0; margin: 0; list-style-type: none;"> {{ range .Following }} <li><a href="/{{ $key }}/{{ $board.Name }}/follow?follow={{ . }}&actor={{ $actor }}">[Unsubscribe]</a><a href="{{ . }}">{{ . }}</a></li> {{ end }} </ul> </div> -<div id="followers" style="display: none;"> - <h4>Subscribers</h4> - <ul style="display: inline-block; padding: 0; margin: 0;"> +<div id="followers" class="popup-box" style="margin-bottom: 25px; padding: 12px;"> + <h4 style="margin: 0; margin-bottom: 5px;">Subscribers</h4> + <ul style="display: inline-block; padding: 0; margin: 0; list-style-type: none;"> {{ range .Followers }} <li><a href="{{ . }}">{{ . }}</a></li> {{ end }} @@ -46,13 +45,12 @@ </div> {{ end }} -<div id="reported" style="display: none;"> - <h4>Reported</h4> - <ul style="display: inline-block; padding: 0; margin: 0;"> - +<div id="reported" class="popup-box" style="margin-bottom: 25px; padding: 12px;"> + <h4 style="margin: 0; margin-bottom: 5px;">Reported</h4> + <ul style="display: inline-block; padding: 0; margin: 0; list-style-type: none;"> {{ $domain := .Domain }} {{ range .Reported }} - <li><a id="rpost" post="{{ .ID }}" href=""></a> - <b>{{ .Count }}</b> <a href="/delete?id={{ .ID }}&board={{ $board.Name }}">[Remove Post]</a> <a href="/deleteattach?id={{ .ID }}">[Remove Attachment]</a> <a href="/report?id={{ .ID }}&close=1&board={{ $board.Name }}">[Close]</a></li> + <li><a id="rpost" post="{{ .ID }}" href=""></a> - <b>{{ .Count }}</b> <a href="/delete?id={{ .ID }}&board={{ $board.Name }}&manage=t">[Remove Post]</a> <a href="/deleteattach?id={{ .ID }}&board={{ $board.Name }}&manage=t">[Remove Attachment]</a> <a href="/report?id={{ .ID }}&close=1&board={{ $board.Name }}">[Close]</a></li> {{ end }} </ul> </div> @@ -61,21 +59,6 @@ {{ define "script" }} <script> - function show(element) - { - {{ if .IsLocal }} - var following = document.getElementById("following"); - var followers = document.getElementById("followers"); - following.style.display = "none"; - followers.style.display = "none"; - {{ end }} - - var reported = document.getElementById("reported"); - reported.style.display = "none"; - - document.getElementById(element).style.display = "block"; - } - var reported = document.querySelectorAll('#rpost'); var reportedArray = [].slice.call(reported); diff --git a/static/nadmin.html b/static/nadmin.html index 0583efc..984eb76 100644 --- a/static/nadmin.html +++ b/static/nadmin.html @@ -19,20 +19,19 @@ </form> <ul style="display: inline-block; padding: 0;"> - <li style="display: inline-block;"><a href="javascript:show('following')">Subscribed</a></li> + <li style="display: inline-block;"><a href="#following">Subscribed</a></li> <!-- <li style="display: inline-block;"><a href="javascript:show('followers')">Followers</a></li> --> - <li style="display: inline-block;"><a href="javascript:show('reported')">Reported</a></li> + <li style="display: inline-block;"><a href="#reported">Reported</a></li> </ul> </div> -<div id="following"> - <h4>Following</h4> +<div id="following" class="popup-box" style="margin-bottom: 25px; padding: 12px;"> + <h4 style="margin: 0; margin-bottom: 5px;">Subscribed</h4> <form id="follow-form" action="/{{ .Key }}/follow" method="post" enctype="application/x-www-form-urlencoded"> - <label>Subscribe:</label><br> <input id="follow" name="follow" style="margin-bottom: 12px;" placeholder="http://localhost:3000/g"></input><input type="submit" value="Subscribe"><br> <input type="hidden" name="actor" value="{{ .Actor }}"> </form> - <ul style="display: inline-block; padding: 0; margin: 0;"> + <ul style="display: inline-block; padding: 0; margin: 0; list-style-type: none;"> {{ $actor := .Actor }} {{ $key := .Key }} {{ range .Following }} @@ -41,36 +40,22 @@ </ul> </div> -<div id="followers" style="display: none;"> - <h4>Followers</h4> - <ul style="display: inline-block; padding: 0; margin: 0;"> +<div id="followers" class="popup-box" style="margin-bottom: 25px; padding: 12px; display:none;"> + <h4 style="margin: 0; margin-bottom: 5px;">Followers</h4> + <ul style="display: inline-block; padding: 0; margin: 0; list-style-type: none;"> {{ range .Followers }} <li><a href="http://localhost:3000/g">{{ . }}</a></li> {{ end }} </ul> </div> -<div id="reported" style="display: none;"> - <h4>Reported</h4> - <ul style="display: inline-block; padding: 0; margin: 0;"> +<div id="reported" class="popup-box" style="margin-bottom: 25px; padding: 12px;"> + <h4 style="margin: 0; margin-bottom: 5px;">Reported</h4> + <ul style="display: inline-block; padding: 0; margin: 0; list-style-type: none;"> </ul> </div> {{ end }} {{ define "bottom" }}{{ end }} {{ define "script" }} -<script> - function show(element) - { - var following = document.getElementById("following"); - // var followers = document.getElementById("followers"); - var reported = document.getElementById("reported"); - - following.style.display = "none"; - // followers.style.display = "none"; - reported.style.display = "none"; - - document.getElementById(element).style.display = "block"; - } -</script> {{ end }} diff --git a/static/ncatalog.html b/static/ncatalog.html index 81d31f3..deb8e27 100644 --- a/static/ncatalog.html +++ b/static/ncatalog.html @@ -1,4 +1,16 @@ {{ define "header" }} +<title>/{{ .Board.Name }}/ - catalog</title> +<meta name="description" content="{{ .Board.Summary }}"> +<meta property="og:url" content="{{ .Board.Actor.Id }}"> +<meta property="og:site_name" content="{{ .Instance.PreferredUsername }}" /> + +<meta property="og:title" content="{{ .Title }}"> +<meta property="og:description" content="{{ .Board.Summary }}"> + +<meta name="twitter:title" content="{{ .Title }}"> +<meta name="twitter:description" content="{{ .Board.Summary }}"> +<meta name="twitter:card" content="summary_large_image"> + <script src="/static/js/posts.js"></script> {{ end }} @@ -16,19 +28,36 @@ {{ range .Posts }} <div style="overflow: hidden; vertical-align: top; padding-right: 24px; padding-bottom: 24px; display: inline-block; width: 180px; max-height: 320px; margin-bottom: 10px;"> {{ if eq $board.ModCred $board.Domain $board.Actor.Id }} - <a href="/delete?id={{ .Id }}">[Delete Post]</a> + <a href="/delete?id={{ .Id }}&board={{ $board.Actor.Name }}">[Delete Post]</a> {{ end }} {{ if .Attachment }} {{ if eq $board.ModCred $board.Domain $board.Actor.Id }} - <a href="/deleteattach?id={{ .Id }}">[Delete Attachment]</a> + <a href="/deleteattach?id={{ .Id }}&board={{ $board.Actor.Name }}">[Delete Attachment]</a> + <a href="/marksensitive?id={{ .Id }}&board={{ $board.Actor.Name }}">[Mark Sensitive]</a> {{ end }} - <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/"> + + {{ if and .Sensitive $board.Actor.Restricted }} + <div id="hide-{{ .Id }}" style="display: none;">[Hide]</div> + <div id="sensitive-{{ .Id }}" style="display: none;"><div style="position: relative; text-align: center;"><img style="float: left; margin-right: 10px; margin-bottom: 10px; max-width: 180px; max-height: 180px;" src="/static/sensitive.png"><div style="width: 170px; position: absolute; margin-top: 75px; padding: 5px; background-color: black; color: white; cursor: default; ">NSFW Content</div></div></div> + {{ end }} + <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/"> <div id="media-{{ .Id }}" style="width:180px;"></div> + </a> <script> media = document.getElementById("media-{{ .Id }}") + + if({{ .Sensitive }} && {{ $board.Actor.Restricted }}){ + sensitive = document.getElementById("sensitive-{{ .Id }}") + hide = document.getElementById("hide-{{ .Id }}") + sensitive.onclick = function(){document.getElementById("media-{{ .Id }}").style="display: block;"; document.getElementById("sensitive-{{ .Id }}").style="display: none;"; document.getElementById("hide-{{ .Id }}").style="display: block; cursor: pointer;"} + hide.onclick = function(){document.getElementById("media-{{ .Id }}").style="display: none;"; document.getElementById("sensitive-{{ .Id }}").style="display: block;"; document.getElementById("hide-{{ .Id }}").style="display: none;"} + sensitive.style = "display: block" + media.style = "display: none;" + } + if(getMIMEType({{ (index .Attachment 0).MediaType }}) == "image"){ var img = document.createElement("img"); - img.style = "max-width: 180px; max-height: 180px; cursor: move;" + img.style = "max-width: 180px; max-height: 180px;" img.setAttribute("id", "img") img.setAttribute("main", "1") img.setAttribute("src", "{{ (index .Attachment 0).Href }}") @@ -56,9 +85,12 @@ video.style = "margin-right: 10px; margin-bottom: 10px; max-width: 180px; max-height: 180px;" video.innerText = 'Video is not supported.' media.appendChild(video) - } + } + + document.getElementById("{{ .Id }}-anchor").href = "/{{ $board.Name }}/" + shortURL("{{$board.Actor.Id}}", "{{ .Id }}") </script> {{ end }} + <a id="{{ .Id }}-link" href="/{{ $board.Name }}/"> <div> {{ $replies := .Replies }} {{ if $replies }} @@ -71,12 +103,11 @@ {{ if .Content }} <span style="display: block">{{.Content}}</span> {{ end }} - </div> - </a> + </a> </div> <script> - document.getElementById("{{ .Id }}-anchor").href = "/{{ $board.Name }}/" + shortURL("{{$board.Actor.Id}}", "{{ .Id }}") + document.getElementById("{{ .Id }}-link").href = "/{{ $board.Name }}/" + shortURL("{{$board.Actor.Id}}", "{{ .Id }}") </script> {{ end }} </div> diff --git a/static/notfound.png b/static/notfound.png Binary files differnew file mode 100644 index 0000000..1253e47 --- /dev/null +++ b/static/notfound.png diff --git a/static/npost.html b/static/npost.html index b91b795..740018b 100644 --- a/static/npost.html +++ b/static/npost.html @@ -1,4 +1,21 @@ {{ define "header" }} +<title>/{{ .Board.Name }}/ - {{ .PostId }}</title> +<meta name="description" content="{{ (index .Posts 0).Content }}"> +<meta property="og:url" content="{{ (index .Posts 0).Id }}"> +<meta property="og:site_name" content="{{ .Instance.PreferredUsername }}" /> + +<meta property="og:title" content="{{ (index .Posts 0).Name }}"> +<meta property="og:description" content="{{ (index .Posts 0).Content }}"> + +<meta name="twitter:title" content="{{ (index .Posts 0).Name }}"> +<meta name="twitter:description" content="{{ (index .Posts 0).Content }}"> +<meta name="twitter:card" content="summary_large_image"> + +{{ if (index .Posts 0).Preview }} +<meta property="og:image" content="{{ (index .Posts 0).Preview.Href }}" /> +<meta name="twitter:image" content="{{ (index .Posts 0).Preview.Href }}" /> +{{ end }} + <script src="/static/js/posts.js"></script> {{ end }} diff --git a/static/nposts.html b/static/nposts.html index 173f175..d106f74 100644 --- a/static/nposts.html +++ b/static/nposts.html @@ -1,4 +1,15 @@ {{ define "header" }} +<title>{{ .Title }}</title> +<meta name="description" content="{{ .Board.Summary }}"> +<meta property="og:url" content="{{ .Board.Actor.Id }}"> +<meta property="og:site_name" content="{{ .Instance.PreferredUsername }}" /> + +<meta property="og:title" content="{{ .Title }}"> +<meta property="og:description" content="{{ .Board.Summary }}"> + +<meta name="twitter:title" content="{{ .Title }}"> +<meta name="twitter:description" content="{{ .Board.Summary }}"> +<meta name="twitter:card" content="summary_large_image"> <script src="/static/js/posts.js"></script> {{ end }} diff --git a/static/posts.html b/static/posts.html index a32d7c5..1b1d78b 100644 --- a/static/posts.html +++ b/static/posts.html @@ -9,19 +9,32 @@ <div style="overflow: auto;"> <div id="{{ .Id }}" style="overflow: visible; margin-bottom: 12px;"> {{ if eq $board.ModCred $board.Domain $board.Actor.Id }} - <a href="/delete?id={{ .Id }}">[Delete Post]</a> + <a href="/delete?id={{ .Id }}&board={{ $board.Actor.Name }}">[Delete Post]</a> {{ end }} {{ if .Attachment }} {{ if eq $board.ModCred $board.Domain $board.Actor.Id }} - <a href="/deleteattach?id={{ .Id }}">[Delete Attachment]</a> + <a href="/deleteattach?id={{ .Id }}&board={{ $board.Actor.Name }}">[Delete Attachment]</a> + <a href="/marksensitive?id={{ .Id }}&board={{ $board.Actor.Name }}">[Mark Sensitive]</a> {{ end }} <span style="display: block;">File: <a id="{{ .Id }}-img" href="{{ (index .Attachment 0).Href}}">{{ (index .Attachment 0).Name }}</a><span id="{{ .Id }}-size">({{ (index .Attachment 0).Size }})</span></span> + <div id="hide-{{ .Id }}" style="display: none;">[Hide]</div> + <div id="sensitive-{{ .Id }}" style="display: none;"><div style="position: relative; text-align: center;"><img style="float: left; margin-right: 10px; margin-bottom: 10px; max-width: 250px; max-height: 250px;" src="/static/sensitive.png"><div style="width: 240px; position: absolute; margin-top: 110px; padding: 5px; background-color: black; color: white; cursor: default; ">NSFW Content</div></div></div> <div id="media-{{ .Id }}"></div> <script> media = document.getElementById("media-{{ .Id }}") + + if({{ .Sensitive }} && {{ $board.Actor.Restricted }}){ + sensitive = document.getElementById("sensitive-{{ .Id }}") + hide = document.getElementById("hide-{{ .Id }}") + sensitive.onclick = function(){document.getElementById("media-{{ .Id }}").style="display: block;"; document.getElementById("sensitive-{{ .Id }}").style="display: none;"; document.getElementById("hide-{{ .Id }}").style="display: block; cursor: pointer;"} + hide.onclick = function(){document.getElementById("media-{{ .Id }}").style="display: none;"; document.getElementById("sensitive-{{ .Id }}").style="display: block;"; document.getElementById("hide-{{ .Id }}").style="display: none;"} + sensitive.style = "display: block" + media.style = "display: none;" + } + if(getMIMEType({{ (index .Attachment 0).MediaType }}) == "image"){ var img = document.createElement("img"); - img.style = "float: left; margin-right: 10px; margin-bottom: 10px; max-width: 250px; max-height: 250px; cursor: pointer;" + img.style = "float: left; margin-right: 10px; margin-bottom: 10px; max-width: 250px; max-height: 250px;" img.setAttribute("id", "img") img.setAttribute("main", "1") img.setAttribute("enlarge", "0") @@ -60,7 +73,7 @@ } </script> {{ end }} - <span style="color: #0f0c5d;"><b>{{ .Name }}</b></span><span style="color: #117743;"><b>{{ if .AttributedTo }} {{.AttributedTo }} {{ else }} Anonymous {{ end }}</b></span><span>{{ .Published }} <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/">No.</a> <a id="{{ .Id }}-link" title="{{ .Id }}" href="javascript:quote('{{ $board.Actor.Id }}', '{{ $opId }}', '{{ .Id }}')">{{ .Id }}</a> {{ if ne .Type "Tombstone" }}<a href="javascript:report('{{ $board.Actor.Id }}', '{{ .Id }}')">[Report]</a>{{ end }}</span> + <span style="color: #0f0c5d;"><b>{{ .Name }}</b></span><span style="color: #117743;"><b>{{ if .AttributedTo }} {{.AttributedTo }} {{ else }} Anonymous {{ end }}</b></span><span class="tripcode"> {{ .TripCode }} </span><span>{{ .Published }} <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/">No.</a> <a id="{{ .Id }}-link" title="{{ .Id }}" href="javascript:quote('{{ $board.Actor.Id }}', '{{ $opId }}', '{{ .Id }}')">{{ .Id }}</a> {{ if ne .Type "Tombstone" }}<a href="javascript:report('{{ $board.Actor.Id }}', '{{ .Id }}')">[Report]</a>{{ end }}</span> <p id="{{ .Id }}-content" style="white-space: pre-wrap; margin: 10px 30px 10px 30px;">{{.Content}}</p> {{ if .Replies }} {{ $replies := .Replies }} @@ -75,26 +88,42 @@ <div style="float: left; display: block; margin-right: 5px;">>></div> <div class="post" style="overflow: auto; padding: 5px; margin-bottom: 2px;"> {{ if eq $board.ModCred $board.Domain $board.Actor.Id }} - <a href="/delete?id={{ .Id }}">[Delete Post]</a> + <a href="/delete?id={{ .Id }}&board={{ $board.Actor.Name }}">[Delete Post]</a> {{ end }} {{ if .Attachment }} {{ if eq $board.ModCred $board.Domain $board.Actor.Id }} - <a href="/deleteattach?id={{ .Id }}">[Delete Attachment]</a> + <a href="/deleteattach?id={{ .Id }}&board={{ $board.Actor.Name }}">[Delete Attachment]</a> + <a href="/marksensitive?id={{ .Id }}&board={{ $board.Actor.Name }}">[Mark Sensitive]</a> {{ end }} <span style="display: block;">File <a id="{{ .Id }}-img" href="{{ (index .Attachment 0).Href}}">{{ (index .Attachment 0).Name }}</a> <span id="{{ .Id }}-size">({{ (index .Attachment 0).Size }})</span></span> - <div id="media-{{ .Id }}"></div> + {{ if and .Sensitive $board.Actor.Restricted }} + <div id="hide-{{ .Id }}" style="display: none;">[Hide]</div> + <div id="sensitive-{{ .Id }}" style="display: none;"><div style="position: relative; text-align: center;"><img style="float: left; margin-right: 10px; margin-bottom: 10px; max-width: 250px; max-height: 250px;" src="/static/sensitive.png"><div style="width: 240px; position: absolute; margin-top: 110px; padding: 5px; background-color: black; color: white; cursor: default; ">NSFW Content</div></div></div> + {{ end }} + <div id="media-{{ .Id }}" sensitive="0"></div> <script> media = document.getElementById("media-{{ .Id }}") + + if({{ .Sensitive }} && {{ $board.Actor.Restricted }}){ + sensitive = document.getElementById("sensitive-{{ .Id }}") + hide = document.getElementById("hide-{{ .Id }}") + sensitive.onclick = function(){document.getElementById("media-{{ .Id }}").style="display: block;"; document.getElementById("sensitive-{{ .Id }}").style="display: none;"; document.getElementById("hide-{{ .Id }}").style="display: block; cursor: pointer;"} + hide.onclick = function(){document.getElementById("media-{{ .Id }}").style="display: none;"; document.getElementById("sensitive-{{ .Id }}").style="display: block;"; document.getElementById("hide-{{ .Id }}").style="display: none;"} + sensitive.style = "display: block" + media.style = "display: none;" + } + if(getMIMEType({{ (index .Attachment 0).MediaType }}) == "image"){ var img = document.createElement("img"); - img.style = "float: left; margin-right: 10px; margin-bottom: 10px; max-width: 250px; max-height: 250px; cursor: pointer;" + img.style = "float: left; margin-right: 10px; margin-bottom: 10px; max-width: 250px; max-height: 250px;" img.setAttribute("id", "img") img.setAttribute("main", "1") img.setAttribute("enlarge", "0") img.setAttribute("attachment", "{{ (index .Attachment 0).Href }}") - {{ if .Preview.Href }} + img.setAttribute("post", "{{ .Id }}") + {{ if and .Preview.Href . }} img.setAttribute("src", "{{ .Preview.Href }}") - img.setAttribute("preview", "{{ .Preview.Href }}") + img.setAttribute("preview", "{{ .Preview.Href }}") {{ else }} img.setAttribute("src", "{{ (index .Attachment 0).Href }}") img.setAttribute("preview", "{{ (index .Attachment 0).Href }}") @@ -107,7 +136,7 @@ audio.controls = 'controls' audio.preload = 'metadata' audio.src = '{{ (index .Attachment 0).Href }}' - audio.type = '{{ (index .Attachment 0).MediaType }}' + audio.type = '{{ (index .Attachment 0).MediaType }}' audio.style = "float: left; margin-right: 10px; margin-bottom: 10px; max-width: 250px; max-height: 250px;" audio.innerText = 'Audio is not supported.' media.appendChild(audio) @@ -119,22 +148,25 @@ video.preload = 'metadata' video.muted = 'muted' video.src = '{{ (index .Attachment 0).Href }}' - video.type = '{{ (index .Attachment 0).MediaType }}' + video.type = '{{ (index .Attachment 0).MediaType }}' video.style = "float: left; margin-right: 10px; margin-bottom: 10px; max-width: 250px; max-height: 250px;" video.innerText = 'Video is not supported.' media.appendChild(video) } </script> {{ end }} - <span style="color: #0f0c5d;"><b>{{ .Name }}</b></span><span style="color: #117743;"><b>{{ if .AttributedTo }} {{.AttributedTo }} {{ else }} Anonymous {{ end }}</b></span><span>{{ .Published }} <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/post/{{ $opId }}#{{ .Id }}">No. </a><a id="{{ .Id }}-link" title="{{ .Id }}" href="javascript:quote('{{ $board.Actor.Id }}', '{{ $opId }}', '{{ .Id }}')">{{ .Id }}</a> {{ if ne .Type "Tombstone" }}<a href="javascript:report('{{ $board.Actor.Id }}', '{{ .Id }}')">[Report]</a>{{ end }}</span> + <span style="color: #0f0c5d;"><b>{{ .Name }}</b></span><span style="color: #117743;"><b>{{ if .AttributedTo }} {{.AttributedTo }} {{ else }} Anonymous {{ end }}</b></span><span class="tripcode"> {{ .TripCode }} </span><span>{{ .Published }} <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/post/{{ $opId }}#{{ .Id }}">No. </a><a id="{{ .Id }}-link" title="{{ .Id }}" href="javascript:quote('{{ $board.Actor.Id }}', '{{ $opId }}', '{{ .Id }}')">{{ .Id }}</a> {{ if ne .Type "Tombstone" }}<a href="javascript:report('{{ $board.Actor.Id }}', '{{ .Id }}')">[Report]</a>{{ end }}</span> {{ $parentId := .Id }} {{ if .Replies.OrderedItems }} {{ range .Replies.OrderedItems }} <span id="{{$parentId}}-replyto-{{.Id}}"></span> - <script>document.getElementById("{{ $parentId }}-replyto-{{.Id}}").innerHTML = "<a title='{{ .Id }}' href='/{{ $board.Name }}/" + shortURL("{{ $board.Actor.Id }}", "{{ $opId }}") + "#" + shortURL("{{ $board.Actor.Id }}", "{{ .Id }}") + "'>>>" + shortURL("{{ $board.Actor.Id }}", "{{ .Id }}") + "</a>";</script> - {{ end }} - {{ end }} - <p id="{{ .Id }}-content" style="white-space: pre-wrap; margin: 10px 30px 10px 30px;">{{.Content}}</p> + <script> + var content = convertContentNoLink('{{$board.Actor.Id}}', '{{ .Content }}', '{{ $opId }}') + document.getElementById("{{ $parentId }}-replyto-{{.Id}}").innerHTML = "<a title='" + content +"' href='/{{ $board.Name }}/" + shortURL("{{ $board.Actor.Id }}", "{{ $opId }}") + "#" + shortURL("{{ $board.Actor.Id }}", "{{ .Id }}") + "'>>>" + shortURL("{{ $board.Actor.Id }}", "{{ .Id }}") + "</a>"; + </script> + {{ end }} + {{ end }} + <p id="{{ .Id }}-content" style="white-space: pre-wrap; margin: 10px 30px 10px 30px;">{{.Content}}</p> </div> </div> </div> diff --git a/static/sensitive.png b/static/sensitive.png Binary files differnew file mode 100644 index 0000000..ea706c8 --- /dev/null +++ b/static/sensitive.png diff --git a/static/top.html b/static/top.html index b891e14..e2612e8 100644 --- a/static/top.html +++ b/static/top.html @@ -25,6 +25,7 @@ <input type="hidden" id="boardName" name="boardName" value="{{ .Board.Name }}"> <input type="hidden" id="captchaCode" name="captchaCode" value="{{ .Board.CaptchaCode }}"> <input type="file" id="file" name="file" {{ if gt $len 1 }} required {{ else }} {{ if eq $len 0 }} required {{ end }} {{ end }} ><br><br> + <input type="checkbox" name="sensitive"><span>Mark attachment as sensitive</span><br><br> <label stye="display: inline-block;" for="captcha">Captcha:</label> <br> <input style="display: inline-block;" type="text" id="captcha" name="captcha" autocomplete="off"><br> |