hide year headings when all items are hidden

fixes #7

make-pages/GalleryPage.hs

@@ -122,7 +122,7 @@ makeYearItems :: Bool -- ^ nsfw
               -> [(FilePath, Info)]
               -> Builder
 makeYearItems nsfw year infos = [b|@4
-    <li class="item year-marker">
+    <li class="item year-marker" id="marker-$year">
       <span class=year-text>$year'</span>
     $4.items
   |]
@@ -132,7 +132,8 @@ makeYearItems nsfw year infos = [b|@4
 
 makeItem :: Bool -> FilePath -> Info -> Builder
 makeItem nsfw file info@(Info {title, bg}) = [b|@4
-    <li class="item post$nsfw'" data-date="$date'" data-updated="$updated'"
+    <li class="item post$nsfw'" data-date="$date'" data-year=$year'
+        data-updated="$updated'"
         data-tags="$tags'">
       <figure>
         <a href="$dir">
@@ -149,6 +150,8 @@ makeItem nsfw file info@(Info {title, bg}) = [b|@4
   thumb    = getThumb dir info
   nsfw'    = if nsfw && #anyNsfw info then [b| nsfw|] else ""
   tags'    = fold $ intersperse ";" $ map fromText $ tagsFor nsfw info
-  date'    = formatShort $ #latestDate info
+  date     = #latestDate info
+  date'    = formatShort date
+  year'    = #year date
   updated' = if #updated info then [b|true|] else [b|false|]
   bgStyle  = ifJust bg \col -> [b| style="background: $col"|]

script/gallery.js

@@ -1,11 +1,11 @@
 (function() {
 'use strict';
 
-let items;
 let reqBoxes;
 let excBoxes;
 let allBoxes;
 let tags;
+let itemsByYear;
 
 let showSingles = true;
 
@@ -21,11 +21,19 @@ function updateItems() {
   let [reqTags, excTags] = fillSets();
   let anyReq = reqTags.size > 0;
 
-  for (let item of items) {
-    let req = tags.get(item).some(x => reqTags.has(x));
-    let exc = tags.get(item).some(x => excTags.has(x));
+  for (let [year, items] of itemsByYear) {
+    let hide = true;
 
-    item.hidden = exc || (anyReq && !req);
+    for (let item of items) {
+      let req = tags.get(item).some(x => reqTags.has(x));
+      let exc = tags.get(item).some(x => excTags.has(x));
+      let hidden = exc || (anyReq && !req);
+
+      item.hidden = hidden;
+      hide &&= hidden;
+    }
+
+    document.getElementById(`marker-${year}`).hidden = hide;
   }
 }
 
@@ -101,13 +109,20 @@ function useFragment() {
 
 
 function setup() {
-  items = Array.from(document.getElementsByClassName('post'));
-
   function inputs(id) {
     let iter = document.getElementById(id).getElementsByTagName('input');
     return Array.from(iter);
   }
 
+  let items = Array.from(document.getElementsByClassName('post'));
+  itemsByYear = new Map;
+
+  for (let item of items) {
+    let year = item.dataset.year;
+    if (!itemsByYear.has(year)) itemsByYear.set(year, new Set);
+    itemsByYear.get(year).add(item);
+  }
+
   reqBoxes = inputs('require');
   excBoxes = inputs('exclude');
   allBoxes = [...reqBoxes, ...excBoxes];