@crystalui/angular-lightbox
Version:
Angular library for viewing images in a pop-up window with touch screen support.
158 lines • 14.2 kB
JavaScript
import { __decorate } from "tslib";
import { Directive, ElementRef, Input, Output, HostListener, HostBinding, OnInit, EventEmitter } from '@angular/core';
import { EventService } from './event.service';
import { CrystalLightbox } from './lightbox.service';
var LightboxDirective = /** @class */ (function () {
function LightboxDirective(lightbox, eventService, elementRef) {
var _this = this;
this.lightbox = lightbox;
this.eventService = eventService;
this.elementRef = elementRef;
this.properties = {};
this.events = new EventEmitter();
this.hostLightboxGroup = true;
this.globalEventsSubscription = this.eventService.emitter.subscribe(function (event) {
_this.handleGlobalEvents(event);
});
}
Object.defineProperty(LightboxDirective.prototype, "hostSimpleMode", {
get: function () {
return this.simpleMode;
},
enumerable: true,
configurable: true
});
Object.defineProperty(LightboxDirective.prototype, "isGroupImage", {
get: function () {
return this.elementRef.nativeElement.closest(".lightbox-group");
},
enumerable: true,
configurable: true
});
LightboxDirective.prototype.onClick = function (event) {
if (this.disable) {
return;
}
if (this.isGroupImage) {
this.eventService.emitChangeEvent({
type: 'thumbnail:click',
elementRef: this.elementRef,
properties: this.properties
});
}
else {
this.image = this.getImage();
this.lightbox.open({
images: [this.image],
properties: this.properties,
index: 0
});
}
};
LightboxDirective.prototype.ngOnChanges = function (changes) {
this.properties = Object.assign({}, this.properties, this.getProperties(changes));
};
LightboxDirective.prototype.handleGlobalEvents = function (event) {
this.events.emit(event);
};
LightboxDirective.prototype.getImage = function () {
var image = {};
var nativeElement = this.elementRef.nativeElement;
if (this.fullImage) {
image.fullImage = this.fullImage;
}
image.thumbnailImage = {
path: nativeElement.src,
height: nativeElement.naturalHeight,
width: nativeElement.naturalWidth
};
image.nativeElement = nativeElement;
return image;
};
;
LightboxDirective.prototype.getProperties = function (changes) {
var properties = {};
for (var prop in changes) {
if (prop !== 'fullImage') {
properties[prop] = changes[prop].currentValue;
}
}
return properties;
};
LightboxDirective.ctorParameters = function () { return [
{ type: CrystalLightbox },
{ type: EventService },
{ type: ElementRef }
]; };
__decorate([
Input()
], LightboxDirective.prototype, "fullImage", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "properties", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "loop", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "backgroundOpacity", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "counter", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "imageMaxHeight", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "imageMaxWidth", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "animationDuration", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "animationMode", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "animationTimingFunction", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "closeButtonText", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "counterSeparator", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "disable", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "simpleMode", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "backgroundColor", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "hideThumbnail", void 0);
__decorate([
Input()
], LightboxDirective.prototype, "gestureEnable", void 0);
__decorate([
Output()
], LightboxDirective.prototype, "events", void 0);
__decorate([
HostBinding('class.lightbox-single')
], LightboxDirective.prototype, "hostLightboxGroup", void 0);
__decorate([
HostBinding('class.lightbox-simple-mode')
], LightboxDirective.prototype, "hostSimpleMode", null);
__decorate([
HostListener('click', ['$event'])
], LightboxDirective.prototype, "onClick", null);
LightboxDirective = __decorate([
Directive({
selector: '[lightbox]'
})
], LightboxDirective);
return LightboxDirective;
}());
export { LightboxDirective };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlnaHRib3guZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGNyeXN0YWx1aS9hbmd1bGFyLWxpZ2h0Ym94LyIsInNvdXJjZXMiOlsibGliL2xpZ2h0Ym94LmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxVQUFVLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQUUsV0FBVyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdEgsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBSyxvQkFBb0IsQ0FBQztBQU9wRDtJQWtDSSwyQkFDWSxRQUF5QixFQUN6QixZQUEwQixFQUMxQixVQUFzQjtRQUhsQyxpQkFTQztRQVJXLGFBQVEsR0FBUixRQUFRLENBQWlCO1FBQ3pCLGlCQUFZLEdBQVosWUFBWSxDQUFjO1FBQzFCLGVBQVUsR0FBVixVQUFVLENBQVk7UUFoQ3pCLGVBQVUsR0FBZSxFQUFFLENBQUM7UUFpQjNCLFdBQU0sR0FBc0IsSUFBSSxZQUFZLEVBQU8sQ0FBQztRQUV4QixzQkFBaUIsR0FBWSxJQUFJLENBQUM7UUFjcEUsSUFBSSxDQUFDLHdCQUF3QixHQUFHLElBQUksQ0FBQyxZQUFZLENBQUMsT0FBTyxDQUFDLFNBQVMsQ0FDL0QsVUFBQyxLQUFLO1lBQ0YsS0FBSSxDQUFDLGtCQUFrQixDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQ25DLENBQUMsQ0FDSixDQUFDO0lBQ04sQ0FBQztJQWpCRCxzQkFBSSw2Q0FBYzthQUFsQjtZQUNJLE9BQU8sSUFBSSxDQUFDLFVBQVUsQ0FBQztRQUMzQixDQUFDOzs7T0FBQTtJQUVELHNCQUFJLDJDQUFZO2FBQWhCO1lBQ0ksT0FBTyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQyxPQUFPLENBQUMsaUJBQWlCLENBQUMsQ0FBQztR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bkM7UUFBUixLQUFLLEVBQUU7NERBQXdCO0lBQ3ZCO1FBQVIsS0FBSyxFQUFFOzREQUF3QjtJQUV0QjtRQUFULE1BQU0sRUFBRTtxREFBcUQ7SUFFeEI7UUFBckMsV0FBVyxDQUFDLHVCQUF1QixDQUFDO2dFQUFtQztJQUV4RTtRQURDLFdBQVcsQ0FBQyw0QkFBNEIsQ0FBQzsyREFHekM7SUFrQkQ7UUFEQyxZQUFZLENBQUMsT0FBTyxFQUFFLENBQUMsUUFBUSxDQUFDLENBQUM7b0RBcUJqQztJQWxFUSxpQkFBaUI7UUFKN0IsU0FBUyxDQUFDO1lBQ1AsUUFBUSxFQUFFLFlBQVk7U0FDekIsQ0FBQztPQUVXLGlCQUFpQixDQXdHN0I7SUFBRCx3QkFBQztDQUFBLEFBeEdELElBd0dDO1NBeEdZLGlCQUFpQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSW5wdXQsIE91dHB1dCwgSG9zdExpc3RlbmVyLCBIb3N0QmluZGluZywgT25Jbml0LCBFdmVudEVtaXR0ZXIgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEV2ZW50U2VydmljZSB9IGZyb20gJy4vZXZlbnQuc2VydmljZSc7XG5pbXBvcnQgeyBDcnlzdGFsTGlnaHRib3ggfSBmcm9tJy4vbGlnaHRib3guc2VydmljZSc7XG5pbXBvcnQgeyBQcm9wZXJ0aWVzLCBJbWFnZUV4dGVuZGVkLCBJbWFnZSB9IGZyb20gJy4vaW50ZXJmYWNlcyc7XG5cbkBEaXJlY3RpdmUoe1xuICAgIHNlbGVjdG9yOiAnW2xpZ2h0Ym94XSdcbn0pXG5cbmV4cG9ydCBjbGFzcyBMaWdodGJveERpcmVjdGl2ZSB7XG5cbiAgICBnbG9iYWxFdmVudHNTdWJzY3JpcHRpb247XG4gICAgaW1hZ2U6IEltYWdlRXh0ZW5kZWQ7XG4gICAgQElucHV0KCkgZnVsbEltYWdlOiBJbWFnZTtcbiAgICBASW5wdXQoKSBwcm9wZXJ0aWVzOiBQcm9wZXJ0aWVzID0ge307XG4gICAgQElucHV0KCkgbG9vcDogYm9vbGVhbjtcbiAgICBASW5wdXQoKSBiYWNrZ3JvdW5kT3BhY2l0eTogbnVtYmVyO1xuICAgIEBJbnB1dCgpIGNvdW50ZXI6IGJvb2xlYW47XG4gICAgQElucHV0KCkgaW1hZ2VNYXhIZWlnaHQ6IHN0cmluZztcbiAgICBASW5wdXQoKSBpbWFnZU1heFdpZHRoOiBzdHJpbmc7XG4gICAgQElucHV0KCkgYW5pbWF0aW9uRHVyYXRpb246IG51bWJlcjtcbiAgICBASW5wdXQoKSBhbmltYXRpb25Nb2RlOiAnZGVmYXVsdCcgfCAnem9vbScgfCAnem9vbS1ibHVyJyB8ICd6b29tLXByZWxvYWRlcicgfCAnb3BhY2l0eScgfCAnbm9uZSc7IFxuICAgIEBJbnB1dCgpIGFuaW1hdGlvblRpbWluZ0Z1bmN0aW9uOiBzdHJpbmc7XG4gICAgQElucHV0KCkgY2xvc2VCdXR0b25UZXh0OiBzdHJpbmc7XG4gICAgQElucHV0KCkgY291bnRlclNlcGFyYXRvcjogc3RyaW5nO1xuICAgIEBJbnB1dCgpIGRpc2FibGU6IGJvb2xlYW47XG4gICAgQElucHV0KCkgc2ltcGxlTW9kZTogYm9vbGVhbjtcbiAgICBASW5wdXQoKSBiYWNrZ3JvdW5kQ29sb3I6ICdibGFjaycgfCAnd2hpdGUnO1xuICAgIEBJbnB1dCgpIGhpZGVUaHVtYm5haWw6IGJvb2xlYW47XG4gICAgQElucHV0KCkgZ2VzdHVyZUVuYWJsZTogYm9vbGVhbjtcblxuICAgIEBPdXRwdXQoKSBldmVudHM6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XG5cbiAgICBASG9zdEJpbmRpbmcoJ2NsYXNzLmxpZ2h0Ym94LXNpbmdsZScpIGhvc3RMaWdodGJveEdyb3VwOiBib29sZWFuID0gdHJ1ZTtcbiAgICBASG9zdEJpbmRpbmcoJ2NsYXNzLmxpZ2h0Ym94LXNpbXBsZS1tb2RlJykgXG4gICAgZ2V0IGhvc3RTaW1wbGVNb2RlKCl7XG4gICAgICAgIHJldHVybiB0aGlzLnNpbXBsZU1vZGU7XG4gICAgfVxuXG4gICAgZ2V0IGlzR3JvdXBJbWFnZSgpOmJvb2xlYW4ge1xuICAgICAgICByZXR1cm4gdGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQuY2xvc2VzdChcIi5saWdodGJveC1ncm91cFwiKTtcbiAgICB9XG5cbiAgICBjb25zdHJ1Y3RvciggXG4gICAgICAgIHByaXZhdGUgbGlnaHRib3g6IENyeXN0YWxMaWdodGJveCwgXG4gICAgICAgIHByaXZhdGUgZXZlbnRTZXJ2aWNlOiBFdmVudFNlcnZpY2UsXG4gICAgICAgIHByaXZhdGUgZWxlbWVudFJlZjogRWxlbWVudFJlZikge1xuICAgICAgICB0aGlzLmdsb2JhbEV2ZW50c1N1YnNjcmlwdGlvbiA9IHRoaXMuZXZlbnRTZXJ2aWNlLmVtaXR0ZXIuc3Vic2NyaWJlKFxuICAgICAgICAgICAgKGV2ZW50KSA9PiB7XG4gICAgICAgICAgICAgICAgdGhpcy5oYW5kbGVHbG9iYWxFdmVudHMoZXZlbnQpO1xuICAgICAgICAgICAgfVxuICAgICAgICApO1xuICAgIH1cblxuICAgIEBIb3N0TGlzdGVuZXIoJ2NsaWNrJywgWyckZXZlbnQnXSlcbiAgICBvbkNsaWNrKGV2ZW50KXtcbiAgICAgICAgaWYgKHRoaXMuZGlzYWJsZSl7XG4gICAgICAgICAgICByZXR1cm47XG4gICAgICAgIH1cblxuICAgICAgICBpZiAodGhpcy5pc0dyb3VwSW1hZ2Upe1xuICAgICAgICAgICAgdGhpcy5ldmVudFNlcnZpY2UuZW1pdENoYW5nZUV2ZW50KHtcbiAgICAgICAgICAgICAgICB0eXBlOiAndGh1bWJuYWlsOmNsaWNrJyxcbiAgICAgICAgICAgICAgICBlbGVtZW50UmVmOiB0aGlzLmVsZW1lbnRSZWYsXG4gICAgICAgICAgICAgICAgcHJvcGVydGllczogdGhpcy5wcm9wZXJ0aWVzXG4gICAgICAgICAgICB9KTtcbiAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICAgIHRoaXMuaW1hZ2UgPSB0aGlzLmdldEltYWdlKCk7XG5cbiAgICAgICAgICAgIHRoaXMubGlnaHRib3gub3Blbih7XG4gICAgICAgICAgICAgICAgaW1hZ2VzOiBbdGhpcy5pbWFnZV0sXG4gICAgICAgICAgICAgICAgcHJvcGVydGllczogdGhpcy5wcm9wZXJ0aWVzLFxuICAgICAgICAgICAgICAgIGluZGV4OiAwXG4gICAgICAgICAgICB9KTtcbiAgICAgICAgfVxuICAgIH1cblxuICAgIG5nT25DaGFuZ2VzKGNoYW5nZXMpIHtcbiAgICAgICAgdGhpcy5wcm9wZXJ0aWVzID0gT2JqZWN0LmFzc2lnbih7fSwgdGhpcy5wcm9wZXJ0aWVzLCB0aGlzLmdldFByb3BlcnRpZXMoY2hhbmdlcykpO1xuICAgIH1cblxuICAgIGhhbmRsZUdsb2JhbEV2ZW50cyhldmVudCl7XG4gICAgICAgIHRoaXMuZXZlbnRzLmVtaXQoZXZlbnQpO1xuICAgIH1cblxuICAgIGdldEltYWdlKCl7XG4gICAgICAgIGxldCBpbWFnZTogSW1hZ2VFeHRlbmRlZCA9IHt9O1xuICAgICAgICBjb25zdCBuYXRpdmVFbGVtZW50ID0gdGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQ7XG5cbiAgICAgICAgaWYgKHRoaXMuZnVsbEltYWdlKXtcbiAgICAgICAgICAgIGltYWdlLmZ1bGxJbWFnZSA9IHRoaXMuZnVsbEltYWdlO1xuICAgICAgICB9XG5cbiAgICAgICAgaW1hZ2UudGh1bWJuYWlsSW1hZ2UgPSB7XG4gICAgICAgICAgICBwYXRoOiBuYXRpdmVFbGVtZW50LnNyYyxcbiAgICAgICAgICAgIGhlaWdodDogbmF0aXZlRWxlbWVudC5uYXR1cmFsSGVpZ2h0LFxuICAgICAgICAgICAgd2lkdGg6IG5hdGl2ZUVsZW1lbnQubmF0dXJhbFdpZHRoXG4gICAgICAgIH1cblxuICAgICAgICBpbWFnZS5uYXRpdmVFbGVtZW50ID0gbmF0aXZlRWxlbWVudDtcbiAgICAgICAgcmV0dXJuIGltYWdlO1xuICAgIH07XG5cbiAgICBnZXRQcm9wZXJ0aWVzKGNoYW5nZXMpe1xuICAgICAgICBsZXQgcHJvcGVydGllcyA9IHt9O1xuXG4gICAgICAgIGZvciAodmFyIHByb3AgaW4gY2hhbmdlcykge1xuICAgICAgICAgICAgaWYgKHByb3AgIT09ICdmdWxsSW1hZ2UnKXtcbiAgICAgICAgICAgICAgICBwcm9wZXJ0aWVzW3Byb3BdID0gY2hhbmdlc1twcm9wXS5jdXJyZW50VmFsdWU7XG4gICAgICAgICAgICB9XG4gICAgICAgIH1cbiAgICAgICAgcmV0dXJuIHByb3BlcnRpZXM7XG4gICAgfVxufVxuIl19