Merge with master

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
new 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
new 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>