add js functionality to show/hide text blocks

pascalwittler · Jul 7, 2023 · 3eba2f6 · 3eba2f6
1 parent faac4db
commit 3eba2f6
Showing 1 changed file with 22 additions and 0 deletions.
diff --git a/public/static/js/main.js b/public/static/js/main.js
@@ -18,4 +18,26 @@ document.addEventListener('DOMContentLoaded', () => {
       'minutes': minutesRounded
     };
   }
+
+  function showAndHideWords() {
+    const now = getCurrentTime();
+
+    document.querySelectorAll('li[data-hours], li[data-minutes]').forEach((element) => {
+      element.classList.remove('active');
+    });
+
+    const hoursToActivate = document.querySelectorAll(`li[data-hours~='${now.hours}']`);
+    const minutesToActivate = document.querySelectorAll(`li[data-minutes~='${now.minutes}']`);
+
+    hoursToActivate.forEach((element) => {
+      element.classList.add('active');
+    });
+
+    minutesToActivate.forEach((element) => {
+      element.classList.add('active');
+    });
+  }
+
+  showAndHideWords();
+  setInterval(showAndHideWords, 1000);
 });