| 1 | !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("primeng/dom")):"function"==typeof define&&define.amd?define("primeng/lightbox",["exports","@angular/core","@angular/common","primeng/dom"],t):t(((e=e||self).primeng=e.primeng||{},e.primeng.lightbox={}),e.ng.core,e.ng.common,e.primeng.dom)}(this,(function(e,t,i,n){"use strict";var s=this&&this.__decorate||function(e,t,i,n){var s,o=arguments.length,l=o<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,t,i,n);else for(var a=e.length-1;a>=0;a--)(s=e[a])&&(l=(o<3?s(l):o>3?s(t,i,l):s(t,i))||l);return o>3&&l&&Object.defineProperty(t,i,l),l},o=function(){function e(e,t,i){this.el=e,this.renderer=t,this.cd=i,this.type="image",this.effectDuration="500ms",this.autoZIndex=!0,this.baseZIndex=0,this.closeOnEscape=!0}return e.prototype.onImageClick=function(e,t,i,n){this.index=i,this.loading=!0,n.style.width="32px",n.style.height="32px",this.preventDocumentClickListener=!0,this.show(),this.displayImage(t),e.preventDefault()},e.prototype.ngAfterViewInit=function(){this.panel=n.DomHandler.findSingle(this.el.nativeElement,".ui-lightbox "),this.appendTo&&("body"===this.appendTo?document.body.appendChild(this.panel):n.DomHandler.appendChild(this.panel,this.appendTo))},e.prototype.onLinkClick=function(e,t){this.preventDocumentClickListener=!0,this.show(),e.preventDefault()},e.prototype.displayImage=function(e){var t=this;setTimeout((function(){t.cd.markForCheck(),t.currentImage=e,t.captionText=e.title,t.center()}),1e3)},e.prototype.show=function(){this.mask=document.createElement("div"),n.DomHandler.addMultipleClasses(this.mask,"ui-widget-overlay ui-dialog-mask"),document.body.appendChild(this.mask),this.autoZIndex&&(this.zindex=this.baseZIndex+ ++n.DomHandler.zindex),this.mask.style.zIndex=this.zindex-1,this.center(),this.visible=!0,this.bindGlobalListeners()},e.prototype.hide=function(e){this.captionText=null,this.index=null,this.currentImage=null,this.visible=!1,this.mask&&(document.body.removeChild(this.mask),this.mask=null),this.unbindGlobalListeners(),e.preventDefault()},e.prototype.center=function(){var e=n.DomHandler.getOuterWidth(this.panel),t=n.DomHandler.getOuterHeight(this.panel);0==e&&0==t&&(this.panel.style.visibility="hidden",this.panel.style.display="block",e=n.DomHandler.getOuterWidth(this.panel),t=n.DomHandler.getOuterHeight(this.panel),this.panel.style.display="none",this.panel.style.visibility="visible")},e.prototype.onImageLoad=function(e,t){var i=this,s=e.target;s.style.visibility="hidden",s.style.display="block";var o=n.DomHandler.getOuterWidth(s),l=n.DomHandler.getOuterHeight(s);s.style.display="none",s.style.visibility="visible",t.style.width=o+"px",t.style.height=l+"px",this.panel.style.left=parseInt(this.panel.style.left)+(n.DomHandler.getOuterWidth(this.panel)-o)/2+"px",this.panel.style.top=parseInt(this.panel.style.top)+(n.DomHandler.getOuterHeight(this.panel)-l)/2+"px",setTimeout((function(){i.cd.markForCheck(),n.DomHandler.fadeIn(s,500),s.style.display="block",i.loading=!1}),parseInt(this.effectDuration))},e.prototype.prev=function(e){this.captionText=null,this.loading=!0,e.style.display="none",this.index>0&&this.displayImage(this.images[--this.index])},e.prototype.next=function(e){this.captionText=null,this.loading=!0,e.style.display="none",this.index<=this.images.length-1&&this.displayImage(this.images[++this.index])},e.prototype.bindGlobalListeners=function(){var e=this;this.documentClickListener=this.renderer.listen("document","click",(function(t){!e.preventDocumentClickListener&&e.visible&&e.hide(t),e.preventDocumentClickListener=!1,e.cd.markForCheck()})),this.closeOnEscape&&!this.documentEscapeListener&&(this.documentEscapeListener=this.renderer.listen("document","keydown",(function(t){27==t.which&&parseInt(e.panel.style.zIndex)===n.DomHandler.zindex+e.baseZIndex&&e.hide(t)})))},e.prototype.unbindGlobalListeners=function(){this.documentEscapeListener&&(this.documentEscapeListener(),this.documentEscapeListener=null),this.documentClickListener&&(this.documentClickListener(),this.documentClickListener=null)},Object.defineProperty(e.prototype,"leftVisible",{get:function(){return this.images&&this.images.length&&0!=this.index&&!this.loading},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"rightVisible",{get:function(){return this.images&&this.images.length&&this.index<this.images.length-1&&!this.loading},enumerable:!0,configurable:!0}),e.prototype.ngOnDestroy=function(){this.unbindGlobalListeners(),this.appendTo&&this.el.nativeElement.appendChild(this.panel)},e.ctorParameters=function(){return[{type:t.ElementRef},{type:t.Renderer2},{type:t.ChangeDetectorRef}]},s([t.Input()],e.prototype,"images",void 0),s([t.Input()],e.prototype,"type",void 0),s([t.Input()],e.prototype,"style",void 0),s([t.Input()],e.prototype,"styleClass",void 0),s([t.Input()],e.prototype,"appendTo",void 0),s([t.Input()],e.prototype,"easing",void 0),s([t.Input()],e.prototype,"effectDuration",void 0),s([t.Input()],e.prototype,"autoZIndex",void 0),s([t.Input()],e.prototype,"baseZIndex",void 0),s([t.Input()],e.prototype,"closeOnEscape",void 0),e=s([t.Component({selector:"p-lightbox",template:'\n <div [ngStyle]="style" [class]="styleClass" *ngIf="(type == \'image\')">\n <a *ngFor="let image of images; let i = index;" [href]="image.source" (click)="onImageClick($event,image,i,content)">\n <img [src]="image.thumbnail" [title]="image.title" [alt]="image.alt">\n </a>\n </div>\n <span [ngStyle]="style" [class]="styleClass" *ngIf="(type == \'content\')" (click)="onLinkClick($event,content)">\n <ng-content select="a"></ng-content>\n </span>\n <div class="ui-lightbox ui-widget ui-corner-all ui-shadow" [style.display]="visible ? \'block\' : \'none\'" [style.zIndex]="zindex"\n [ngClass]="{\'ui-lightbox-loading\': loading}"\n [style.transitionProperty]="\'all\'" [style.transitionDuration]="effectDuration" [style.transitionTimingFunction]="easing" (click)="preventDocumentClickListener=true">\n <div class="ui-lightbox-content-wrapper">\n <a class="ui-state-default ui-lightbox-nav-left ui-corner-right" [style.zIndex]="zindex + 1" (click)="prev(img)"\n [ngClass]="{\'ui-helper-hidden\':!leftVisible}"><span class="ui-lightbox-nav-icon pi pi-chevron-left"></span></a>\n <div #content class="ui-lightbox-content ui-corner-all" \n [style.transitionProperty]="\'width,height\'" [style.transitionDuration]="effectDuration" [style.transitionTimingFunction]="easing">\n <img #img [src]="currentImage ? currentImage.source||\'\' : \'\'" (load)="onImageLoad($event,content)" style="display:none">\n <ng-content></ng-content>\n </div>\n <a class="ui-state-default ui-lightbox-nav-right ui-corner-left ui-helper-hidden" [style.zIndex]="zindex + 1" (click)="next(img)"\n [ngClass]="{\'ui-helper-hidden\':!rightVisible}"><span class="ui-lightbox-nav-icon pi pi-chevron-right"></span></a>\n </div>\n <div class="ui-lightbox-caption ui-widget-header" [style.display]="captionText ? \'block\' : \'none\'">\n <span class="ui-lightbox-caption-text">{{captionText}}</span><a class="ui-lightbox-close ui-corner-all" tabindex="0" (click)="hide($event)" (keydown.enter)="hide($event)"><span class="pi pi-times"></span></a>\n <div style="clear:both"></div>\n </div>\n </div>\n ',changeDetection:t.ChangeDetectionStrategy.Default})],e)}(),l=function(){function e(){}return e=s([t.NgModule({imports:[i.CommonModule],exports:[o],declarations:[o]})],e)}();e.Lightbox=o,e.LightboxModule=l,Object.defineProperty(e,"__esModule",{value:!0})}));
|