121 أسطر
3.2 KiB
JavaScript
121 أسطر
3.2 KiB
JavaScript
async function loadData() {
|
|
|
|
try {
|
|
|
|
const response = await fetch("data.json?t=" + Date.now());
|
|
const data = await response.json();
|
|
|
|
if (data.length === 0) {
|
|
return;
|
|
}
|
|
|
|
const latest = data[data.length - 1];
|
|
|
|
const upCount = data.filter(item => item.uptime === "UP").length;
|
|
const uptimePercentage = ((upCount / data.length) * 100).toFixed(1);
|
|
|
|
document.getElementById("uptime").innerText =
|
|
uptimePercentage + "%";
|
|
|
|
document.getElementById("latency").innerText =
|
|
(latest.latency_ms ?? "-") + " ms";
|
|
|
|
document.getElementById("dns").innerText =
|
|
(latest.dns_ms ?? "-") + " ms";
|
|
|
|
if (latest.ssl && latest.ssl.valid) {
|
|
|
|
document.getElementById("ssl").innerHTML = `
|
|
<strong style="color:green;">Valid</strong><br>
|
|
<small>${latest.ssl.expires}</small>
|
|
`;
|
|
|
|
} else {
|
|
|
|
document.getElementById("ssl").innerHTML = `
|
|
<strong style="color:red;">Invalid</strong>
|
|
`;
|
|
|
|
}
|
|
|
|
const table = document.getElementById("historyTable");
|
|
table.innerHTML = "";
|
|
|
|
data
|
|
.slice()
|
|
.reverse()
|
|
.forEach(item => {
|
|
|
|
table.innerHTML += `
|
|
<tr>
|
|
<td>${item.timestamp}</td>
|
|
<td>${item.uptime}</td>
|
|
<td>${item.latency_ms ?? "-"}</td>
|
|
<td>${item.dns_ms ?? "-"}</td>
|
|
<td>${item.ssl && item.ssl.valid ? "Valid" : "Invalid"}</td>
|
|
</tr>
|
|
`;
|
|
|
|
});
|
|
|
|
|
|
const labels = data.map(item => item.timestamp);
|
|
const latency = data.map(item => item.latency_ms);
|
|
|
|
if (!window.latencyChart) {
|
|
|
|
window.latencyChart = new Chart(
|
|
document.getElementById("latencyChart"),
|
|
{
|
|
type: "line",
|
|
|
|
data: {
|
|
labels: labels,
|
|
datasets: [{
|
|
label: "Latency (ms)",
|
|
data: latency,
|
|
borderColor: "#0b7dda",
|
|
backgroundColor: "rgba(11,125,218,0.15)",
|
|
fill: true,
|
|
tension: 0.3
|
|
}]
|
|
},
|
|
|
|
options: {
|
|
responsive: true,
|
|
plugins: {
|
|
legend: {
|
|
display: true
|
|
}
|
|
},
|
|
scales: {
|
|
y: {
|
|
beginAtZero: false
|
|
}
|
|
}
|
|
}
|
|
}
|
|
);
|
|
|
|
} else {
|
|
|
|
window.latencyChart.data.labels = labels;
|
|
window.latencyChart.data.datasets[0].data = latency;
|
|
window.latencyChart.update();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
catch (error) {
|
|
|
|
console.error(error);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
loadData();
|
|
|
|
setInterval(loadData, 60000);
|