fix: consolidate scanner display with capabilities

Show each scanner as a single marker with WiFi/Bluetooth capabilities
listed in the popup, instead of separate entries per capability.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
User
2026-02-01 11:54:53 +01:00
parent ae235ebef8
commit 7e469d6a0a

View File

@@ -953,7 +953,7 @@ function updateMapMarkers() {
iconSize: [24, 24],
iconAnchor: [12, 12]
})
}).addTo(map).bindPopup(`📍 ${localScannerName}`);
}).addTo(map).bindPopup(`<strong>📍 ${escapeHtml(localScannerName)}</strong><br><span style="color:#4dabf7;">WiFi</span> · <span style="color:#9b59b6;">Bluetooth</span>`);
markers.push(centerMarker);
// Add peer scanner markers (async, won't block)
@@ -962,6 +962,7 @@ function updateMapMarkers() {
.then(data => {
(data.peers || []).forEach(peer => {
if (peer.latitude && peer.longitude) {
const peerName = peer.name || peer.scanner_id;
const peerIcon = `
<div style="position:relative;width:20px;height:20px;">
<svg viewBox="0 0 24 24" style="width:20px;height:20px;filter:drop-shadow(0 0 3px rgba(0,200,255,0.8));">
@@ -975,7 +976,7 @@ function updateMapMarkers() {
iconSize: [20, 20],
iconAnchor: [10, 10]
})
}).addTo(map).bindPopup(`📡 ${peer.name || peer.scanner_id}<br>Floor: ${peer.floor ?? '?'}`);
}).addTo(map).bindPopup(`<strong>📡 ${escapeHtml(peerName)}</strong><br><span style="color:#4dabf7;">WiFi</span> · <span style="color:#9b59b6;">Bluetooth</span><br>Floor: ${peer.floor ?? '?'}`);
markers.push(peerMarker);
}
});
@@ -1859,10 +1860,10 @@ function update3DMarkers() {
.setLngLat([lon, lat])
.setPopup(new maplibregl.Popup().setHTML(`
<strong>📍 ${escapeHtml(scannerName)}</strong><br>
<span style="color:#4dabf7;">WiFi</span> · <span style="color:#9b59b6;">Bluetooth</span><br>
Floor: ${scannerFloor}<br>
Lat: ${lat.toFixed(6)}<br>
Lon: ${lon.toFixed(6)}<br>
<div style="font-size:0.7rem;color:#888;margin-top:4px;">Drag marker to reposition</div>
<span style="font-size:0.8rem;color:#888;">${lat.toFixed(6)}, ${lon.toFixed(6)}</span>
<div style="font-size:0.7rem;color:#666;margin-top:4px;">Drag to reposition</div>
`))
.addTo(map3d);
@@ -1879,11 +1880,12 @@ function update3DMarkers() {
if (peer.latitude && peer.longitude) {
const peerFloor = peer.floor ?? 0;
const peerOffset = (peerFloor - groundFloor) * pixelsPerFloor;
const peerName = peer.name || peer.scanner_id;
const peerEl = document.createElement('div');
peerEl.className = 'marker-3d peer-scanner';
peerEl.innerHTML = `<div class="marker-icon">📡</div><div class="marker-floor">F${peerFloor}</div>`;
peerEl.title = `${peer.name || peer.scanner_id} - Floor ${peerFloor}`;
peerEl.title = `${peerName} - Floor ${peerFloor}`;
const peerMarker = new maplibregl.Marker({
element: peerEl,
@@ -1891,11 +1893,10 @@ function update3DMarkers() {
})
.setLngLat([peer.longitude, peer.latitude])
.setPopup(new maplibregl.Popup().setHTML(`
<strong>📡 ${peer.name || peer.scanner_id}</strong><br>
<strong>📡 ${escapeHtml(peerName)}</strong><br>
<span style="color:#4dabf7;">WiFi</span> · <span style="color:#9b59b6;">Bluetooth</span><br>
Floor: ${peerFloor}<br>
Lat: ${peer.latitude.toFixed(6)}<br>
Lon: ${peer.longitude.toFixed(6)}<br>
<div style="font-size:0.7rem;color:#888;margin-top:4px;">Peer scanner (read-only)</div>
<span style="font-size:0.8rem;color:#888;">${peer.latitude.toFixed(6)}, ${peer.longitude.toFixed(6)}</span>
`))
.addTo(map3d);