// ==============================================
// STATISTICS MODAL
// ==============================================

/**
 * Show the statistics modal with win/loss data
 */
function showStats() {
    // Fetch fresh stats from API and display
    fetch('/api/sessions/game-stats/chess')
        .then(response => response.json())
        .then(data => {
            statsTableBody.innerHTML = '';
            
            // Create rows for wins and losses
            const rows = [
                { label: 'Wins', value: data.totalWins || 0, className: 'stat-highlight' },
                { label: 'Losses', value: data.totalLosses || 0, className: 'stat-danger' }
            ];
            
            rows.forEach(({ label, value, className }) => {
                const row = document.createElement('tr');
                row.innerHTML = `
                    <td>${label}</td>
                    <td class="${className}">${value}</td>
                `;
                statsTableBody.appendChild(row);
            });
            
            // Show the modal
            if (statsScreen) {
                statsScreen.classList.remove('hidden');
            }
        })
        .catch(error => {
            console.error('Error fetching stats:', error);
            showNotification('Failed to load statistics', 'error');
        });
}

/**
 * Hide the statistics modal
 */
function hideStats() {
    if (statsScreen) {
        statsScreen.classList.add('hidden');
    }
}

// Event Listeners for Stats Modal
if (viewStatsCard) {
    viewStatsCard.addEventListener('click', showStats);
    viewStatsCard.addEventListener('keypress', (e) => {
        if (e.key === 'Enter' || e.key === ' ') {
            e.preventDefault();
            showStats();
        }
    });
}

if (closeStatsBtn) {
    closeStatsBtn.addEventListener('click', hideStats);
}

// Close stats modal when clicking overlay
if (statsScreen) {
    statsScreen.addEventListener('click', (e) => {
        if (e.target === statsScreen) {
            hideStats();
        }
    });
}
