ico
/
pingql
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

attempt fix: cont 2

This commit is contained in:
nate 2026-03-28 16:21:11 +04:00
parent 3dc0757b4a
commit 8831c9c7b4
1 changed files with 19 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
apps/web/src/views/home.ejs
View File

@ -85,8 +85,8 @@
'us-west': '#f59e0b',
};
// Per-monitor, per-region latency tracking for sparkline (mirrors SSR sparklineFromPings)
const sparkData = {};
// Per-monitor tracking: regions = {region: [vals]}, timeline = [{region, val}] in arrival order
const sparkData = {}; // mid → { regions: {region: [vals]}, timeline: [{region}] }
// Seed from SSR data-vals and data-region
document.querySelectorAll('[data-monitor-id]').forEach(card => {
const mid = card.dataset.monitorId;
@ -94,38 +94,35 @@
if (!svg) return;
const region = svg.dataset.region || '__none__';
const vals = svg.dataset.vals ? svg.dataset.vals.split(',').map(Number) : [];
sparkData[mid] = {};
sparkData[mid][region] = vals;
sparkData[mid] = {
regions: { [region]: vals },
timeline: vals.map(() => region),
};
});
function getBestRegion(monitorId) {
const regions = sparkData[monitorId] || {};
// Only consider regions that appear in the 3 most recent pings overall
// sparkData stores vals per region in chronological order; build a merged timeline
const timeline = [];
for (const [region, vals] of Object.entries(regions)) {
for (const val of vals) timeline.push({ region, val });
}
if (!timeline.length) return { region: '__none__', latest: null };
const data = sparkData[monitorId];
if (!data || !data.timeline.length) return { region: '__none__', latest: null };
const recentRegions = new Set(timeline.slice(-3).map(p => p.region));
// Only consider regions present in the 3 most recent pings
const recentRegions = new Set(data.timeline.slice(-3));
let bestRegion = '__none__', bestAvg = Infinity;
for (const [region, vals] of Object.entries(regions)) {
for (const [region, vals] of Object.entries(data.regions)) {
if (!recentRegions.has(region) || !vals.length) continue;
const recent = vals.slice(-3);
const avg = recent.reduce((a, b) => a + b, 0) / recent.length;
if (avg < bestAvg) { bestAvg = avg; bestRegion = region; }
}
const vals = regions[bestRegion] || [];
const vals = data.regions[bestRegion] || [];
const latest = vals.length ? vals[vals.length - 1] : null;
return { region: bestRegion, latest };
}
function redrawSparkline(card, monitorId) {
const { region: bestRegion } = getBestRegion(monitorId);
const vals = (sparkData[monitorId] || {})[bestRegion];
const vals = (sparkData[monitorId]?.regions || {})[bestRegion];
if (!vals || !vals.length) return;
const color = REGION_COLORS[bestRegion] || '#60a5fa';
const W = 120, H = 32;
@ -156,12 +153,13 @@
if (ping.latency_ms != null) {
const mid = ping.monitor_id;
const region = ping.region || '__none__';
if (!sparkData[mid]) sparkData[mid] = {};
if (!sparkData[mid][region]) sparkData[mid][region] = [];
sparkData[mid][region].push(ping.latency_ms);
if (sparkData[mid][region].length > 20) sparkData[mid][region].shift();
if (!sparkData[mid]) sparkData[mid] = { regions: {}, timeline: [] };
if (!sparkData[mid].regions[region]) sparkData[mid].regions[region] = [];
sparkData[mid].regions[region].push(ping.latency_ms);
sparkData[mid].timeline.push(region);
if (sparkData[mid].regions[region].length > 20) sparkData[mid].regions[region].shift();
if (sparkData[mid].timeline.length > 40) sparkData[mid].timeline.shift();
redrawSparkline(card, mid);
// Show best region's latest latency
const { latest } = getBestRegion(mid);
if (latest != null) card.querySelector('.stat-latency').textContent = latest + 'ms';
}