diff --git a/.gitignore b/.gitignore index 22f006a..2fed150 100644 --- a/.gitignore +++ b/.gitignore @@ -45,6 +45,9 @@ data/scan_*.json data/*.db data/profiles/ data/logs/ +data/rf-mapper.log +data/rf-mapper.pid +data/rf-mapper.started # OS .DS_Store diff --git a/src/rf_mapper/web/static/js/app.js b/src/rf_mapper/web/static/js/app.js index 597e130..4f66e0b 100644 --- a/src/rf_mapper/web/static/js/app.js +++ b/src/rf_mapper/web/static/js/app.js @@ -413,15 +413,23 @@ function drawRadar() { ctx.lineTo(w - 20, cy); ctx.stroke(); - // Draw center point (you) - ctx.fillStyle = APP_CONFIG.colors.wifi; + // Draw center point (scanner) - magenta star-like + ctx.fillStyle = '#ff0080'; ctx.beginPath(); - ctx.arc(cx, cy, 8, 0, Math.PI * 2); + // Draw a star shape + const starRadius = 10; + for (let i = 0; i < 5; i++) { + const angle = (i * 144 - 90) * Math.PI / 180; + const x = cx + starRadius * Math.cos(angle); + const y = cy + starRadius * Math.sin(angle); + if (i === 0) ctx.moveTo(x, y); + else ctx.lineTo(x, y); + } + ctx.closePath(); ctx.fill(); - ctx.fillStyle = '#1a1a2e'; - ctx.font = 'bold 8px sans-serif'; - ctx.textAlign = 'center'; - ctx.fillText('YOU', cx, cy + 3); + ctx.strokeStyle = 'white'; + ctx.lineWidth = 1.5; + ctx.stroke(); if (!scanData) return; @@ -578,17 +586,49 @@ function updateMapMarkers() { const lat = parseFloat(document.getElementById('lat-input').value); const lon = parseFloat(document.getElementById('lon-input').value); - // Add center marker + // Add center marker (this scanner) - distinct star shape + const scannerIcon = ` +
+ + + +
`; const centerMarker = L.marker([lat, lon], { icon: L.divIcon({ - className: 'center-marker', - html: `
`, - iconSize: [16, 16], - iconAnchor: [8, 8] + className: 'center-marker scanner-marker', + html: scannerIcon, + iconSize: [24, 24], + iconAnchor: [12, 12] }) - }).addTo(map).bindPopup('📍 Your Position'); + }).addTo(map).bindPopup('📍 This Scanner'); markers.push(centerMarker); + // Add peer scanner markers (async, won't block) + fetch('/api/peers') + .then(r => r.json()) + .then(data => { + (data.peers || []).forEach(peer => { + if (peer.latitude && peer.longitude) { + const peerIcon = ` +
+ + + +
`; + const peerMarker = L.marker([peer.latitude, peer.longitude], { + icon: L.divIcon({ + className: 'peer-marker scanner-marker', + html: peerIcon, + iconSize: [20, 20], + iconAnchor: [10, 10] + }) + }).addTo(map).bindPopup(`📡 ${peer.name || peer.scanner_id}
Floor: ${peer.floor ?? '?'}`); + markers.push(peerMarker); + } + }); + }) + .catch(() => {}); // Ignore errors + const wifi = filters.wifi ? (scanData.wifi_networks || []) : []; const bt = filters.bluetooth ? (scanData.bluetooth_devices || []) : []; diff --git a/src/rf_mapper/web/templates/base.html b/src/rf_mapper/web/templates/base.html index be55fdd..51a2b59 100644 --- a/src/rf_mapper/web/templates/base.html +++ b/src/rf_mapper/web/templates/base.html @@ -48,6 +48,8 @@ colors: { wifi: '#f59f00', // Orange for WiFi bluetooth: '#4dabf7', // Blue for Bluetooth + scanner: '#ff0080', // Magenta for scanner positions + peerScanner: '#00c8ff', // Cyan for peer scanners warning: '#ffd93d', danger: '#ff6b6b' },