fossilfranv/pigallery2
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fixing zoom progress zoom place bug

Browse Source
This commit is contained in:
Patrik J. Braun 2018-12-19 22:32:59 +01:00
parent 9e710e9039
commit e8c9b184fe
2 changed files with 15 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/app/gallery/lightbox/lightbox.gallery.component.html
View File

@ -85,7 +85,7 @@
</div> </div>
<input type="range" <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"> value="1" class="col-10 col-md-4 zoom-progress">
<div class="col-1 col-md-4"> <div class="col-1 col-md-4">
<span (click)="zoomIn()" class="oi oi-zoom-in float-left"></span> <span (click)="zoomIn()" class="oi oi-zoom-in float-left"></span>

26
frontend/app/gallery/lightbox/lightbox.gallery.component.ts
View File

@ -132,7 +132,7 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
return; return;
} }
this.setZoom(1); this.Zoom = 1;
const photo = this.gridPhotoQL.find(i => this.queryService.getMediaStringId(i.gridPhoto.media) === photoStringId); const photo = this.gridPhotoQL.find(i => this.queryService.getMediaStringId(i.gridPhoto.media) === photoStringId);
if (!photo) { if (!photo) {
return this.delayedMediaShow = photoStringId; return this.delayedMediaShow = photoStringId;
@ -186,7 +186,6 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
if (!this.activePhoto || this.activePhoto.gridPhoto.isVideo()) { if (!this.activePhoto || this.activePhoto.gridPhoto.isVideo()) {
return; return;
} }
this.showControls();
if ($event.deltaY < 0) { if ($event.deltaY < 0) {
this.zoomIn(); this.zoomIn();
} else { } else {
@ -200,7 +199,7 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
return; return;
} }
this.showControls(); this.showControls();
this.setZoom(this.prevZoom * $event.scale); this.Zoom = this.prevZoom * $event.scale;
} }
@HostListener('pinchend', ['$event']) @HostListener('pinchend', ['$event'])
@ -209,7 +208,7 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
return; return;
} }
this.showControls(); this.showControls();
this.setZoom(this.prevZoom * $event.scale); this.Zoom = this.prevZoom * $event.scale;
this.prevZoom = this.zoom; this.prevZoom = this.zoom;
} }
@ -223,11 +222,11 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
this.showControls(); this.showControls();
if (this.zoom > 1) { if (this.zoom > 1) {
this.setZoom(1); this.Zoom = 1;
this.prevZoom = this.zoom; this.prevZoom = this.zoom;
return; return;
} else { } else {
this.setZoom(5); this.Zoom = 5;
this.prevZoom = this.zoom; this.prevZoom = this.zoom;
return; return;
} }
@ -235,17 +234,20 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
zoomIn() { zoomIn() {
this.showControls(); this.showControls();
this.setZoom(this.zoom + this.zoom / 10); this.Zoom = this.zoom + this.zoom / 10;
} }
zoomOut() { zoomOut() {
this.showControls(); 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()) { if (!this.activePhoto || this.activePhoto.gridPhoto.isVideo()) {
return; return;
} }
@ -356,7 +358,7 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
} }
public showLigthbox(photo: MediaDTO) { public showLigthbox(photo: MediaDTO) {
this.setZoom(1); this.Zoom = 1;
this.controllersVisible = true; this.controllersVisible = true;
this.showControls(); this.showControls();
this.status = LightboxStates.Open; this.status = LightboxStates.Open;
@ -447,7 +449,7 @@ export class GalleryLightboxComponent implements OnDestroy, OnInit {
} }
private hideLigthbox() { private hideLigthbox() {
this.setZoom(1); this.Zoom = 1;
this.controllersVisible = false; this.controllersVisible = false;
this.status = LightboxStates.Closing; this.status = LightboxStates.Closing;
this.fullScreenService.exitFullScreen(); this.fullScreenService.exitFullScreen();