51 lines
2.1 KiB
JavaScript
51 lines
2.1 KiB
JavaScript
function handleSwipe(action, swiped_user_id) {
|
|
const card = document.querySelector('.card-swipe');
|
|
if (!card) return;
|
|
|
|
// 1. Add class to trigger animation
|
|
const animationClass = action === 'like' ? 'swipe-right' : 'swipe-left';
|
|
card.classList.add(animationClass);
|
|
|
|
// 2. Wait for animation to end, then fetch
|
|
card.addEventListener('animationend', () => {
|
|
fetch('swipe.php', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'Accept': 'application/json'
|
|
},
|
|
body: JSON.stringify({
|
|
action: action,
|
|
swiped_user_id: swiped_user_id
|
|
})
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
// 3. Replace the card with the next one
|
|
const swipeContainer = document.getElementById('swipe-container');
|
|
swipeContainer.innerHTML = data.next_companion_html;
|
|
|
|
// 4. If it's a match, show the notification modal
|
|
if (data.match) {
|
|
const matchModal = new bootstrap.Modal(document.getElementById('matchNotificationModal'));
|
|
const matchBody = document.getElementById('match-notification-body');
|
|
// Note: This relies on a global `translations` object or a dedicated function.
|
|
// For simplicity, we hardcode a message here, but a robust solution would use the `t()` function.
|
|
matchBody.textContent = `You and ${data.matched_user_name} have liked each other.`;
|
|
matchModal.show();
|
|
}
|
|
} else {
|
|
// Handle errors, e.g., show a message to the user
|
|
console.error('Swipe failed:', data.error);
|
|
// Re-enable card if swipe failed
|
|
card.classList.remove(animationClass);
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error during swipe:', error);
|
|
card.classList.remove(animationClass);
|
|
});
|
|
}, { once: true });
|
|
}
|