fix: use actual timezone offsets in map tooltip

This commit is contained in:
Your Name
2025-10-13 22:58:45 -06:00
parent 2769cb8bf1
commit aa76e34d69

View File

@@ -1,5 +1,5 @@
const MAP_SVG_SOURCE = 'assets/world_time_zones.svg'; const MAP_SVG_SOURCE = 'assets/world_time_zones.svg';
const OFFSET_PRECISION = 15; // Minuten-Schrittweite const OFFSET_PRECISION = 30; // Minuten-Schrittweite
const mapContainer = document.getElementById('map-container'); const mapContainer = document.getElementById('map-container');
const overlayEl = document.getElementById('map-overlay'); const overlayEl = document.getElementById('map-overlay');
@@ -52,9 +52,15 @@ function attachMapListeners(svg) {
const lon = normalizeLongitude(x, svg.viewBox.baseVal.width); const lon = normalizeLongitude(x, svg.viewBox.baseVal.width);
const lat = normalizeLatitude(y, svg.viewBox.baseVal.height); const lat = normalizeLatitude(y, svg.viewBox.baseVal.height);
const offsetMinutes = approximateOffsetMinutes(lon); const offsetMinutes = approximateOffsetMinutes(lon);
const { offsetLabel } = describeOffset(offsetMinutes); const candidate = findTimezoneByOffset(offsetMinutes);
positionTooltip(event.clientX, event.clientY, `${offsetLabel}\n${formatCoordinate(lat, lon)}`); if (candidate) {
const suggestion = buildSuggestion(candidate);
positionTooltip(event.clientX, event.clientY, `${suggestion.offsetLabel}\n${candidate.name}`);
} else {
const { offsetLabel } = describeOffset(offsetMinutes);
positionTooltip(event.clientX, event.clientY, `${offsetLabel}\n${formatCoordinate(lat, lon)}`);
}
} }
function handlePointerLeave() { function handlePointerLeave() {
@@ -65,15 +71,22 @@ function attachMapListeners(svg) {
const { x } = getRelativePoint(event); const { x } = getRelativePoint(event);
const lon = normalizeLongitude(x, svg.viewBox.baseVal.width); const lon = normalizeLongitude(x, svg.viewBox.baseVal.width);
const offsetMinutes = approximateOffsetMinutes(lon); const offsetMinutes = approximateOffsetMinutes(lon);
const { offsetLabel, offsetMinutesRounded } = describeOffset(offsetMinutes); const candidate = findTimezoneByOffset(offsetMinutes);
let labelToShow;
showOverlay(offsetLabel); if (candidate) {
const suggestion = buildSuggestion(candidate);
const candidate = findTimezoneByOffset(offsetMinutesRounded); labelToShow = `${suggestion.offsetLabel}`;
if (candidate && typeof addSelection === 'function') { if (typeof addSelection === 'function') {
addSelection(candidate); addSelection(candidate);
renderSelections(); renderSelections();
}
} else {
const { offsetLabel } = describeOffset(offsetMinutes);
labelToShow = offsetLabel;
} }
showOverlay(labelToShow);
} }
svg.addEventListener('pointermove', handlePointerMove); svg.addEventListener('pointermove', handlePointerMove);
@@ -158,3 +171,15 @@ function findTimezoneByOffset(targetOffsetMinutes) {
return bestCandidate; return bestCandidate;
} }
function buildSuggestion(entry) {
const now = new Date();
const offsetMinutes = getOffsetMinutes(now, entry.timeZone);
const hours = Math.trunc(offsetMinutes / 60);
const minutes = Math.abs(offsetMinutes % 60);
const sign = offsetMinutes >= 0 ? '+' : '-';
return {
offsetMinutes,
offsetLabel: `UTC${sign}${String(Math.abs(hours)).padStart(2, '0')}:${String(minutes).padStart(2, '0')}`
};
}