import { Injectable } from "@angular/core" ; import { FullscreenControls } from "../interfaces/fullscreen-controls.interface" ; @ Injectable ( ) export class FullscreenService { private fnMap : string [ ] [ ] = [ [ "requestFullscreen" , "exitFullscreen" , "fullscreenElement" , "fullscreenEnabled" , "fullscreenchange" , "fullscreenerror" ] , [ "webkitRequestFullscreen" , "webkitExitFullscreen" , "webkitFullscreenElement" , "webkitFullscreenEnabled" , "webkitfullscreenchange" , "webkitfullscreenerror" ] , [ "webkitRequestFullScreen" , "webkitCancelFullScreen" , "webkitCurrentFullScreenElement" , "webkitCancelFullScreen" , "webkitfullscreenchange" , "webkitfullscreenerror" ] , [ "mozRequestFullScreen" , "mozCancelFullScreen" , "mozFullScreenElement" , "mozFullScreenEnabled" , "mozfullscreenchange" , "mozfullscreenerror" ] , [ "msRequestFullscreen" , "msExitFullscreen" , "msFullscreenElement" , "msFullscreenEnabled" , "MSFullscreenChange" , "MSFullscreenError" ] ] ; private fn : FullscreenControls ; private keyboardAllowed : boolean ; constructor ( ) { this . keyboardAllowed = typeof Element !== "undefined" && "ALLOW_KEYBOARD_INPUT" in Element ; const ret = { } ; let val ; for ( let i = 0 ; i < this . fnMap . length ; i ++ ) { val = this . fnMap [ i ] ; if ( val && val [ 1 ] in document ) { for ( i = 0 ; i < val . length ; i ++ ) { ret [ this . fnMap [ 0 ] [ i ] . toString ( ) ] = val [ i ] ; } this . fn = ret ; } } } public request ( elem ) { const request = this . fn . requestFullscreen ; elem = elem || document . documentElement ; if ( /5\.1[.\d]* Safari/ . test ( navigator . userAgent ) ) { elem [ request ] ( ) ; } else { elem [ request ] ( this . keyboardAllowed ? ( Element as any ) . ALLOW_KEYBOARD_INPUT : { } ) ; } } public exit ( ) { document [ this . fn . exitFullscreen ] ( ) ; } public toggle ( elem ) { if ( this . isFullscreen ( ) ) { this . exit ( ) ; } else { this . request ( elem ) ; } } public onChange ( callback ) { document . addEventListener ( this . fn . fullscreenchange , callback , false ) ; } public onError ( callback ) { document . addEventListener ( this . fn . fullscreenerror , callback , false ) ; } public isFullscreen ( ) { return Boolean ( document [ this . fn . fullscreenElement ] ) ; } public isEnabled ( ) { return Boolean ( document [ this . fn . fullscreenEnabled ] ) ; } public getElement ( ) { return document [ this . fn . fullscreenElement ] ; } }