//========= begin buttons.js //========= Добавляем стили для кнопок=========// const styleCommon = ` position:fixed; width:30px; //настройки тени? height:30px; //настройки тени? background:rgba(0,0,0,0.2); color:white; text-align:center; line-height:40px; border-radius:20px; font-size:35px; //размер кнопки z-index:99999; transition: all 0.3s ease; user-select: none; touch-action: none; `; const styleMainBtn = styleCommon + 'left:10px;bottom:10px;cursor:move;'; //========= Добавляем стиль для визуального эффекта нажатия=========// const style = document.createElement('style'); style.textContent = ` #main-btn.clicked { box-shadow: 0 0 10px 3px rgba(255,255,255,0.7); transform: scale(0.90); } `; document.head.appendChild(style); //========= Создание кнопок =========// const mainBtn = document.createElement('div'); mainBtn.setAttribute('id', 'main-btn'); mainBtn.setAttribute('style', styleMainBtn); mainBtn.textContent = '🔎'; document.body.appendChild(mainBtn); //========= Хранилище позиции =========// const loadPosition = () => { const pos = localStorage.getItem('floatingBtnPos'); if (pos) { const { x, y } = JSON.parse(pos); mainBtn.style.left = x + 'px'; mainBtn.style.top = y + 'px'; mainBtn.style.bottom = 'auto'; } }; const savePosition = (x, y) => { localStorage.setItem('floatingBtnPos', JSON.stringify({ x, y })); }; loadPosition(); //========= Перетаскивание =========// let offsetX = 0, offsetY = 0, dragging = false, moved = false; const startDrag = (clientX, clientY) => { dragging = true; moved = false; const rect = mainBtn.getBoundingClientRect(); offsetX = clientX - rect.left; offsetY = clientY - rect.top; mainBtn.style.cursor = 'grabbing'; }; const doDrag = (clientX, clientY) => { if (!dragging) return; moved = true; const x = clientX - offsetX; const y = clientY - offsetY; const bounded = applyBounds(x, y); mainBtn.style.left = bounded.x + 'px'; mainBtn.style.top = bounded.y + 'px'; }; const endDrag = () => { if (!dragging) return; dragging = false; mainBtn.style.cursor = 'move'; const rect = mainBtn.getBoundingClientRect(); savePosition(rect.left, rect.top); }; const applyBounds = (x, y) => { const maxX = window.innerWidth - 40; const maxY = window.innerHeight - 40; return { x: Math.max(0, Math.min(x, maxX)), y: Math.max(0, Math.min(y, maxY)) }; }; //========= События =========// mainBtn.addEventListener('mousedown', e => startDrag(e.clientX, e.clientY)); document.addEventListener('mousemove', e => doDrag(e.clientX, e.clientY)); document.addEventListener('mouseup', () => endDrag()); //mainBtn.addEventListener('touchstart', e => startDrag(e.touches[0].clientX, e.touches[0].clientY), { passive: false }); // document.addEventListener('touchmove', e => { e.preventDefault(); doDrag(e.touches[0].clientX, e.touches[0].clientY); }, { passive: false }); // document.addEventListener('touchend', () => endDrag()); let isDragging = false; let startX, startY; mainBtn.addEventListener('touchstart', (e) => { isDragging = true; startX = e.touches[0].clientX - mainBtn.offsetLeft; startY = e.touches[0].clientY - mainBtn.offsetTop; }, { passive: true }); // <<< ключевой момент document.addEventListener('touchmove', (e) => { if (!isDragging) return; const x = e.touches[0].clientX - startX; const y = e.touches[0].clientY - startY; mainBtn.style.left = `${x}px`; mainBtn.style.top = `${y}px`; e.preventDefault(); // <<< только если действительно двигаем }, { passive: false }); document.addEventListener('touchend', () => { isDragging = false; }); mainBtn.addEventListener('click', () => { if (moved) { moved = false; return; // Не запускаем поиск если перетаскивали } // Визуальный эффект нажатия mainBtn.classList.add('clicked'); setTimeout(() => mainBtn.classList.remove('clicked'), 150); // Твой код запуска поиска: window.doSearchFromGoogleSpreadsheets(); }); //========= end buttons.js