From e8c9b184fee237070d78fbe142e851139b28f73a Mon Sep 17 00:00:00 2001
From: "Patrik J. Braun" <bra.patrik@gmail.com>
Date: Wed, 19 Dec 2018 22:32:59 +0100
Subject: [PATCH] fixing zoom progress zoom place bug

---
 .../lightbox/lightbox.gallery.component.html  |  2 +-
 .../lightbox/lightbox.gallery.component.ts    | 26 ++++++++++---------
 2 files changed, 15 insertions(+), 13 deletions(-)

diff --git a/frontend/app/gallery/lightbox/lightbox.gallery.component.html b/frontend/app/gallery/lightbox/lightbox.gallery.component.html
index 1d21689..7798a9b 100644
--- a/frontend/app/gallery/lightbox/lightbox.gallery.component.html
+++ b/frontend/app/gallery/lightbox/lightbox.gallery.component.html
@@ -85,7 +85,7 @@
       </div>
 
       <input type="range"
-             [(ngModel)]="zoom" min="1" [max]="MAX_ZOOM" step="0.1"
+             [(ngModel)]="Zoom"  min="1" [max]="MAX_ZOOM" step="0.1"
              value="1" class="col-10 col-md-4 zoom-progress">
       <div class="col-1 col-md-4">
         <span (click)="zoomIn()" class="oi oi-zoom-in float-left"></span>
diff --git a/frontend/app/gallery/lightbox/lightbox.gallery.component.ts b/frontend/app/gallery/lightbox/lightbox.gallery.component.ts
index 14fe412..8d8b9ff 100644
--- a/frontend/app/gallery/lightbox/lightbox.gallery.component.ts
+++ b/frontend/app/gallery/lightbox/lightbox.gallery.component.ts
@@ -132,7 +132,7 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
       return;
     }
 
-    this.setZoom(1);
+    this.Zoom = 1;
     const photo = this.gridPhotoQL.find(i => this.queryService.getMediaStringId(i.gridPhoto.media) === photoStringId);
     if (!photo) {
       return this.delayedMediaShow = photoStringId;
@@ -186,7 +186,6 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
     if (!this.activePhoto || this.activePhoto.gridPhoto.isVideo()) {
       return;
     }
-    this.showControls();
     if ($event.deltaY < 0) {
       this.zoomIn();
     } else {
@@ -200,7 +199,7 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
       return;
     }
     this.showControls();
-    this.setZoom(this.prevZoom * $event.scale);
+    this.Zoom = this.prevZoom * $event.scale;
   }
 
   @HostListener('pinchend', ['$event'])
@@ -209,7 +208,7 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
       return;
     }
     this.showControls();
-    this.setZoom(this.prevZoom * $event.scale);
+    this.Zoom = this.prevZoom * $event.scale;
     this.prevZoom = this.zoom;
   }
 
@@ -223,11 +222,11 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
 
     this.showControls();
     if (this.zoom > 1) {
-      this.setZoom(1);
+      this.Zoom = 1;
       this.prevZoom = this.zoom;
       return;
     } else {
-      this.setZoom(5);
+      this.Zoom = 5;
       this.prevZoom = this.zoom;
       return;
     }
@@ -235,17 +234,20 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
 
   zoomIn() {
     this.showControls();
-    this.setZoom(this.zoom + this.zoom / 10);
-
+    this.Zoom = this.zoom + this.zoom / 10;
   }
 
   zoomOut() {
     this.showControls();
-    this.setZoom(this.zoom - this.zoom / 10);
+    this.Zoom = this.zoom - this.zoom / 10;
   }
 
 
-  private setZoom(zoom: number) {
+  public get Zoom(): number {
+    return this.zoom;
+  }
+
+  public set Zoom(zoom: number) {
     if (!this.activePhoto || this.activePhoto.gridPhoto.isVideo()) {
       return;
     }
@@ -356,7 +358,7 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
   }
 
   public showLigthbox(photo: MediaDTO) {
-    this.setZoom(1);
+    this.Zoom = 1;
     this.controllersVisible = true;
     this.showControls();
     this.status = LightboxStates.Open;
@@ -447,7 +449,7 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
   }
 
   private hideLigthbox() {
-    this.setZoom(1);
+    this.Zoom = 1;
     this.controllersVisible = false;
     this.status = LightboxStates.Closing;
     this.fullScreenService.exitFullScreen();