import { prefersReducedMotion } from "../shared/media.js";

const THRESHOLD = 0.15;
const ROOT_MARGIN = "0px 0px -120px 0px";

export function initScrollReveal() {
  const targets = document.querySelectorAll("[data-reveal]");
  if (!targets.length) return;

  if (prefersReducedMotion()) {
    targets.forEach((el) => el.classList.add("is-visible"));
    return;
  }

  const obs = new IntersectionObserver(
    (entries) => {
      for (const e of entries) {
        if (!e.isIntersecting) continue;
        e.target.classList.add("is-visible");
        obs.unobserve(e.target);
      }
    },
    { threshold: THRESHOLD, rootMargin: ROOT_MARGIN },
  );

  targets.forEach((el) => obs.observe(el));
}