script.js

// Global variable to store country data
let countryData = [];

// Fetch data from data.json when the page loads
document.addEventListener('DOMContentLoaded', () => {
    fetch('data.json')
        .then(response => {
            if (!response.ok) {
                throw new Error('Network response was not ok');
            }
            return response.json();
        })
        .then(data => {
            countryData = data;
            renderTable(data);
        })
        .catch(error => {
            console.error('Error fetching data:', error);
            const tbody = document.querySelector('#requirements-table tbody');
            tbody.innerHTML = '<tr><td colspan="5" style="text-align:center; color:red;">无法加载数据，请确保在本地服务器环境下运行 (例如使用 Live Server 或 python -m http.server)。</td></tr>';
        });

    // Setup event listener for the test button
    const testBtn = document.getElementById('test-btn');
    testBtn.addEventListener('click', handleTest);
});

// Render the requirements table
function renderTable(data) {
    const tbody = document.querySelector('#requirements-table tbody');
    tbody.innerHTML = ''; // Clear existing rows

    data.forEach(item => {
        const tr = document.createElement('tr');
        
        // Country
        const tdCountry = document.createElement('td');
        tdCountry.textContent = item.country;
        tdCountry.style.fontWeight = 'bold';
        tr.appendChild(tdCountry);

        // IELTS
        const tdIelts = document.createElement('td');
        tdIelts.textContent = item.ielts;
        tr.appendChild(tdIelts);

        // TOEFL
        const tdToefl = document.createElement('td');
        tdToefl.textContent = item.toefl;
        tr.appendChild(tdToefl);

        // PTE
        const tdPte = document.createElement('td');
        tdPte.textContent = item.pte;
        tr.appendChild(tdPte);

        // Source
        const tdSource = document.createElement('td');
        const aSource = document.createElement('a');
        aSource.href = item.source_url;
        aSource.textContent = item.source_name;
        aSource.target = '_blank'; // Open in new tab
        tdSource.appendChild(aSource);
        tr.appendChild(tdSource);

        tbody.appendChild(tr);
    });
}

// Handle the matching test logic
function handleTest() {
    const examType = document.getElementById('exam-type').value;
    const scoreInput = document.getElementById('score-input').value;
    const resultsContainer = document.getElementById('results-container');
    const resultsGrid = document.getElementById('results-grid');

    // Validation
    if (!scoreInput || isNaN(scoreInput)) {
        alert('请输入有效的分数！');
        return;
    }

    const userScore = parseFloat(scoreInput);
    resultsGrid.innerHTML = ''; // Clear previous results

    // Calculate status for each country
    countryData.forEach(country => {
        const reqScore = country[examType];
        let status = ''; // 'safe', 'marginal', 'difficult'
        let statusText = '';
        let statusIcon = '';
        let badgeClass = '';

        // Algorithm for matching degree
        if (examType === 'ielts') {
            if (userScore >= reqScore + 0.5) {
                status = 'safe';
            } else if (userScore >= reqScore) {
                status = 'marginal';
            } else {
                status = 'difficult';
            }
        } else {
            // TOEFL and PTE logic
            if (userScore >= reqScore + 5) {
                status = 'safe';
            } else if (userScore >= reqScore) {
                status = 'marginal';
            } else {
                status = 'difficult';
            }
        }

        // Set UI text and classes based on status
        if (status === 'safe') {
            statusText = '稳了';
            statusIcon = '🟢';
            badgeClass = 'bg-safe';
        } else if (status === 'marginal') {
            statusText = '勉强';
            statusIcon = '🟡';
            badgeClass = 'bg-marginal';
        } else {
            statusText = '困难';
            statusIcon = '🔴';
            badgeClass = 'bg-difficult';
        }

        // Create result card
        const card = document.createElement('div');
        card.className = `result-card status-${status}`;

        const examNameMap = {
            'ielts': '雅思',
            'toefl': '托福',
            'pte': 'PTE'
        };

        card.innerHTML = `
            <div class="country-name">
                ${country.country}
                <span>${statusIcon}</span>
            </div>
            <div class="req-score">
                要求${examNameMap[examType]}：${reqScore} 分
            </div>
            <div>
                <span class="status-badge ${badgeClass}">${statusText}</span>
            </div>
        `;

        resultsGrid.appendChild(card);
    });

    // Show the results container
    resultsContainer.classList.remove('hidden');
    
    // Smooth scroll to results
    resultsContainer.scrollIntoView({ behavior: 'smooth', block: 'start' });
}