jfork/octane-website
1
0
Fork 0
mirror of https://github.com/nfonteyne/octane-website.git synced 2026-09-03 23:24:48 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: laggy swiping

Browse source
This commit is contained in:
Nathan FONTEYNE 2026-07-09 15:34:19 +02:00
parent e368a8681b
commit 4b5b572aa3
1 changed files with 10 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

13
public/js/suggestions.js
View file

@ -320,7 +320,7 @@ async function onSuggestionCandidateSelected(candidate) {
// ---------- Swipe ("Vote rapide") view ---------- // ---------- Swipe ("Vote rapide") view ----------
const VIEW_STORAGE_KEY = 'octane-suggestions-view'; const VIEW_STORAGE_KEY = 'octane-suggestions-view';
let currentView = localStorage.getItem(VIEW_STORAGE_KEY) === 'swipe' ? 'swipe' : 'list'; let currentView = localStorage.getItem(VIEW_STORAGE_KEY) === 'list' ? 'list' : 'swipe';
let swipeQueue = []; let swipeQueue = [];
let dragState = null; let dragState = null;
@ -390,14 +390,21 @@ function renderSwipeStack() {
function bindSwipeCardEvents(card, suggestion) { function bindSwipeCardEvents(card, suggestion) {
card.addEventListener('pointerdown', (e) => { card.addEventListener('pointerdown', (e) => {
if (e.pointerType === 'mouse') return; if (e.pointerType === 'mouse') return;
dragState = { id: card.dataset.id, startX: e.clientX, startY: e.clientY, dx: 0, dy: 0 }; dragState = { id: card.dataset.id, startX: e.clientX, startY: e.clientY, dx: 0, dy: 0, raf: null };
card.style.transition = 'none';
card.setPointerCapture(e.pointerId); card.setPointerCapture(e.pointerId);
}); });
card.addEventListener('pointermove', (e) => { card.addEventListener('pointermove', (e) => {
if (!dragState || dragState.id !== card.dataset.id) return; if (!dragState || dragState.id !== card.dataset.id) return;
dragState.dx = e.clientX - dragState.startX; dragState.dx = e.clientX - dragState.startX;
dragState.dy = e.clientY - dragState.startY; dragState.dy = e.clientY - dragState.startY;
applyDragTransform(card, dragState.dx, dragState.dy); if (dragState.raf) return;
dragState.raf = requestAnimationFrame(() => {
if (dragState) {
applyDragTransform(card, dragState.dx, dragState.dy);
dragState.raf = null;
}
});
}); });
const endDrag = (e) => { const endDrag = (e) => {
if (!dragState || dragState.id !== card.dataset.id) return; if (!dragState || dragState.id !== card.dataset.id) return;