From 869f733fb7cb7f7aa584f73a66b066eaabbe1973 Mon Sep 17 00:00:00 2001
From: James Lyne <jim+github@not-null.co.uk>
Date: Tue, 26 Jan 2021 14:32:48 +0000
Subject: [PATCH] Handle popups for markers. Fixes #5

---
 src/util/markers.ts | 30 +++++++++++++++++++++++++++++-
 1 file changed, 29 insertions(+), 1 deletion(-)

diff --git a/src/util/markers.ts b/src/util/markers.ts
index e4c14a4..463d707 100644
--- a/src/util/markers.ts
+++ b/src/util/markers.ts
@@ -24,7 +24,7 @@ import {DynmapProjection} from "@/leaflet/projection/DynmapProjection";
 import {GenericMarker} from "@/leaflet/marker/GenericMarker";
 
 export const createMarker = (options: DynmapMarker, projection: DynmapProjection): Marker => {
-	return new GenericMarker(projection.locationToLatLng(options.location), {
+	const marker = new GenericMarker(projection.locationToLatLng(options.location), {
 		icon: new DynmapIcon({
 			icon: options.icon,
 			label: options.label,
@@ -34,6 +34,12 @@ export const createMarker = (options: DynmapMarker, projection: DynmapProjection
 		maxZoom: options.maxZoom,
 		minZoom: options.minZoom,
 	});
+
+	if(options.popupContent) {
+		marker.bindPopup(() => createPopup(options));
+	}
+
+	return marker;
 };
 
 export const updateMarker = (marker: Marker | undefined, options: DynmapMarker, projection: DynmapProjection): Marker => {
@@ -61,5 +67,27 @@ export const updateMarker = (marker: Marker | undefined, options: DynmapMarker,
 		}
 	}
 
+	marker.unbindPopup();
+
+	if(options.popupContent) {
+		marker.bindPopup(() => createPopup(options));
+	}
+
 	return marker;
 };
+
+export const createPopup = (options: DynmapMarker) => {
+	const popup = document.createElement('span');
+
+	if (options.popupContent) {
+		popup.classList.add('MarkerPopup');
+		popup.insertAdjacentHTML('afterbegin', options.popupContent);
+	} else if (options.isHTML) {
+		popup.classList.add('MarkerPopup');
+		popup.insertAdjacentHTML('afterbegin', options.label);
+	} else {
+		popup.textContent = options.label;
+	}
+
+	return popup;
+}