ngx-mat-cdk
Version:
Extra Components for Angular Material including Filters,Drag Drop File, MatSelect Mobile Version
69 lines • 8.63 kB
JavaScript
import { Directive, ElementRef, Input } from '@angular/core';
export class NgxCdkAvatarViewerDirective {
constructor(el) {
this.el = el;
this.defaultImage = '../../../../assets/no-image.png';
this.hasLoading = true;
this.imgSrc = '';
}
ngOnInit() {
this.el.nativeElement.style.display = 'none';
const container = document.createElement('div');
container.style.position = 'relative';
container.style.width = `${this.width}px`;
container.style.height = `${this.height}px`;
const loadingEl = document.createElement('div');
if (this.hasLoading) {
loadingEl.classList.add('ngx-cdk-loading');
loadingEl.classList.add('ngx-cdk-loading-avatar-viewer');
container.appendChild(loadingEl);
}
this.el.nativeElement.after(container);
container.appendChild(this.el.nativeElement);
if (this.el) {
this.el.nativeElement.setAttribute('src', this.imgSrc);
this.el.nativeElement.onload = () => {
if (this.hasLoading) {
loadingEl.style.display = 'none';
}
this.el.nativeElement.style.display = 'block';
};
this.el.nativeElement.onerror = () => {
this.el.nativeElement.setAttribute('src', this.defaultImage);
setTimeout(() => {
this.el.nativeElement.style.display = 'block';
}, 50);
};
if (this.height) {
if (typeof (this.height) !== 'string') {
this.height += 'px';
}
this.el.nativeElement.style.height = this.height;
}
if (this.width) {
if (typeof (this.width) !== 'string') {
this.width += 'px';
}
this.el.nativeElement.style.width = this.width;
}
}
}
}
NgxCdkAvatarViewerDirective.decorators = [
{ type: Directive, args: [{
selector: 'img[ngxCdkAvatarViewer]'
},] }
];
NgxCdkAvatarViewerDirective.ctorParameters = () => [
{ type: ElementRef }
];
NgxCdkAvatarViewerDirective.propDecorators = {
width: [{ type: Input }],
height: [{ type: Input }],
size: [{ type: Input }],
owner: [{ type: Input }],
defaultImage: [{ type: Input }],
hasLoading: [{ type: Input }],
imgSrc: [{ type: Input }]
};
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmd4LWNkay1hdmF0YXItdmlld2VyLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiJDOi9Vc2Vycy9BbGlyZXphIE1vaGFtbWFkaS9zb3VyY2UvcmVwb3MvTXlMaWJyYXJ5L0FuZ3VsYXIuTGlicmFyeS9saWJzL3Byb2plY3RzL25neC1tYXQtY2RrL3NyYy8iLCJzb3VyY2VzIjpbImxpYi9zaGFyZWQvZGlyZWN0aXZlcy9uZ3gtY2RrLWF2YXRhci12aWV3ZXIuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBQyxTQUFTLEVBQUUsVUFBVSxFQUFFLEtBQUssRUFBUyxNQUFNLGVBQWUsQ0FBQztBQUtuRSxNQUFNLE9BQU8sMkJBQTJCO0lBRXRDLFlBQ1UsRUFBMkI7UUFBM0IsT0FBRSxHQUFGLEVBQUUsQ0FBeUI7UUFRNUIsaUJBQVksR0FBRyxpQ0FBaUMsQ0FBQztRQUNqRCxlQUFVLEdBQUcsSUFBSSxDQUFDO1FBQ2xCLFdBQU0sR0FBRyxFQUFFLENBQUM7SUFSckIsQ0FBQztJQVVELFFBQVE7UUFDTixJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsT0FBTyxHQUFHLE1BQU0sQ0FBQztRQUM3QyxNQUFNLFNBQVMsR0FBRyxRQUFRLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQ2hELFNBQVMsQ0FBQyxLQUFLLENBQUMsUUFBUSxHQUFHLFVBQVUsQ0FBQztRQUN0QyxTQUFTLENBQUMsS0FBSyxDQUFDLEtBQUssR0FBRyxHQUFHLElBQUksQ0FBQyxLQUFLLElBQUksQ0FBQztRQUMxQyxTQUFTLENBQUMsS0FBSyxDQUFDLE1BQU0sR0FBRyxHQUFHLElBQUksQ0FBQyxNQUFNLElBQUksQ0FBQztRQUM1QyxNQUFNLFNBQVMsR0FBRyxRQUFRLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQ2hELElBQUksSUFBSSxDQUFDLFVBQVUsRUFBRTtZQUNuQixTQUFTLENBQUMsU0FBUyxDQUFDLEdBQUcsQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDO1lBQzNDLFNBQVMsQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLCtCQUErQixDQUFDLENBQUM7WUFDekQsU0FBUyxDQUFDLFdBQVcsQ0FBQyxTQUFTLENBQUMsQ0FBQztTQUNsQztRQUNELElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxTQUFTLENBQUMsQ0FBQztRQUN2QyxTQUFTLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLENBQUM7UUFDN0MsSUFBSSxJQUFJLENBQUMsRUFBRSxFQUFFO1lBQ1gsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsWUFBWSxDQUFDLEtBQUssRUFBRSxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7WUFDdkQsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsTUFBTSxHQUFHLEdBQUcsRUFBRTtnQkFDbEMsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFO29CQUNuQixTQUFTLENBQUMsS0FBSyxDQUFDLE9BQU8sR0FBRyxNQUFNLENBQUM7aUJBQ2xDO2dCQUNELElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxPQUFPLEdBQUcsT0FBTyxDQUFDO1lBQ2hELENBQUMsQ0FBQztZQUNGLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLE9BQU8sR0FBRyxHQUFHLEVBQUU7Z0JBQ25DLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLFlBQVksQ0FBQyxLQUFLLEVBQUUsSUFBSSxDQUFDLFlBQVksQ0FBQyxDQUFDO2dCQUM3RCxVQUFVLENBQUMsR0FBRyxFQUFFO29CQUNkLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxPQUFPLEdBQUcsT0FBTyxDQUFDO2dCQUNoRCxDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUM7WUFDVCxDQUFDLENBQUM7WUFDRixJQUFJLElBQUksQ0FBQyxNQUFNLEVBQUU7Z0JBQ2YsSUFBSSxPQUFPLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxLQUFLLFFBQVEsRUFBRTtvQkFDckMsSUFBSSxDQUFDLE1BQU0sSUFBSSxJQUFJLENBQUM7aUJBQ3JCO2dCQUNELElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxNQUFNLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQzthQUNsRDtZQUNELElBQUksSUFBSSxDQUFDLEtBQUssRUFBRTtnQkFDZCxJQUFJLE9BQU8sQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLEtBQUssUUFBUSxFQUFFO29CQUNwQyxJQUFJLENBQUMsS0FBSyxJQUFJLElBQUksQ0FBQztpQkFDcEI7Z0JBQ0QsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsS0FBSyxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDO2FBQ2hEO1NBQ0Y7SUFDSCxDQUFDOzs7WUEzREYsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSx5QkFBeUI7YUFDcEM7OztZQUprQixVQUFVOzs7b0JBWTFCLEtBQUs7cUJBQ0wsS0FBSzttQkFDTCxLQUFLO29CQUNMLEtBQUs7MkJBQ0wsS0FBSzt5QkFDTCxLQUFLO3FCQUNMLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0RpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSW5wdXQsIE9uSW5pdH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG5ARGlyZWN0aXZlKHtcclxuICBzZWxlY3RvcjogJ2ltZ1tuZ3hDZGtBdmF0YXJWaWV3ZXJdJ1xyXG59KVxyXG5leHBvcnQgY2xhc3MgTmd4Q2RrQXZhdGFyVmlld2VyRGlyZWN0aXZlIGltcGxlbWVudHMgT25Jbml0IHtcclxuXHJcbiAgY29uc3RydWN0b3IoXHJcbiAgICBwcml2YXRlIGVsOiBFbGVtZW50UmVmPEhUTUxFbGVtZW50PlxyXG4gICkge1xyXG4gIH1cclxuXHJcbiAgQElucHV0KCkgd2lkdGg6IHN0cmluZyB8IGFueTtcclxuICBASW5wdXQoKSBoZWlnaHQ6IHN0cmluZyB8IGFueTtcclxuICBASW5wdXQoKSBzaXplOiBudW1iZXI7XHJcbiAgQElucHV0KCkgb3duZXI6IHN0cmluZztcclxuICBASW5wdXQoKSBkZWZhdWx0SW1hZ2UgPSAnLi4vLi4vLi4vLi4vYXNzZXRzL25vLWltYWdlLnBuZyc7XHJcbiAgQElucHV0KCkgaGFzTG9hZGluZyA9IHRydWU7XHJcbiAgQElucHV0KCkgaW1nU3JjID0gJyc7XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gICAgdGhpcy5lbC5uYXRpdmVFbGVtZW50LnN0eWxlLmRpc3BsYXkgPSAnbm9uZSc7XHJcbiAgICBjb25zdCBjb250YWluZXIgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkaXYnKTtcclxuICAgIGNvbnRhaW5lci5zdHlsZS5wb3NpdGlvbiA9ICdyZWxhdGl2ZSc7XHJcbiAgICBjb250YWluZXIuc3R5bGUud2lkdGggPSBgJHt0aGlzLndpZHRofXB4YDtcclxuICAgIGNvbnRhaW5lci5zdHlsZS5oZWlnaHQgPSBgJHt0aGlzLmhlaWdodH1weGA7XHJcbiAgICBjb25zdCBsb2FkaW5nRWwgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkaXYnKTtcclxuICAgIGlmICh0aGlzLmhhc0xvYWRpbmcpIHtcclxuICAgICAgbG9hZGluZ0VsLmNsYXNzTGlzdC5hZGQoJ25neC1jZGstbG9hZGluZycpO1xyXG4gICAgICBsb2FkaW5nRWwuY2xhc3NMaXN0LmFkZCgnbmd4LWNkay1sb2FkaW5nLWF2YXRhci12aWV3ZXInKTtcclxuICAgICAgY29udGFpbmVyLmFwcGVuZENoaWxkKGxvYWRpbmdFbCk7XHJcbiAgICB9XHJcbiAgICB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuYWZ0ZXIoY29udGFpbmVyKTtcclxuICAgIGNvbnRhaW5lci5hcHBlbmRDaGlsZCh0aGlzLmVsLm5hdGl2ZUVsZW1lbnQpO1xyXG4gICAgaWYgKHRoaXMuZWwpIHtcclxuICAgICAgdGhpcy5lbC5uYXRpdmVFbGVtZW50LnNldEF0dHJpYnV0ZSgnc3JjJywgdGhpcy5pbWdTcmMpO1xyXG4gICAgICB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQub25sb2FkID0gKCkgPT4ge1xyXG4gICAgICAgIGlmICh0aGlzLmhhc0xvYWRpbmcpIHtcclxuICAgICAgICAgIGxvYWRpbmdFbC5zdHlsZS5kaXNwbGF5ID0gJ25vbmUnO1xyXG4gICAgICAgIH1cclxuICAgICAgICB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuc3R5bGUuZGlzcGxheSA9ICdibG9jayc7XHJcbiAgICAgIH07XHJcbiAgICAgIHRoaXMuZWwubmF0aXZlRWxlbWVudC5vbmVycm9yID0gKCkgPT4ge1xyXG4gICAgICAgIHRoaXMuZWwubmF0aXZlRWxlbWVudC5zZXRBdHRyaWJ1dGUoJ3NyYycsIHRoaXMuZGVmYXVsdEltYWdlKTtcclxuICAgICAgICBzZXRUaW1lb3V0KCgpID0+IHtcclxuICAgICAgICAgIHRoaXMuZWwubmF0aXZlRWxlbWVudC5zdHlsZS5kaXNwbGF5ID0gJ2Jsb2NrJztcclxuICAgICAgICB9LCA1MCk7XHJcbiAgICAgIH07XHJcbiAgICAgIGlmICh0aGlzLmhlaWdodCkge1xyXG4gICAgICAgIGlmICh0eXBlb2YgKHRoaXMuaGVpZ2h0KSAhPT0gJ3N0cmluZycpIHtcclxuICAgICAgICAgIHRoaXMuaGVpZ2h0ICs9ICdweCc7XHJcbiAgICAgICAgfVxyXG4gICAgICAgIHRoaXMuZWwubmF0aXZlRWxlbWVudC5zdHlsZS5oZWlnaHQgPSB0aGlzLmhlaWdodDtcclxuICAgICAgfVxyXG4gICAgICBpZiAodGhpcy53aWR0aCkge1xyXG4gICAgICAgIGlmICh0eXBlb2YgKHRoaXMud2lkdGgpICE9PSAnc3RyaW5nJykge1xyXG4gICAgICAgICAgdGhpcy53aWR0aCArPSAncHgnO1xyXG4gICAgICAgIH1cclxuICAgICAgICB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuc3R5bGUud2lkdGggPSB0aGlzLndpZHRoO1xyXG4gICAgICB9XHJcbiAgICB9XHJcbiAgfVxyXG5cclxufVxyXG4iXX0=