`; try { const response = await fetch('/api/check-servers'); if (!response.ok) { throw new Error('Failed to fetch server status'); } const results = await response.json(); // Clear the loading message tbody.innerHTML = ''; // Calculate percentage of online servers for the main server status indicator const onlineCount = results.filter(r => r.status === 'online').length; const onlinePercent = Math.round((onlineCount / results.length) * 100); // Update the main server status indicator if it exists const mainStatusElement = document.getElementById('online'); if (mainStatusElement) { if (onlinePercent > 90) { mainStatusElement.textContent = 'online'; mainStatusElement.style.color = '#198009'; } else if (onlinePercent > 70) { mainStatusElement.textContent = 'degraded'; mainStatusElement.style.color = '#CC7722'; } else { mainStatusElement.textContent = 'disrupted'; mainStatusElement.style.color = '#cf0000'; } } // Split into online and offline servers const onlineServers = results.filter(server => server.status === 'online'); const offlineServers = results.filter(server => server.status === 'offline'); // Sort each group by the predefined server order onlineServers.sort((a, b) => { return serverOrder.indexOf(a.name) - serverOrder.indexOf(b.name); }); offlineServers.sort((a, b) => { return serverOrder.indexOf(a.name) - serverOrder.indexOf(b.name); }); // Combine with online servers first, but each group in proper order const orderedResults = [...onlineServers, ...offlineServers]; // Add rows to the table orderedResults.forEach(server => { const row = document.createElement('tr'); if (server.status === 'online') { row.style.backgroundColor = 'rgba(25, 128, 9, 0.05)'; // Very light green for online servers } const nameCell = document.createElement('td'); nameCell.textContent = server.name; const statusCell = document.createElement('td'); statusCell.style.textAlign = 'center'; if (server.status === 'online') { statusCell.innerHTML = '● online'; } else { statusCell.innerHTML = '● offline'; } const latencyCell = document.createElement('td'); latencyCell.style.textAlign = 'right'; latencyCell.textContent = server.latency ? `${server.latency}ms` : '-'; row.appendChild(nameCell); row.appendChild(statusCell); row.appendChild(latencyCell); tbody.appendChild(row); }); // Update last checked time const lastUpdateElement = document.getElementById('last-update-time'); const now = new Date(); lastUpdateElement.textContent = now.toLocaleTimeString(); } catch (error) { console.error("Error checking server status:", error); tbody.innerHTML = ` `; } } // fetch ASN info from server-side route (token stays server-side) async function fetchASNInfo() { try { const response = await fetch('/api/asn-info'); const asnInfo = await response.json(); const asnDetailsElement = document.getElementById('asn-details'); asnDetailsElement.innerHTML = `

ASN:	${asnInfo.asn}	Country:	${asnInfo.country}
Name:	${asnInfo.name}	Peers:	${asnInfo.peers}
Prefix:	${asnInfo.prefix}	Routes:	${asnInfo.routes}
Description:	${asnInfo.description}
Registered:	${asnInfo.registered}

`; } catch (error) { console.error("Error fetching ASN info:", error); document.getElementById('asn-details').innerHTML = '

failed to load ASN info

'; } } // Start loading the data immediately when the page loads // We'll initiate both API calls right away even if the Network tab isn't active fetchASNInfo(); fetchServerStatus(); // Add click event for tab to ensure data is refreshed when the tab is viewed const asnTab = document.querySelector('button[aria-controls="asn"]'); asnTab.addEventListener('click', function() { // Refresh data when the tab is clicked fetchASNInfo(); fetchServerStatus(); }); // Add refresh button click handler const refreshButtons = document.querySelectorAll('button'); refreshButtons.forEach(button => { if (button.innerText === 'OK') { button.addEventListener('click', function() { const activeTab = document.querySelector('button[aria-selected="true"]'); if (activeTab && activeTab.getAttribute('aria-controls') === 'asn') { fetchASNInfo(); fetchServerStatus(); } }); } }); });