ignore import { Directive , Inject , ElementRef , forwardRef , OnDestroy , AfterViewInit , PLATFORM_ID , OnInit } from '@angular/core' ; import { NgMasonryGridComponent } from './ng-masonry-grid.component' ; import { isPlatformBrowser } from '@angular/common' ; import { NgMasonryGridService } from './ng-masonry-grid.service' ; interface MutationWindow extends Window { MutationObserver : any ; WebKitMutationObserver : any ; } declare var window ; @ Directive ( { selector : '[ng-masonry-grid-item], ng-masonry-grid-item' } ) export class NgMasonryGridDirective implements OnDestroy , AfterViewInit , OnInit { constructor ( private _element , @ Inject ( forwardRef ( ( ) => NgMasonryGridComponent ) ) private _parent , @ Inject ( PLATFORM_ID ) private platformId , private masonryGridService ) { } ngOnInit ( ) { } /**
     * Add Masonry grid item after view initialization
     */ ngAfterViewInit ( ) { if ( isPlatformBrowser ( this . platformId ) ) { this . masonryGridService . itemsCount ++ ; this . _element . nativeElement . setAttribute ( 'data-count' , this . masonryGridService . itemsCount ) ; this . _parent . add ( this . _element . nativeElement ) ; this . watchForHtmlChanges ( ) ; } } ngOnDestroy ( ) { } /** When HTML in brick changes dynamically, observe that and change layout */ private watchForHtmlChanges ( ) { MutationObserver = window . MutationObserver || window . WebKitMutationObserver ; if ( MutationObserver ) { /** Watch for any changes to subtree */ let self = this ; let observer = new MutationObserver ( ( mutations , observerFromElement ) => { self . _parent . layout ( ) ; } ) ; observer . observe ( this . _element . nativeElement , { subtree : true , childList : true } ) ; } } }