document.addEventListener('DOMContentLoaded', () => { const chatBotContainer = document.getElementById('chat-bot-container'); let isDragging = false; let offsetX, offsetY; let saveTimeout; // Загрузка позиции и размера из localStorage const savedPosition = localStorage.getItem('chatBotPosition'); const savedSize = localStorage.getItem('chatBotSize'); if (savedPosition) { const { left, top } = JSON.parse(savedPosition); chatBotContainer.style.left = `${left}px`; chatBotContainer.style.top = `${top}px`; } if (savedSize) { const { width, height } = JSON.parse(savedSize); chatBotContainer.style.width = `${width}px`; chatBotContainer.style.height = `${height}px`; } // Добавляем обработчики для перетаскивания chatBotContainer.querySelector('.chat-header').addEventListener('mousedown', (e) => { isDragging = true; offsetX = e.clientX - chatBotContainer.offsetLeft; offsetY = e.clientY - chatBotContainer.offsetTop; }); document.addEventListener('mousemove', (e) => { if (isDragging) { chatBotContainer.style.left = `${e.clientX - offsetX}px`; chatBotContainer.style.top = `${e.clientY - offsetY}px`; } }); document.addEventListener('mouseup', () => { isDragging = false; scheduleSave(); }); // // Добавляем обработчики для изменения размера // chatBotContainer.addEventListener('mousedown', (e) => { // if (e.target.classList.contains('resizable')) { // isDragging = true; // offsetX = e.clientX - chatBotContainer.offsetWidth; // offsetY = e.clientY - chatBotContainer.offsetHeight; // } // }); document.addEventListener('mousemove', (e) => { if (isDragging && e.target.classList.contains('resizable')) { chatBotContainer.style.width = `${e.clientX - offsetX}px`; chatBotContainer.style.height = `${e.clientY - offsetY}px`; } }); document.addEventListener('mouseup', () => { isDragging = false; scheduleSave(); }); function scheduleSave() { clearTimeout(saveTimeout); saveTimeout = setTimeout(savePositionAndSize, 200); // Задержка в 200 миллисекунд } function savePositionAndSize() { const position = { left: chatBotContainer.offsetLeft, top: chatBotContainer.offsetTop }; const size = { width: chatBotContainer.offsetWidth, height: chatBotContainer.offsetHeight }; localStorage.setItem('chatBotPosition', JSON.stringify(position)); localStorage.setItem('chatBotSize', JSON.stringify(size)); } });