Folder reorganize 1

assets/js/mobile-header.js

@@ -0,0 +1,75 @@
+(() => {
+  const HEADER_SELECTOR = '.app-header';
+  const HIDDEN_CLASS = 'app-header--hidden';
+  const MOBILE_BREAKPOINT = 960;
+  const SCROLL_THRESHOLD = 12;
+
+  let lastScrollY = window.scrollY || window.pageYOffset || 0;
+  let isHidden = false;
+
+  const header = document.querySelector(HEADER_SELECTOR);
+  if (!header) {
+    return;
+  }
+
+  const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)');
+
+  const shouldEnable = () => window.innerWidth <= MOBILE_BREAKPOINT && !prefersReducedMotion.matches;
+
+  const showHeader = (force = false) => {
+    if (isHidden || force) {
+      header.classList.remove(HIDDEN_CLASS);
+      isHidden = false;
+    }
+  };
+
+  const hideHeader = () => {
+    if (!isHidden) {
+      header.classList.add(HIDDEN_CLASS);
+      isHidden = true;
+    }
+  };
+
+  const handleScroll = () => {
+    const currentY = window.scrollY || window.pageYOffset || 0;
+
+    if (!shouldEnable() || currentY <= 0) {
+      showHeader(true);
+      lastScrollY = currentY;
+      return;
+    }
+
+    const delta = currentY - lastScrollY;
+
+    if (Math.abs(delta) <= SCROLL_THRESHOLD) {
+      lastScrollY = currentY;
+      return;
+    }
+
+    if (delta > 0) {
+      hideHeader();
+    } else {
+      showHeader();
+    }
+
+    lastScrollY = currentY;
+  };
+
+  const handleResize = () => {
+    lastScrollY = window.scrollY || window.pageYOffset || 0;
+    if (!shouldEnable()) {
+      showHeader(true);
+    }
+  };
+
+  window.addEventListener('scroll', handleScroll, { passive: true });
+  window.addEventListener('resize', handleResize);
+
+  if (typeof prefersReducedMotion.addEventListener === 'function') {
+    prefersReducedMotion.addEventListener('change', handleResize);
+  } else if (typeof prefersReducedMotion.addListener === 'function') {
+    prefersReducedMotion.addListener(handleResize);
+  }
+
+  handleResize();
+})();