|
|
| const dropArea = document.getElementById('drop-area');
|
|
|
| ['dragenter', 'dragover'].forEach(eventName => {
|
| dropArea.addEventListener(eventName, () => {
|
| dropArea.style.borderColor = '#fff';
|
| dropArea.style.transform = 'scale(1.02)';
|
| }, false);
|
| });
|
|
|
| ['dragleave', 'drop'].forEach(eventName => {
|
| dropArea.addEventListener(eventName, () => {
|
| dropArea.style.borderColor = '#a855f7';
|
| dropArea.style.transform = 'scale(1)';
|
| }, false);
|
| });
|
|
|
|
|
| dropArea.addEventListener('drop', handleDrop, false);
|
|
|
| function handleDrop(e) {
|
| e.preventDefault();
|
| e.stopPropagation();
|
| const files = e.dataTransfer.files;
|
| handleFiles(files);
|
| }
|
|
|
| function handleFiles(files) {
|
| if(files.length > 0) {
|
| alert(`File "${files[0].name}" received! Processing...`);
|
|
|
| }
|
| }
|
|
|
|
|
| function toggleChat() {
|
| const chat = document.getElementById('chat-overlay');
|
| chat.classList.toggle('hidden');
|
| } |