@udhsin/ngx-image-viewer
Version:
A configurable Angular image viewer component, compatible with Angular 2+
55 lines • 6.07 kB
JavaScript
import { __decorate, __param } from "tslib";
import { Directive, HostListener, OnChanges, Input, ElementRef, Inject, } from '@angular/core';
import { DOCUMENT } from '@angular/common';
let ToggleFullscreenDirective = class ToggleFullscreenDirective {
constructor(el, document) {
this.el = el;
this.document = document;
this.element = this.el.nativeElement;
this.isEnabled = this.document.fullscreenEnabled;
}
ngOnChanges() {
if (this.isFullscreen && this.isEnabled) {
this.openFullscreen();
}
else if (this.isEnabled) {
this.closeFullscreen();
}
}
openFullscreen() {
const methodToBeInvoked = this.element.requestFullscreen ||
this.element.mozRequestFullScreen ||
this.element.msRequestFullscreen ||
this.element.webkitRequestFullscreen;
if (methodToBeInvoked) {
methodToBeInvoked.call(this.element);
}
}
closeFullscreen() {
if (!this.document.fullscreenElement) {
return;
}
const methodToBeInvoked = this.document.exitFullscreen ||
this.document.mozCancelFullScreen ||
this.document.webkitExitFullscreen ||
this.document.msExitFullscreen;
if (methodToBeInvoked) {
methodToBeInvoked.call(this.document);
}
}
};
ToggleFullscreenDirective.ctorParameters = () => [
{ type: ElementRef },
{ type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
];
__decorate([
Input('ngxToggleFullscreen')
], ToggleFullscreenDirective.prototype, "isFullscreen", void 0);
ToggleFullscreenDirective = __decorate([
Directive({
selector: '[ngxToggleFullscreen]',
}),
__param(1, Inject(DOCUMENT))
], ToggleFullscreenDirective);
export { ToggleFullscreenDirective };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZnVsbHNjcmVlbi5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9AdWRoc2luL25neC1pbWFnZS12aWV3ZXIvIiwic291cmNlcyI6WyJsaWIvZnVsbHNjcmVlbi5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsWUFBWSxFQUNaLFNBQVMsRUFDVCxLQUFLLEVBQ0wsVUFBVSxFQUNWLE1BQU0sR0FDUCxNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFLM0MsSUFBYSx5QkFBeUIsR0FBdEMsTUFBYSx5QkFBeUI7SUFLcEMsWUFBb0IsRUFBYyxFQUE0QixRQUFhO1FBQXZELE9BQUUsR0FBRixFQUFFLENBQVk7UUFBNEIsYUFBUSxHQUFSLFFBQVEsQ0FBSztRQUN6RSxJQUFJLENBQUMsT0FBTyxHQUFHLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDO1FBQ3JDLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxpQkFBaUIsQ0FBQztJQUNuRCxDQUFDO0lBRUQsV0FBVztRQUNULElBQUksSUFBSSxDQUFDLFlBQVksSUFBSSxJQUFJLENBQUMsU0FBUyxFQUFFO1lBQ3ZDLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztTQUN2QjthQUFNLElBQUksSUFBSSxDQUFDLFNBQVMsRUFBRTtZQUN6QixJQUFJLENBQUMsZUFBZSxFQUFFLENBQUM7U0FDeEI7SUFDSCxDQUFDO0lBRUQsY0FBYztRQUNaLE1BQU0saUJBQWlCLEdBQ3JCLElBQUksQ0FBQyxPQUFPLENBQUMsaUJBQWlCO1lBQzlCLElBQUksQ0FBQyxPQUFPLENBQUMsb0JBQW9CO1lBQ2pDLElBQUksQ0FBQyxPQUFPLENBQUMsbUJBQW1CO1lBQ2hDLElBQUksQ0FBQyxPQUFPLENBQUMsdUJBQXVCLENBQUM7UUFDdkMsSUFBSSxpQkFBaUIsRUFBRTtZQUNyQixpQkFBaUIsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1NBQ3RDO0lBQ0gsQ0FBQztJQUVELGVBQWU7UUFDYixJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxpQkFBaUIsRUFBRTtZQUNwQyxPQUFPO1NBQ1I7UUFFRCxNQUFNLGlCQUFpQixHQUNyQixJQUFJLENBQUMsUUFBUSxDQUFDLGNBQWM7WUFDNUIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxtQkFBbUI7WUFDakMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxvQkFBb0I7WUFDbEMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxnQkFBZ0IsQ0FBQztRQUNqQyxJQUFJLGlCQUFpQixFQUFFO1lBQ3JCLGlCQUFpQixDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUM7U0FDdkM7SUFDSCxDQUFDO0NBQ0YsQ0FBQTs7WUF0Q3lCLFVBQVU7NENBQUcsTUFBTSxTQUFDLFFBQVE7O0FBSHBEO0lBREMsS0FBSyxDQUFDLHFCQUFxQixDQUFDOytEQUNQO0FBRlgseUJBQXlCO0lBSHJDLFNBQVMsQ0FBQztRQUNULFFBQVEsRUFBRSx1QkFBdUI7S0FDbEMsQ0FBQztJQU1xQyxXQUFBLE1BQU0sQ0FBQyxRQUFRLENBQUMsQ0FBQTtHQUwxQyx5QkFBeUIsQ0EyQ3JDO1NBM0NZLHlCQUF5QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XHJcbiAgRGlyZWN0aXZlLFxyXG4gIEhvc3RMaXN0ZW5lcixcclxuICBPbkNoYW5nZXMsXHJcbiAgSW5wdXQsXHJcbiAgRWxlbWVudFJlZixcclxuICBJbmplY3QsXHJcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IERPQ1VNRU5UIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcclxuXHJcbkBEaXJlY3RpdmUoe1xyXG4gIHNlbGVjdG9yOiAnW25neFRvZ2dsZUZ1bGxzY3JlZW5dJyxcclxufSlcclxuZXhwb3J0IGNsYXNzIFRvZ2dsZUZ1bGxzY3JlZW5EaXJlY3RpdmUgaW1wbGVtZW50cyBPbkNoYW5nZXMge1xyXG4gIEBJbnB1dCgnbmd4VG9nZ2xlRnVsbHNjcmVlbicpXHJcbiAgaXNGdWxsc2NyZWVuOiBib29sZWFuO1xyXG4gIGVsZW1lbnQ7XHJcbiAgaXNFbmFibGVkOiBib29sZWFuO1xyXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgZWw6IEVsZW1lbnRSZWYsIEBJbmplY3QoRE9DVU1FTlQpIHByaXZhdGUgZG9jdW1lbnQ6IGFueSkge1xyXG4gICAgdGhpcy5lbGVtZW50ID0gdGhpcy5lbC5uYXRpdmVFbGVtZW50O1xyXG4gICAgdGhpcy5pc0VuYWJsZWQgPSB0aGlzLmRvY3VtZW50LmZ1bGxzY3JlZW5FbmFibGVkO1xyXG4gIH1cclxuXHJcbiAgbmdPbkNoYW5nZXMoKSB7XHJcbiAgICBpZiAodGhpcy5pc0Z1bGxzY3JlZW4gJiYgdGhpcy5pc0VuYWJsZWQpIHtcclxuICAgICAgdGhpcy5vcGVuRnVsbHNjcmVlbigpO1xyXG4gICAgfSBlbHNlIGlmICh0aGlzLmlzRW5hYmxlZCkge1xyXG4gICAgICB0aGlzLmNsb3NlRnVsbHNjcmVlbigpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgb3BlbkZ1bGxzY3JlZW4oKSB7XHJcbiAgICBjb25zdCBtZXRob2RUb0JlSW52b2tlZCA9XHJcbiAgICAgIHRoaXMuZWxlbWVudC5yZXF1ZXN0RnVsbHNjcmVlbiB8fFxyXG4gICAgICB0aGlzLmVsZW1lbnQubW96UmVxdWVzdEZ1bGxTY3JlZW4gfHxcclxuICAgICAgdGhpcy5lbGVtZW50Lm1zUmVxdWVzdEZ1bGxzY3JlZW4gfHxcclxuICAgICAgdGhpcy5lbGVtZW50LndlYmtpdFJlcXVlc3RGdWxsc2NyZWVuO1xyXG4gICAgaWYgKG1ldGhvZFRvQmVJbnZva2VkKSB7XHJcbiAgICAgIG1ldGhvZFRvQmVJbnZva2VkLmNhbGwodGhpcy5lbGVtZW50KTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIGNsb3NlRnVsbHNjcmVlbigpIHtcclxuICAgIGlmICghdGhpcy5kb2N1bWVudC5mdWxsc2NyZWVuRWxlbWVudCkge1xyXG4gICAgICByZXR1cm47XHJcbiAgICB9XHJcblxyXG4gICAgY29uc3QgbWV0aG9kVG9CZUludm9rZWQgPVxyXG4gICAgICB0aGlzLmRvY3VtZW50LmV4aXRGdWxsc2NyZWVuIHx8XHJcbiAgICAgIHRoaXMuZG9jdW1lbnQubW96Q2FuY2VsRnVsbFNjcmVlbiB8fFxyXG4gICAgICB0aGlzLmRvY3VtZW50LndlYmtpdEV4aXRGdWxsc2NyZWVuIHx8XHJcbiAgICAgIHRoaXMuZG9jdW1lbnQubXNFeGl0RnVsbHNjcmVlbjtcclxuICAgIGlmIChtZXRob2RUb0JlSW52b2tlZCkge1xyXG4gICAgICBtZXRob2RUb0JlSW52b2tlZC5jYWxsKHRoaXMuZG9jdW1lbnQpO1xyXG4gICAgfVxyXG4gIH1cclxufVxyXG4iXX0=