text: "use strict";
  var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
      var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
      if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
      else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
      return c > 3 && r && Object.defineProperty(target, key, r), r;
  };
  var __metadata = (this && this.__metadata) || function (k, v) {
      if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
  };
  var core_1 = require('@angular/core');
  var common_1 = require('@angular/common');
  var domhandler_1 = require('../dom/domhandler');
  var Lightbox = (function () {
      function Lightbox(el, domHandler, renderer) {
          this.el = el;
          this.domHandler = domHandler;
          this.renderer = renderer;
          this.type = 'image';
          this.effectDuration = '500ms';
      }
      Lightbox.prototype.onImageClick = function (event, image, i, content) {
          this.index = i;
          this.loading = true;
          content.style.width = 32 + 'px';
          content.style.height = 32 + 'px';
          this.show();
          this.displayImage(image);
          this.preventDocumentClickListener = true;
          event.preventDefault();
      };
      Lightbox.prototype.ngAfterViewInit = function () {
          var _this = this;
          this.panel = this.domHandler.findSingle(this.el.nativeElement, '.ui-lightbox ');
          this.documentClickListener = this.renderer.listenGlobal('body', 'click', function (event) {
              if (!_this.preventDocumentClickListener && _this.visible) {
                  _this.hide(event);
              }
              _this.preventDocumentClickListener = false;
          });
      };
      Lightbox.prototype.onLinkClick = function (event, content) {
          this.show();
          this.preventDocumentClickListener = true;
          event.preventDefault();
      };
      Lightbox.prototype.displayImage = function (image) {
          var _this = this;
          setTimeout(function () {
              _this.currentImage = image;
          }, 1000);
      };
      Lightbox.prototype.show = function () {
          this.mask = document.createElement('div');
          this.mask.style.zIndex = ++domhandler_1.DomHandler.zindex;
          this.domHandler.addMultipleClasses(this.mask, 'ui-widget-overlay ui-dialog-mask');
          document.body.appendChild(this.mask);
          this.zindex = ++domhandler_1.DomHandler.zindex;
          this.center();
          this.visible = true;
      };
      Lightbox.prototype.hide = function (event) {
          this.captionText = null;
          this.index = null;
          this.currentImage = null;
          this.visible = false;
          this.panel.style.left = 'auto';
          this.panel.style.top = 'auto';
          if (this.mask) {
              document.body.removeChild(this.mask);
              this.mask = null;
          }
          event.preventDefault();
      };
      Lightbox.prototype.center = function () {
          var elementWidth = this.domHandler.getOuterWidth(this.panel);
          var elementHeight = this.domHandler.getOuterHeight(this.panel);
          if (elementWidth == 0 && elementHeight == 0) {
              this.panel.style.visibility = 'hidden';
              this.panel.style.display = 'block';
              elementWidth = this.domHandler.getOuterWidth(this.panel);
              elementHeight = this.domHandler.getOuterHeight(this.panel);
              this.panel.style.display = 'none';
              this.panel.style.visibility = 'visible';
          }
          var viewport = this.domHandler.getViewport();
          var x = (viewport.width - elementWidth) / 2;
          var y = (viewport.height - elementHeight) / 2;
          this.panel.style.left = x + 'px';
          this.panel.style.top = y + 'px';
      };
      Lightbox.prototype.onImageLoad = function (event, content) {
          var _this = this;
          var image = event.target;
          image.style.visibility = 'hidden';
          image.style.display = 'block';
          var imageWidth = this.domHandler.getOuterWidth(image);
          var imageHeight = this.domHandler.getOuterHeight(image);
          image.style.display = 'none';
          image.style.visibility = 'visible';
          content.style.width = imageWidth + 'px';
          content.style.height = imageHeight + 'px';
          this.panel.style.left = parseInt(this.panel.style.left) + (this.domHandler.getOuterWidth(this.panel) - imageWidth) / 2 + 'px';
          this.panel.style.top = parseInt(this.panel.style.top) + (this.domHandler.getOuterHeight(this.panel) - imageHeight) / 2 + 'px';
          setTimeout(function () {
              _this.domHandler.fadeIn(image, 500);
              image.style.display = 'block';
              //this.captionText = this.currentImage.title;
              _this.loading = false;
          }, parseInt(this.effectDuration));
      };
      Lightbox.prototype.prev = function (placeholder) {
          this.captionText = null;
          this.loading = true;
          placeholder.style.display = 'none';
          if (this.index > 0) {
              this.displayImage(this.images[--this.index]);
          }
      };
      Lightbox.prototype.next = function (placeholder) {
          this.captionText = null;
          this.loading = true;
          placeholder.style.display = 'none';
          if (this.index <= (this.images.length - 1)) {
              this.displayImage(this.images[++this.index]);
          }
      };
      Object.defineProperty(Lightbox.prototype, "leftVisible", {
          get: function () {
              return this.images && this.images.length && this.index != 0 && !this.loading;
          },
          enumerable: true,
          configurable: true
      });
      Object.defineProperty(Lightbox.prototype, "rightVisible", {
          get: function () {
              return this.images && this.images.length && this.index < (this.images.length - 1) && !this.loading;
          },
          enumerable: true,
          configurable: true
      });
      Lightbox.prototype.ngOnDestroy = function () {
          this.documentClickListener();
      };
      __decorate([
          core_1.Input(), 
          __metadata('design:type', Array)
      ], Lightbox.prototype, "images", void 0);
      __decorate([
          core_1.Input(), 
          __metadata('design:type', String)
      ], Lightbox.prototype, "type", void 0);
      __decorate([
          core_1.Input(), 
          __metadata('design:type', Object)
      ], Lightbox.prototype, "style", void 0);
      __decorate([
          core_1.Input(), 
          __metadata('design:type', String)
      ], Lightbox.prototype, "styleClass", void 0);
      __decorate([
          core_1.Input(), 
          __metadata('design:type', String)
      ], Lightbox.prototype, "easing", void 0);
      __decorate([
          core_1.Input(), 
          __metadata('design:type', Object)
      ], Lightbox.prototype, "effectDuration", void 0);
      Lightbox = __decorate([
          core_1.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-helper-hidden ui-corner-all ui-shadow\" [style.display]=\"visible ? 'block' : 'none'\" [style.zIndex]=\"zindex\"\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=\"fa fa-fw fa-caret-left\"></span></a>\n              <div #content class=\"ui-lightbox-content ui-corner-all\" #content [ngClass]=\"{'ui-lightbox-loading': loading}\" \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=\"fa fa-fw fa-caret-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\" href=\"#\" (click)=\"hide($event)\"><span class=\"fa fa-fw fa-close\"></span></a>\n              <div style=\"clear:both\"></div>\n           </div>\n        </div>\n    ",
              providers: [domhandler_1.DomHandler]
          }), 
          __metadata('design:paramtypes', [core_1.ElementRef, domhandler_1.DomHandler, core_1.Renderer])
      ], Lightbox);
      return Lightbox;
  }());
  exports.Lightbox = Lightbox;
  var LightboxModule = (function () {
      function LightboxModule() {
      }
      LightboxModule = __decorate([
          core_1.NgModule({
              imports: [common_1.CommonModule],
              exports: [Lightbox],
              declarations: [Lightbox]
          }), 
          __metadata('design:paramtypes', [])
      ], LightboxModule);
      return LightboxModule;
  }());
  exports.LightboxModule = LightboxModule;
  //# sourceMappingURL=lightbox.js.map