Function setButtonState

web/scripts/ragnar_modern.js:7776–7785

(busy, label)

        const [cls, label] = _CDP_VERDICT_STYLE[d.verdict] || _CDP_VERDICT_STYLE.unknown;
        let html = `<div class="mb-2 px-3 py-2 rounded border ${cls} text-sm">${label}</div>`;
        html += `<p class="text-xs text-gray-500 mb-2">Interface: ${escapeHtml(d.interface || '—')} · ${d.seconds}s · ${d.packet_count} CDP frame(s), ${d.speaker_count} speaker(s)${d.learned ? ' · <span class="text-gray-400">baseline learned now</span>' : ''}</p>`;
        if ((d.speakers || []).length) {
            html += '<table class="min-w-full text-xs text-gray-300 whitespace-nowrap"><thead>' +
                '<tr class="text-left text-gray-500"><th class="px-2 py-1">Device-ID</th><th class="px-2 py-1">Platform</th><th class="px-2 py-1">IOS / version</th><th class="px-2 py-1">Mgmt IP</th><th class="px-2 py-1">Native VLAN</th><th class="px-2 py-1">Voice VLAN</th><th class="px-2 py-1">Port</th><th class="px-2 py-1">Trust</th></tr>' +
                '</thead><tbody>' +
                d.speakers.map(sp => {
                    const badge = sp.baseline ? '<span class="text-green-400">✓ known</span>' : '<span class="text-red-300">? new</span>';
                    return `<tr class="border-t border-slate-800">
                        <td class="px-2 py-1 font-mono ${sp.baseline ? 'text-gray-200' : 'text-red-300'}">${escapeHtml(sp.device_id || sp.src)}</td>
                        <td class="px-2 py-1 text-gray-400">${escapeHtml(sp.platform || '—')}</td>
                        <td class="px-2 py-1 text-gray-400" title="${escapeHtml(sp.sw_version || '')}">${escapeHtml((sp.sw_version || '—').slice(0, 46))}</td>
                        <td class="px-2 py-1 font-mono text-amber-300/90">${escapeHtml(sp.mgmt_addr || '—')}</td>
                        <td class="px-2 py-1 text-amber-300/90">${sp.native_vlan == null ? '—' : sp.native_vlan}</td>