// Parallax utilities — lett, vanilla. Ingen libs.
//
// useScrollParallax(speed) — returnerer et tall (pixels) basert på vindu-scroll
//                            multiplisert med speed (-1..1). Negativ = motsatt vei.
//                            Brukes i style={{ transform: `translateY(${py}px)` }}.
//
// useMouseTilt({ max=10, perspective=1000 }) — returnerer { ref, style } som
//                            settes på et element. Når musa flyttes over elementet,
//                            tiltes det i 3D. Avtar mot 0 når musa forlater.

const { useEffect, useRef, useState } = React;

function useScrollParallax(speed = 0.3, elementRef = null) {
  const [offset, setOffset] = useState(0);

  useEffect(() => {
    let raf = 0;
    const update = () => {
      if (elementRef && elementRef.current) {
        // Relativ til element — sentrum av elementet vs sentrum av viewport.
        const rect = elementRef.current.getBoundingClientRect();
        const center = rect.top + rect.height / 2;
        const vh = window.innerHeight;
        const delta = (center - vh / 2) * speed;
        setOffset(-delta);
      } else {
        setOffset(window.scrollY * speed);
      }
      raf = 0;
    };
    const onScroll = () => {
      if (!raf) raf = requestAnimationFrame(update);
    };
    update();
    window.addEventListener("scroll", onScroll, { passive: true });
    window.addEventListener("resize", onScroll);
    return () => {
      window.removeEventListener("scroll", onScroll);
      window.removeEventListener("resize", onScroll);
      if (raf) cancelAnimationFrame(raf);
    };
  }, [speed, elementRef]);

  return offset;
}

// Mouse-tracked 3D tilt. Wraps any child element. perspective på parent,
// rotateX/rotateY på inner. Stille når musa er borte.
function MouseTilt({ children, max = 8, perspective = 1200, scale = 1.02, style, ...rest }) {
  const ref = useRef(null);
  const [tilt, setTilt] = useState({ rx: 0, ry: 0, active: false });

  const onMove = (e) => {
    const el = ref.current;
    if (!el) return;
    const r = el.getBoundingClientRect();
    const x = (e.clientX - r.left) / r.width;  // 0..1
    const y = (e.clientY - r.top) / r.height;  // 0..1
    const ry = (x - 0.5) * 2 * max;            // -max..max
    const rx = -(y - 0.5) * 2 * max;
    setTilt({ rx, ry, active: true });
  };
  const onLeave = () => setTilt({ rx: 0, ry: 0, active: false });

  return (
    <div
      ref={ref}
      onMouseMove={onMove}
      onMouseLeave={onLeave}
      style={{
        perspective: `${perspective}px`,
        pointerEvents: "auto",
        ...style,
      }}
      {...rest}
    >
      <div style={{
        transform: `rotateX(${tilt.rx}deg) rotateY(${tilt.ry}deg) scale(${tilt.active ? scale : 1})`,
        transition: tilt.active ? "transform 0.08s linear" : "transform 0.4s cubic-bezier(0.2,0.9,0.3,1)",
        willChange: "transform",
        pointerEvents: "auto",
      }}>
        {children}
      </div>
    </div>
  );
}

// Parallax-laget som rir på mouse-position på hero (subtilt).
// Returnerer { x, y } pixels for å bruke i transform.
function useMouseParallax(targetRef, strength = 20) {
  const [pos, setPos] = useState({ x: 0, y: 0 });

  useEffect(() => {
    const el = targetRef.current;
    if (!el) return;
    let raf = 0;
    let pending = null;
    const onMove = (e) => {
      const r = el.getBoundingClientRect();
      const x = (e.clientX - r.left) / r.width - 0.5;
      const y = (e.clientY - r.top) / r.height - 0.5;
      pending = { x: x * strength, y: y * strength };
      if (!raf) {
        raf = requestAnimationFrame(() => {
          if (pending) setPos(pending);
          raf = 0;
        });
      }
    };
    const onLeave = () => setPos({ x: 0, y: 0 });
    el.addEventListener("mousemove", onMove);
    el.addEventListener("mouseleave", onLeave);
    return () => {
      el.removeEventListener("mousemove", onMove);
      el.removeEventListener("mouseleave", onLeave);
      if (raf) cancelAnimationFrame(raf);
    };
  }, [targetRef, strength]);

  return pos;
}

Object.assign(window, { useScrollParallax, MouseTilt, useMouseParallax });