diff --git a/src/components/Filter/Filter.js b/src/components/Filter/Filter.js index 94917e6..2c35da8 100644 --- a/src/components/Filter/Filter.js +++ b/src/components/Filter/Filter.js @@ -287,14 +287,16 @@ function Filter({filter, doSubmit, resetFilter, searchParams, loadFilter, isLoad } } - + console.log("L290 parseFloat((coordinatesSouthWest.lat).toFixed(6))" , parseFloat((coordinatesSouthWest.lat).toFixed(6))) const submit = () => { const filterValues = { //coordinates: coordinates, //Füg den Wert in die URL ein - coordinatesSouthWest: coordinatesSouthWest, - coordinatesNorthEast: coordinatesNorthEast, + s: parseFloat((coordinatesSouthWest.lat).toFixed(6)), + w: coordinatesSouthWest.lng, + n: coordinatesNorthEast.lat, + e: coordinatesNorthEast.lng, singleDayTour: mapPosNegValues(singleDayTour), multipleDayTour: mapPosNegValues(multipleDayTour), summerSeason: mapPosNegValues(summerSeason), diff --git a/src/components/Map/TourMapContainer.js b/src/components/Map/TourMapContainer.js index 293921a..8f9f0e2 100644 --- a/src/components/Map/TourMapContainer.js +++ b/src/components/Map/TourMapContainer.js @@ -104,15 +104,6 @@ function TourMapContainer({ centerLat = (default_LatSW + default_LatNE) / 2; centerLng = (default_LngSW + default_LngNE) / 2; - - // storing masterMarkers list inside localStorage - useEffect(() => { - if (!isMasterMarkersSet.current && markers && markers.length > 0) { - localStorage.setItem("masterMarkers", JSON.stringify(markers)); - // console.log("L112 inside markers useEffect") - isMasterMarkersSet.current = true; // Set the flag to true to avoid future updates - } - }, [markers]); const createStartMarker = () => { return L.icon({ @@ -153,6 +144,14 @@ function TourMapContainer({ // console.log("L154 filterValuesLocal", filterValuesLocal) filter = !!filterValuesLocal ? filterValuesLocal : filter; // TODO: why is that necessary? + // storing masterMarkers list inside localStorage + useEffect(() => { + if (!isMasterMarkersSet.current && markers && markers.length > 0) { + localStorage.setItem("masterMarkers", JSON.stringify(markers)); + localStorage.setItem("visibleMarkers", JSON.stringify(markers)); + isMasterMarkersSet.current = true; // Set the flag to true to avoid future updates + } + }, [markers]); //setMapInitialized useEffect(() => { @@ -182,6 +181,10 @@ function TourMapContainer({ // useEffect(() => { // console.log("L185 mapBounds :", mapBounds) // }, [mapBounds]) + + // useEffect(() => { + // console.log("L185 visibleMarkersArray :", visibleMarkersArray) + // }, [visibleMarkersArray]) const mapChangeHandler = (bounds)=>{ @@ -198,7 +201,7 @@ const mapChangeHandler = (bounds)=>{ } let visibleMarkersObj = {}; - let visibleMarkersArray =[]; + let _visibleMarkersArray =[]; // if _masterMarkers is not empty if (!!_masterMarkers && Object.keys(_masterMarkers).length > 0) { @@ -212,19 +215,19 @@ const mapChangeHandler = (bounds)=>{ handleShowCardContainer(true); // so we can retain the card container when markers are there } // if found extract only IDs in an array - visibleMarkersArray = createIdArray(visibleMarkersObj); + _visibleMarkersArray = createIdArray(visibleMarkersObj); } const storedMarkers = JSON.parse(localStorage.getItem("visibleMarkers")) || []; - const check = checkMarkersChanges(visibleMarkersArray, storedMarkers); + const check = checkMarkersChanges(_visibleMarkersArray, storedMarkers); - console.log("L294 check : ", check) - console.log("===================") - console.log("L163 visibleMarkersArray : ", visibleMarkersArray) - console.log("==================="); + // console.log("L294 check : ", check) + // console.log("===================") + // console.log("L163 _visibleMarkersArray : ", _visibleMarkersArray) + // console.log("==================="); - if (!!check && !!visibleMarkersObj && !!visibleMarkersArray) { - localStorage.setItem("visibleMarkers", JSON.stringify(visibleMarkersArray)); + if (!!check && !!visibleMarkersObj && !!_visibleMarkersArray) { + localStorage.setItem("visibleMarkers", JSON.stringify(_visibleMarkersArray)); handleChangedMarkers(true); // *** handle the Boolean flag in Main /make new call in card container let newBounds = getMarkersBounds(visibleMarkersObj) @@ -250,7 +253,6 @@ const mapChangeHandler = (bounds)=>{ } }); // console.log("L252 _bounds ", _bounds) - return _bounds; }else return null }; @@ -282,15 +284,16 @@ const mapChangeHandler = (bounds)=>{ ); localStorage.setItem( "MapPositionLngNE", - position?._northEast?.lng || default_LngNE + parseFloat((position?._northEast?.lng).toFixed(6)) || default_LngNE ); + localStorage.setItem( "MapPositionLatSW", - position?._southWest?.lat || default_LatSW + parseFloat((position?._southWest?.lat).toFixed(6)) || default_LatSW ); localStorage.setItem( "MapPositionLngSW", - position?._southWest?.lng || default_LngSW + parseFloat((position?._southWest?.lng).toFixed(6)) || default_LngSW ); }; @@ -427,7 +430,7 @@ const mapChangeHandler = (bounds)=>{ let _bounds = map.getBounds(); // console.log("L443 mapLoaded", mapLoaded) // console.log("L444 markers.length", markers.length) - if (markers && markers.length > 0 && mapLoaded) { + if (markers && markers.length > 0 && mapLoaded) { // replace markers with visibleMarkers _bounds = getMarkersBounds(markers); // console.log("L446 _bounds", _bounds) } @@ -469,12 +472,13 @@ const mapChangeHandler = (bounds)=>{ //Method to load the parameters and the filter call: const initiateFilter = (bounds) => { mapChangeHandler(bounds) - // handleMapBounds(bounds); const searchTerm = !!searchParams.get('search') ? searchParams.get('search') : null; const filterValues = { //All Values in the URL - coordinatesSouthWest: bounds?._southWest, - coordinatesNorthEast: bounds?._northEast, + s: parseFloat((bounds?._southWest.lat).toFixed(6)), + w: parseFloat((bounds?._southWest.lng).toFixed(6)), + n: parseFloat((bounds?._northEast.lat).toFixed(6)), + e: parseFloat((bounds?._northEast.lng).toFixed(6)), singleDayTour: filter.singleDayTour, multipleDayTour: filter.multipleDayTour, summerSeason: filter.summerSeason, @@ -497,10 +501,11 @@ const mapChangeHandler = (bounds)=>{ if (filterValues == null) { searchParams.delete("filter"); setSearchParams(searchParams); + // localStorage.removeItem("filterValues") } else { - //pull filtervalues from localStorage and pass it to params for setting searchParams.set("filter", JSON.stringify(filterValues)); setSearchParams(searchParams); + // localStorage.setItem("filterValues", JSON.stringify(filterValues)) } //pull filtervalues from localStorage and pass it to params for setting localStorage.setItem("MapToggle", true); //The map should stay the same after rendering the page diff --git a/src/components/TourCardContainer.js b/src/components/TourCardContainer.js index 03b9d8b..9e6010f 100644 --- a/src/components/TourCardContainer.js +++ b/src/components/TourCardContainer.js @@ -95,8 +95,8 @@ export default function TourCardContainer({ page: !!pageTours ? Number(pageTours) + 1 : 2, bounds: bounds, // bounds added }).then((res) => { - let retrievedTours = res?.data?.tours ? res.data.tours : []; - console.log("L100 retrievedTours[0]", retrievedTours[0]) + // let retrievedTours = res?.data?.tours ? res.data.tours : []; + // console.log("L100 retrievedTours[0]", retrievedTours[0]) }); };