import { Directive } from '@angular/core' ; import { coerceNumberProperty } from '@angular/cdk/coercion' ; import { EMPTY , fromEvent , merge , Observable , of } from 'rxjs' ; import { map , pluck , switchMap , tap } from 'rxjs/operators' ; import { preventSelection , enableSelection , stopPropagation } from '../common' ; import { NgScrollbarBase } from '../../ng-scrollbar-base' ; @ Directive ( ) export abstract class TrackAdapter { get clicked ( ) : Observable < MouseEvent > { const mouseDown = fromEvent < MouseEvent > ( this . trackElement , 'mousedown' , { passive : true } ) . pipe ( stopPropagation ( ) , preventSelection ( this . document ) ) ; const mouseup = fromEvent < MouseEvent > ( this . document , 'mouseup' , { passive : true } ) . pipe ( stopPropagation ( ) , enableSelection ( this . document ) , switchMap ( ( ) => EMPTY ) ) ; return merge ( mouseDown , mouseup ) ; } abstract get pageProperty ( ) : string ; abstract get size ( ) : number ; abstract get offset ( ) : number ; get clientRect ( ) : DOMRect { return this . trackElement . getBoundingClientRect ( ) ; } protected constructor ( protected cmp , protected trackElement , protected document ) { } /**
     * Stream that emits when scrollbar track is clicked
     */ onTrackClicked ( e , thumbSize , scrollSize ) { return of ( e ) . pipe ( pluck ( this . pageProperty ) , map ( ( pageOffset ) => { const clickOffset = pageOffset - this . offset ; const offset = clickOffset - ( thumbSize / 2 ) ; const ratio = offset / this . size ; return ratio * scrollSize ; } ) , tap ( ( value ) => { this . cmp . scrollTo ( { ... this . mapToScrollToOption ( value ) , duration : coerceNumberProperty ( this . cmp . trackClickScrollDuration ) } ) ; } ) ) ; } protected abstract mapToScrollToOption ( value ) ; }