From dbfa5c5746318268ed2f3117935d6d685e6301b4 Mon Sep 17 00:00:00 2001 From: Pavel Djundik Date: Tue, 24 Dec 2019 18:36:12 +0200 Subject: [PATCH] Restrict image viewer bounds while moving --- client/components/ImageViewer.vue | 15 +++++---------- 1 file changed, 5 insertions(+), 10 deletions(-) diff --git a/client/components/ImageViewer.vue b/client/components/ImageViewer.vue index 3b97519d..00130581 100644 --- a/client/components/ImageViewer.vue +++ b/client/components/ImageViewer.vue @@ -197,7 +197,6 @@ export default { const touchMove = (moveEvent) => { touch = this.reduceTouches(moveEvent.touches); - // TODO: There's bugs with multi finger interactions, needs more testing if (currentTouches.length !== moveEvent.touches.length) { currentTransform.x = touch.x; currentTransform.y = touch.y; @@ -221,16 +220,10 @@ export default { startTransform.y ); - if (newScale > 1) { - this.transform.x = fixedPosition.x + deltaX; - this.transform.y = fixedPosition.y + deltaY; - } else if (Math.abs(deltaX) > Math.abs(deltaY)) { - this.transform.x = fixedPosition.x + deltaX; - } else { - this.transform.y = fixedPosition.y + deltaY; - } - + this.transform.x = fixedPosition.x + deltaX; + this.transform.y = fixedPosition.y + deltaY; this.transform.scale = newScale; + this.correctPosition(); }; const touchEnd = (endEvent) => { @@ -302,6 +295,8 @@ export default { if (centerY < 0 || heightScaled + centerY > containerHeight) { this.transform.y = startTransformY + newY; } + + this.correctPosition(); }; const mouseUp = (upEvent) => {