diff --git a/templates/z_comps/boton_chat.html b/templates/z_comps/boton_chat.html
index 0d265b3..640dabb 100644
--- a/templates/z_comps/boton_chat.html
+++ b/templates/z_comps/boton_chat.html
@@ -61,6 +61,8 @@
let offsetX, offsetY;
let isDragging = false;
let hasMoved = false;
+ let touchStartX = 0;
+ let touchStartY = 0;
const savedPosition = localStorage.getItem('floatingBtnPosition');
if (savedPosition) {
@@ -73,16 +75,17 @@
btn.style.top = '20px';
}
- // Eventos para mouse
+ // MOUSE EVENTS
btn.addEventListener('mousedown', startDrag);
document.addEventListener('mousemove', drag);
document.addEventListener('mouseup', stopDrag);
- // Eventos para touch
+ // TOUCH EVENTS
btn.addEventListener('touchstart', startDragTouch, { passive: false });
document.addEventListener('touchmove', dragTouch, { passive: false });
document.addEventListener('touchend', stopDragTouch);
+ // Evitar abrir link si se arrastró el botón
link.addEventListener('click', function (e) {
if (hasMoved) {
e.preventDefault();
@@ -118,7 +121,7 @@
hasMoved = true;
}
- function stopDrag() {
+ function stopDrag(e) {
if (!isDragging) return;
isDragging = false;
@@ -134,7 +137,6 @@
function startDragTouch(e) {
if (e.touches.length !== 1) return;
-
isDragging = true;
hasMoved = false;
@@ -142,28 +144,40 @@
offsetX = e.touches[0].clientX - rect.left;
offsetY = e.touches[0].clientY - rect.top;
+ touchStartX = e.touches[0].clientX;
+ touchStartY = e.touches[0].clientY;
+
btn.style.cursor = 'grabbing';
btn.style.left = `${rect.left}px`;
btn.style.top = `${rect.top}px`;
btn.style.right = 'auto';
- e.preventDefault(); // evita scroll
+ e.preventDefault();
}
function dragTouch(e) {
if (!isDragging || e.touches.length !== 1) return;
- const x = e.touches[0].clientX - offsetX;
- const y = e.touches[0].clientY - offsetY;
+ const currentX = e.touches[0].clientX;
+ const currentY = e.touches[0].clientY;
+
+ const deltaX = Math.abs(currentX - touchStartX);
+ const deltaY = Math.abs(currentY - touchStartY);
+
+ if (deltaX > 5 || deltaY > 5) {
+ hasMoved = true;
+ }
+
+ const x = currentX - offsetX;
+ const y = currentY - offsetY;
btn.style.left = `${x}px`;
btn.style.top = `${y}px`;
- hasMoved = true;
e.preventDefault(); // evita scroll
}
- function stopDragTouch() {
+ function stopDragTouch(e) {
if (!isDragging) return;
isDragging = false;