vp-outstream-player/src/core/viewability.ts

Outstream video player with Google IMA integration

export class ViewabilityTracker {
	private observer: IntersectionObserver | null = null;
	private isInView: boolean = false;

	constructor(private element: HTMLElement, private onChange: (inView: boolean) => void) {
		if ("IntersectionObserver" in window) {
			const options = {
				rootMargin: "0px",
				threshold: 0.5,
			};
			this.observer = new IntersectionObserver(([entry]) => {
				this.isInView = entry.isIntersecting;
				this.onChange(this.isInView);
			}, options);
			this.observer.observe(element);
		} else {
			// Fallback if no IntersectionObserver
			this.isInView = true;
			this.onChange(true);
		}
	}

	public destroy() {
		if (this.observer) {
			this.observer.disconnect();
		}
	}

	get isInViewState() {
		return this.isInView;
	}
}