diff --git a/static/index.html b/static/index.html index 36aeaad..6057a7c 100644 --- a/static/index.html +++ b/static/index.html @@ -1595,10 +1595,22 @@ // Map tab lifecycle if (tabId === 'tabMap') { - if (map) { - setTimeout(() => map.invalidateSize(), 150); - loadAssetPins(); // Refresh pins on every tab visit + if (!map) { + const tileUrl = document.querySelector('meta[name="map-tile-url"]')?.content + || 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'; + const tileAttr = document.querySelector('meta[name="map-tile-attribution"]')?.content + || '© OpenStreetMap'; + map = L.map('mapContainer', { + center: [39.8283, -98.5795], + zoom: 4, + zoomControl: true, + }); + L.tileLayer(tileUrl, { attribution: tileAttr, maxZoom: 19 }).addTo(map); + // Restore heatmap layer if it was active + if (heatVisible) setTimeout(() => loadHeatmapData(), 300); } + setTimeout(() => map.invalidateSize(), 150); + loadAssetPins(); // Refresh pins on every tab visit startVisitTracking(); } else { stopVisitTracking(); @@ -1681,6 +1693,9 @@ let manualPhotoBlob = null; let manKeysCounter = 0; let settingsCache = {}; + let map = null; + let heatLayer = null; + let heatVisible = false; // ── Mode Switching ────────────────────────────────────────────────────── function setAddAssetMode(mode) { @@ -3405,6 +3420,41 @@ showToast('Import complete: ' + created + ' created, ' + skipped + ' skipped, ' + errors.length + ' errors'); } + // ═══════════════════════════════════════════════════════════════════════ + // MAP PINS + // ═══════════════════════════════════════════════════════════════════════ + + async function loadAssetPins() { + // Store markers on a namespace so we can clear them + if (!window._assetPins) window._assetPins = []; + // Clear existing markers + window._assetPins.forEach(function(m) { if (map) map.removeLayer(m); }); + window._assetPins = []; + + try { + const assets = await api('/api/assets?limit=1000'); + assets.forEach(function(a) { + if (a.latitude != null && a.longitude != null) { + var icon = catIcon(a.category); + var popupHtml = '' + esc(a.name) + '
' + esc(a.machine_id || '') + + '
'; + var marker = L.marker([a.latitude, a.longitude]) + .addTo(map) + .bindPopup(popupHtml); + window._assetPins.push(marker); + } + }); + // If we have assets with coords, zoom to fit them + if (window._assetPins.length > 0) { + var group = L.featureGroup(window._assetPins); + map.fitBounds(group.getBounds().pad(0.1)); + } + } catch (e) { + console.error('Failed to load asset pins:', e); + } + } + // ═══════════════════════════════════════════════════════════════════════ // HEATMAP // ═══════════════════════════════════════════════════════════════════════