import { Component , Input , OnDestroy , OnInit } from "@angular/core" ; import { ZonesService } from "../shared/zones.service" ; import { MatSnackBar } from "@angular/material" ; import * as _ from "lodash" ; import { ZoneChangeOrderModel } from "../shared/zone-change-order.model" ; import { ZoneChangeWhisperModel } from "../shared/zone-change-whisper.model" ; import { ZoneChangeTypeModel } from "./zone-change-type.model" ; import { ZoneDefinitionModel } from "../../shared/models/zone-definition.model" ; import { Subscription } from "rxjs" ; import { ZoneModel } from "@elevate/shared/models" ; import { LoggerService } from "../../shared/services/logging/logger.service" ; @ Component ( { selector : "app-zone" , templateUrl : "./zone.component.html" , styleUrls : [ "./zone.component.scss" ] } ) export class ZoneComponent implements OnInit , OnDestroy { @ Input ( "zone" ) public zone : ZoneModel ; @ Input ( "zoneId" ) public zoneId : number ; @ Input ( "zoneFrom" ) public zoneFrom : number ; @ Input ( "zoneTo" ) public zoneTo : number ; @ Input ( "prevZoneFrom" ) public prevZoneFrom : number ; @ Input ( "nextZoneTo" ) public nextZoneTo : number ; @ Input ( "isFirstZone" ) public isFirstZone : boolean ; @ Input ( "isLastZone" ) public isLastZone : boolean ; @ Input ( "currentZones" ) public currentZones : ZoneModel [ ] ; @ Input ( "zoneDefinition" ) public zoneDefinition : ZoneDefinitionModel ; public zoneChangeOrderSubscription : Subscription ; public stepUpdatesSubscription : Subscription ; constructor ( public zonesService , public snackBar , public logger ) { } public ngOnInit ( ) { this . zoneChangeOrderSubscription = this . zonesService . zoneChangeOrderUpdates . subscribe ( ( change ) => { const isChangeOrderForMe = ( ! _ . isNull ( change ) && ( this . zoneId === change . destinationId ) ) ; if ( isChangeOrderForMe ) { this . applyChangeOrder ( change ) ; } } , error => { this . logger . error ( error ) ; } , ( ) => { this . logger . info ( "InstructionListener complete" ) ; } ) ; this . stepUpdatesSubscription = this . zonesService . stepUpdates . subscribe ( ( step ) => { this . zoneDefinition . step = step ; } ) ; } public onZoneChange ( changeType ) { this . whisperZoneChange ( changeType ) ; } param { ZoneChangeTypeModel } changeType public whisperZoneChange ( changeType ) { if ( changeType . from && changeType . to ) { return ; } if ( changeType . from || changeType . to ) { const zoneChangeWhisper = { sourceId : this . zoneId , from : false , to : false , value : null } ; if ( changeType . from ) { zoneChangeWhisper . from = true ; zoneChangeWhisper . value = this . zone . from ; } else if ( changeType . to ) { zoneChangeWhisper . to = true ; zoneChangeWhisper . value = this . zone . to ; } this . zonesService . whisperZoneChange ( zoneChangeWhisper ) ; } } private applyChangeOrder ( instruction ) { if ( instruction . from ) { this . zone . from = instruction . value ; } if ( instruction . to ) { this . zone . to = instruction . value ; } } public onRemoveZoneAtIndex ( zoneId ) { this . zonesService . removeZoneAtIndex ( zoneId ) . then ( message => this . popSnack ( message ) , error => this . popSnack ( error ) ) ; } param { KeyboardEvent } event public onKeyDown ( event ) { const whiteListCode = [ 38 , 40 , 9 , 16 ] ; const isKeyWhiteListed = _ . indexOf ( whiteListCode , event . keyCode ) === - 1 ; if ( isKeyWhiteListed ) { event . preventDefault ( ) ; } } private popSnack ( message ) { this . snackBar . open ( message , "Close" , { duration : 2500 } ) ; } public ngOnDestroy ( ) { this . zoneChangeOrderSubscription . unsubscribe ( ) ; this . stepUpdatesSubscription . unsubscribe ( ) ; } }