import { Injectable , OnDestroy , ElementRef , Optional } from '@angular/core' ; import { coerceBooleanProperty } from '@angular/cdk/coercion' ; import { supportsPassiveEventListeners } from '@angular/cdk/platform' ; import { EventType , SpecificEventListener } from '@material/base' ; import { matches } from '@angular-mdc/web/dom' ; import { MDCRippleFoundation , MDCRippleAdapter , util } from '@material/ripple' ; export interface MDCRippleCapableSurface { readonly _root : Element ; unbounded ? : boolean ; disabled ? : boolean ; } @ Injectable ( ) export class MdcRipple implements OnDestroy { private _foundation ! : MDCRippleFoundation ; initialized : boolean = false ; static createAdapter ( instance ) { const adapter = { addClass : ( className ) => instance . _root . classList . add ( className ) , removeClass : ( className ) => instance . _root . classList . remove ( className ) , browserSupportsCssVars : ( ) => typeof window !== 'undefined' ? util . supportsCssVariables ( window ) : false , isUnbounded : ( ) => coerceBooleanProperty ( instance . unbounded ) , isSurfaceActive : ( ) => matches ( instance . _root , ':active' ) , isSurfaceDisabled : ( ) => coerceBooleanProperty ( instance . disabled ) , containsEventTarget : ( target ) => instance . _root . contains ( target as Node ) , registerDocumentInteractionHandler : < K extends EventType > ( evtType , handler ) => typeof document === 'object' && ! ! document ? document . documentElement ! . addEventListener ( evtType , handler , supportsPassiveEventListeners ( ) ) : { } , deregisterDocumentInteractionHandler : < K extends EventType > ( evtType , handler ) => typeof document === 'object' && ! ! document ? document . documentElement ! . removeEventListener ( evtType , handler , supportsPassiveEventListeners ( ) ) : { } , registerResizeHandler : ( handler ) => typeof window !== 'undefined' ? window . addEventListener ( 'resize' , handler ) : { } , deregisterResizeHandler : ( handler ) => typeof window !== 'undefined' ? window . removeEventListener ( 'resize' , handler ) : { } , updateCssVariable : ( varName , value ) => ( instance . _root as HTMLElement ) . style . setProperty ( varName , value ) , computeBoundingRect : ( ) => typeof document === 'object' && ! ! document ? instance . _root . getBoundingClientRect ( ) : ( { top : 0 , right : 0 , bottom : 0 , left : 0 , width : 0 , height : 0 } ) , getWindowPageOffset : ( ) => typeof window !== 'undefined' ? ( { x : window . pageXOffset , y : window . pageYOffset } ) : ( { x : 0 , y : 0 } ) , registerInteractionHandler : < K extends EventType > ( evtType , handler ) => ( instance . _root as HTMLElement ) . addEventListener ( evtType , handler , supportsPassiveEventListeners ( ) ) , deregisterInteractionHandler : < K extends EventType > ( evtType , handler ) => ( instance . _root as HTMLElement ) . removeEventListener ( evtType , handler , supportsPassiveEventListeners ( ) ) } ; return adapter ; } constructor ( public element , @ Optional ( ) foundation ? ) { this . _foundation = foundation || new MDCRippleFoundation ( MdcRipple . createAdapter ( { _root : element . nativeElement } as MDCRippleCapableSurface ) ) ; } init ( ) { if ( ! this . initialized ) { this . _foundation . init ( ) ; this . initialized = true ; } } destroy ( ) { if ( this . initialized ) { this . initialized = false ; this . _foundation . destroy ( ) ; } } layout ( ) { this . _foundation . layout ( ) ; } ngOnDestroy ( ) { this . destroy ( ) ; } activateRipple ( event ? ) { setTimeout ( ( ) => this . _foundation ! . activate ( event ) ) ; } deactivateRipple ( ) { setTimeout ( ( ) => this . _foundation ! . deactivate ( ) ) ; } handleBlur ( ) { this . _foundation . handleBlur ( ) ; } }