dix/formha
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

intento 2

Browse Source
This commit is contained in:
David Itehua Xalamihua 2025-05-24 12:51:51 -06:00
parent c088c9df78
commit 77abdef9ab
1 changed files with 79 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

98
templates/z_comps/boton_chat.html
View File

@ -44,7 +44,9 @@
let hasMoved = false;
let touchStartTimer;
const tapThreshold = 200; // Tiempo en milisegundos para considerar un "tap"
const moveThreshold = 5; // Distancia en píxeles para considerar un "move"
const moveThreshold = 10; // Distancia en píxeles para considerar un "move"
let initialTouchX, initialTouchY;
const savedPosition = localStorage.getItem('floatingBtnPosition');
if (savedPosition) {
@ -62,10 +64,11 @@
document.addEventListener('mousemove', drag);
document.addEventListener('mouseup', stopDrag);
// Eventos para touch
btn.addEventListener('touchstart', startTouch, { passive: true });
document.addEventListener('touchmove', moveTouch, { passive: false });
document.addEventListener('touchend', endTouch);
btn.addEventListener('touchstart', startTouch, { passive: false });
btn.addEventListener('touchmove', moveTouch, { passive: false });
btn.addEventListener('touchend', endTouch);
link.addEventListener('click', function (e) {
if (hasMoved) {
@ -116,35 +119,77 @@
savePosition(x, y);
}
// function startTouch(e) {
// if (e.touches.length !== 1) return;
// hasMoved = false;
// const touch = e.touches[0];
// const startX = touch.clientX;
// const startY = touch.clientY;
// touchStartTimer = setTimeout(() => {
// // Si el temporizador termina y no ha habido movimiento, consideramos un tap
// link.click();
// }, tapThreshold);
// // Preparar para el movimiento
// const rect = btn.getBoundingClientRect();
// offsetX = startX - rect.left;
// offsetY = startY - rect.top;
// }
function startTouch(e) {
if (e.touches.length !== 1) return;
hasMoved = false;
e.preventDefault(); // Prevenir comportamiento por defecto
const touch = e.touches[0];
const startX = touch.clientX;
const startY = touch.clientY;
initialTouchX = touch.clientX;
initialTouchY = touch.clientY;
touchStartTimer = setTimeout(() => {
// Si el temporizador termina y no ha habido movimiento, consideramos un tap
link.click();
}, tapThreshold);
// Preparar para el movimiento
const rect = btn.getBoundingClientRect();
offsetX = startX - rect.left;
offsetY = startY - rect.top;
offsetX = initialTouchX - rect.left;
offsetY = initialTouchY - rect.top;
hasMoved = false;
touchStartTimer = setTimeout(() => {
if (!isDragging) {
link.click();
}
}, tapThreshold);
}
// function moveTouch(e) {
// if (!touchStartTimer || e.touches.length !== 1) return;
// const touch = e.touches[0];
// const currentX = touch.clientX;
// const currentY = touch.clientY;
// // Verificar si el movimiento supera el umbral
// if (Math.abs(currentX - (touch.clientX - offsetX)) > moveThreshold || Math.abs(currentY - (touch.clientY - offsetY)) > moveThreshold) {
// clearTimeout(touchStartTimer); // Cancelar el temporizador si hay movimiento
// isDragging = true;
// hasMoved = true;
// btn.style.cursor = 'grabbing';
// btn.style.left = `${currentX - offsetX}px`;
// btn.style.top = `${currentY - offsetY}px`;
// btn.style.right = 'auto';
// e.preventDefault(); // Evitar el scroll durante el arrastre
// }
// }
function moveTouch(e) {
if (!touchStartTimer || e.touches.length !== 1) return;
if (!touchStartTimer || e.touches.length !== 1 || !initialTouchX) return;
const touch = e.touches[0];
const currentX = touch.clientX;
const currentY = touch.clientY;
// Verificar si el movimiento supera el umbral
if (Math.abs(currentX - (touch.clientX - offsetX)) > moveThreshold || Math.abs(currentY - (touch.clientY - offsetY)) > moveThreshold) {
clearTimeout(touchStartTimer); // Cancelar el temporizador si hay movimiento
if (Math.abs(currentX - initialTouchX) > moveThreshold ||
Math.abs(currentY - initialTouchY) > moveThreshold) {
clearTimeout(touchStartTimer);
isDragging = true;
hasMoved = true;
@ -152,10 +197,23 @@
btn.style.left = `${currentX - offsetX}px`;
btn.style.top = `${currentY - offsetY}px`;
btn.style.right = 'auto';
e.preventDefault(); // Evitar el scroll durante el arrastre
e.preventDefault();
}
}
// function endTouch(e) {
// clearTimeout(touchStartTimer);
// if (isDragging) {
// isDragging = false;
// btn.style.cursor = 'move';
// const rect = btn.getBoundingClientRect();
// stickToNearestSide(rect.left, rect.top);
// savePosition(rect.left, rect.top);
// }
// }
function endTouch(e) {
clearTimeout(touchStartTimer);
if (isDragging) {
@ -165,6 +223,8 @@
stickToNearestSide(rect.left, rect.top);
savePosition(rect.left, rect.top);
}
initialTouchX = null;
initialTouchY = null;
}
function stickToNearestSide(x, y) {