import { Component , Input , OnDestroy , OnInit , ViewEncapsulation } from '@angular/core' ; import { interval , Subject } from 'rxjs' ; import { map , takeUntil } from 'rxjs/operators' ; import * as moment from 'moment' ; @ Component ( { selector : 'fuse-countdown' , templateUrl : './countdown.component.html' , styleUrls : [ './countdown.component.scss' ] , encapsulation : ViewEncapsulation . None } ) export class FuseCountdownComponent implements OnInit , OnDestroy { @ Input ( 'eventDate' ) eventDate ; countdown : any ; private _unsubscribeAll : Subject < any > ; /**
     * Constructor
     */ constructor ( ) { this . countdown = { days : '' , hours : '' , minutes : '' , seconds : '' } ; this . _unsubscribeAll = new Subject ( ) ; } /**
     * On init
     */ ngOnInit ( ) { const currDate = moment ( ) ; const eventDate = moment ( this . eventDate ) ; let diff = eventDate . diff ( currDate , 'seconds' ) ; this . countdown = this . _secondsToRemaining ( diff ) ; const countDown = interval ( 1000 ) . pipe ( map ( value => { return diff = diff - 1 ; } ) , map ( value => { return this . _secondsToRemaining ( value ) ; } ) ) ; countDown . pipe ( takeUntil ( this . _unsubscribeAll ) ) . subscribe ( value => { this . countdown = value ; } ) ; } /**
     * On destroy
     */ ngOnDestroy ( ) { this . _unsubscribeAll . next ( ) ; this . _unsubscribeAll . complete ( ) ; } param seconds private private _secondsToRemaining ( seconds ) { const timeLeft = moment . duration ( seconds , 'seconds' ) ; return { days : timeLeft . asDays ( ) . toFixed ( 0 ) , hours : timeLeft . hours ( ) , minutes : timeLeft . minutes ( ) , seconds : timeLeft . seconds ( ) } ; } }