import { IViewAbility } from "./IViewAbility"; declare var window: any; declare var performance: any; window.performance = window.performance || {}; performance.now = (function () { return performance.now || performance.mozNow || performance.msNow || performance.oNow || performance.webkitNow || function () { return new Date().getTime(); }; })(); export class RequestAnimationFrame implements IViewAbility { private passTest: boolean; private delta = 250; private frame: HTMLElement; private last = 0; private ad: any; constructor(el: any) { let frame = document.createElement("iframe"); el.parentNode.appendChild(frame); frame.id = "VisFrame1"; frame.style.width = "4px"; frame.style.height = "4px"; frame.style.backgroundColor = "blue"; frame.style.verticalAlign = "top"; frame.scrolling = "no"; frame.frameBorder = "0"; let top = el.offsetTop; let left = el.offsetLeft; let width = el.offsetWidth; let height = el.offsetHeight; while (el.offsetParent) { el = el.offsetParent; top += el.offsetTop; left += el.offsetLeft; } frame.style.marginTop = "-" + Math.round((height + top) / 2) + "px"; frame.style.marginLeft = Math.round((width + left) / 2) + "px"; this.listen(); this.frame = frame; frame.src = "data:text/html;charset=UTF-8," + '"; } public isSupported(cb?: Function): boolean { if (typeof requestAnimationFrame === "undefined" || typeof this.ad === "undefined" || this.ad == null || !this.passTest) { return false; } return true; } public isView = () => { if (this.isSupported()) { return false; } let avg = (((this.time() - this.last) + this.delta) / 2); return (avg < 55); } private time = () => { return performance.now(); } private listen = () => { let self = this; self.last = 0; /* last time we received an update */ window.addEventListener("message", function (e: any) { let time = self.time(); let diff = (time - self.last); self.last = time; self.delta = Math.round((self.delta + diff) / 2); }); } }