import { Directive , Input , OnInit , HostListener , OnDestroy , HostBinding } from '@angular/core' ; import { MatSidenav } from '@angular/material/sidenav' ; import { Subject } from 'rxjs' ; import { takeUntil } from 'rxjs/operators' ; import { FuseMatchMediaService } from '@fuse/services/match-media.service' ; import { FuseMatSidenavHelperService } from '@fuse/directives/fuse-mat-sidenav/fuse-mat-sidenav.service' ; import { MediaObserver } from '@angular/flex-layout' ; @ Directive ( { selector : '[fuseMatSidenavHelper]' } ) export class FuseMatSidenavHelperDirective implements OnInit , OnDestroy { @ HostBinding ( 'class.mat-is-locked-open' ) isLockedOpen : boolean ; @ Input ( ) fuseMatSidenavHelper : string ; @ Input ( ) matIsLockedOpen : string ; private _unsubscribeAll : Subject < any > ; param { FuseMatchMediaService } _fuseMatchMediaService param { FuseMatSidenavHelperService } _fuseMatSidenavHelperService param { MatSidenav } _matSidenav param { ObservableMedia } _observableMedia constructor ( private _fuseMatchMediaService , private _fuseMatSidenavHelperService , private _matSidenav , private _observableMedia ) { this . isLockedOpen = true ; this . _unsubscribeAll = new Subject ( ) ; } /**
     * On init
     */ ngOnInit ( ) { this . _fuseMatSidenavHelperService . setSidenav ( this . fuseMatSidenavHelper , this . _matSidenav ) ; if ( this . _observableMedia . isActive ( this . matIsLockedOpen ) ) { this . isLockedOpen = true ; this . _matSidenav . mode = 'side' ; this . _matSidenav . toggle ( true ) ; } else { this . isLockedOpen = false ; this . _matSidenav . mode = 'over' ; this . _matSidenav . toggle ( false ) ; } this . _fuseMatchMediaService . onMediaChange . pipe ( takeUntil ( this . _unsubscribeAll ) ) . subscribe ( ( ) => { if ( this . _observableMedia . isActive ( this . matIsLockedOpen ) ) { this . isLockedOpen = true ; this . _matSidenav . mode = 'side' ; this . _matSidenav . toggle ( true ) ; } else { this . isLockedOpen = false ; this . _matSidenav . mode = 'over' ; this . _matSidenav . toggle ( false ) ; } } ) ; } /**
     * On destroy
     */ ngOnDestroy ( ) { this . _unsubscribeAll . next ( ) ; this . _unsubscribeAll . complete ( ) ; } } @ Directive ( { selector : '[fuseMatSidenavToggler]' } ) export class FuseMatSidenavTogglerDirective { @ Input ( ) fuseMatSidenavToggler : string ; param { FuseMatSidenavHelperService } _fuseMatSidenavHelperService constructor ( private _fuseMatSidenavHelperService ) { } /**
     * On click
     */ @ HostListener ( 'click' ) onClick ( ) { this . _fuseMatSidenavHelperService . getSidenav ( this . fuseMatSidenavToggler ) . toggle ( ) ; } }