forked from Public/pics
Fix pinch-to-zoom being misinterpreted as swipe navigation
Multi-finger gestures like pinch-to-zoom were triggering photo navigation because the touch handler didn't check touch count. Move swipe detection to touchend, reject multi-touch gestures, and require a minimum 40px horizontal distance. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -30,21 +30,38 @@ function disableKeyDownPropagation(obj) {
|
|||||||
function enableTouchNavigation() {
|
function enableTouchNavigation() {
|
||||||
var x_down = null;
|
var x_down = null;
|
||||||
var y_down = null;
|
var y_down = null;
|
||||||
|
var cancelled = false;
|
||||||
|
|
||||||
document.addEventListener('touchstart', function(event) {
|
document.addEventListener('touchstart', function(event) {
|
||||||
|
if (event.touches.length > 1) {
|
||||||
|
cancelled = true;
|
||||||
|
return;
|
||||||
|
}
|
||||||
x_down = event.touches[0].clientX;
|
x_down = event.touches[0].clientX;
|
||||||
y_down = event.touches[0].clientY;
|
y_down = event.touches[0].clientY;
|
||||||
|
cancelled = false;
|
||||||
}, false);
|
}, false);
|
||||||
|
|
||||||
document.addEventListener('touchmove', function(event) {
|
document.addEventListener('touchmove', function(event) {
|
||||||
if (!x_down || !y_down) {
|
if (event.touches.length > 1) {
|
||||||
|
cancelled = true;
|
||||||
|
}
|
||||||
|
}, false);
|
||||||
|
|
||||||
|
document.addEventListener('touchend', function(event) {
|
||||||
|
if (cancelled || x_down === null || y_down === null) {
|
||||||
|
x_down = null;
|
||||||
|
y_down = null;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
var x_diff = x_down - event.touches[0].clientX;
|
var x_diff = x_down - event.changedTouches[0].clientX;
|
||||||
var y_diff = y_down - event.touches[0].clientY;
|
var y_diff = y_down - event.changedTouches[0].clientY;
|
||||||
|
|
||||||
if (Math.abs(y_diff) > 50) {
|
x_down = null;
|
||||||
|
y_down = null;
|
||||||
|
|
||||||
|
if (Math.abs(x_diff) < 40 || Math.abs(y_diff) > 50) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -52,13 +69,11 @@ function enableTouchNavigation() {
|
|||||||
if (x_diff > 0) {
|
if (x_diff > 0) {
|
||||||
var target = document.getElementById("previous_photo").href;
|
var target = document.getElementById("previous_photo").href;
|
||||||
if (target) {
|
if (target) {
|
||||||
event.preventDefault();
|
|
||||||
document.location.href = target + '#photo_frame';
|
document.location.href = target + '#photo_frame';
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
var target = document.getElementById("next_photo").href;
|
var target = document.getElementById("next_photo").href;
|
||||||
if (target) {
|
if (target) {
|
||||||
event.preventDefault();
|
|
||||||
document.location.href = target + '#photo_frame';
|
document.location.href = target + '#photo_frame';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user