diff --git a/static/js/main.js b/static/js/main.js
index 9931a00..a087f79 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -165,6 +165,13 @@ function renderVehicleIcon(vehicle) {
})
}
+function vehiclePopupContent(vehicle) {
+ return `${routeDesignator(vehicle.route)} to ${vehicle.headsign?.replace(
+ /^to /i,
+ ""
+ )}${vehicle.nearest_station ? `
@ ${vehicle.nearest_station?.name}` : ""}
vehicle #: ${vehicle.id}`
+}
+
function renderVehicle(vehicle) {
return L.marker([vehicle.lat, vehicle.lon], {
zIndexOffset:
@@ -173,13 +180,7 @@ function renderVehicle(vehicle) {
? 4000
: 3000,
icon: renderVehicleIcon(vehicle),
- })
- .bindPopup(
- `${routeDesignator(vehicle.route)} to ${vehicle.headsign?.replace(
- /^to /i,
- ""
- )}${vehicle.nearest_station ? `
@ ${vehicle.nearest_station?.name}` : ""}
vehicle #: ${vehicle.id}`
- );
+ }).bindPopup(vehiclePopupContent(vehicle));
}
async function reload() {
@@ -211,6 +212,7 @@ async function reload() {
if (currentVehicles.has(vehicle.id)) { // if this vehicle is already on the map, update its location
currentVehicles.get(vehicle.id).marker.setLatLng([vehicle.lat, vehicle.lon])
currentVehicles.get(vehicle.id).marker.setIcon(renderVehicleIcon(vehicle))
+ currentVehicles.get(vehicle.id).marker.setPopupContent(vehiclePopupContent(vehicle))
} else {
const marker = renderVehicle(vehicle)
marker.addTo(