ignore import { Component , OnInit , OnDestroy , Input , Output , ElementRef , EventEmitter , PLATFORM_ID , Inject , AfterContentInit } from '@angular/core' ; import { isPlatformBrowser } from '@angular/common' ; import { Observable } from 'rxjs' ; declare var require ; import { MasonryOptions , Masonry as IMasonry , AnimationOptions , MasonryGridItem } from './ng-masonry-grid.interface' ; import { NgMasonryGridService } from './ng-masonry-grid.service' ; @ Component ( { selector : '[ng-masonry-grid], ng-masonry-grid' , template : '<ng-content></ng-content>' , styles : [ `
		:host {
			display: block;
		}
	` ] } ) export class NgMasonryGridComponent implements OnInit , OnDestroy , AfterContentInit { public _msnry : IMasonry ; @ Input ( ) public masonryOptions : MasonryOptions = { } ; @ Input ( ) public useAnimation = false ; @ Input ( ) public scrollAnimationOptions : AnimationOptions ; @ Input ( ) public useImagesLoaded = false ; @ Output ( ) layoutComplete : EventEmitter < any [ ] > = new EventEmitter < any [ ] > ( ) ; @ Output ( ) removeComplete : EventEmitter < any [ ] > = new EventEmitter < any [ ] > ( ) ; @ Output ( ) onNgMasonryInit : EventEmitter < IMasonry > = new EventEmitter < IMasonry > ( ) ; constructor ( @ Inject ( PLATFORM_ID ) private _platformId , private _element , private masonryGridService ) { } ngOnInit ( ) { this . _element . nativeElement . classList . add ( 'grid' ) ; this . initializeMasonry ( ) ; } ngAfterContentInit ( ) { } ngOnDestroy ( ) { if ( this . _msnry ) { this . _msnry . destroy ( ) ; this . masonryGridService . onDestory ( ) ; } } public layout ( ) { setTimeout ( ( ) => { this . _msnry . layout ( ) ; } , 50 ) ; } public remove ( element ) { this . _msnry . remove ( element ) ; this . layout ( ) ; } public add ( element ) { this . masonryGridService . add ( element ) ; } public initializeMasonry ( ) { this . _msnry = this . masonryGridService . init ( this . _element . nativeElement , this . masonryOptions , this . useAnimation , this . scrollAnimationOptions , this . useImagesLoaded ) ; this . _msnry . on ( 'layoutComplete' , ( items ) => { this . layoutComplete . emit ( items ) ; } ) ; this . _msnry . on ( 'removeComplete' , ( items ) => { this . removeComplete . emit ( items ) ; } ) ; this . _msnry . removeAnimation = ( ) => { this . masonryGridService . removeAnimation ( ) ; } ; this . _msnry . setAddStatus = ( value ) => { this . masonryGridService . setAddStatus ( value ) ; } ; this . _msnry . removeItem = ( item ) : Observable < MasonryGridItem > => { return this . masonryGridService . removeItem ( item ) ; } ; this . _msnry . removeFirstItem = ( ) : Observable < MasonryGridItem > => { return this . masonryGridService . removeFirstItem ( ) ; } ; this . _msnry . removeAllItems = ( ) : Observable < MasonryGridItem > => { return this . masonryGridService . removeAllItems ( ) ; } ; this . _msnry . reOrderItems = ( ) : void => { return this . masonryGridService . reorderMasonryItems ( ) ; } ; this . onNgMasonryInit . emit ( this . _msnry ) ; this . layout ( ) ; } }