diff options
Diffstat (limited to 'layouts/_partials/term/term-scripts.html')
| -rw-r--r-- | layouts/_partials/term/term-scripts.html | 73 |
1 files changed, 0 insertions, 73 deletions
diff --git a/layouts/_partials/term/term-scripts.html b/layouts/_partials/term/term-scripts.html deleted file mode 100644 index 45ac9ac6..00000000 --- a/layouts/_partials/term/term-scripts.html +++ /dev/null @@ -1,73 +0,0 @@ -<script> - const postList = document.getElementById("term-posts") - const reverseButton = document.getElementById("reverse-order") - const reverseOrder = () => { - // play exit animation - postList.classList.remove("animate-fade-in") - postList.classList.add("animate-fade-out") - setTimeout(() => { - // reverse order - postList.classList.toggle("flex-col") - postList.classList.toggle("flex-col-reverse") - - // play entrance animation - postList.classList.remove("animate-fade-out") - postList.classList.add("animate-fade-in") - }, 100) - } - reverseButton.addEventListener('click', reverseOrder) -</script> - -{{ if eq .Data.Singular "tag" }} -<script> - const hideWeeklyButton = document.getElementById("hide-weekly") - const weeklies = postList.querySelectorAll(".weekly") - - if (weeklies.length === 0) { - hideWeeklyButton.classList.add("hidden") - } - - const entranceAnimation = "animate-flip-in-x" - const exitAnimation = "animate-flip-out-x" - const animationDuration = 500 - - const toggleWeekly = () => { - if (postList.classList.contains("weekly-hidden")) { - // show weekly posts - postList.classList.remove("weekly-hidden") - weeklies.forEach(weekly => { - weekly.classList.remove("hidden!") - weekly.classList.add(entranceAnimation) - setTimeout(() => { - weekly.classList.remove(entranceAnimation) - }, animationDuration) - }) - } else { - // hide weekly posts - postList.classList.add("weekly-hidden") - weeklies.forEach(weekly => { - weekly.classList.add(exitAnimation) - setTimeout(() => { - weekly.classList.add("hidden!") - weekly.classList.remove(exitAnimation) - }, animationDuration) - }) - } - } - - const highlightClasses = ["animate-flash", "opacity-50"] - - const highlightWeekly = () => { - if (weeklies[0].classList.contains(highlightClasses[0])) return; - weeklies.forEach(e => e.classList.add(...highlightClasses)) - } - - const unhighlightWeekly = () => { - weeklies.forEach(e => e.classList.remove(...highlightClasses)) - } - - hideWeeklyButton.addEventListener("click", toggleWeekly) - hideWeeklyButton.addEventListener("mouseover", highlightWeekly) - hideWeeklyButton.addEventListener("mouseout", unhighlightWeekly) -</script> -{{ end }} |
