import { ESLMedia } from './esl-media' ; const RATIO_TO_ACTIVATE = 0.75 ; const RATIO_TO_DEACTIVATE = 0.20 ; let iObserver ; /** ESL Media Play-In-Viewport IntersectionObserver instance */ export function getIObserver ( lazy = false ) { if ( ! iObserver && ! lazy ) { iObserver = new IntersectionObserver ( function ( entries ) { entries . forEach ( handleViewport ) ; } , { threshold : [ RATIO_TO_DEACTIVATE , RATIO_TO_ACTIVATE ] } ) ; } return iObserver ; } function handleViewport ( entry ) { const { target : video } = entry ; if ( ! ( video instanceof ESLMedia ) ) return ; if ( video . active && entry . intersectionRatio <= RATIO_TO_DEACTIVATE ) { video . pause ( ) ; } if ( ! video . active && video . autoplay && entry . intersectionRatio >= RATIO_TO_ACTIVATE ) { video . play ( ) ; } }