From 68499ca33b7aadb0fd2fa5837bb2a29d53ae444b Mon Sep 17 00:00:00 2001 From: Petr Kucera Date: Mon, 23 Jan 2023 14:32:08 +0100 Subject: [PATCH 1/5] Create a file --- components/map-url-params.js | 3 +++ components/map.js | 2 ++ 2 files changed, 5 insertions(+) create mode 100644 components/map-url-params.js diff --git a/components/map-url-params.js b/components/map-url-params.js new file mode 100644 index 00000000..1a7471ed --- /dev/null +++ b/components/map-url-params.js @@ -0,0 +1,3 @@ +export default function MapURLParams(){ + return null; +} \ No newline at end of file diff --git a/components/map.js b/components/map.js index 9634c886..6331175e 100644 --- a/components/map.js +++ b/components/map.js @@ -5,6 +5,7 @@ import "leaflet/dist/leaflet.css"; import SracLocation from "../components/map-srac-location"; import MapToilets from "../components/map-toilets"; import MapPicker from "./map-picker"; +import MapURLParams from "./map-url-params"; export default function Map() { return ( @@ -21,6 +22,7 @@ export default function Map() { + Date: Mon, 23 Jan 2023 15:56:46 +0100 Subject: [PATCH 2/5] Routing with reload --- components/map-srac-location.js | 2 +- components/map-url-params.js | 33 ++++++++++++++++++++++++++++++--- components/map.js | 13 ++++++++++++- lib/utils.js | 6 ++++++ 4 files changed, 49 insertions(+), 5 deletions(-) create mode 100644 lib/utils.js diff --git a/components/map-srac-location.js b/components/map-srac-location.js index 223ecc5a..a4c40654 100644 --- a/components/map-srac-location.js +++ b/components/map-srac-location.js @@ -15,6 +15,6 @@ export default function SracLocation() { }, }) .addTo(map); - locateControl.start(); + // locateControl.start(); return null; } diff --git a/components/map-url-params.js b/components/map-url-params.js index 1a7471ed..a5b92ef6 100644 --- a/components/map-url-params.js +++ b/components/map-url-params.js @@ -1,3 +1,30 @@ -export default function MapURLParams(){ - return null; -} \ No newline at end of file +import { useRouter } from "next/router"; +import { useState } from "react"; +import { useMap, useMapEvent } from "react-leaflet"; + +export default function MapURLParams() { + const route = useRouter(); + // console.log(route); + + const [location, setLocation] = useState(() => { + const { lng, lat, zoom } = route.query; + return { lng: lng, lat: lat, zoom: zoom }; + }); + // zoomend + const map = useMapEvent("dragend zoomend", (e) => { + const z = e.target.getZoom(); + const c = e.target.getCenter(); + console.log("onMoveEnd", z, c); + // setLocation({ + // lng: c.lng, + // lat: c.lat, + // zoom: z, + // }); + route.push(`?lat=${c.lat}&lng=${c.lng}&zoom=${z}`, undefined, { + shallow: true, + }); + map.setView([c.lat, c.lng], z); + }); + + return null; +} diff --git a/components/map.js b/components/map.js index 6331175e..4a7263d4 100644 --- a/components/map.js +++ b/components/map.js @@ -6,11 +6,22 @@ import SracLocation from "../components/map-srac-location"; import MapToilets from "../components/map-toilets"; import MapPicker from "./map-picker"; import MapURLParams from "./map-url-params"; +import { useRouter } from "next/router"; +import { parseParamsFloat, parseParamsInt } from "../lib/utils"; export default function Map() { + const route = useRouter(); + const { lat, lng, zoom } = route.query; + const query = route.query; + + let startLat = 50.08061; + let startLng = 14.4101822; + if(query.lat != null) startLat = parseParamsFloat(query.lat); + if(query.lng != null) startLng = parseParamsFloat(query.lng); + return ( Date: Mon, 23 Jan 2023 16:47:04 +0100 Subject: [PATCH 3/5] Coment code --- components/map-url-params.js | 32 ++++++++++++++++---------------- components/map.js | 12 +----------- 2 files changed, 17 insertions(+), 27 deletions(-) diff --git a/components/map-url-params.js b/components/map-url-params.js index a5b92ef6..8fde72c6 100644 --- a/components/map-url-params.js +++ b/components/map-url-params.js @@ -3,28 +3,28 @@ import { useState } from "react"; import { useMap, useMapEvent } from "react-leaflet"; export default function MapURLParams() { - const route = useRouter(); - // console.log(route); + // const route = useRouter(); + // // console.log(route); - const [location, setLocation] = useState(() => { - const { lng, lat, zoom } = route.query; - return { lng: lng, lat: lat, zoom: zoom }; - }); - // zoomend - const map = useMapEvent("dragend zoomend", (e) => { - const z = e.target.getZoom(); - const c = e.target.getCenter(); - console.log("onMoveEnd", z, c); + // const [location, setLocation] = useState(() => { + // const { lng, lat, zoom } = route.query; + // return { lng: lng, lat: lat, zoom: zoom }; + // }); + // // zoomend + // const map = useMapEvent("dragend zoomend", (e) => { + // const z = e.target.getZoom(); + // const c = e.target.getCenter(); + // console.log("onMoveEnd", z, c); // setLocation({ // lng: c.lng, // lat: c.lat, // zoom: z, // }); - route.push(`?lat=${c.lat}&lng=${c.lng}&zoom=${z}`, undefined, { - shallow: true, - }); - map.setView([c.lat, c.lng], z); - }); + // route.push(`?lat=${c.lat}&lng=${c.lng}&zoom=${z}`, undefined, { + // shallow: true, + // }); + // map.setView([c.lat, c.lng], z); + // }); return null; } diff --git a/components/map.js b/components/map.js index 4a7263d4..2f7b8620 100644 --- a/components/map.js +++ b/components/map.js @@ -6,22 +6,12 @@ import SracLocation from "../components/map-srac-location"; import MapToilets from "../components/map-toilets"; import MapPicker from "./map-picker"; import MapURLParams from "./map-url-params"; -import { useRouter } from "next/router"; -import { parseParamsFloat, parseParamsInt } from "../lib/utils"; export default function Map() { - const route = useRouter(); - const { lat, lng, zoom } = route.query; - const query = route.query; - - let startLat = 50.08061; - let startLng = 14.4101822; - if(query.lat != null) startLat = parseParamsFloat(query.lat); - if(query.lng != null) startLng = parseParamsFloat(query.lng); return ( Date: Mon, 23 Jan 2023 16:47:10 +0100 Subject: [PATCH 4/5] Install search --- package.json | 1 + yarn.lock | 20 ++++++++++++++++++++ 2 files changed, 21 insertions(+) diff --git a/package.json b/package.json index dae5beb8..3d3862bc 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "autoprefixer": "^10.4.2", "leaflet": "^1.7.1", "leaflet-defaulticon-compatibility": "^0.1.1", + "leaflet-geosearch": "^3.7.0", "leaflet.locatecontrol": "^0.76.0", "next": "latest", "next-pwa": "^5.5.2", diff --git a/yarn.lock b/yarn.lock index afa4c48b..37854a0e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -932,6 +932,13 @@ minimatch "^3.0.4" strip-json-comments "^3.1.1" +"@googlemaps/js-api-loader@^1.14.3": + version "1.15.1" + resolved "https://registry.yarnpkg.com/@googlemaps/js-api-loader/-/js-api-loader-1.15.1.tgz#7d5f1d55a4ec5c99b1d8f0708f3a46b83a71384c" + integrity sha512-AsnEgNsB7S/VdrHGEQUaUM2e5tmjFGKBAfzR/AqO8O7TPq/jQGvoRw5liPBw4EMF38RDsHmKDV89q/X+qiUREQ== + dependencies: + fast-deep-equal "^3.1.3" + "@humanwhocodes/config-array@^0.9.2": version "0.9.3" resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.9.3.tgz#f2564c744b387775b436418491f15fce6601f63e" @@ -2779,11 +2786,24 @@ leaflet-defaulticon-compatibility@^0.1.1: resolved "https://registry.yarnpkg.com/leaflet-defaulticon-compatibility/-/leaflet-defaulticon-compatibility-0.1.1.tgz#ab72257b3da66fb48dab69a10c3824012a15a20a" integrity sha512-vDBFdlUAwjSEGep9ih8kfJilf6yN8V9zTbF5NC/1ZwLeGko3RUQepspPnGCRMFV51dY3Lb3hziboicrFz+rxQA== +leaflet-geosearch@^3.7.0: + version "3.7.0" + resolved "https://registry.yarnpkg.com/leaflet-geosearch/-/leaflet-geosearch-3.7.0.tgz#42f8918ed2584956c90d8c8798cc13aa8a22972f" + integrity sha512-pvDiBc+gnl0eCazT8Ls88cbCQN6NVFoYYqlK6wtQFxObkNlzlj1p919XKuhKJwrLQiF97GxY8pny5mcV9kCe6g== + optionalDependencies: + "@googlemaps/js-api-loader" "^1.14.3" + leaflet "^1.6.0" + leaflet.locatecontrol@^0.76.0: version "0.76.0" resolved "https://registry.yarnpkg.com/leaflet.locatecontrol/-/leaflet.locatecontrol-0.76.0.tgz#afca63a3ccf3161bed0e8bf94a98ddba364e90e1" integrity sha512-Mx8uiihBi8KrrW3LgblsNL/pS8HR0gj60m8VFDFrnhSvDuitChazc095XcMSscf/XqZW+TSqQMCTe+AUy/4/eA== +leaflet@^1.6.0: + version "1.9.3" + resolved "https://registry.yarnpkg.com/leaflet/-/leaflet-1.9.3.tgz#52ec436954964e2d3d39e0d433da4b2500d74414" + integrity sha512-iB2cR9vAkDOu5l3HAay2obcUHZ7xwUBBjph8+PGtmW/2lYhbLizWtG7nTeYht36WfOslixQF9D/uSIzhZgGMfQ== + leaflet@^1.7.1: version "1.7.1" resolved "https://registry.yarnpkg.com/leaflet/-/leaflet-1.7.1.tgz#10d684916edfe1bf41d688a3b97127c0322a2a19" From bcc1b849b098d8bc7cd86b2a3e3bb6689590e396 Mon Sep 17 00:00:00 2001 From: Petr Kucera Date: Mon, 23 Jan 2023 17:06:55 +0100 Subject: [PATCH 5/5] Uninstall search plugin --- components/map-srac-location.js | 2 +- components/map.js | 1 - package.json | 1 - yarn.lock | 20 -------------------- 4 files changed, 1 insertion(+), 23 deletions(-) diff --git a/components/map-srac-location.js b/components/map-srac-location.js index a4c40654..223ecc5a 100644 --- a/components/map-srac-location.js +++ b/components/map-srac-location.js @@ -15,6 +15,6 @@ export default function SracLocation() { }, }) .addTo(map); - // locateControl.start(); + locateControl.start(); return null; } diff --git a/components/map.js b/components/map.js index 2f7b8620..6331175e 100644 --- a/components/map.js +++ b/components/map.js @@ -8,7 +8,6 @@ import MapPicker from "./map-picker"; import MapURLParams from "./map-url-params"; export default function Map() { - return (