diff --git a/calendario.html b/calendario.html
index 76e140d..d11f1e0 100644
--- a/calendario.html
+++ b/calendario.html
@@ -1122,9 +1122,9 @@
(function initServiceModalSwipeBack() {
const modalEl = document.getElementById('serviceModal');
if (!modalEl) return;
- let swipeStartX = 0, swipeStartY = 0, swipeTracking = false;
+ let swipeStartX = 0, swipeStartY = 0, swipeTracking = false, swipeDx = 0, swipeCancelled = false;
const EDGE_ZONE = 35; // px desde el borde izquierdo donde debe empezar el gesto
- const SWIPE_THRESHOLD = 90; // px minimos de desplazamiento horizontal para considerar 'volver'
+ const SWIPE_THRESHOLD = 90; // px minimos para considerar 'volver'
modalEl.addEventListener('touchstart', (e) => {
if (!e.touches || e.touches.length !== 1) return;
@@ -1133,27 +1133,50 @@
swipeStartX = t.clientX;
swipeStartY = t.clientY;
swipeTracking = true;
- // Evita que iOS/el navegador interprete este toque en el borde como su propio gesto de "volver"
- e.preventDefault();
+ swipeCancelled = false;
+ swipeDx = 0;
+ modalEl.style.transition = 'none'; // seguimos el dedo sin animacion mientras arrastra
+ e.preventDefault(); // evita que iOS interprete esto como su propio gesto de "volver"
} else {
swipeTracking = false;
}
}, { passive: false });
modalEl.addEventListener('touchmove', (e) => {
- if (!swipeTracking) return;
- // Seguimos bloqueando el gesto nativo mientras dura nuestro swipe
+ if (!swipeTracking || swipeCancelled) return;
+ const t = e.touches[0];
+ const dx = t.clientX - swipeStartX;
+ const dy = t.clientY - swipeStartY;
+ if (Math.abs(dy) > 60 && Math.abs(dy) > Math.abs(dx)) {
+ // Movimiento mas vertical que horizontal: no era un swipe de volver, lo cancelamos
+ swipeCancelled = true;
+ modalEl.style.transition = '';
+ modalEl.style.transform = '';
+ return;
+ }
+ swipeDx = Math.max(0, dx);
+ modalEl.style.transform = `translateX(${swipeDx}px)`; // el modal sigue al dedo en horizontal
e.preventDefault();
}, { passive: false });
- modalEl.addEventListener('touchend', (e) => {
+ modalEl.addEventListener('touchend', () => {
if (!swipeTracking) return;
swipeTracking = false;
- const t = e.changedTouches[0];
- const dx = t.clientX - swipeStartX;
- const dy = t.clientY - swipeStartY;
- if (dx > SWIPE_THRESHOLD && Math.abs(dy) < 60) {
- closeModal();
+ if (swipeCancelled) return;
+ modalEl.style.transition = 'transform 0.22s ease-out';
+ if (swipeDx > SWIPE_THRESHOLD) {
+ modalEl.style.transform = 'translateX(100%)'; // termina de salir hacia la derecha
+ setTimeout(() => {
+ modalEl.style.transition = '';
+ modalEl.style.transform = '';
+ closeModal();
+ }, 220);
+ } else {
+ modalEl.style.transform = 'translateX(0px)'; // no llego al umbral: vuelve a su sitio
+ setTimeout(() => {
+ modalEl.style.transition = '';
+ modalEl.style.transform = '';
+ }, 220);
}
}, { passive: true });
})();