fix(gallery): open lightbox on click and keep mouse drag alive

Pointer capture on pointerdown redirected the click to the strip, so photos
never opened; capture now starts only after a 5px drag. Native link drag is
blocked so it no longer cancels the mouse drag.
This commit is contained in:
andre committed 2026-10-26 20:40:17 +00:00
1 parent a8683658fa
commit f297e128fd
1 file changed
+9 -2
+9 -2
View File
@@ -829,15 +829,22 @@ document.addEventListener('DOMContentLoaded', function () {
if (e.pointerType === 'touch' || e.button !== 0) return; if (e.pointerType === 'touch' || e.button !== 0) return;
dragging = true; moved = 0; dragging = true; moved = 0;
startX = e.clientX; startLeft = wrap.scrollLeft; startX = e.clientX; startLeft = wrap.scrollLeft;
wrap.classList.add('is-dragging');
wrap.setPointerCapture(e.pointerId);
}); });
wrap.addEventListener('pointermove', function (e) { wrap.addEventListener('pointermove', function (e) {
if (!dragging) return; if (!dragging) return;
var dx = e.clientX - startX; var dx = e.clientX - startX;
moved = Math.max(moved, Math.abs(dx)); moved = Math.max(moved, Math.abs(dx));
if (moved <= 5) return;
// Capture only once it is a real drag: capturing on pointerdown sends the
// click to .gal-wrap instead of the photo, so the lightbox never opened.
if (!wrap.classList.contains('is-dragging')) {
wrap.classList.add('is-dragging');
try { wrap.setPointerCapture(e.pointerId); } catch (err) {}
}
wrap.scrollLeft = startLeft - dx; wrap.scrollLeft = startLeft - dx;
}); });
// The tiles are links, which the browser drags natively (cancelling our drag).
wrap.addEventListener('dragstart', function (e) { e.preventDefault(); });
function endDrag(e) { function endDrag(e) {
if (!dragging) return; if (!dragging) return;
dragging = false; dragging = false;