@neocomplexx/ngx-neo-directives-mat
Version:
59 lines • 6.71 kB
JavaScript
import { __decorate, __metadata } from "tslib";
import { Directive, ElementRef, Input, HostListener } from '@angular/core';
let NeoMatchHeightDirective = class NeoMatchHeightDirective {
constructor(el) {
this.el = el;
}
onResize() {
this.matchHeight(this.el.nativeElement, this.matchHeightClassName);
}
ngAfterViewChecked() {
this.matchHeight(this.el.nativeElement, this.matchHeightClassName);
}
matchHeight(parent, className) {
if (!parent) {
return;
}
// step 1: find all the child elements with the selected class name
const children = parent.getElementsByClassName(className);
if (!children) {
return;
}
// step 1b: reset all children height
Array.from(children).forEach((x) => {
x.style.height = 'initial';
});
// step 2a: get all the child elements heights
const itemHeights = Array.from(children)
.map(x => x.getBoundingClientRect().height);
// step 2b: find out the tallest
const maxHeight = itemHeights.reduce((prev, curr) => {
return curr > prev ? curr : prev;
}, 0);
// step 3: update all the child elements to the tallest height
Array.from(children)
.forEach((x) => x.style.height = `${maxHeight}px`);
}
};
NeoMatchHeightDirective.ctorParameters = () => [
{ type: ElementRef }
];
__decorate([
Input('neoMatchHeight'),
__metadata("design:type", String)
], NeoMatchHeightDirective.prototype, "matchHeightClassName", void 0);
__decorate([
HostListener('window:resize'),
__metadata("design:type", Function),
__metadata("design:paramtypes", []),
__metadata("design:returntype", void 0)
], NeoMatchHeightDirective.prototype, "onResize", null);
NeoMatchHeightDirective = __decorate([
Directive({
// tslint:disable-next-line:directive-selector
selector: '[neoMatchHeight]'
}),
__metadata("design:paramtypes", [ElementRef])
], NeoMatchHeightDirective);
export { NeoMatchHeightDirective };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmVvLW1hdGNoaGVpZ2h0LmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BuZW9jb21wbGV4eC9uZ3gtbmVvLWRpcmVjdGl2ZXMtbWF0LyIsInNvdXJjZXMiOlsibGliL25lby1tYXRjaGhlaWdodC5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sRUFDSCxTQUFTLEVBQUUsVUFBVSxFQUNyQixLQUFLLEVBQUUsWUFBWSxFQUN0QixNQUFNLGVBQWUsQ0FBQztBQU92QixJQUFhLHVCQUF1QixHQUFwQyxNQUFhLHVCQUF1QjtJQU9oQyxZQUFvQixFQUFjO1FBQWQsT0FBRSxHQUFGLEVBQUUsQ0FBWTtJQUNsQyxDQUFDO0lBTDhCLFFBQVE7UUFDbkMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsRUFBRSxJQUFJLENBQUMsb0JBQW9CLENBQUMsQ0FBQztJQUN2RSxDQUFDO0lBS0Qsa0JBQWtCO1FBQ2QsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsRUFBRSxJQUFJLENBQUMsb0JBQW9CLENBQUMsQ0FBQztJQUN2RSxDQUFDO0lBRU0sV0FBVyxDQUFDLE1BQW1CLEVBQUUsU0FBaUI7UUFDckQsSUFBSSxDQUFDLE1BQU0sRUFBRTtZQUFFLE9BQU87U0FBRTtRQUV4QixtRUFBbUU7UUFDbkUsTUFBTSxRQUFRLEdBQUcsTUFBTSxDQUFDLHNCQUFzQixDQUFDLFNBQVMsQ0FBQyxDQUFDO1FBRTFELElBQUksQ0FBQyxRQUFRLEVBQUU7WUFBRSxPQUFPO1NBQUU7UUFFMUIscUNBQXFDO1FBQ3JDLEtBQUssQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBYyxFQUFFLEVBQUU7WUFDNUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxNQUFNLEdBQUcsU0FBUyxDQUFDO1FBQy9CLENBQUMsQ0FBQyxDQUFDO1FBRUgsOENBQThDO1FBQzlDLE1BQU0sV0FBVyxHQUFHLEtBQUssQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDO2FBQ25DLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsQ0FBQyxxQkFBcUIsRUFBRSxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBRWhELGdDQUFnQztRQUNoQyxNQUFNLFNBQVMsR0FBRyxXQUFXLENBQUMsTUFBTSxDQUFDLENBQUMsSUFBSSxFQUFFLElBQUksRUFBRSxFQUFFO1lBQ2hELE9BQU8sSUFBSSxHQUFHLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUM7UUFDckMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDO1FBRU4sOERBQThEO1FBQzlELEtBQUssQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDO2FBQ2YsT0FBTyxDQUFDLENBQUMsQ0FBYyxFQUFFLEVBQUUsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLE1BQU0sR0FBRyxHQUFHLFNBQVMsSUFBSSxDQUFDLENBQUM7SUFDeEUsQ0FBQztDQUNKLENBQUE7O1lBakMyQixVQUFVOztBQU5UO0lBQXhCLEtBQUssQ0FBQyxnQkFBZ0IsQ0FBQzs7cUVBQThCO0FBRXZCO0lBQTlCLFlBQVksQ0FBQyxlQUFlLENBQUM7Ozs7dURBRTdCO0FBTFEsdUJBQXVCO0lBSm5DLFNBQVMsQ0FBQztRQUNQLDhDQUE4QztRQUM5QyxRQUFRLEVBQUUsa0JBQWtCO0tBQy9CLENBQUM7cUNBUTBCLFVBQVU7R0FQekIsdUJBQXVCLENBd0NuQztTQXhDWSx1QkFBdUIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xyXG4gICAgRGlyZWN0aXZlLCBFbGVtZW50UmVmLFxyXG4gICAgSW5wdXQsIEhvc3RMaXN0ZW5lclxyXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBBZnRlclZpZXdDaGVja2VkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG5ARGlyZWN0aXZlKHtcclxuICAgIC8vIHRzbGludDpkaXNhYmxlLW5leHQtbGluZTpkaXJlY3RpdmUtc2VsZWN0b3JcclxuICAgIHNlbGVjdG9yOiAnW25lb01hdGNoSGVpZ2h0XSdcclxufSlcclxuZXhwb3J0IGNsYXNzIE5lb01hdGNoSGVpZ2h0RGlyZWN0aXZlIGltcGxlbWVudHMgQWZ0ZXJWaWV3Q2hlY2tlZCB7XHJcbiAgICBASW5wdXQoJ25lb01hdGNoSGVpZ2h0JykgbWF0Y2hIZWlnaHRDbGFzc05hbWU6IHN0cmluZztcclxuXHJcbiAgICBASG9zdExpc3RlbmVyKCd3aW5kb3c6cmVzaXplJykgb25SZXNpemUoKSB7XHJcbiAgICAgICAgdGhpcy5tYXRjaEhlaWdodCh0aGlzLmVsLm5hdGl2ZUVsZW1lbnQsIHRoaXMubWF0Y2hIZWlnaHRDbGFzc05hbWUpO1xyXG4gICAgfVxyXG5cclxuICAgIGNvbnN0cnVjdG9yKHByaXZhdGUgZWw6IEVsZW1lbnRSZWYpIHtcclxuICAgIH1cclxuXHJcbiAgICBuZ0FmdGVyVmlld0NoZWNrZWQoKSB7XHJcbiAgICAgICAgdGhpcy5tYXRjaEhlaWdodCh0aGlzLmVsLm5hdGl2ZUVsZW1lbnQsIHRoaXMubWF0Y2hIZWlnaHRDbGFzc05hbWUpO1xyXG4gICAgfVxyXG5cclxuICAgIHB1YmxpYyBtYXRjaEhlaWdodChwYXJlbnQ6IEhUTUxFbGVtZW50LCBjbGFzc05hbWU6IHN0cmluZykge1xyXG4gICAgICAgIGlmICghcGFyZW50KSB7IHJldHVybjsgfVxyXG5cclxuICAgICAgICAvLyBzdGVwIDE6IGZpbmQgYWxsIHRoZSBjaGlsZCBlbGVtZW50cyB3aXRoIHRoZSBzZWxlY3RlZCBjbGFzcyBuYW1lXHJcbiAgICAgICAgY29uc3QgY2hpbGRyZW4gPSBwYXJlbnQuZ2V0RWxlbWVudHNCeUNsYXNzTmFtZShjbGFzc05hbWUpO1xyXG5cclxuICAgICAgICBpZiAoIWNoaWxkcmVuKSB7IHJldHVybjsgfVxyXG5cclxuICAgICAgICAvLyBzdGVwIDFiOiByZXNldCBhbGwgY2hpbGRyZW4gaGVpZ2h0XHJcbiAgICAgICAgQXJyYXkuZnJvbShjaGlsZHJlbikuZm9yRWFjaCgoeDogSFRNTEVsZW1lbnQpID0+IHtcclxuICAgICAgICAgICAgeC5zdHlsZS5oZWlnaHQgPSAnaW5pdGlhbCc7XHJcbiAgICAgICAgfSk7XHJcblxyXG4gICAgICAgIC8vIHN0ZXAgMmE6IGdldCBhbGwgdGhlIGNoaWxkIGVsZW1lbnRzIGhlaWdodHNcclxuICAgICAgICBjb25zdCBpdGVtSGVpZ2h0cyA9IEFycmF5LmZyb20oY2hpbGRyZW4pXHJcbiAgICAgICAgICAgIC5tYXAoeCA9PiB4LmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpLmhlaWdodCk7XHJcblxyXG4gICAgICAgIC8vIHN0ZXAgMmI6IGZpbmQgb3V0IHRoZSB0YWxsZXN0XHJcbiAgICAgICAgY29uc3QgbWF4SGVpZ2h0ID0gaXRlbUhlaWdodHMucmVkdWNlKChwcmV2LCBjdXJyKSA9PiB7XHJcbiAgICAgICAgICAgIHJldHVybiBjdXJyID4gcHJldiA/IGN1cnIgOiBwcmV2O1xyXG4gICAgICAgIH0sIDApO1xyXG5cclxuICAgICAgICAvLyBzdGVwIDM6IHVwZGF0ZSBhbGwgdGhlIGNoaWxkIGVsZW1lbnRzIHRvIHRoZSB0YWxsZXN0IGhlaWdodFxyXG4gICAgICAgIEFycmF5LmZyb20oY2hpbGRyZW4pXHJcbiAgICAgICAgICAgIC5mb3JFYWNoKCh4OiBIVE1MRWxlbWVudCkgPT4geC5zdHlsZS5oZWlnaHQgPSBgJHttYXhIZWlnaHR9cHhgKTtcclxuICAgIH1cclxufVxyXG4iXX0=