will/water-station-tracker
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Keep popups open/refreshed, rename app

Browse Source
This commit is contained in:
Will Bradley
2025-07-16 17:52:24 -07:00
parent e5ba61c71c
commit 7b332f873a
5 changed files with 65 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
public/dashboard.html
View File

@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Dashboard - Water Station Tracker</title>
<title>Dashboard - CoolingStations.org</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
<style>
* {
@@ -561,6 +561,38 @@
window.openEditModal = openEditModal;
window.deleteStation = deleteStation;
// Consolidated station management functions
let activePopup = null;
let activeStationId = null;
let stationMarkers = new Map(); // Map station ID to marker
function clearMapMarkers() {
map.eachLayer(function (layer) {
if (layer instanceof L.CircleMarker) {
map.removeLayer(layer);
}
});
stationMarkers.clear();
}
function refreshStationsAndKeepPopup(keepPopupOpen = false) {
const stationIdToReopen = keepPopupOpen ? activeStationId : null;
clearMapMarkers();
loadStations().then(() => {
if (stationIdToReopen && stationMarkers.has(stationIdToReopen)) {
// Reopen the popup for the specific station
setTimeout(() => {
const marker = stationMarkers.get(stationIdToReopen);
if (marker) {
marker.openPopup();
activePopup = marker.getPopup();
activeStationId = stationIdToReopen;
}
}, 200);
}
});
}
async function loadStations() {
try {
const response = await fetch(`/api/cities/${currentCity}/stations`);
@@ -621,6 +653,22 @@
const popupContent = createPopupContent(station);
marker.bindPopup(popupContent);
// Store marker in the map with station ID as key
stationMarkers.set(station.id, marker);
// Track popup open/close events
marker.on('popupopen', function(e) {
activePopup = e.popup;
activeStationId = station.id;
});
marker.on('popupclose', function(e) {
if (activePopup === e.popup) {
activePopup = null;
activeStationId = null;
}
});
});
}
@@ -633,9 +681,9 @@
<h3>${station.name}</h3>
<p style="color: #666; font-size: 0.9rem; margin-bottom: 10px;">${station.description || 'No description'}</p>
<p><strong>Status:</strong> ${station.latest_description || 'No status update'}</p>
<p><strong>Last Refill:</strong> ${refillTime}</p>
<p><strong>Status As Of:</strong> ${refillTime}</p>
<p><strong>Estimated Empty:</strong> ${estimatedEmpty}</p>
<p><strong>Last Updated By:</strong> ${station.updated_by_name || 'Unknown'}</p>
<p><strong>Status Update By:</strong> ${station.updated_by_name || 'Unknown'}</p>
<div style="margin-top: 10px;">
<button class="popup-btn" onclick="openEditModal(${station.id})">Edit Station</button>
<button class="popup-btn" onclick="openUpdateModal(${station.id})">Update Status</button>
@@ -650,6 +698,7 @@
if (!station) return;
selectedStation = station;
activeStationId = stationId; // Track which station we're updating
document.getElementById('updateModal').style.display = 'block';
// Set current date/time as default
@@ -695,6 +744,7 @@
if (!station) return;
selectedStation = station;
activeStationId = stationId; // Track which station we're editing
document.getElementById('editModal').style.display = 'block';
document.getElementById('editStationName').value = station.name;
document.getElementById('editStationDescription').value = station.description || '';
@@ -727,7 +777,7 @@
showMessage('edit-message', 'Station deleted successfully!');
setTimeout(() => {
closeEditModal();
loadStations();
refreshStationsAndKeepPopup(false);
}, 1500);
} else {
showMessage('edit-message', result.error || 'Failed to delete station', 'error');
@@ -822,7 +872,7 @@
showMessage('add-message', 'Station added successfully!');
setTimeout(() => {
closeAddModal();
loadStations();
refreshStationsAndKeepPopup(false);
}, 1500);
} else {
const result = await response.json();
@@ -861,7 +911,7 @@
showMessage('update-message', 'Station updated successfully!');
setTimeout(() => {
closeUpdateModal();
loadStations();
refreshStationsAndKeepPopup(true);
}, 1500);
} else {
const result = await response.json();
@@ -899,7 +949,7 @@
showMessage('edit-message', 'Station updated successfully!');
setTimeout(() => {
closeEditModal();
loadStations();
refreshStationsAndKeepPopup(true);
}, 1500);
} else {
const result = await response.json();