/* ─── EVE Monitor Preview — Radar Dashboard (100% dati reali) ─── */
const { useState, useEffect, useRef, useCallback } = React;
async function apiFetch(url) {
try {
const r = await fetch(url, { credentials: 'include' });
if (!r.ok) return null;
return await r.json();
} catch { return null; }
}
const KIND_TAG = {
hostile:'HOSTILE', cyno:'CYNO', bubble:'BUBBLE', gate_camp:'GATECAMP',
neutral:'NEUTRAL', all_clear:'CLEAR', kill:'KILL',
wormhole_signature:'WARN', blob:'GANG', note:'INTEL', hostile_seen:'HOSTILE',
};
const SEV_MAP = { 1:'low', 2:'low', 3:'med', 4:'high', 5:'high' };
function parseEvents(rows) {
return (rows ?? []).map(r => ({
id: r.id,
ts: r.observed_at ? new Date(r.observed_at).getTime() : Date.now(),
tag: KIND_TAG[r.kind] ?? 'INTEL',
sev: SEV_MAP[r.severity] ?? 'med',
sys: r.system_name || String(r.system_id || '—'),
pilot: r.hostile_tags?.[0] || (r.reporters || []).find(x => !x.includes(':') && x.length > 2) || null,
charId: undefined,
text: r.message || r.description || r.raw_text || r.kind || '—',
}));
}
/* ── useAutoLocation: sistema corrente del PG via ESI ── */
function useAutoLocation() {
const [loc, setLoc] = useState(null);
useEffect(() => {
let alive = true;
async function load() {
const d = await apiFetch('/api/radar-00/auto-location');
if (!alive) return;
if (d?.ok && d.system_name) setLoc(d.system_name);
}
load();
const id = setInterval(load, 30_000); // aggiorna ogni 30s
return () => { alive = false; clearInterval(id); };
}, []);
return loc;
}
/* ── useCharacter: nome PG ── */
function useCharacter() {
const [info, setInfo] = useState({ pilot: '—', region: '—' });
useEffect(() => {
apiFetch('/api/radar-00/character').then(d => {
if (d?.ok) setInfo({
pilot: d.character_name || d.name || '—',
region: d.region_name || '—',
});
});
}, []);
return info;
}
/* ── BFS filter: sigma-coords reali, clamped a radar radius ── */
function filterByRadius(allSystems, allEdges, focusName, hops) {
const adj = new Map();
for (const s of allSystems) adj.set(s.id, new Set());
for (const [a, b] of allEdges) {
adj.get(a)?.add(b);
adj.get(b)?.add(a);
}
const inView = new Set([focusName]);
let frontier = [focusName];
for (let h = 0; h < hops; h++) {
const next = [];
for (const n of frontier)
for (const nb of adj.get(n) ?? [])
if (!inView.has(nb)) { inView.add(nb); next.push(nb); }
frontier = next;
if (!frontier.length) break;
}
if (inView.size < 3) for (const s of allSystems) inView.add(s.id);
const sub = allSystems.filter(s => inView.has(s.id));
const subEdges = allEdges.filter(([a, b]) => inView.has(a) && inView.has(b));
// Posizione focus
const focusSys = allSystems.find(s => s.id === focusName);
const fx = focusSys?.x ?? 0.5, fy = focusSys?.y ?? 0.5;
// Bbox solo da sistemi con coordinate sigma valide (has_coord !== false)
const validSub = sub.filter(s => s.has_coord !== false);
const bboxSrc = validSub.length >= 2 ? validSub : sub;
let xMin=Infinity, xMax=-Infinity, yMin=Infinity, yMax=-Infinity;
for (const s of bboxSrc) {
if (s.x < xMin) xMin = s.x; if (s.x > xMax) xMax = s.x;
if (s.y < yMin) yMin = s.y; if (s.y > yMax) yMax = s.y;
}
const span = Math.max(xMax - xMin, yMax - yMin, 0.06);
// scale: mappa span → 1.3 (rimane dentro radar con margine)
const scale = 1.3 / span;
const clamp = v => Math.max(-0.82, Math.min(0.82, v));
// Prima passata: sistemi con coord valide
const posMap = new Map();
for (const s of sub) {
if (s.has_coord === false) continue;
posMap.set(s.id, {
x: clamp((s.x - fx) * scale),
y: clamp((s.y - fy) * scale),
});
}
// Seconda passata: sistemi senza coord → media dei vicini con coord
for (const s of sub) {
if (posMap.has(s.id)) continue;
const nbs = [...(adj.get(s.id) ?? [])].map(id => posMap.get(id)).filter(Boolean);
if (nbs.length > 0) {
posMap.set(s.id, {
x: +(nbs.reduce((a, n) => a + n.x, 0) / nbs.length).toFixed(3),
y: +(nbs.reduce((a, n) => a + n.y, 0) / nbs.length).toFixed(3),
});
} else {
posMap.set(s.id, { x: 0, y: 0 });
}
}
return {
systems: sub.map(s => {
const p = posMap.get(s.id) ?? { x: 0, y: 0 };
return { ...s, x: +p.x.toFixed(3), y: +p.y.toFixed(3) };
}),
edges: subEdges,
};
}
/* ═══════════════════════ RADAR PAGE ═══════════════════════ */
function RadarPage({ shared }) {
const { focus, setFocus, alerts, setAlerts, volume, setVolume, muteAll, setMuteAll } = shared;
const rd = window.RadarData;
// Tutti i sistemi del territorio (non filtrati, con coordinate raw)
const allSystems = rd.allSystems ?? rd.systems;
const allEdges = rd.allEdges ?? rd.edges;
const [radius, setRadius] = useState(2);
const { systems, edges } = filterByRadius(allSystems, allEdges, focus, radius);
/* sweep */
const [sweepAngle, setSweepAngle] = useState(0);
useEffect(() => {
let raf, last = performance.now();
const tick = now => {
const dt = (now - last) / 1000; last = now;
setSweepAngle(a => (a + dt * 60) % 360);
raf = requestAnimationFrame(tick);
};
raf = requestAnimationFrame(tick);
return () => cancelAnimationFrame(raf);
}, []);
/* intel feed: polling ogni 8s */
const [events, setEvents] = useState([]);
const [paused, setPaused] = useState(false);
const [hotEvent, setHotEvent] = useState(null);
const [eventCount, setEventCount] = useState(0);
const lastTsRef = useRef(0);
const fetchEvents = useCallback(async () => {
const data = await apiFetch('/api/radar-00/events?limit=60');
if (!data?.ok) return;
const parsed = parseEvents(data.rows ?? []);
setEvents(parsed);
setEventCount(data.total ?? parsed.length);
if (!paused && parsed.length > 0) {
const newOnes = parsed.filter(e => e.ts > lastTsRef.current);
for (const e of newOnes.slice(0, 2)) {
setHotEvent(e.sys);
setTimeout(() => setHotEvent(null), 1300);
const tagKey = { HOSTILE:'hostile', CYNO:'cyno', BUBBLE:'bubble',
GATECAMP:'gatecamp', NEUTRAL:'neutral', CLEAR:'clear' }[e.tag];
if (tagKey && alerts[tagKey] && !muteAll) {
const meta = window.ALERT_SOUNDS_REF?.[tagKey];
if (meta && window.__playBlip) window.__playBlip(meta.freq, 0.1, meta.type, 0.12, meta.sev);
}
}
lastTsRef.current = parsed[0].ts;
}
}, [paused, alerts, muteAll]);
useEffect(() => {
fetchEvents();
const id = setInterval(fetchEvents, 8000);
return () => clearInterval(id);
}, [fetchEvents]);
/* risk dal sistema focus */
const focusedSystem = systems.find(s => s.id === focus) || systems[0];
const risk = focusedSystem?.risk ?? 0;
/* stats */
const [parseRate, setParseRate] = useState(null);
useEffect(() => {
apiFetch('/api/radar-00/stats').then(d => {
if (d?.ok) {
const rate = d.events_per_min ?? d.parse_rate ?? null;
setParseRate(typeof rate === 'number' ? rate : null);
}
});
}, []);
return (
{/* sinistra */}
▸ CONSTELLATION
{systems.length}sys · {edges.length}j
{/* Controllo raggio */}
RANGE
{[2,3,5,7,10].map(r => (
))}
F · {focus}
0 ? 'green' : 'dim'}>LIVE
▸ JUMPS · 1
▸ SENSOR
▸ AUDIO · ALERTS
▸ KILLBOARD · zKill
OPEN ↗
{/* destra: gauge + feed */}
▸ {focus}
· {focusedSystem?.hub ? 'HOME' : 'WATCHED'}
{focusedSystem?.region_name ? ' · ' + focusedSystem.region_name : ''}
setPaused(p => !p)}/>
LOADING...
);
if (!kills.length) return (
);
return ;
}
/* ═══════════════════════ APP ROUTER ═══════════════════════ */
function App() {
const [page, setPage] = useState('RADAR');
// Focus: prima prova auto-location (sistema corrente del PG)
// poi fallback al primo sistema hub dei dati live
const autoLoc = useAutoLocation();
const defaultFocus =
(window.RadarData.systems.find(s => s.hub) || window.RadarData.systems[0])?.id || 'YA0-XJ';
const [focus, setFocus] = useState(defaultFocus);
// Quando arriva l'auto-location, aggiorna il focus
useEffect(() => {
if (autoLoc) setFocus(autoLoc);
}, [autoLoc]);
const [alerts, setAlerts] = useState({
hostile: true, cyno: true, bubble: true,
gatecamp: true, neutral: false, clear: false,
});
const [volume, setVolume] = useState(70);
const [muteAll, setMuteAll] = useState(false);
const char = useCharacter();
const focusSys = window.RadarData.systems.find(s => s.id === focus);
useEffect(() => { window.__masterVol = (muteAll ? 0 : volume) / 100; }, [volume, muteAll]);
useEffect(() => {
window.__playBlip = window.playBlip;
window.ALERT_SOUNDS_REF = window.ALERT_SOUNDS;
}, []);
const shared = { focus, setFocus, alerts, setAlerts, volume, setVolume, muteAll, setMuteAll };
return (
{page === 'RADAR' && }
{page === 'INTEL' && }
{page === 'MARKET' && }
{page === 'KILLS' && }
{page === 'SETTINGS' && }
);
}
ReactDOM.createRoot(document.getElementById('root')).render();