ngx-image-viewer - npm Package Compare versions

Comparing version 1.0.10 to 1.0.11

bundles/ngx-image-viewer.umd.js

@@ -198,2 +198,12 @@ (function (global, factory) {
      */
+    ImageViewerComponent.prototype.reset = function () {
+        this.scale = 1;
+        this.rotation = 0;
+        this.translateX = 0;
+        this.translateY = 0;
+        this.updateStyle();
+    };
+    /**
+     * @return {?}
+     */
     ImageViewerComponent.prototype.onMouseOver = function () {
@@ -239,12 +249,2 @@ this.hovered = true;
     };
-    /**
-     * @return {?}
-     */
-    ImageViewerComponent.prototype.reset = function () {
-        this.scale = 1;
-        this.rotation = 0;
-        this.translateX = 0;
-        this.translateY = 0;
-        this.updateStyle();
-    };
     return ImageViewerComponent;
@@ -251,0 +251,0 @@ }());

bundles/ngx-image-viewer.umd.min.js

@@ -1,2 +0,2 @@
-!function(n,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("screenfull")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/common","screenfull"],t):t(n["ngx-image-viewer"]={},n.ng.core,n.ng.common,n.screenfull)}(this,function(n,t,o,e){"use strict";var i=function(){return function(n,t){this.name=n,this.imageIndex=t}}(),r={btnClass:"default",zoomFactor:.1,containerBackgroundColor:"#ccc",wheelZoom:!1,allowFullscreen:!0,allowKeyboardNavigation:!0,btnShow:{zoomIn:!0,zoomOut:!0,rotateClockwise:!0,rotateCounterClockwise:!0,next:!0,prev:!0},btnIcons:{zoomIn:"fa fa-plus",zoomOut:"fa fa-minus",rotateClockwise:"fa fa-repeat",rotateCounterClockwise:"fa fa-undo",next:"fa fa-arrow-right",prev:"fa fa-arrow-left",fullscreen:"fa fa-arrows-alt"}},s=function(){function n(n){this.moduleConfig=n,this.index=0,this.indexChange=new t.EventEmitter,this.configChange=new t.EventEmitter,this.customEvent=new t.EventEmitter,this.style={transform:"",msTransform:"",oTransform:"",webkitTransform:""},this.fullscreen=!1,this.loading=!0,this.scale=1,this.rotation=0,this.translateX=0,this.translateY=0,this.hovered=!1}return n.prototype.ngOnInit=function(){var n=this.mergeConfig(r,this.moduleConfig);this.config=this.mergeConfig(n,this.config),this.triggerConfigBinding()},n.prototype.nextImage=function(n){this.canNavigate(n)&&this.index<this.src.length-1&&(this.loading=!0,this.index++,this.triggerIndexBinding(),this.reset())},n.prototype.prevImage=function(n){this.canNavigate(n)&&this.index>0&&(this.loading=!0,this.index--,this.triggerIndexBinding(),this.reset())},n.prototype.zoomIn=function(){this.scale*=1+this.config.zoomFactor,this.updateStyle()},n.prototype.zoomOut=function(){this.scale>this.config.zoomFactor&&(this.scale/=1+this.config.zoomFactor),this.updateStyle()},n.prototype.scrollZoom=function(n){if(this.config.wheelZoom)return n.deltaY>0?this.zoomOut():this.zoomIn(),!1},n.prototype.rotateClockwise=function(){this.rotation+=90,this.updateStyle()},n.prototype.rotateCounterClockwise=function(){this.rotation-=90,this.updateStyle()},n.prototype.onLoad=function(){this.loading=!1},n.prototype.onLoadStart=function(){this.loading=!0},n.prototype.onDragOver=function(n){this.translateX+=n.clientX-this.prevX,this.translateY+=n.clientY-this.prevY,this.prevX=n.clientX,this.prevY=n.clientY,this.updateStyle()},n.prototype.onDragStart=function(n){n.dataTransfer.setDragImage(n.target.nextElementSibling,0,0),this.prevX=n.clientX,this.prevY=n.clientY},n.prototype.toggleFullscreen=function(){this.fullscreen=!this.fullscreen,this.fullscreen||this.reset()},n.prototype.triggerIndexBinding=function(){this.indexChange.emit(this.index)},n.prototype.triggerConfigBinding=function(){this.configChange.next(this.config)},n.prototype.fireCustomEvent=function(n,t){this.customEvent.emit(new i(n,t))},n.prototype.onMouseOver=function(){this.hovered=!0},n.prototype.onMouseLeave=function(){this.hovered=!1},n.prototype.canNavigate=function(n){return null==n||this.config.allowKeyboardNavigation&&this.hovered},n.prototype.updateStyle=function(){this.style.transform="translate("+this.translateX+"px, "+this.translateY+"px) rotate("+this.rotation+"deg) scale("+this.scale+")",this.style.msTransform=this.style.transform,this.style.webkitTransform=this.style.transform,this.style.oTransform=this.style.transform},n.prototype.mergeConfig=function(n,t){var o=Object.assign({},n);return t&&(o=Object.assign({},n,t),t.btnIcons&&(o.btnIcons=Object.assign({},n.btnIcons,t.btnIcons))),o},n.prototype.reset=function(){this.scale=1,this.rotation=0,this.translateX=0,this.translateY=0,this.updateStyle()},n}();s.decorators=[{type:t.Component,args:[{selector:"ngx-image-viewer",template:'\n    <div [ngxToggleFullscreen]="fullscreen" class="img-container" [style.backgroundColor]="config.containerBackgroundColor"\n         (wheel)="scrollZoom($event)" (dragover)="onDragOver($event)">\n      <img [src]="src[index]" [ngStyle]="style" alt="Image not found..." (dragstart)="onDragStart($event)" (load)="onLoad()" (loadstart)="onLoadStart()"/>\n      \x3c!-- Div below will be used to hide the \'ghost\' image when dragging --\x3e\n      <div></div>\n      <div class="spinner-container" *ngIf="loading">\n        <div class="spinner"></div>\n      </div>\n\n      <button [class]="config.btnClass" *ngIf="config.btnShow.rotateCounterClockwise" (click)="rotateCounterClockwise()">\n        <span [class]="config.btnIcons.rotateCounterClockwise"></span>\n      </button>\n      <button [class]="config.btnClass" *ngIf="config.btnShow.rotateClockwise" (click)="rotateClockwise()">\n        <span [class]="config.btnIcons.rotateClockwise"></span>\n      </button>\n\n      <button [class]="config.btnClass" *ngIf="config.btnShow.zoomOut" (click)="zoomOut()">\n        <span [class]="config.btnIcons.zoomOut"></span>\n      </button>\n      <button [class]="config.btnClass" *ngIf="config.btnShow.zoomIn" (click)="zoomIn()">\n        <span [class]="config.btnIcons.zoomIn"></span>\n      </button>\n\n      <button [class]="config.btnClass" *ngFor="let cBtn of config.customBtns" (click)="fireCustomEvent(cBtn.name, index)">\n        <span [class]="cBtn.icon"></span>\n      </button>\n\n      <button id="ngx-fs-btn" [class]="config.btnClass" (click)="toggleFullscreen()" *ngIf="config.allowFullscreen">\n        <span [class]="config.btnIcons.fullscreen"></span>\n      </button>\n\n      <div class="nav-button-container" *ngIf="src.length > 1">\n        <button [class]="config.btnClass" (click)="prevImage()" [disabled]="index === 0">\n          <span [class]="config.btnIcons.prev"></span>\n        </button>\n        <button [class]="config.btnClass" (click)="nextImage()" [disabled]="index === src.length - 1">\n          <span [class]="config.btnIcons.next"></span>\n        </button>\n      </div>\n    </div>\n  ',styles:["\n    .img-container {\n      height: 100%;\n      width: 100%;\n      overflow: hidden;\n      position: relative; }\n\n    .img-container img {\n      z-index: 2;\n      margin: 0 auto;\n      display: block;\n      max-width: 100%;\n      max-height: 100%; }\n\n    .img-container button {\n      z-index: 99;\n      position: absolute;\n      right: 15px; }\n      .img-container button:not(:disabled) {\n        cursor: pointer; }\n\n    .img-container > button:nth-of-type(1):not(#ngx-fs-btn) {\n      bottom: 15px; }\n\n    .img-container > button:nth-of-type(2):not(#ngx-fs-btn) {\n      bottom: 65px; }\n\n    .img-container > button:nth-of-type(3):not(#ngx-fs-btn) {\n      bottom: 115px; }\n\n    .img-container > button:nth-of-type(4):not(#ngx-fs-btn) {\n      bottom: 165px; }\n\n    .img-container > button:nth-of-type(5):not(#ngx-fs-btn) {\n      bottom: 215px; }\n\n    .img-container > button:nth-of-type(6):not(#ngx-fs-btn) {\n      bottom: 265px; }\n\n    .img-container > button:nth-of-type(7):not(#ngx-fs-btn) {\n      bottom: 315px; }\n\n    #ngx-fs-btn {\n      top: 15px; }\n\n    button.default {\n      height: 40px;\n      width: 40px;\n      border: 1px solid #555;\n      border-radius: 50%;\n      background-color: white;\n      opacity: 0.7;\n      -webkit-transition: opacity 200ms;\n      transition: opacity 200ms; }\n\n    button.default:hover {\n      opacity: 1; }\n\n    button.default:disabled {\n      opacity: 0.25; }\n\n    .nav-button-container > button {\n      position: relative;\n      right: 0;\n      margin: 0 10px; }\n\n    .nav-button-container {\n      text-align: center;\n      position: absolute;\n      z-index: 98;\n      bottom: 10px;\n      left: 0;\n      right: 0; }\n\n    .spinner-container {\n      position: absolute;\n      left: 0;\n      right: 0;\n      top: 0;\n      bottom: 0;\n      width: 60px;\n      height: 60px;\n      margin: auto;\n      padding: 10px;\n      background-color: rgba(0, 0, 0, 0.4);\n      border-radius: 25%; }\n\n    .spinner {\n      border-width: 7px;\n      border-style: solid;\n      border-color: #ccc;\n      border-bottom-color: #222;\n      border-radius: 50%;\n      height: 100%;\n      width: 100%;\n      -webkit-box-sizing: border-box;\n              box-sizing: border-box;\n      -webkit-animation: rotation 2s linear infinite;\n      /* Safari 4+ */\n      /* Fx 5+ */\n      /* Opera 12+ */\n      animation: rotation 2s linear infinite;\n      /* IE 10+, Fx 29+ */ }\n\n    @keyframes rotation {\n      from {\n        -webkit-transform: rotate(0deg); }\n      to {\n        -webkit-transform: rotate(359deg); } }\n\n    @-webkit-keyframes rotation {\n      from {\n        -webkit-transform: rotate(0deg); }\n      to {\n        -webkit-transform: rotate(359deg); } }\n  "]}]}],s.ctorParameters=function(){return[{type:undefined,decorators:[{type:t.Optional},{type:t.Inject,args:["config"]}]}]},s.propDecorators={src:[{type:t.Input}],index:[{type:t.Input}],config:[{type:t.Input}],indexChange:[{type:t.Output}],configChange:[{type:t.Output}],customEvent:[{type:t.Output}],nextImage:[{type:t.HostListener,args:["window:keyup.ArrowRight",["$event"]]}],prevImage:[{type:t.HostListener,args:["window:keyup.ArrowLeft",["$event"]]}],onMouseOver:[{type:t.HostListener,args:["mouseover"]}],onMouseLeave:[{type:t.HostListener,args:["mouseleave"]}]};var a=function(){function n(n){this.el=n}return n.prototype.ngOnChanges=function(){this.isFullscreen&&e.enabled?e.request(this.el.nativeElement):e.enabled&&e.exit()},n}();a.decorators=[{type:t.Directive,args:[{selector:"[ngxToggleFullscreen]"}]}],a.ctorParameters=function(){return[{type:t.ElementRef}]},a.propDecorators={isFullscreen:[{type:t.Input,args:["ngxToggleFullscreen"]}]};var c=function(){function n(){}return n.forRoot=function(t){return{ngModule:n,providers:[{provide:"config",useValue:t}]}},n}();c.decorators=[{type:t.NgModule,args:[{imports:[o.CommonModule],declarations:[s,a],exports:[s,a]}]}],c.ctorParameters=function(){return[]},n.ImageViewerComponent=s,n.CustomEvent=i,n.ImageViewerModule=c,n.ɵa=a,Object.defineProperty(n,"__esModule",{value:!0})});
+!function(n,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("screenfull")):"function"==typeof define&&define.amd?define(["exports","@angular/core","@angular/common","screenfull"],t):t(n["ngx-image-viewer"]={},n.ng.core,n.ng.common,n.screenfull)}(this,function(n,t,o,e){"use strict";var i=function(){return function(n,t){this.name=n,this.imageIndex=t}}(),r={btnClass:"default",zoomFactor:.1,containerBackgroundColor:"#ccc",wheelZoom:!1,allowFullscreen:!0,allowKeyboardNavigation:!0,btnShow:{zoomIn:!0,zoomOut:!0,rotateClockwise:!0,rotateCounterClockwise:!0,next:!0,prev:!0},btnIcons:{zoomIn:"fa fa-plus",zoomOut:"fa fa-minus",rotateClockwise:"fa fa-repeat",rotateCounterClockwise:"fa fa-undo",next:"fa fa-arrow-right",prev:"fa fa-arrow-left",fullscreen:"fa fa-arrows-alt"}},s=function(){function n(n){this.moduleConfig=n,this.index=0,this.indexChange=new t.EventEmitter,this.configChange=new t.EventEmitter,this.customEvent=new t.EventEmitter,this.style={transform:"",msTransform:"",oTransform:"",webkitTransform:""},this.fullscreen=!1,this.loading=!0,this.scale=1,this.rotation=0,this.translateX=0,this.translateY=0,this.hovered=!1}return n.prototype.ngOnInit=function(){var n=this.mergeConfig(r,this.moduleConfig);this.config=this.mergeConfig(n,this.config),this.triggerConfigBinding()},n.prototype.nextImage=function(n){this.canNavigate(n)&&this.index<this.src.length-1&&(this.loading=!0,this.index++,this.triggerIndexBinding(),this.reset())},n.prototype.prevImage=function(n){this.canNavigate(n)&&this.index>0&&(this.loading=!0,this.index--,this.triggerIndexBinding(),this.reset())},n.prototype.zoomIn=function(){this.scale*=1+this.config.zoomFactor,this.updateStyle()},n.prototype.zoomOut=function(){this.scale>this.config.zoomFactor&&(this.scale/=1+this.config.zoomFactor),this.updateStyle()},n.prototype.scrollZoom=function(n){if(this.config.wheelZoom)return n.deltaY>0?this.zoomOut():this.zoomIn(),!1},n.prototype.rotateClockwise=function(){this.rotation+=90,this.updateStyle()},n.prototype.rotateCounterClockwise=function(){this.rotation-=90,this.updateStyle()},n.prototype.onLoad=function(){this.loading=!1},n.prototype.onLoadStart=function(){this.loading=!0},n.prototype.onDragOver=function(n){this.translateX+=n.clientX-this.prevX,this.translateY+=n.clientY-this.prevY,this.prevX=n.clientX,this.prevY=n.clientY,this.updateStyle()},n.prototype.onDragStart=function(n){n.dataTransfer.setDragImage(n.target.nextElementSibling,0,0),this.prevX=n.clientX,this.prevY=n.clientY},n.prototype.toggleFullscreen=function(){this.fullscreen=!this.fullscreen,this.fullscreen||this.reset()},n.prototype.triggerIndexBinding=function(){this.indexChange.emit(this.index)},n.prototype.triggerConfigBinding=function(){this.configChange.next(this.config)},n.prototype.fireCustomEvent=function(n,t){this.customEvent.emit(new i(n,t))},n.prototype.reset=function(){this.scale=1,this.rotation=0,this.translateX=0,this.translateY=0,this.updateStyle()},n.prototype.onMouseOver=function(){this.hovered=!0},n.prototype.onMouseLeave=function(){this.hovered=!1},n.prototype.canNavigate=function(n){return null==n||this.config.allowKeyboardNavigation&&this.hovered},n.prototype.updateStyle=function(){this.style.transform="translate("+this.translateX+"px, "+this.translateY+"px) rotate("+this.rotation+"deg) scale("+this.scale+")",this.style.msTransform=this.style.transform,this.style.webkitTransform=this.style.transform,this.style.oTransform=this.style.transform},n.prototype.mergeConfig=function(n,t){var o=Object.assign({},n);return t&&(o=Object.assign({},n,t),t.btnIcons&&(o.btnIcons=Object.assign({},n.btnIcons,t.btnIcons))),o},n}();s.decorators=[{type:t.Component,args:[{selector:"ngx-image-viewer",template:'\n    <div [ngxToggleFullscreen]="fullscreen" class="img-container" [style.backgroundColor]="config.containerBackgroundColor"\n         (wheel)="scrollZoom($event)" (dragover)="onDragOver($event)">\n      <img [src]="src[index]" [ngStyle]="style" alt="Image not found..." (dragstart)="onDragStart($event)" (load)="onLoad()" (loadstart)="onLoadStart()"/>\n      \x3c!-- Div below will be used to hide the \'ghost\' image when dragging --\x3e\n      <div></div>\n      <div class="spinner-container" *ngIf="loading">\n        <div class="spinner"></div>\n      </div>\n\n      <button [class]="config.btnClass" *ngIf="config.btnShow.rotateCounterClockwise" (click)="rotateCounterClockwise()">\n        <span [class]="config.btnIcons.rotateCounterClockwise"></span>\n      </button>\n      <button [class]="config.btnClass" *ngIf="config.btnShow.rotateClockwise" (click)="rotateClockwise()">\n        <span [class]="config.btnIcons.rotateClockwise"></span>\n      </button>\n\n      <button [class]="config.btnClass" *ngIf="config.btnShow.zoomOut" (click)="zoomOut()">\n        <span [class]="config.btnIcons.zoomOut"></span>\n      </button>\n      <button [class]="config.btnClass" *ngIf="config.btnShow.zoomIn" (click)="zoomIn()">\n        <span [class]="config.btnIcons.zoomIn"></span>\n      </button>\n\n      <button [class]="config.btnClass" *ngFor="let cBtn of config.customBtns" (click)="fireCustomEvent(cBtn.name, index)">\n        <span [class]="cBtn.icon"></span>\n      </button>\n\n      <button id="ngx-fs-btn" [class]="config.btnClass" (click)="toggleFullscreen()" *ngIf="config.allowFullscreen">\n        <span [class]="config.btnIcons.fullscreen"></span>\n      </button>\n\n      <div class="nav-button-container" *ngIf="src.length > 1">\n        <button [class]="config.btnClass" (click)="prevImage()" [disabled]="index === 0">\n          <span [class]="config.btnIcons.prev"></span>\n        </button>\n        <button [class]="config.btnClass" (click)="nextImage()" [disabled]="index === src.length - 1">\n          <span [class]="config.btnIcons.next"></span>\n        </button>\n      </div>\n    </div>\n  ',styles:["\n    .img-container {\n      height: 100%;\n      width: 100%;\n      overflow: hidden;\n      position: relative; }\n\n    .img-container img {\n      z-index: 2;\n      margin: 0 auto;\n      display: block;\n      max-width: 100%;\n      max-height: 100%; }\n\n    .img-container button {\n      z-index: 99;\n      position: absolute;\n      right: 15px; }\n      .img-container button:not(:disabled) {\n        cursor: pointer; }\n\n    .img-container > button:nth-of-type(1):not(#ngx-fs-btn) {\n      bottom: 15px; }\n\n    .img-container > button:nth-of-type(2):not(#ngx-fs-btn) {\n      bottom: 65px; }\n\n    .img-container > button:nth-of-type(3):not(#ngx-fs-btn) {\n      bottom: 115px; }\n\n    .img-container > button:nth-of-type(4):not(#ngx-fs-btn) {\n      bottom: 165px; }\n\n    .img-container > button:nth-of-type(5):not(#ngx-fs-btn) {\n      bottom: 215px; }\n\n    .img-container > button:nth-of-type(6):not(#ngx-fs-btn) {\n      bottom: 265px; }\n\n    .img-container > button:nth-of-type(7):not(#ngx-fs-btn) {\n      bottom: 315px; }\n\n    #ngx-fs-btn {\n      top: 15px; }\n\n    button.default {\n      height: 40px;\n      width: 40px;\n      border: 1px solid #555;\n      border-radius: 50%;\n      background-color: white;\n      opacity: 0.7;\n      -webkit-transition: opacity 200ms;\n      transition: opacity 200ms; }\n\n    button.default:hover {\n      opacity: 1; }\n\n    button.default:disabled {\n      opacity: 0.25; }\n\n    .nav-button-container > button {\n      position: relative;\n      right: 0;\n      margin: 0 10px; }\n\n    .nav-button-container {\n      text-align: center;\n      position: absolute;\n      z-index: 98;\n      bottom: 10px;\n      left: 0;\n      right: 0; }\n\n    .spinner-container {\n      position: absolute;\n      left: 0;\n      right: 0;\n      top: 0;\n      bottom: 0;\n      width: 60px;\n      height: 60px;\n      margin: auto;\n      padding: 10px;\n      background-color: rgba(0, 0, 0, 0.4);\n      border-radius: 25%; }\n\n    .spinner {\n      border-width: 7px;\n      border-style: solid;\n      border-color: #ccc;\n      border-bottom-color: #222;\n      border-radius: 50%;\n      height: 100%;\n      width: 100%;\n      -webkit-box-sizing: border-box;\n              box-sizing: border-box;\n      -webkit-animation: rotation 2s linear infinite;\n      /* Safari 4+ */\n      /* Fx 5+ */\n      /* Opera 12+ */\n      animation: rotation 2s linear infinite;\n      /* IE 10+, Fx 29+ */ }\n\n    @keyframes rotation {\n      from {\n        -webkit-transform: rotate(0deg); }\n      to {\n        -webkit-transform: rotate(359deg); } }\n\n    @-webkit-keyframes rotation {\n      from {\n        -webkit-transform: rotate(0deg); }\n      to {\n        -webkit-transform: rotate(359deg); } }\n  "]}]}],s.ctorParameters=function(){return[{type:undefined,decorators:[{type:t.Optional},{type:t.Inject,args:["config"]}]}]},s.propDecorators={src:[{type:t.Input}],index:[{type:t.Input}],config:[{type:t.Input}],indexChange:[{type:t.Output}],configChange:[{type:t.Output}],customEvent:[{type:t.Output}],nextImage:[{type:t.HostListener,args:["window:keyup.ArrowRight",["$event"]]}],prevImage:[{type:t.HostListener,args:["window:keyup.ArrowLeft",["$event"]]}],onMouseOver:[{type:t.HostListener,args:["mouseover"]}],onMouseLeave:[{type:t.HostListener,args:["mouseleave"]}]};var a=function(){function n(n){this.el=n}return n.prototype.ngOnChanges=function(){this.isFullscreen&&e.enabled?e.request(this.el.nativeElement):e.enabled&&e.exit()},n}();a.decorators=[{type:t.Directive,args:[{selector:"[ngxToggleFullscreen]"}]}],a.ctorParameters=function(){return[{type:t.ElementRef}]},a.propDecorators={isFullscreen:[{type:t.Input,args:["ngxToggleFullscreen"]}]};var c=function(){function n(){}return n.forRoot=function(t){return{ngModule:n,providers:[{provide:"config",useValue:t}]}},n}();c.decorators=[{type:t.NgModule,args:[{imports:[o.CommonModule],declarations:[s,a],exports:[s,a]}]}],c.ctorParameters=function(){return[]},n.ImageViewerComponent=s,n.CustomEvent=i,n.ImageViewerModule=c,n.ɵa=a,Object.defineProperty(n,"__esModule",{value:!0})});
 //# sourceMappingURL=ngx-image-viewer.umd.min.js.map

ngx-image-viewer.es5.js

@@ -195,2 +195,12 @@ import { Component, Directive, ElementRef, EventEmitter, HostListener, Inject, Input, NgModule, Optional, Output } from '@angular/core';
      */
+    ImageViewerComponent.prototype.reset = function () {
+        this.scale = 1;
+        this.rotation = 0;
+        this.translateX = 0;
+        this.translateY = 0;
+        this.updateStyle();
+    };
+    /**
+     * @return {?}
+     */
     ImageViewerComponent.prototype.onMouseOver = function () {
@@ -236,12 +246,2 @@ this.hovered = true;
     };
-    /**
-     * @return {?}
-     */
-    ImageViewerComponent.prototype.reset = function () {
-        this.scale = 1;
-        this.rotation = 0;
-        this.translateX = 0;
-        this.translateY = 0;
-        this.updateStyle();
-    };
     return ImageViewerComponent;
@@ -248,0 +248,0 @@ }());

ngx-image-viewer.js

@@ -196,2 +196,12 @@ import { Component, Directive, ElementRef, EventEmitter, HostListener, Inject, Input, NgModule, Optional, Output } from '@angular/core';
      */
+    reset() {
+        this.scale = 1;
+        this.rotation = 0;
+        this.translateX = 0;
+        this.translateY = 0;
+        this.updateStyle();
+    }
+    /**
+     * @return {?}
+     */
     onMouseOver() {
@@ -237,12 +247,2 @@ this.hovered = true;
     }
-    /**
-     * @return {?}
-     */
-    reset() {
-        this.scale = 1;
-        this.rotation = 0;
-        this.translateX = 0;
-        this.translateY = 0;
-        this.updateStyle();
-    }
 }
@@ -249,0 +249,0 @@ ImageViewerComponent.decorators = [

ngx-image-viewer.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":3,"metadata":{"ImageViewerModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"}],"declarations":[{"__symbolic":"reference","name":"ImageViewerComponent"},{"__symbolic":"reference","name":"ɵa"}],"exports":[{"__symbolic":"reference","name":"ImageViewerComponent"},{"__symbolic":"reference","name":"ɵa"}]}]}],"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"},"arguments":[{"selector":"ngx-image-viewer","template":"\n    <div [ngxToggleFullscreen]=\"fullscreen\" class=\"img-container\" [style.backgroundColor]=\"config.containerBackgroundColor\"\n         (wheel)=\"scrollZoom($event)\" (dragover)=\"onDragOver($event)\">\n      <img [src]=\"src[index]\" [ngStyle]=\"style\" alt=\"Image not found...\" (dragstart)=\"onDragStart($event)\" (load)=\"onLoad()\" (loadstart)=\"onLoadStart()\"/>\n      <!-- Div below will be used to hide the 'ghost' image when dragging -->\n      <div></div>\n      <div class=\"spinner-container\" *ngIf=\"loading\">\n        <div class=\"spinner\"></div>\n      </div>\n\n      <button [class]=\"config.btnClass\" *ngIf=\"config.btnShow.rotateCounterClockwise\" (click)=\"rotateCounterClockwise()\">\n        <span [class]=\"config.btnIcons.rotateCounterClockwise\"></span>\n      </button>\n      <button [class]=\"config.btnClass\" *ngIf=\"config.btnShow.rotateClockwise\" (click)=\"rotateClockwise()\">\n        <span [class]=\"config.btnIcons.rotateClockwise\"></span>\n      </button>\n\n      <button [class]=\"config.btnClass\" *ngIf=\"config.btnShow.zoomOut\" (click)=\"zoomOut()\">\n        <span [class]=\"config.btnIcons.zoomOut\"></span>\n      </button>\n      <button [class]=\"config.btnClass\" *ngIf=\"config.btnShow.zoomIn\" (click)=\"zoomIn()\">\n        <span [class]=\"config.btnIcons.zoomIn\"></span>\n      </button>\n\n      <button [class]=\"config.btnClass\" *ngFor=\"let cBtn of config.customBtns\" (click)=\"fireCustomEvent(cBtn.name, index)\">\n        <span [class]=\"cBtn.icon\"></span>\n      </button>\n\n      <button id=\"ngx-fs-btn\" [class]=\"config.btnClass\" (click)=\"toggleFullscreen()\" *ngIf=\"config.allowFullscreen\">\n        <span [class]=\"config.btnIcons.fullscreen\"></span>\n      </button>\n\n      <div class=\"nav-button-container\" *ngIf=\"src.length > 1\">\n        <button [class]=\"config.btnClass\" (click)=\"prevImage()\" [disabled]=\"index === 0\">\n          <span [class]=\"config.btnIcons.prev\"></span>\n        </button>\n        <button [class]=\"config.btnClass\" (click)=\"nextImage()\" [disabled]=\"index === src.length - 1\">\n          <span [class]=\"config.btnIcons.next\"></span>\n        </button>\n      </div>\n    </div>\n  ","styles":["\n    .img-container {\n      height: 100%;\n      width: 100%;\n      overflow: hidden;\n      position: relative; }\n\n    .img-container img {\n      z-index: 2;\n      margin: 0 auto;\n      display: block;\n      max-width: 100%;\n      max-height: 100%; }\n\n    .img-container button {\n      z-index: 99;\n      position: absolute;\n      right: 15px; }\n      .img-container button:not(:disabled) {\n        cursor: pointer; }\n\n    .img-container > button:nth-of-type(1):not(#ngx-fs-btn) {\n      bottom: 15px; }\n\n    .img-container > button:nth-of-type(2):not(#ngx-fs-btn) {\n      bottom: 65px; }\n\n    .img-container > button:nth-of-type(3):not(#ngx-fs-btn) {\n      bottom: 115px; }\n\n    .img-container > button:nth-of-type(4):not(#ngx-fs-btn) {\n      bottom: 165px; }\n\n    .img-container > button:nth-of-type(5):not(#ngx-fs-btn) {\n      bottom: 215px; }\n\n    .img-container > button:nth-of-type(6):not(#ngx-fs-btn) {\n      bottom: 265px; }\n\n    .img-container > button:nth-of-type(7):not(#ngx-fs-btn) {\n      bottom: 315px; }\n\n    #ngx-fs-btn {\n      top: 15px; }\n\n    button.default {\n      height: 40px;\n      width: 40px;\n      border: 1px solid #555;\n      border-radius: 50%;\n      background-color: white;\n      opacity: 0.7;\n      -webkit-transition: opacity 200ms;\n      transition: opacity 200ms; }\n\n    button.default:hover {\n      opacity: 1; }\n\n    button.default:disabled {\n      opacity: 0.25; }\n\n    .nav-button-container > button {\n      position: relative;\n      right: 0;\n      margin: 0 10px; }\n\n    .nav-button-container {\n      text-align: center;\n      position: absolute;\n      z-index: 98;\n      bottom: 10px;\n      left: 0;\n      right: 0; }\n\n    .spinner-container {\n      position: absolute;\n      left: 0;\n      right: 0;\n      top: 0;\n      bottom: 0;\n      width: 60px;\n      height: 60px;\n      margin: auto;\n      padding: 10px;\n      background-color: rgba(0, 0, 0, 0.4);\n      border-radius: 25%; }\n\n    .spinner {\n      border-width: 7px;\n      border-style: solid;\n      border-color: #ccc;\n      border-bottom-color: #222;\n      border-radius: 50%;\n      height: 100%;\n      width: 100%;\n      -webkit-box-sizing: border-box;\n              box-sizing: border-box;\n      -webkit-animation: rotation 2s linear infinite;\n      /* Safari 4+ */\n      /* Fx 5+ */\n      /* Opera 12+ */\n      animation: rotation 2s linear infinite;\n      /* IE 10+, Fx 29+ */ }\n\n    @keyframes rotation {\n      from {\n        -webkit-transform: rotate(0deg); }\n      to {\n        -webkit-transform: rotate(359deg); } }\n\n    @-webkit-keyframes rotation {\n      from {\n        -webkit-transform: rotate(0deg); }\n      to {\n        -webkit-transform: rotate(359deg); } }\n  "]}]}],"members":{"src":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"index":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"indexChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"configChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"customEvent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject"},"arguments":["config"]}]],"parameters":[{"__symbolic":"reference","name":"ImageViewerConfig"}]}],"ngOnInit":[{"__symbolic":"method"}],"nextImage":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["window:keyup.ArrowRight",["$event"]]}]}],"prevImage":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"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"}],"onMouseOver":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["mouseover"]}]}],"onMouseLeave":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["mouseleave"]}]}],"canNavigate":[{"__symbolic":"method"}],"updateStyle":[{"__symbolic":"method"}],"mergeConfig":[{"__symbolic":"method"}],"reset":[{"__symbolic":"method"}]}},"ImageViewerConfig":{"__symbolic":"interface"},"CustomEvent":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[null,null]}]}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"[ngxToggleFullscreen]"}]}],"members":{"isFullscreen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["ngxToggleFullscreen"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"}]}],"ngOnChanges":[{"__symbolic":"method"}]}}},"origins":{"ImageViewerModule":"./src/app/image-viewer/image-viewer.module","ImageViewerComponent":"./src/app/image-viewer/image-viewer.component","ImageViewerConfig":"./src/app/image-viewer/image-viewer-config.model","CustomEvent":"./src/app/image-viewer/image-viewer-config.model","ɵa":"./src/app/image-viewer/fullscreen.directive"},"importAs":"ngx-image-viewer"}
+{"__symbolic":"module","version":3,"metadata":{"ImageViewerModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"}],"declarations":[{"__symbolic":"reference","name":"ImageViewerComponent"},{"__symbolic":"reference","name":"ɵa"}],"exports":[{"__symbolic":"reference","name":"ImageViewerComponent"},{"__symbolic":"reference","name":"ɵa"}]}]}],"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"},"arguments":[{"selector":"ngx-image-viewer","template":"\n    <div [ngxToggleFullscreen]=\"fullscreen\" class=\"img-container\" [style.backgroundColor]=\"config.containerBackgroundColor\"\n         (wheel)=\"scrollZoom($event)\" (dragover)=\"onDragOver($event)\">\n      <img [src]=\"src[index]\" [ngStyle]=\"style\" alt=\"Image not found...\" (dragstart)=\"onDragStart($event)\" (load)=\"onLoad()\" (loadstart)=\"onLoadStart()\"/>\n      <!-- Div below will be used to hide the 'ghost' image when dragging -->\n      <div></div>\n      <div class=\"spinner-container\" *ngIf=\"loading\">\n        <div class=\"spinner\"></div>\n      </div>\n\n      <button [class]=\"config.btnClass\" *ngIf=\"config.btnShow.rotateCounterClockwise\" (click)=\"rotateCounterClockwise()\">\n        <span [class]=\"config.btnIcons.rotateCounterClockwise\"></span>\n      </button>\n      <button [class]=\"config.btnClass\" *ngIf=\"config.btnShow.rotateClockwise\" (click)=\"rotateClockwise()\">\n        <span [class]=\"config.btnIcons.rotateClockwise\"></span>\n      </button>\n\n      <button [class]=\"config.btnClass\" *ngIf=\"config.btnShow.zoomOut\" (click)=\"zoomOut()\">\n        <span [class]=\"config.btnIcons.zoomOut\"></span>\n      </button>\n      <button [class]=\"config.btnClass\" *ngIf=\"config.btnShow.zoomIn\" (click)=\"zoomIn()\">\n        <span [class]=\"config.btnIcons.zoomIn\"></span>\n      </button>\n\n      <button [class]=\"config.btnClass\" *ngFor=\"let cBtn of config.customBtns\" (click)=\"fireCustomEvent(cBtn.name, index)\">\n        <span [class]=\"cBtn.icon\"></span>\n      </button>\n\n      <button id=\"ngx-fs-btn\" [class]=\"config.btnClass\" (click)=\"toggleFullscreen()\" *ngIf=\"config.allowFullscreen\">\n        <span [class]=\"config.btnIcons.fullscreen\"></span>\n      </button>\n\n      <div class=\"nav-button-container\" *ngIf=\"src.length > 1\">\n        <button [class]=\"config.btnClass\" (click)=\"prevImage()\" [disabled]=\"index === 0\">\n          <span [class]=\"config.btnIcons.prev\"></span>\n        </button>\n        <button [class]=\"config.btnClass\" (click)=\"nextImage()\" [disabled]=\"index === src.length - 1\">\n          <span [class]=\"config.btnIcons.next\"></span>\n        </button>\n      </div>\n    </div>\n  ","styles":["\n    .img-container {\n      height: 100%;\n      width: 100%;\n      overflow: hidden;\n      position: relative; }\n\n    .img-container img {\n      z-index: 2;\n      margin: 0 auto;\n      display: block;\n      max-width: 100%;\n      max-height: 100%; }\n\n    .img-container button {\n      z-index: 99;\n      position: absolute;\n      right: 15px; }\n      .img-container button:not(:disabled) {\n        cursor: pointer; }\n\n    .img-container > button:nth-of-type(1):not(#ngx-fs-btn) {\n      bottom: 15px; }\n\n    .img-container > button:nth-of-type(2):not(#ngx-fs-btn) {\n      bottom: 65px; }\n\n    .img-container > button:nth-of-type(3):not(#ngx-fs-btn) {\n      bottom: 115px; }\n\n    .img-container > button:nth-of-type(4):not(#ngx-fs-btn) {\n      bottom: 165px; }\n\n    .img-container > button:nth-of-type(5):not(#ngx-fs-btn) {\n      bottom: 215px; }\n\n    .img-container > button:nth-of-type(6):not(#ngx-fs-btn) {\n      bottom: 265px; }\n\n    .img-container > button:nth-of-type(7):not(#ngx-fs-btn) {\n      bottom: 315px; }\n\n    #ngx-fs-btn {\n      top: 15px; }\n\n    button.default {\n      height: 40px;\n      width: 40px;\n      border: 1px solid #555;\n      border-radius: 50%;\n      background-color: white;\n      opacity: 0.7;\n      -webkit-transition: opacity 200ms;\n      transition: opacity 200ms; }\n\n    button.default:hover {\n      opacity: 1; }\n\n    button.default:disabled {\n      opacity: 0.25; }\n\n    .nav-button-container > button {\n      position: relative;\n      right: 0;\n      margin: 0 10px; }\n\n    .nav-button-container {\n      text-align: center;\n      position: absolute;\n      z-index: 98;\n      bottom: 10px;\n      left: 0;\n      right: 0; }\n\n    .spinner-container {\n      position: absolute;\n      left: 0;\n      right: 0;\n      top: 0;\n      bottom: 0;\n      width: 60px;\n      height: 60px;\n      margin: auto;\n      padding: 10px;\n      background-color: rgba(0, 0, 0, 0.4);\n      border-radius: 25%; }\n\n    .spinner {\n      border-width: 7px;\n      border-style: solid;\n      border-color: #ccc;\n      border-bottom-color: #222;\n      border-radius: 50%;\n      height: 100%;\n      width: 100%;\n      -webkit-box-sizing: border-box;\n              box-sizing: border-box;\n      -webkit-animation: rotation 2s linear infinite;\n      /* Safari 4+ */\n      /* Fx 5+ */\n      /* Opera 12+ */\n      animation: rotation 2s linear infinite;\n      /* IE 10+, Fx 29+ */ }\n\n    @keyframes rotation {\n      from {\n        -webkit-transform: rotate(0deg); }\n      to {\n        -webkit-transform: rotate(359deg); } }\n\n    @-webkit-keyframes rotation {\n      from {\n        -webkit-transform: rotate(0deg); }\n      to {\n        -webkit-transform: rotate(359deg); } }\n  "]}]}],"members":{"src":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"index":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"indexChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"configChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"customEvent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional"}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject"},"arguments":["config"]}]],"parameters":[{"__symbolic":"reference","name":"ImageViewerConfig"}]}],"ngOnInit":[{"__symbolic":"method"}],"nextImage":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["window:keyup.ArrowRight",["$event"]]}]}],"prevImage":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"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"},"arguments":["mouseover"]}]}],"onMouseLeave":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["mouseleave"]}]}],"canNavigate":[{"__symbolic":"method"}],"updateStyle":[{"__symbolic":"method"}],"mergeConfig":[{"__symbolic":"method"}]}},"ImageViewerConfig":{"__symbolic":"interface"},"CustomEvent":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[null,null]}]}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"[ngxToggleFullscreen]"}]}],"members":{"isFullscreen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"},"arguments":["ngxToggleFullscreen"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"}]}],"ngOnChanges":[{"__symbolic":"method"}]}}},"origins":{"ImageViewerModule":"./src/app/image-viewer/image-viewer.module","ImageViewerComponent":"./src/app/image-viewer/image-viewer.component","ImageViewerConfig":"./src/app/image-viewer/image-viewer-config.model","CustomEvent":"./src/app/image-viewer/image-viewer-config.model","ɵa":"./src/app/image-viewer/fullscreen.directive"},"importAs":"ngx-image-viewer"}

package.json

@@ -1,1 +0,1 @@
-{"name":"ngx-image-viewer","version":"1.0.10","license":"MIT","scripts":{"ng":"ng","start":"ng serve","build":"ng build","test":"ng test","lint":"ng lint","e2e":"ng e2e","packagr":"ng-packagr -p ng-package.json"},"private":false,"peerDependencies":{"@angular/core":">= 2.0.0","@angular/common":">= 2.0.0"},"repository":{"url":"https://github.com/jpilfold/ngx-image-viewer"},"devDependencies":{"@angular/animations":"^5.0.0","@angular/cli":"1.6.0","@angular/common":"^5.0.0","@angular/compiler":"^5.0.0","@angular/compiler-cli":"^5.0.0","@angular/core":"^5.0.0","@angular/forms":"^5.0.0","@angular/http":"^5.0.0","@angular/language-service":"^5.0.0","@angular/platform-browser":"^5.0.0","@angular/platform-browser-dynamic":"^5.0.0","@angular/router":"^5.0.0","@types/jasmine":"~2.5.53","@types/jasminewd2":"~2.0.2","@types/node":"~6.0.60","codelyzer":"^4.0.1","core-js":"^2.4.1","font-awesome":"^4.7.0","jasmine-core":"~2.6.2","jasmine-spec-reporter":"~4.1.0","karma":"~1.7.0","karma-chrome-launcher":"~2.1.1","karma-cli":"~1.0.1","karma-coverage-istanbul-reporter":"^1.2.1","karma-jasmine":"~1.1.0","karma-jasmine-html-reporter":"^0.2.2","ng-packagr":"^1.6.0","protractor":"~5.1.2","rxjs":"^5.5.2","ssri":"5.2.2","ts-node":"~3.2.0","tslint":"~5.7.0","typescript":"~2.4.2","zone.js":"^0.8.14"},"dependencies":{"screenfull":"^3.3.2"},"main":"bundles/ngx-image-viewer.umd.js","module":"ngx-image-viewer.es5.js","es2015":"ngx-image-viewer.js","typings":"ngx-image-viewer.d.ts","metadata":"ngx-image-viewer.metadata.json"}
+{"name":"ngx-image-viewer","version":"1.0.11","license":"MIT","scripts":{"ng":"ng","start":"ng serve","build":"ng build","test":"ng test","lint":"ng lint","e2e":"ng e2e","packagr":"ng-packagr -p ng-package.json"},"private":false,"peerDependencies":{"@angular/core":">= 2.0.0","@angular/common":">= 2.0.0"},"repository":{"url":"https://github.com/jpilfold/ngx-image-viewer"},"devDependencies":{"@angular/animations":"^5.0.0","@angular/cli":"1.6.0","@angular/common":"^5.0.0","@angular/compiler":"^5.0.0","@angular/compiler-cli":"^5.0.0","@angular/core":"^5.0.0","@angular/forms":"^5.0.0","@angular/http":"^5.0.0","@angular/language-service":"^5.0.0","@angular/platform-browser":"^5.0.0","@angular/platform-browser-dynamic":"^5.0.0","@angular/router":"^5.0.0","@types/jasmine":"~2.5.53","@types/jasminewd2":"~2.0.2","@types/node":"~6.0.60","codelyzer":"^4.0.1","core-js":"^2.4.1","font-awesome":"^4.7.0","jasmine-core":"~2.6.2","jasmine-spec-reporter":"~4.1.0","karma":"~1.7.0","karma-chrome-launcher":"~2.1.1","karma-cli":"~1.0.1","karma-coverage-istanbul-reporter":"^1.2.1","karma-jasmine":"~1.1.0","karma-jasmine-html-reporter":"^0.2.2","ng-packagr":"^1.6.0","protractor":"~5.1.2","rxjs":"^5.5.2","ssri":"5.2.2","ts-node":"~3.2.0","tslint":"~5.7.0","typescript":"~2.4.2","zone.js":"^0.8.14"},"dependencies":{"screenfull":"^3.3.2"},"main":"bundles/ngx-image-viewer.umd.js","module":"ngx-image-viewer.es5.js","es2015":"ngx-image-viewer.js","typings":"ngx-image-viewer.d.ts","metadata":"ngx-image-viewer.metadata.json"}

src/app/image-viewer/image-viewer.component.d.ts

@@ -43,2 +43,3 @@ import { OnInit, EventEmitter } from '@angular/core';
     fireCustomEvent(name: any, imageIndex: any): void;
+    reset(): void;
     private onMouseOver();
@@ -49,3 +50,2 @@ private onMouseLeave();
     private mergeConfig(defaultValues, overrideValues);
-    private reset();
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

171439

decreased by-0.02%

No dependency changes