reporting requires captcha

4 files changed, 50 insertions, 5 deletions

diff --git a/static/bottom.html b/static/bottom.html
index 0542c41..25339b5 100644
--- a/static/bottom.html
+++ b/static/bottom.html
@@ -1,10 +1,10 @@
 {{ define "bottom" }}
-<div id="reply-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">
     <input id="reply-options" name="options" size="43" type="text" placeholder="Options">
-    <textarea id="reply-comment" name="comment" rows="12" cols="54" style="width: 396px;"></textarea>
+    <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 type="hidden" id="inReplyTo-box" name="inReplyTo" value="{{ .Board.InReplyTo }}">
@@ -20,4 +20,25 @@
     </div>
   </form>
 </div>
+
+<div id="report-box" class="popup-box" style="display: none; ">
+  <div id="report-header" style="text-align: center; display: inline-block; width: 370px; z-index: 0; cursor: move;"></div><div id="report-close" style="display: inline-block; float: right;"><a href="javascript:closeReport()">[X]</a></div>
+  <form id="report-post" action="/report" method="post">
+    <label for="comment">Reason:</label>
+    <textarea id="report-comment" name="comment" rows="12" cols="54" style="width: 396px;" maxlength="100"></textarea>
+    <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" name="close" value="0">    
+    <input type="hidden" id="captchaCode" name="captchaCode" value="{{ .Board.CaptchaCode }}">
+    <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>
+    </div>
+    <div style="width: 230px; margin: 0 auto;">
+      <img src="{{ .Board.Captcha }}">
+    </div>
+  </form>
+</div>
 {{ end }}
diff --git a/static/js/posts.js b/static/js/posts.js
index a6963de..805c1c1 100644
--- a/static/js/posts.js
+++ b/static/js/posts.js
@@ -149,6 +149,12 @@ function closeReply()
     document.getElementById("reply-comment").value = "";        
 }
 
+function closeReport()
+{
+    document.getElementById("report-box").style.display = "none";
+    document.getElementById("report-comment").value = "";        
+}
+
 
 function previous(actorName, page)
 {
@@ -192,6 +198,24 @@ function quote(actorName, opid, id)
 
     dragElement(header);            
 
+}
+
+function report(actorName, id)
+{
+    var box = document.getElementById("report-box");
+    var header = document.getElementById("report-header");
+    var comment = document.getElementById("report-comment");
+    var inReplyTo = document.getElementById("report-inReplyTo-box");      
+
+    var w = window.innerWidth / 2 - 200;
+    var h = document.getElementById(id + "-content").offsetTop - 448;
+
+    box.setAttribute("style", "display: block; position: absolute; width: 400px; height: 480px; z-index: 9; top: " + h + "px; left: " + w + "px; padding: 5px;");
+
+    header.innerText = "Report Post No. " + shortURL(actorName, id);
+    inReplyTo.value = id;
+
+    dragElement(header);            
 }  
 
 function dragElement(elmnt) {
diff --git a/static/main.html b/static/main.html
index 180e91f..fc3d5ed 100644
--- a/static/main.html
+++ b/static/main.html
@@ -27,7 +27,7 @@
           {{ end }}
       }
       
-      #reply-box {
+      .popup-box {
           {{ if .Board.Restricted }}
           border: 4px solid #d3caf0;
           background-color: #eff5ff;
diff --git a/static/posts.html b/static/posts.html
index 9e3e8ce..a7b18a9 100644
--- a/static/posts.html
+++ b/static/posts.html
@@ -60,7 +60,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 }}', '{{ $opId }}', '{{ .Id }}')">{{ .Id }}</a> {{ if ne .Type "Tombstone" }}<a href="/report?id={{ .Id }}&board={{ $board.Name }}">[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>{{ .Published }} <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/">No.</a> <a id="{{ .Id }}-link" title="{{ .Id }}" href="javascript:quote('{{ $board.Actor }}', '{{ $opId }}', '{{ .Id }}')">{{ .Id }}</a> {{ if ne .Type "Tombstone" }}<a href="javascript:report('{{ $board.Actor }}', '{{ .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 }}
@@ -124,7 +124,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 }}/post/{{ $opId }}#{{ .Id }}">No. </a><a id="{{ .Id }}-link" title="{{ .Id }}" href="javascript:quote('{{ $board.Actor }}', '{{ $opId }}', '{{ .Id }}')">{{ .Id }}</a> {{ if ne .Type "Tombstone" }}<a href="/report?id={{ .Id }}&board={{ $board.Name }}">[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>{{ .Published }} <a id="{{ .Id }}-anchor" href="/{{ $board.Name }}/post/{{ $opId }}#{{ .Id }}">No. </a><a id="{{ .Id }}-link" title="{{ .Id }}" href="javascript:quote('{{ $board.Actor }}', '{{ $opId }}', '{{ .Id }}')">{{ .Id }}</a> {{ if ne .Type "Tombstone" }}<a href="javascript:report('{{ $board.Actor }}', '{{ .Id }}')">[Report]</a>{{ end }}</span>
           {{ $parentId := .Id }}
           {{ if .Replies.OrderedItems }}
           {{ range .Replies.OrderedItems }}