radiacode/web/static/js/spectrum.js

let spectrumChart = null;
let currentSpectrumData = null;

async function refreshSpectrum() {
    const showDiff = document.getElementById('show-difference').checked;
    const endpoint = showDiff ? '/api/spectrum/difference' : '/api/spectrum/current';

    try {
        const resp = await fetch(`${API_BASE}${endpoint}`);
        if (!resp.ok) return;
        const data = await resp.json();
        currentSpectrumData = data;
        updateSpectrumChart(data);
        updateIsotopesTable(data.isotopes_detected || []);
    } catch {}
}

function updateSpectrumChart(data) {
    const logScale = document.getElementById('log-scale').checked;
    const ctx = document.getElementById('spectrum-chart').getContext('2d');

    const chartData = {
        labels: data.energy_kev,
        datasets: [{
            label: data.background_subtracted ? 'Spectre (background soustrait)' : 'Spectre cumulé',
            data: data.counts,
            borderColor: '#4fc3f7',
            backgroundColor: 'rgba(79, 195, 247, 0.1)',
            borderWidth: 1,
            pointRadius: 0,
            fill: true,
        }]
    };

    const options = {
        responsive: true,
        maintainAspectRatio: false,
        animation: { duration: 300 },
        plugins: {
            legend: { labels: { color: '#e0e0e0' } },
            tooltip: {
                callbacks: {
                    title: (items) => {
                        const idx = items[0].dataIndex;
                        return `${data.energy_kev[idx]} keV`;
                    },
                    label: (item) => `${item.raw.toFixed(1)} counts`
                }
            }
        },
        scales: {
            x: {
                type: 'linear',
                title: { display: true, text: 'Énergie (keV)', color: '#888' },
                ticks: { color: '#888', maxTicksLimit: 20 },
                grid: { color: '#333' },
            },
            y: {
                type: logScale ? 'logarithmic' : 'linear',
                title: { display: true, text: 'Comptages', color: '#888' },
                ticks: { color: '#888' },
                grid: { color: '#333' },
            }
        }
    };

    if (spectrumChart) {
        spectrumChart.data = chartData;
        spectrumChart.options = options;
        spectrumChart.update();
    } else {
        spectrumChart = new Chart(ctx, { type: 'line', data: chartData, options });
    }
}

function updateIsotopesTable(isotopes) {
    const container = document.getElementById('isotopes-table');
    if (!isotopes || isotopes.length === 0) {
        container.innerHTML = '<p style="color:#888;text-align:center;padding:8px;">Aucun isotope détecté (background uniquement)</p>';
        return;
    }

    let html = '<h3 style="margin-bottom:8px;color:#4fc3f7;">Isotopes détectés</h3>';
    isotopes.forEach(iso => {
        const probColor = iso.probability > 0.9 ? '#4caf50' : iso.probability > 0.7 ? '#ff9800' : '#f44336';
        html += `<div class="isotope-row">
            <span class="isotope-name">${iso.isotope}</span>
            <span class="isotope-prob" style="color:${probColor}">${(iso.probability * 100).toFixed(1)}%</span>
            <span class="isotope-activity">${iso.activity_bq.toFixed(1)} Bq</span>
        </div>`;
    });
    container.innerHTML = html;
}

// Event listeners
document.getElementById('show-difference').addEventListener('change', refreshSpectrum);
document.getElementById('log-scale').addEventListener('change', refreshSpectrum);