jerrybendy / vue-touch-events

Support simple touch events (tap / swipe / touch hold)
MIT License
537 stars 51 forks source link

Issue with the swipe detection logic #100

Closed mohsenasm closed 1 year ago

mohsenasm commented 1 year ago

I was reviewing the swipe detection code to better understand its logic.

In this line we have:

if (distanceY > swipeOutBounded) {
    direction = $this.startY > $this.currentY ? 'top' : 'bottom';
} else {
    direction = $this.startX > $this.currentX ? 'left' : 'right';
}

In which the swipeOutBounded variable is $this.options.swipeTolerance. Shouldn't it be:

if (distanceY > distanceX) {
    direction = $this.startY > $this.currentY ? 'top' : 'bottom';
} else {
    direction = $this.startX > $this.currentX ? 'left' : 'right';
}

In the current code, we are prioritizing top/bottom swipes over left/right swipes. There is no need for prioritization. We can check if the swipe was a more vertical one or a more horizontal one, and make the decision based on that.

For example, if the start point, current point, and swipeTolerance are like this:

startX = 0
startY = 0
currentX = 300
currentY = 100
swipeTolerance = 50

The current code will set direction = 'bottom' instead of direction = 'right'.

jerrybendy commented 1 year ago

Thanks for your advice. Yours is better.