Add close banners to news banners

1 files changed, 40 insertions, 2 deletions

diff --git a/_layouts/postlist.html b/_layouts/postlist.html
index 454a8ae..765c014 100644
--- a/_layouts/postlist.html
+++ b/_layouts/postlist.html
@@ -3,13 +3,27 @@ layout: default
 ---
 
 <div class="home">
-  <div id="AdBlock" style="border-radius: 10px; padding: 5px; background: #eeeeee; margin-bottom: 1em;">
+  <div
+      id="AdBlock"
+      style="border-radius: 10px; padding: 5px; background: #eeeeee; margin-bottom: 1em; position: relative;"
+    >
+    <a
+        class="close-button"
+        style="position: absolute; top: 10px; right: 10px;"
+    >&lbrack;&times;&rbrack;</a>
     <p>
       <div style="font-weight: bold">You don't seem to be using an ad blocker.</div>
       <div>Please consider installing one.</div>
     </p>
   </div>
-  <div style="border-radius: 10px; padding: 5px; background: #eeeeee; margin-bottom: 1em;">
+  <div
+      id="news1"
+      style="border-radius: 10px; padding: 5px; background: #eeeeee; margin-bottom: 1em; position: relative;"
+    >
+    <a
+        class="close-button"
+        style="position: absolute; top: 10px; right: 10px;"
+    >&lbrack;&times;&rbrack;</a>
     <p>Now also available via Tor</p>
     <code>http://iwccx6ebuapto7dlkd4m5fooud6nqn2z7go7aass5c4q6vl6gzs5htad.onion/</code>
   </div>
@@ -55,3 +69,27 @@ layout: default
   {%- endif -%}
 
 </div>
+
+<script>
+  document.addEventListener("DOMContentLoaded", function() {
+    const ids =  [ "AdBlock", "news1" ];
+    for (currId of ids) {
+        const currentBanner = document.getElementById(currId);
+        const closeLink = currentBanner.firstElementChild;
+        const currentNewsClosed = localStorage.getItem(currId+"closed");
+        if (currentNewsClosed === "true") {
+            currentBanner.style.display = "none";
+        }
+
+        function closeBanner(evt) {
+            currentBanner.style.display = "none";
+            const storId = evt.currentTarget.closeArg + "closed";
+            localStorage.setItem(storId, "true");
+        }
+
+        closeLink.closeArg=currId;
+        closeLink.addEventListener("click", closeBanner);
+    }
+
+  });
+</script>