diff --git a/website/src/lib/components/gpx-layer/GPXLayer.ts b/website/src/lib/components/gpx-layer/GPXLayer.ts index 574e541cf..b9e548498 100644 --- a/website/src/lib/components/gpx-layer/GPXLayer.ts +++ b/website/src/lib/components/gpx-layer/GPXLayer.ts @@ -81,6 +81,7 @@ export class GPXLayer { layerOnMouseEnterBinded: (e: any) => void = this.layerOnMouseEnter.bind(this); layerOnMouseLeaveBinded: () => void = this.layerOnMouseLeave.bind(this); layerOnClickBinded: (e: any) => void = this.layerOnClick.bind(this); + layerOnContextMenuBinded: (e: any) => void = this.layerOnContextMenu.bind(this); maybeHideWaypointPopupBinded: (e: any) => void = this.maybeHideWaypointPopup.bind(this); constructor(map: mapboxgl.Map, fileId: string, file: Readable) { @@ -153,6 +154,7 @@ export class GPXLayer { }); this.map.on('click', this.fileId, this.layerOnClickBinded); + this.map.on('contextmenu', this.fileId, this.layerOnContextMenuBinded); this.map.on('mouseenter', this.fileId, this.layerOnMouseEnterBinded); this.map.on('mouseleave', this.fileId, this.layerOnMouseLeaveBinded); } @@ -302,6 +304,7 @@ export class GPXLayer { remove() { if (get(map)) { this.map.off('click', this.fileId, this.layerOnClickBinded); + this.map.off('contextmenu', this.fileId, this.layerOnContextMenuBinded); this.map.off('mouseenter', this.fileId, this.layerOnMouseEnterBinded); this.map.off('mouseleave', this.fileId, this.layerOnMouseLeaveBinded); this.map.off('style.import.load', this.updateBinded); @@ -382,6 +385,12 @@ export class GPXLayer { } } + layerOnContextMenu(e: any) { + if (e.originalEvent.ctrlKey) { + this.layerOnClick(e); + } + } + showWaypointPopup(waypoint: Waypoint) { if (get(currentPopupWaypoint) !== null) { this.hideWaypointPopup();