document.addEventListener('DOMContentLoaded', function() {
    // Elements
    const statusDot = document.getElementById('status-dot');
    const statusText = document.getElementById('status-text');
    const messageInput = document.getElementById('message');
    const sendBtn = document.getElementById('send-btn');
    const activityLog = document.getElementById('activity-log');
    
    // API endpoints
    const API_BASE = window.location.origin;
    const STATUS_API = `${API_BASE}/api/status`;
    const MESSAGE_API = `${API_BASE}/api/message`;
    
    // Set initial status and check periodically
    checkStatus();
    setInterval(checkStatus, 30000); // Check every 30 seconds
    
    // Event listeners
    sendBtn.addEventListener('click', sendMessage);
    messageInput.addEventListener('keypress', function(e) {
        if (e.key === 'Enter') {
            sendMessage();
        }
    });
    
    // Check addon status
    function checkStatus() {
        logActivity('Checking addon status...');
        
        fetch(STATUS_API)
            .then(response => {
                if (!response.ok) {
                    throw new Error(`HTTP error! Status: ${response.status}`);
                }
                return response.json();
            })
            .then(data => {
                setStatus(data.status === 'online');
                if (data.last_message) {
                    logActivity(`Last message: "${data.last_message}"`);
                }
            })
            .catch(error => {
                console.error('Error checking status:', error);
                setStatus(false);
                logActivity(`Error checking status: ${error.message}`);
            });
    }
    
    // Set status indicator
    function setStatus(isOnline) {
        if (isOnline) {
            statusDot.classList.add('online');
            statusDot.classList.remove('offline');
            statusText.textContent = 'Online';
        } else {
            statusDot.classList.add('offline');
            statusDot.classList.remove('online');
            statusText.textContent = 'Offline';
        }
    }
    
    // Send message to Home Assistant
    function sendMessage() {
        const message = messageInput.value.trim();
        
        if (!message) {
            alert('Please enter a message');
            return;
        }
        
        logActivity(`Sending message: "${message}"`);
        
        fetch(MESSAGE_API, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({ message: message }),
        })
            .then(response => {
                if (!response.ok) {
                    throw new Error(`HTTP error! Status: ${response.status}`);
                }
                return response.json();
            })
            .then(data => {
                if (data.success) {
                    logActivity(`Message sent successfully: "${message}"`);
                    messageInput.value = '';
                } else {
                    logActivity(`Failed to send message: ${data.error || 'Unknown error'}`);
                }
            })
            .catch(error => {
                console.error('Error sending message:', error);
                logActivity(`Error sending message: ${error.message}`);
            });
    }
    
    // Log activity
    function logActivity(text) {
        const timestamp = new Date().toLocaleTimeString();
        const logEntry = document.createElement('p');
        logEntry.textContent = `[${timestamp}] ${text}`;
        
        // Check if "No recent activity" message exists
        if (activityLog.firstChild && activityLog.firstChild.textContent === 'No recent activity') {
            activityLog.innerHTML = '';
        }
        
        activityLog.insertBefore(logEntry, activityLog.firstChild);
    }
});