Add swipe threshold, fix incorrect up/down detection, swipe down for random.

2 files changed, 25 insertions, 4 deletions

diff --git a/client/js/util/touch.js b/client/js/util/touch.js
index 6863eb8..3a64642 100644
--- a/client/js/util/touch.js
+++ b/client/js/util/touch.js
@@ -6,6 +6,9 @@ const direction = {
     UP: 'up'
 };
 
+const thresholdX = 0.15;
+const thresholdY = 0.1;
+
 function handleTouchStart(handler, evt) {
     const touchEvent = evt.touches[0];
     handler._xStart = touchEvent.clientX;
@@ -21,16 +24,22 @@ function handleTouchMove(handler, evt) {
     const yDirection = handler._yStart - evt.touches[0].clientY;
 
     if (Math.abs(xDirection) > Math.abs(yDirection)) {
-        if (xDirection > 0) {
+        let percentSwiped = Math.abs(xDirection) / screen.width;
+        if (percentSwiped < thresholdX) {
+            return;
+        } else if (xDirection > 0) {
             handler._direction = direction.LEFT;
         } else {
             handler._direction = direction.RIGHT;
         }
     } else {
-        if (yDirection > 0) {
-            handler._direction = direction.DOWN;
-        } else {
+        let percentSwiped = Math.abs(yDirection) / screen.height;
+        if (percentSwiped < thresholdY) {
+            return;
+        } else if (yDirection > 0) {
             handler._direction = direction.UP;
+        } else {
+            handler._direction = direction.DOWN;
         }
     }
 }
diff --git a/client/js/views/post_main_view.js b/client/js/views/post_main_view.js
index 1dc0860..15e1c29 100644
--- a/client/js/views/post_main_view.js
+++ b/client/js/views/post_main_view.js
@@ -72,6 +72,12 @@ class PostMainView {
             }
         };
 
+        const showRandomImage = () => {
+            if (ctx.randomPostId) {
+                router.show(ctx.getPostUrl(ctx.randomPostId, ctx.parameters));
+            }
+        };
+
         keyboard.bind('e', () => {
             if (ctx.editMode) {
                 router.show(uri.formatClientLink('post', ctx.post.id));
@@ -98,6 +104,12 @@ class PostMainView {
                 if (!ctx.editMode) {
                     showPreviousImage()
                 }
+            },
+            () => {},
+            () => {
+                if (!ctx.editMode) {
+                    showRandomImage()
+                }
             }
         )
     }