panphp / pan

A simple, lightweight, and privacy-focused product analytics php package
MIT License
1.08k stars 48 forks source link

Track elements visibility #36

Open eloquentarduino opened 1 week ago

eloquentarduino commented 1 week ago

As it is now, impressions are tracked even when elements are not visible in the viewport ("below the fold"). I think it may be a valid metric to track, since one may want to know how many clicks/hover were performed after the element was actually visible. I wrote a quick implementation locally which seems to be working fine. The "main" part is the JS code which looks like this:

intersectionObserver(function (entries: IntersectionObserverEntry[]): void {
        entries.forEach((entry: IntersectionObserverEntry): void => {
            const name = entry.target.getAttribute("data-pan");

            if (!name || !entry.isIntersecting || visible.includes(name))
                return;

            visible.push(name);

            queue.push({
                type: "visible",
                name: name,
            });
        })
    })

Is this something that could be integrated?