UNPKG

ngm-masonry

Version:

Angular Module for displaying a feed of items in a masonry layout using https://github.com/glebmlk/ngx-masonry

108 lines 8.24 kB
/** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ import { isPlatformBrowser } from '@angular/common'; import { Directive, ElementRef, forwardRef, Inject, PLATFORM_ID, } from '@angular/core'; import { NgmMasonryComponent } from './ngm-masonry.component'; /** * @record */ function IMutationWindow() { } if (false) { /** @type {?} */ IMutationWindow.prototype.MutationObserver; /** @type {?} */ IMutationWindow.prototype.WebKitMutationObserver; } export class NgmMasonryDirective { /** * @param {?} _element * @param {?} _parent * @param {?} platformId */ constructor(_element, _parent, platformId) { this._element = _element; this._parent = _parent; this.platformId = platformId; } /** * @return {?} */ ngAfterViewInit() { if (isPlatformBrowser(this.platformId)) { this._parent.add(this._element.nativeElement); this.watchForHtmlChanges(); } } /** * @return {?} */ ngOnDestroy() { if (isPlatformBrowser(this.platformId)) { this._parent.remove(this._element.nativeElement); if (!!this._observer) { this._observer.disconnect(); } } } /** * When HTML in brick changes dynamically, observe that and change layout * @private * @return {?} */ watchForHtmlChanges() { MutationObserver = window.MutationObserver || window.WebKitMutationObserver; if (MutationObserver) { this._observer = new MutationObserver(() => { requestAnimationFrame(() => { this._parent.layout(); }); }); } if (!!this._observer) { // define what element should be observed by the observer // and what types of mutations trigger the callback this._observer.observe(this._element.nativeElement, { subtree: true, childList: true, attributes: true, attributeFilter: ['src'], }); } } } NgmMasonryDirective.decorators = [ { type: Directive, args: [{ selector: '[ngmMasonryItem], ngmMasonryItem', },] } ]; /** @nocollapse */ NgmMasonryDirective.ctorParameters = () => [ { type: ElementRef }, { type: NgmMasonryComponent, decorators: [{ type: Inject, args: [forwardRef(() => NgmMasonryComponent),] }] }, { type: undefined, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] } ]; if (false) { /** * @type {?} * @private */ NgmMasonryDirective.prototype._observer; /** * @type {?} * @private */ NgmMasonryDirective.prototype._element; /** * @type {?} * @private */ NgmMasonryDirective.prototype._parent; /** * @type {?} * @private */ NgmMasonryDirective.prototype.platformId; } //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmdtLW1hc29ucnkuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6Im5nOi8vbmdtLW1hc29ucnkvIiwic291cmNlcyI6WyJuZ20tbWFzb25yeS5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLE9BQU8sRUFBQyxpQkFBaUIsRUFBQyxNQUFNLGlCQUFpQixDQUFDO0FBQ2xELE9BQU8sRUFFSCxTQUFTLEVBQ1QsVUFBVSxFQUNWLFVBQVUsRUFDVixNQUFNLEVBRU4sV0FBVyxHQUNkLE1BQU0sZUFBZSxDQUFDO0FBRXZCLE9BQU8sRUFBQyxtQkFBbUIsRUFBQyxNQUFNLHlCQUF5QixDQUFDOzs7O0FBRTVELDhCQUdDOzs7SUFGRywyQ0FBc0I7O0lBQ3RCLGlEQUE0Qjs7QUFRaEMsTUFBTSxPQUFPLG1CQUFtQjs7Ozs7O0lBRzVCLFlBQ1ksUUFBb0IsRUFFcEIsT0FBNEIsRUFDUCxVQUFlO1FBSHBDLGFBQVEsR0FBUixRQUFRLENBQVk7UUFFcEIsWUFBTyxHQUFQLE9BQU8sQ0FBcUI7UUFDUCxlQUFVLEdBQVYsVUFBVSxDQUFLO0lBQzdDLENBQUM7Ozs7SUFFSixlQUFlO1FBQ1gsSUFBSSxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLEVBQUU7WUFDcEMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxhQUFhLENBQUMsQ0FBQztZQUM5QyxJQUFJLENBQUMsbUJBQW1CLEVBQUUsQ0FBQztTQUM5QjtJQUNMLENBQUM7Ozs7SUFFRCxXQUFXO1FBQ1AsSUFBSSxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLEVBQUU7WUFDcEMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxhQUFhLENBQUMsQ0FBQztZQUVqRCxJQUFJLENBQUMsQ0FBQyxJQUFJLENBQUMsU0FBUyxFQUFFO2dCQUNsQixJQUFJLENBQUMsU0FBUyxDQUFDLFVBQVUsRUFBRSxDQUFDO2FBQy9CO1NBQ0o7SUFDTCxDQUFDOzs7Ozs7SUFHTyxtQkFBbUI7UUFDdkIsZ0JBQWdCLEdBQUcsTUFBTSxDQUFDLGdCQUFnQixJQUFJLE1BQU0sQ0FBQyxzQkFBc0IsQ0FBQztRQUU1RSxJQUFJLGdCQUFnQixFQUFFO1lBQ2xCLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxnQkFBZ0IsQ0FBQyxHQUFHLEVBQUU7Z0JBQ3ZDLHFCQUFxQixDQUFDLEdBQUcsRUFBRTtvQkFDdkIsSUFBSSxDQUFDLE9BQU8sQ0FBQyxNQUFNLEVBQUUsQ0FBQztnQkFDMUIsQ0FBQyxDQUFDLENBQUM7WUFDUCxDQUFDLENBQUMsQ0FBQztTQUNOO1FBRUQsSUFBSSxDQUFDLENBQUMsSUFBSSxDQUFDLFNBQVMsRUFBRTtZQUNsQix5REFBeUQ7WUFDekQsbURBQW1EO1lBQ25ELElBQUksQ0FBQyxTQUFTLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsYUFBYSxFQUFFO2dCQUNoRCxPQUFPLEVBQUUsSUFBSTtnQkFDYixTQUFTLEVBQUUsSUFBSTtnQkFDZixVQUFVLEVBQUUsSUFBSTtnQkFDaEIsZUFBZSxFQUFFLENBQUMsS0FBSyxDQUFDO2FBQzNCLENBQUMsQ0FBQztTQUNOO0lBQ0wsQ0FBQzs7O1lBcERKLFNBQVMsU0FBQztnQkFDUCxRQUFRLEVBQUUsa0NBQWtDO2FBQy9DOzs7O1lBbEJHLFVBQVU7WUFPTixtQkFBbUIsdUJBaUJsQixNQUFNLFNBQUMsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLG1CQUFtQixDQUFDOzRDQUU1QyxNQUFNLFNBQUMsV0FBVzs7Ozs7OztJQU52Qix3Q0FBb0M7Ozs7O0lBR2hDLHVDQUE0Qjs7Ozs7SUFDNUIsc0NBQ29DOzs7OztJQUNwQyx5Q0FBNEMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge2lzUGxhdGZvcm1Ccm93c2VyfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHtcbiAgICBBZnRlclZpZXdJbml0LFxuICAgIERpcmVjdGl2ZSxcbiAgICBFbGVtZW50UmVmLFxuICAgIGZvcndhcmRSZWYsXG4gICAgSW5qZWN0LFxuICAgIE9uRGVzdHJveSxcbiAgICBQTEFURk9STV9JRCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7TmdtTWFzb25yeUNvbXBvbmVudH0gZnJvbSAnLi9uZ20tbWFzb25yeS5jb21wb25lbnQnO1xuXG5pbnRlcmZhY2UgSU11dGF0aW9uV2luZG93IGV4dGVuZHMgV2luZG93IHtcbiAgICBNdXRhdGlvbk9ic2VydmVyOiBhbnk7XG4gICAgV2ViS2l0TXV0YXRpb25PYnNlcnZlcjogYW55O1xufVxuXG5kZWNsYXJlIHZhciB3aW5kb3c6IElNdXRhdGlvbldpbmRvdztcblxuQERpcmVjdGl2ZSh7XG4gICAgc2VsZWN0b3I6ICdbbmdtTWFzb25yeUl0ZW1dLCBuZ21NYXNvbnJ5SXRlbScsXG59KVxuZXhwb3J0IGNsYXNzIE5nbU1hc29ucnlEaXJlY3RpdmUgaW1wbGVtZW50cyBPbkRlc3Ryb3ksIEFmdGVyVmlld0luaXQge1xuICAgIHByaXZhdGUgX29ic2VydmVyOiBNdXRhdGlvbk9ic2VydmVyO1xuXG4gICAgY29uc3RydWN0b3IoXG4gICAgICAgIHByaXZhdGUgX2VsZW1lbnQ6IEVsZW1lbnRSZWYsXG4gICAgICAgIEBJbmplY3QoZm9yd2FyZFJlZigoKSA9PiBOZ21NYXNvbnJ5Q29tcG9uZW50KSlcbiAgICAgICAgcHJpdmF0ZSBfcGFyZW50OiBOZ21NYXNvbnJ5Q29tcG9uZW50LFxuICAgICAgICBASW5qZWN0KFBMQVRGT1JNX0lEKSBwcml2YXRlIHBsYXRmb3JtSWQ6IGFueSxcbiAgICApIHt9XG5cbiAgICBuZ0FmdGVyVmlld0luaXQoKSB7XG4gICAgICAgIGlmIChpc1BsYXRmb3JtQnJvd3Nlcih0aGlzLnBsYXRmb3JtSWQpKSB7XG4gICAgICAgICAgICB0aGlzLl9wYXJlbnQuYWRkKHRoaXMuX2VsZW1lbnQubmF0aXZlRWxlbWVudCk7XG4gICAgICAgICAgICB0aGlzLndhdGNoRm9ySHRtbENoYW5nZXMoKTtcbiAgICAgICAgfVxuICAgIH1cblxuICAgIG5nT25EZXN0cm95KCkge1xuICAgICAgICBpZiAoaXNQbGF0Zm9ybUJyb3dzZXIodGhpcy5wbGF0Zm9ybUlkKSkge1xuICAgICAgICAgICAgdGhpcy5fcGFyZW50LnJlbW92ZSh0aGlzLl9lbGVtZW50Lm5hdGl2ZUVsZW1lbnQpO1xuXG4gICAgICAgICAgICBpZiAoISF0aGlzLl9vYnNlcnZlcikge1xuICAgICAgICAgICAgICAgIHRoaXMuX29ic2VydmVyLmRpc2Nvbm5lY3QoKTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgIH1cblxuICAgIC8qKiBXaGVuIEhUTUwgaW4gYnJpY2sgY2hhbmdlcyBkeW5hbWljYWxseSwgb2JzZXJ2ZSB0aGF0IGFuZCBjaGFuZ2UgbGF5b3V0ICovXG4gICAgcHJpdmF0ZSB3YXRjaEZvckh0bWxDaGFuZ2VzKCk6IHZvaWQge1xuICAgICAgICBNdXRhdGlvbk9ic2VydmVyID0gd2luZG93Lk11dGF0aW9uT2JzZXJ2ZXIgfHwgd2luZG93LldlYktpdE11dGF0aW9uT2JzZXJ2ZXI7XG5cbiAgICAgICAgaWYgKE11dGF0aW9uT2JzZXJ2ZXIpIHtcbiAgICAgICAgICAgIHRoaXMuX29ic2VydmVyID0gbmV3IE11dGF0aW9uT2JzZXJ2ZXIoKCkgPT4ge1xuICAgICAgICAgICAgICAgIHJlcXVlc3RBbmltYXRpb25GcmFtZSgoKSA9PiB7XG4gICAgICAgICAgICAgICAgICAgIHRoaXMuX3BhcmVudC5sYXlvdXQoKTtcbiAgICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH0pO1xuICAgICAgICB9XG5cbiAgICAgICAgaWYgKCEhdGhpcy5fb2JzZXJ2ZXIpIHtcbiAgICAgICAgICAgIC8vIGRlZmluZSB3aGF0IGVsZW1lbnQgc2hvdWxkIGJlIG9ic2VydmVkIGJ5IHRoZSBvYnNlcnZlclxuICAgICAgICAgICAgLy8gYW5kIHdoYXQgdHlwZXMgb2YgbXV0YXRpb25zIHRyaWdnZXIgdGhlIGNhbGxiYWNrXG4gICAgICAgICAgICB0aGlzLl9vYnNlcnZlci5vYnNlcnZlKHRoaXMuX2VsZW1lbnQubmF0aXZlRWxlbWVudCwge1xuICAgICAgICAgICAgICAgIHN1YnRyZWU6IHRydWUsXG4gICAgICAgICAgICAgICAgY2hpbGRMaXN0OiB0cnVlLFxuICAgICAgICAgICAgICAgIGF0dHJpYnV0ZXM6IHRydWUsXG4gICAgICAgICAgICAgICAgYXR0cmlidXRlRmlsdGVyOiBbJ3NyYyddLFxuICAgICAgICAgICAgfSk7XG4gICAgICAgIH1cbiAgICB9XG59XG4iXX0=