Apply suggestions

tibiamaps · May 22, 2022 · 5ca9c0d · 5ca9c0d
1 parent 079a85d
commit 5ca9c0d
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 23 deletions.
diff --git a/src/_js/map.js b/src/_js/map.js
@@ -199,48 +199,52 @@
 			});
 		});
 
-		const mapContainer = document.querySelector('#map');
-		const urlParams = new URLSearchParams(window.location.search);
-		// Possible markers sources
-		// A) https://example.com?m=<base64-json-str>#32368,32198,7:0
-		// B) https://example.com?mf=https://example.com/pack.json#32368,32198,7:0
-		// C) <div id="map" data-marker-json="<json-str>" ...>
-		// D) <div id="map" data-marker-pack="https://example.com/pack.json" ...>
-		// E) fallback: https://tibiamaps.github.io/tibia-map-data/markers.json
-		if (urlParams.get('m')) {
-			buildMarkerLayers(atob(JSON.parse(urlParams.get('m'))));
-		} else if (urlParams.get('mf')) {
-			loadMarkersPack(urlParams.get('mf'));
-		} else if (mapContainer.dataset.markerJson) {
-			buildMarkerLayers(JSON.parse(mapContainer.dataset.markerJson));
-		} else if (mapContainer.dataset.markerPack) {
-			loadMarkersPack(URL_PREFIX + mapContainer.dataset.markerPack);
-		} else {
-			loadMarkersPack(URL_PREFIX + 'markers.json');
+		function getMarkersSource() {
+			const mapContainer = document.querySelector('#map');
+			const urlParams = new URLSearchParams(window.location.search);
+			// Possible markers sources
+			// A) https://example.com?markers=<base64-json-str>#32368,32198,7:0
+			// B) https://example.com?markersUrl=https://example.com/pack.json#32368,32198,7:0
+			// C) <div id="map" data-marker="<json-str>" ...>
+			// D) <div id="map" data-marker-url="https://example.com/pack.json" ...>
+			// E) fallback: https://tibiamaps.github.io/tibia-map-data/markers.json
+			try {
+				if (urlParams.get('markers')) return JSON.parse(atob(urlParams.get('markers')));
+				if (urlParams.get('markersUrl')) return urlParams.get('markersUrl');
+				if (mapContainer.dataset.markers) return JSON.parse(mapContainer.dataset.markers);
+				if (mapContainer.dataset.markersUrl) return URL_PREFIX + mapContainer.dataset.markersUrl;
+			} catch (e) {
+				console.error("Invalid custom markers data, using default markers")
+			}
+			return URL_PREFIX + 'markers.json';
 		}
 
-		function loadMarkersPack(url) {
+		const markersSource = getMarkersSource();
+		if (typeof markersSource === 'string') { loadMarkersFromUrl(markersSource);	}
+		else { buildMarkerLayers(markersSource); }
+
+		function loadMarkersFromUrl(url) {
 			const xhr = new XMLHttpRequest();
 			xhr.open('GET', url);
 			xhr.responseType = 'json';
 			xhr.onload = function () {
 				if (xhr.status === 200) {
 					buildMarkerLayers(xhr.response);
-					_this._tryShowMarkers();
 				}
 			};
 			xhr.send();
 		}
 
-		function buildMarkerLayers(array) {
-			array.forEach(m => {
+		function buildMarkerLayers(markersData) {
+			markersData.forEach(m => {
 				const options = {'title': m.description};
 				if (m.icon && m.icon in icons) { options.icon = icons[m.icon]; }
 				if (!_this.markersLayers[m.z]) { _this.markersLayers[m.z] = new L.layerGroup(); }
 				_this.markersLayers[m.z].addLayer(
 					L.marker(_this.map.unproject([m.x + 0.5, m.y + 0.5], 0), options)
 				);
 			});
+			_this._tryShowMarkers();
 		}
 	};
 	TibiaMap.prototype._toggleMarkers = function () {

diff --git a/src/index.html b/src/index.html
@@ -20,7 +20,8 @@
 		<link rel="icon" href="favicon.ico">
 	</head>
 	<body>
-		<!--<div id="map" data-marker-pack="poi-markers.json"></div>-->
+		<!--<div id="map" data-markers='[{"description":"Shops","icon":"bag","x":32368,"y":32198,"z":7},{"description":"Temple","icon":"cross","x":32369,"y":32241,"z":7}]'></div>-->
+		<!--<div id="map" data-markers-url="poi-markers.json"></div>-->
 		<div id="map"></div>
 		<script src="../dist/map.js"></script>
 	</body>