gpx.studio/website/src/lib/components/map/gpx-layer/gpx-layer-popup.ts

import { MapPopup } from '$lib/components/map/map-popup';

export let waypointPopup: MapPopup | null = null;
export let trackpointPopup: MapPopup | null = null;

export function createPopups(map: mapboxgl.Map) {
    removePopups();
    waypointPopup = new MapPopup(map, {
        closeButton: false,
        focusAfterOpen: false,
        maxWidth: undefined,
        offset: {
            top: [0, 0],
            'top-left': [0, 0],
            'top-right': [0, 0],
            bottom: [0, -30],
            'bottom-left': [0, -30],
            'bottom-right': [0, -30],
            left: [10, -15],
            right: [-10, -15],
        },
    });
    trackpointPopup = new MapPopup(map, {
        closeButton: false,
        focusAfterOpen: false,
        maxWidth: undefined,
    });
}

export function removePopups() {
    if (waypointPopup !== null) {
        waypointPopup.remove();
        waypointPopup = null;
    }
    if (trackpointPopup !== null) {
        trackpointPopup.remove();
        trackpointPopup = null;
    }
}