smart-view/src/viewability/IntersectionObserverAPI.ts

Moq (​mo​​bile ​q​​uality assessment) is a tool used to measure an online ad viewability

import * as  config from "./../common-var/config";
import { IViewAbility } from "./IViewAbility";


export class IntersectionObserverAPI implements IViewAbility {
    private inView: boolean;
    private ad: HTMLElement;

    constructor(el: HTMLElement) {
        this.ad = el;
        let ratio = this.ad.scrollWidth * this.ad.scrollHeight >= config.largeSize ?
            config.largeReduce : config.defaultReduce;
        let observer = new IntersectionObserver((enters:IntersectionObserverEntry[]) => {
            if (enters[0].intersectionRatio < ratio) {
                this.inView = false;
            } else {
                this.inView = true;
            }
        }, {
                // tslint:disable-next-line:trailing-comma
                threshold: [ratio]
            });

        observer.observe(this.ad);
    }
    public isSupported(cb?: Function): boolean {
        let status = true;
        if (typeof this.ad === "undefined" || this.ad == null || typeof IntersectionObserver === "undefined") {
            status = false;
        }
        if (typeof cb === "function") {
            cb(status);
        }
        return status;
    }
    public isView = () => {
        return this.inView;
    }
}