diff --git a/themes/intotheeast/templates/dailies.html.twig b/themes/intotheeast/templates/dailies.html.twig index 9f5f2fd..107e124 100644 --- a/themes/intotheeast/templates/dailies.html.twig +++ b/themes/intotheeast/templates/dailies.html.twig @@ -44,8 +44,7 @@ var feedMap = new maplibregl.Map({ container: 'feed-map', style: MapUtils.MAP_STYLE, center: [20, 20], - zoom: 2, - cooperativeGestures: true + zoom: 2 }); feedMap.on('load', function () { @@ -59,11 +58,10 @@ feedMap.on('load', function () { bounds.extend(lngLat); var el = MapUtils.createDotMarker(isLatest); - el.addEventListener('click', function () { - window.location.href = entry.url; - }); + var popup = new maplibregl.Popup({ offset: 12, closeButton: false, maxWidth: '200px' }) + .setHTML('
'); - new maplibregl.Marker({ element: el }).setLngLat(lngLat).addTo(feedMap); + new maplibregl.Marker({ element: el }).setLngLat(lngLat).setPopup(popup).addTo(feedMap); }); MapUtils.addJourneyLine(feedMap, coords, 'feed-journey'); @@ -71,7 +69,7 @@ feedMap.on('load', function () { if (FEED_ENTRIES.length === 1) { feedMap.jumpTo({ center: coords[0], zoom: 10 }); } else { - feedMap.fitBounds(bounds, { padding: 20, maxZoom: 11 }); + feedMap.fitBounds(bounds, { padding: 60, maxZoom: 11 }); } }); diff --git a/themes/intotheeast/templates/home.html.twig b/themes/intotheeast/templates/home.html.twig index cc55050..02e237a 100644 --- a/themes/intotheeast/templates/home.html.twig +++ b/themes/intotheeast/templates/home.html.twig @@ -133,8 +133,7 @@ var homeMap = new maplibregl.Map({ container: 'home-map', style: MapUtils.MAP_STYLE, center: [20, 20], - zoom: 2, - cooperativeGestures: true + zoom: 2 }); homeMap.on('load', function () { @@ -148,12 +147,10 @@ homeMap.on('load', function () { bounds.extend(lngLat); var el = MapUtils.createDotMarker(isLatest); - el.addEventListener('click', function () { - var card = document.getElementById('entry-' + entry.slug); - if (card) card.scrollIntoView({ behavior: 'smooth', block: 'center' }); - }); + var popup = new maplibregl.Popup({ offset: 12, closeButton: false, maxWidth: '200px' }) + .setHTML(''); - new maplibregl.Marker({ element: el }).setLngLat(lngLat).addTo(homeMap); + new maplibregl.Marker({ element: el }).setLngLat(lngLat).setPopup(popup).addTo(homeMap); }); MapUtils.addJourneyLine(homeMap, coords, 'home-journey'); @@ -161,7 +158,7 @@ homeMap.on('load', function () { if (HOME_ENTRIES.length === 1) { homeMap.jumpTo({ center: coords[0], zoom: 10 }); } else { - homeMap.fitBounds(bounds, { padding: 20, maxZoom: 11 }); + homeMap.fitBounds(bounds, { padding: 60, maxZoom: 11 }); } setTimeout(function () { homeMap.resize(); }, 100); diff --git a/themes/intotheeast/templates/map.html.twig b/themes/intotheeast/templates/map.html.twig index 19333a4..af9c614 100644 --- a/themes/intotheeast/templates/map.html.twig +++ b/themes/intotheeast/templates/map.html.twig @@ -114,7 +114,7 @@ map.on('load', function () { if (ENTRIES.length === 1) { map.jumpTo({ center: coords[0], zoom: 10 }); } else { - map.fitBounds(bounds, { padding: 60, maxZoom: 11 }); + map.fitBounds(bounds, { padding: 100, maxZoom: 11 }); } }); diff --git a/themes/intotheeast/templates/trip.html.twig b/themes/intotheeast/templates/trip.html.twig index 28b6da6..3dd87da 100644 --- a/themes/intotheeast/templates/trip.html.twig +++ b/themes/intotheeast/templates/trip.html.twig @@ -214,8 +214,7 @@ var tripMap = new maplibregl.Map({ container: 'trip-map', style: MapUtils.MAP_STYLE, center: [20, 20], - zoom: 2, - cooperativeGestures: true + zoom: 2 }); tripMap.on('load', function () { @@ -251,12 +250,10 @@ tripMap.on('load', function () { bounds.extend(lngLat); var el = MapUtils.createDotMarker(isLatest); - el.addEventListener('click', function () { - var card = document.getElementById('entry-' + entry.slug); - if (card) { card.scrollIntoView({ behavior: 'smooth', block: 'center' }); } - }); + var popup = new maplibregl.Popup({ offset: 12, closeButton: false, maxWidth: '200px' }) + .setHTML(''); - new maplibregl.Marker({ element: el }).setLngLat(lngLat).addTo(tripMap); + new maplibregl.Marker({ element: el }).setLngLat(lngLat).setPopup(popup).addTo(tripMap); }); MapUtils.addJourneyLine(tripMap, coords, 'trip-journey'); @@ -264,7 +261,7 @@ tripMap.on('load', function () { if (TRIP_ENTRIES.length === 1) { tripMap.jumpTo({ center: coords[0], zoom: 10 }); } else { - tripMap.fitBounds(bounds, { padding: 20, maxZoom: 11 }); + tripMap.fitBounds(bounds, { padding: 60, maxZoom: 11 }); } }); setTimeout(function () { tripMap.resize(); }, 100);