feature: forum spoiler tag support

ccbrown · ccbrown · commit 391b341eee90 · 2017-03-10T20:52:16.000-08:00
diff --git a/server/index_handler.go b/server/index_handler.go
@@ -11,7 +11,7 @@ var index = `<!DOCTYPE html><html>
     <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
     <title>GGG Tracker</title>
     <link rel="shortcut icon" href="static/favicon.ico" />
-    <link rel="stylesheet" type="text/css" href="static/style.css" />
+    <link rel="stylesheet" type="text/css" href="static/style.css?v2" />
     <link rel="alternate" type="application/rss+xml" title="GGG Tracker Forum Feed" href="rss" />
 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
@@ -63,7 +63,7 @@ var index = `<!DOCTYPE html><html>
         </footer>
     </div>
 
-    <script src="static/index.js?v3"></script>
+    <script src="static/index.js?v4"></script>
 </body>
 </html>`
 
diff --git a/server/static/index.js b/server/static/index.js
@@ -1,12 +1,27 @@
-var currentPage = undefined
+var currentPage = undefined;
+
+var POE = {
+    Forum: {
+        SpoilerClick: function(element) {
+            var $spoiler = $(element).closest('.spoiler');
+            if ($spoiler.hasClass('spoilerHidden')) {
+                $(element).val("Hide");
+                $spoiler.removeClass('spoilerHidden');
+            } else {
+                $(element).val("Show");
+                $spoiler.addClass('spoilerHidden');
+            }
+        },
+    },
+};
 
 function loadActivity() {
     var page = location.hash.replace(/^#page=/, '');
     if (currentPage !== undefined && page == currentPage) {
         return;
     }
-    var previousPage = currentPage
-    currentPage = page
+    var previousPage = currentPage;
+    currentPage = page;
 
     $.get('activity.json?next=' + page, function(data) {
         var $tbody = $('#activity-table tbody');
diff --git a/server/static/style.css b/server/static/style.css
@@ -208,3 +208,29 @@ td.body blockquote {
     margin: 1.5em 10px;
     padding: 0.5em 10px;
 }
+
+.spoilerHidden .spoilerContent {
+    display: none;
+}
+
+.spoilerTitle input[type="button"] {
+    margin-left: 8px;
+    color: #c9ba8a;
+    background-color: #0f0f0f;
+    border: 0;
+    cursor: pointer;
+    text-decoration: none;
+}
+
+.spoilerTitle input[type="button"]:hover {
+    text-decoration: underline;
+}
+
+.spoiler {
+    border: 1px solid #1a1a1a;
+    background-color: #323232;
+}
+
+.spoilerTitle, .spoilerContent {
+    padding: 8px;
+}
