From 3ff4dbee48dbbf323666ec86e3ad9363a83f910e Mon Sep 17 00:00:00 2001
From: "(quasar) nebula" <qznebula@protonmail.com>
Date: Thu, 2 Mar 2023 19:16:57 -0400
Subject: hide CW'd art from sticky heading til main cover revealed

---
 src/static/client.js | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

(limited to 'src/static/client.js')

diff --git a/src/static/client.js b/src/static/client.js
index 5b8b0c8a..0c760500 100644
--- a/src/static/client.js
+++ b/src/static/client.js
@@ -185,6 +185,7 @@ for (const reveal of document.querySelectorAll('.reveal')) {
       reveal.classList.add('revealed');
       event.preventDefault();
       event.stopPropagation();
+      reveal.dispatchEvent(new CustomEvent('hsmusic-reveal'));
     }
   });
 }
@@ -527,6 +528,7 @@ const stickyHeadingInfo = Array.from(document.querySelectorAll('.content-sticky-
     const stickySubheadingRow = stickyContainer.querySelector('.content-sticky-subheading-row');
     const stickySubheading = stickySubheadingRow.querySelector('h2');
     const stickyCoverContainer = stickyContainer.querySelector('.content-sticky-heading-cover-container');
+    const stickyCover = stickyCoverContainer.querySelector('.content-sticky-heading-cover');
     const contentHeadings = Array.from(contentContainer.querySelectorAll('.content-heading'));
     const contentCover = contentContainer.querySelector('#cover-art-container');
 
@@ -535,6 +537,7 @@ const stickyHeadingInfo = Array.from(document.querySelectorAll('.content-sticky-
       contentCover,
       contentHeadings,
       stickyContainer,
+      stickyCover,
       stickyCoverContainer,
       stickySubheading,
       stickySubheadingRow,
@@ -549,6 +552,20 @@ const topOfViewInside = (el, scroll = window.scrollY) => (
   scroll < el.offsetTop + el.offsetHeight
 );
 
+function prepareStickyHeadings() {
+  for (const {
+    contentCover,
+    stickyCover,
+  } of stickyHeadingInfo) {
+    const coverRevealImage = contentCover.querySelector('.reveal');
+    if (coverRevealImage) {
+      coverRevealImage.addEventListener('hsmusic-reveal', () => {
+        stickyCover.classList.remove('content-sticky-heading-cover-needs-reveal');
+      });
+    }
+  }
+}
+
 function updateStickyHeading() {
   for (const {
     contentContainer,
@@ -620,7 +637,7 @@ function updateStickyHeading() {
 }
 
 document.addEventListener('scroll', updateStickyHeading);
-
+prepareStickyHeadings();
 updateStickyHeading();
 
 // Image overlay ------------------------------------------
-- 
cgit 1.3.0-6-gf8a5