{"__symbolic":"module","version":4,"metadata":{"ImageViewerModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":7,"character":12}],"declarations":[{"__symbolic":"reference","name":"ImageViewerComponent"},{"__symbolic":"reference","name":"ToggleFullscreenDirective"}],"exports":[{"__symbolic":"reference","name":"ImageViewerComponent"},{"__symbolic":"reference","name":"ToggleFullscreenDirective"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":["config"],"value":{"ngModule":{"__symbolic":"reference","name":"ImageViewerModule"},"providers":[{"provide":"config","useValue":{"__symbolic":"reference","name":"config"}}]}}}},"ImageViewerComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":39,"character":1},"arguments":[{"selector":"ngx-image-viewer","template":"<div\r\n  [ngxToggleFullscreen]=\"fullscreen\"\r\n  class=\"img-container\"\r\n  [ngClass]=\"{'align-center': config.alignCenter}\"\r\n  [style.backgroundColor]=\"config.containerBackgroundColor\"\r\n  (wheel)=\"scrollZoom($event)\"\r\n  (dragover)=\"onDragOver($event)\"\r\n>\r\n  <img\r\n    [src]=\"src[index]\"\r\n    [ngStyle]=\"style\"\r\n    alt=\"Image not found...\"\r\n    (dragstart)=\"onDragStart($event)\"\r\n    (load)=\"onLoad()\"\r\n    (loadstart)=\"onLoadStart()\"\r\n  />\r\n  <!-- Div below will be used to hide the 'ghost' image when dragging -->\r\n  <div></div>\r\n  <div class=\"spinner-container\" *ngIf=\"loading\">\r\n    <div class=\"spinner\"></div>\r\n  </div>\r\n\r\n  <button\r\n    type=\"button\"\r\n    [class]=\"config.btnClass\"\r\n    *ngIf=\"config.btnShow.rotateCounterClockwise\"\r\n    (click)=\"rotateCounterClockwise()\"\r\n  >\r\n    <span [class]=\"config.btnIcons.rotateCounterClockwise\"></span>\r\n  </button>\r\n  <button\r\n    type=\"button\"\r\n    [class]=\"config.btnClass\"\r\n    *ngIf=\"config.btnShow.rotateClockwise\"\r\n    (click)=\"rotateClockwise()\"\r\n  >\r\n    <span [class]=\"config.btnIcons.rotateClockwise\"></span>\r\n  </button>\r\n\r\n  <button\r\n    type=\"button\"\r\n    [class]=\"config.btnClass\"\r\n    *ngIf=\"config.btnShow.zoomOut\"\r\n    (click)=\"zoomOut()\"\r\n  >\r\n    <span [class]=\"config.btnIcons.zoomOut\"></span>\r\n  </button>\r\n  <button\r\n    type=\"button\"\r\n    [class]=\"config.btnClass\"\r\n    *ngIf=\"config.btnShow.zoomIn\"\r\n    (click)=\"zoomIn()\"\r\n  >\r\n    <span [class]=\"config.btnIcons.zoomIn\"></span>\r\n  </button>\r\n\r\n  <button\r\n    type=\"button\"\r\n    [class]=\"config.btnClass\"\r\n    *ngFor=\"let cBtn of config.customBtns\"\r\n    (click)=\"fireCustomEvent(cBtn.name, index)\"\r\n  >\r\n    <span [class]=\"cBtn.icon\"></span>\r\n  </button>\r\n\r\n  <button\r\n    type=\"button\"\r\n    id=\"ngx-fs-btn\"\r\n    [class]=\"config.btnClass\"\r\n    (click)=\"toggleFullscreen()\"\r\n    *ngIf=\"config.allowFullscreen\"\r\n  >\r\n    <span [class]=\"config.btnIcons.fullscreen\"></span>\r\n  </button>\r\n\r\n  <div class=\"nav-button-container\" *ngIf=\"src.length > 1\">\r\n    <button\r\n      type=\"button\"\r\n      [class]=\"config.btnClass\"\r\n      (click)=\"prevImage($event)\"\r\n      [disabled]=\"index === 0\"\r\n    >\r\n      <span [class]=\"config.btnIcons.prev\"></span>\r\n    </button>\r\n    <button\r\n      type=\"button\"\r\n      [class]=\"config.btnClass\"\r\n      (click)=\"nextImage($event)\"\r\n      [disabled]=\"index === src.length - 1\"\r\n    >\r\n      <span [class]=\"config.btnIcons.next\"></span>\r\n    </button>\r\n  </div>\r\n</div>\r\n","styles":[".img-container{height:100%;width:100%;overflow:hidden;position:relative}.img-container.align-center{display:flex}.img-container.align-center img{margin:auto!important}.img-container img{z-index:2;margin:0 auto;display:block;max-width:100%;max-height:100%}.img-container button{z-index:99;position:absolute;right:15px}.img-container button:not(:disabled){cursor:pointer}.img-container button.default{height:40px;width:40px;border:1px solid #555;border-radius:50%;background-color:#fff;opacity:.7;transition:opacity .2s}.img-container button.default:hover{opacity:1}.img-container button.default:disabled{opacity:.25}.img-container>button:nth-of-type(1):not(#ngx-fs-btn){bottom:15px}.img-container>button:nth-of-type(2):not(#ngx-fs-btn){bottom:65px}.img-container>button:nth-of-type(3):not(#ngx-fs-btn){bottom:115px}.img-container>button:nth-of-type(4):not(#ngx-fs-btn){bottom:165px}.img-container>button:nth-of-type(5):not(#ngx-fs-btn){bottom:215px}.img-container>button:nth-of-type(6):not(#ngx-fs-btn){bottom:265px}.img-container>button:nth-of-type(7):not(#ngx-fs-btn){bottom:315px}#ngx-fs-btn{top:15px}.nav-button-container{text-align:center;position:absolute;z-index:98;bottom:10px;left:0;right:0}.nav-button-container>button{position:relative;right:0;margin:0 10px}.spinner-container{position:absolute;left:0;right:0;top:0;bottom:0;width:60px;height:60px;margin:auto;padding:10px;background-color:rgba(0,0,0,.4);border-radius:25%}.spinner{border-width:7px;border-style:solid;border-color:#ccc #ccc #222;border-radius:50%;height:100%;width:100%;box-sizing:border-box;-webkit-animation:2s linear infinite rotation;animation:2s linear infinite rotation}@keyframes rotation{from{-webkit-transform:rotate(0)}to{-webkit-transform:rotate(359deg)}}@-webkit-keyframes rotation{from{-webkit-transform:rotate(0)}to{-webkit-transform:rotate(359deg)}}"]}]}],"members":{"src":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3}}]}],"index":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":48,"character":3}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":51,"character":3}}]}],"indexChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":54,"character":3}}]}],"configChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":57,"character":3}}]}],"customEvent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":60,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":80,"character":5}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":80,"character":17},"arguments":["config"]}]],"parameters":[{"__symbolic":"reference","name":"ImageViewerConfig"}]}],"ngOnInit":[{"__symbolic":"method"}],"nextImage":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":89,"character":3},"arguments":["window:keyup.ArrowRight",["$event"]]}]}],"prevImage":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":99,"character":3},"arguments":["window:keyup.ArrowLeft",["$event"]]}]}],"zoomIn":[{"__symbolic":"method"}],"zoomOut":[{"__symbolic":"method"}],"scrollZoom":[{"__symbolic":"method"}],"rotateClockwise":[{"__symbolic":"method"}],"rotateCounterClockwise":[{"__symbolic":"method"}],"onLoad":[{"__symbolic":"method"}],"onLoadStart":[{"__symbolic":"method"}],"onDragOver":[{"__symbolic":"method"}],"onDragStart":[{"__symbolic":"method"}],"toggleFullscreen":[{"__symbolic":"method"}],"triggerIndexBinding":[{"__symbolic":"method"}],"triggerConfigBinding":[{"__symbolic":"method"}],"fireCustomEvent":[{"__symbolic":"method"}],"reset":[{"__symbolic":"method"}],"onMouseOver":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":189,"character":3},"arguments":["mouseover"]}]}],"onMouseLeave":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":194,"character":3},"arguments":["mouseleave"]}]}],"canNavigate":[{"__symbolic":"method"}],"updateStyle":[{"__symbolic":"method"}],"mergeConfig":[{"__symbolic":"method"}]}},"ToggleFullscreenDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":10,"character":1},"arguments":[{"selector":"[ngxToggleFullscreen]"}]}],"members":{"isFullscreen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3},"arguments":["ngxToggleFullscreen"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":18,"character":39},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":18,"character":46}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":18,"character":26},{"__symbolic":"reference","name":"any"}]}],"ngOnChanges":[{"__symbolic":"method"}],"openFullscreen":[{"__symbolic":"method"}],"closeFullscreen":[{"__symbolic":"method"}]}},"ImageViewerConfig":{"__symbolic":"interface"},"CustomEvent":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[null,null]}]}}},"origins":{"ImageViewerModule":"./lib/ngx-imageviewer.module","ImageViewerComponent":"./lib/ngx-imageviewer.component","ToggleFullscreenDirective":"./lib/fullscreen.directive","ImageViewerConfig":"./lib/ngx-imageviewer-config.model","CustomEvent":"./lib/ngx-imageviewer-config.model"},"importAs":"@udhsin/ngx-image-viewer"}