fix: use actual timezone offsets in map tooltip
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
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 overlayEl = document.getElementById('map-overlay');
|
||||
@@ -52,9 +52,15 @@ function attachMapListeners(svg) {
|
||||
const lon = normalizeLongitude(x, svg.viewBox.baseVal.width);
|
||||
const lat = normalizeLatitude(y, svg.viewBox.baseVal.height);
|
||||
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() {
|
||||
@@ -65,15 +71,22 @@ function attachMapListeners(svg) {
|
||||
const { x } = getRelativePoint(event);
|
||||
const lon = normalizeLongitude(x, svg.viewBox.baseVal.width);
|
||||
const offsetMinutes = approximateOffsetMinutes(lon);
|
||||
const { offsetLabel, offsetMinutesRounded } = describeOffset(offsetMinutes);
|
||||
const candidate = findTimezoneByOffset(offsetMinutes);
|
||||
let labelToShow;
|
||||
|
||||
showOverlay(offsetLabel);
|
||||
|
||||
const candidate = findTimezoneByOffset(offsetMinutesRounded);
|
||||
if (candidate && typeof addSelection === 'function') {
|
||||
addSelection(candidate);
|
||||
renderSelections();
|
||||
if (candidate) {
|
||||
const suggestion = buildSuggestion(candidate);
|
||||
labelToShow = `${suggestion.offsetLabel}`;
|
||||
if (typeof addSelection === 'function') {
|
||||
addSelection(candidate);
|
||||
renderSelections();
|
||||
}
|
||||
} else {
|
||||
const { offsetLabel } = describeOffset(offsetMinutes);
|
||||
labelToShow = offsetLabel;
|
||||
}
|
||||
|
||||
showOverlay(labelToShow);
|
||||
}
|
||||
|
||||
svg.addEventListener('pointermove', handlePointerMove);
|
||||
@@ -158,3 +171,15 @@ function findTimezoneByOffset(targetOffsetMinutes) {
|
||||
|
||||
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')}`
|
||||
};
|
||||
}
|
||||
|
Reference in New Issue
Block a user