shawn/canteen-asset-tracker
1
0
Fork 0
Code Issues 8 Pull Requests Actions Packages Projects Releases Wiki Activity

feat: category-based icon pins on map — 🥤🍔🔧 etc instead of blue dots

Browse Source
This commit is contained in:
Shawn
2026-05-23 00:27:54 -04:00
parent 796914b089
commit 0401e45ea4
1 changed files with 13 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/index.html
+13 -1
View File
@@ -804,6 +804,7 @@
.map-chip.heat-on svg { color: #000; } .map-chip.heat-on svg { color: #000; }
.map-chip.park-on { background: var(--accent); border-color: var(--accent); color: #fff; } .map-chip.park-on { background: var(--accent); border-color: var(--accent); color: #fff; }
.map-chip.park-on svg { color: #fff; } .map-chip.park-on svg { color: #fff; }
.cat-pin-icon { background: transparent !important; border: none !important; box-shadow: none !important; }
.park-label-icon { pointer-events: none !important; background: transparent !important; border: none !important; } .park-label-icon { pointer-events: none !important; background: transparent !important; border: none !important; }
.leaflet-popup-content-wrapper { .leaflet-popup-content-wrapper {
background: var(--card) !important; background: var(--card) !important;
@@ -4397,7 +4398,18 @@
var popupHtml = '<b>' + esc(a.name) + '</b><br>' + esc(a.machine_id || '') + var popupHtml = '<b>' + esc(a.name) + '</b><br>' + esc(a.machine_id || '') +
'<br><button class="btn btn-outline btn-sm" style="margin-top:6px;" ' + '<br><button class="btn btn-outline btn-sm" style="margin-top:6px;" ' +
'onclick="switchTab(\'tabAssets\');viewAsset(' + a.id + ');">View Details</button>'; 'onclick="switchTab(\'tabAssets\');viewAsset(' + a.id + ');">View Details</button>';
var marker = L.marker([a.latitude, a.longitude]) var catColor = catEntry ? catEntry.color : '#6b7280';
var pinIcon = L.divIcon({
className: 'cat-pin-icon',
html: '<div style="background:' + catColor + '22;color:' + catColor +
';border:2px solid ' + catColor + ';width:36px;height:36px;border-radius:50%;' +
'display:flex;align-items:center;justify-content:center;font-size:18px;' +
'box-shadow:0 2px 8px rgba(0,0,0,0.4);">' + icon + '</div>',
iconSize: [36, 36],
iconAnchor: [18, 18],
popupAnchor: [0, -20],
});
var marker = L.marker([a.latitude, a.longitude], { icon: pinIcon })
.addTo(map) .addTo(map)
.bindPopup(popupHtml); .bindPopup(popupHtml);
window._assetPins.push(marker); window._assetPins.push(marker);