make any part of map shareable via url

teambtcmap · Apr 24, 2023 · 3452518 · 3452518
1 parent c637394
commit 3452518
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 5 deletions.
diff --git a/src/lib/map/setup.js b/src/lib/map/setup.js
@@ -286,7 +286,6 @@ export const changeDefaultIcons = (layers, L, mapElement, DomEvent) => {
 
 	const fullscreenButton = L.DomUtil.create('a');
 	fullscreenButton.classList.add('leaflet-control-full-screen');
-	fullscreenButton.href = '#';
 	fullscreenButton.title = 'Full screen';
 	fullscreenButton.role = 'button';
 	fullscreenButton.ariaLabel = 'Full screen';
@@ -431,7 +430,6 @@ export const dataRefresh = (L, map, DomEvent) => {
 
 			const dataRefreshButton = L.DomUtil.create('a');
 			dataRefreshButton.classList.add('leaflet-control-data-refresh');
-			dataRefreshButton.href = '#';
 			dataRefreshButton.title = 'Data refresh available';
 			dataRefreshButton.role = 'button';
 			dataRefreshButton.ariaLabel = 'Data refresh available';

diff --git a/src/routes/map/+page.svelte b/src/routes/map/+page.svelte
@@ -194,8 +194,24 @@
 			// add map and tiles
 			map = leaflet.map(mapElement);
 
+			// use url hash if present
+			if (location.hash) {
+				try {
+					const coords = location.hash.split('/');
+					map.setView([coords[1], coords[2]], coords[0].slice(1));
+					mapCenter = map.getCenter();
+				} catch (error) {
+					map.setView([0, 0], 3);
+					mapCenter = map.getCenter();
+					errToast(
+						'Could not set map view to provided coordinates, please try again or contact BTC Map.'
+					);
+					console.log(error);
+				}
+			}
+
 			// set view to community if in url params
-			if (community && communitySelected) {
+			else if (community && communitySelected) {
 				try {
 					// eslint-disable-next-line no-undef
 					map.fitBounds(L.geoJSON(communitySelected.tags.geo_json).getBounds());
@@ -304,6 +320,11 @@ Thanks for using BTC Map!`);
 
 				mapCenter = map.getCenter();
 
+				if (!community && !communitiesOnly && !urlLat.length && !urlLong.length) {
+					const zoom = map.getZoom();
+					location.hash = zoom + '/' + mapCenter.lat.toFixed(5) + '/' + mapCenter.lng.toFixed(5);
+				}
+
 				localforage
 					.setItem('coords', coords)
 					// eslint-disable-next-line no-unused-vars
@@ -348,7 +369,6 @@ Thanks for using BTC Map!`);
 					// eslint-disable-next-line no-undef
 					const searchButton = L.DomUtil.create('a');
 					searchButton.classList.add('leaflet-control-search-toggle');
-					searchButton.href = '#';
 					searchButton.title = 'Search toggle';
 					searchButton.role = 'button';
 					searchButton.ariaLabel = 'Search toggle';
@@ -435,7 +455,6 @@ Thanks for using BTC Map!`);
 					// eslint-disable-next-line no-undef
 					const boostLayerButton = L.DomUtil.create('a');
 					boostLayerButton.classList.add('leaflet-control-boost-layer');
-					boostLayerButton.href = '#';
 					boostLayerButton.title = 'Boosted locations';
 					boostLayerButton.role = 'button';
 					boostLayerButton.ariaLabel = 'Boosted locations';