@abcagency/hc-ui-components 1.3.10 → 1.3.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useRef,
|
|
1
|
+
import React, { useRef, useEffect } from 'react';
|
|
2
2
|
import { GoogleMap, MarkerClustererF } from '@react-google-maps/api';
|
|
3
3
|
import MapMarker from './map-marker.js';
|
|
4
4
|
import PlaceMarker from './place-marker.js';
|
|
@@ -18,8 +18,9 @@ var Map = function Map(_ref) {
|
|
|
18
18
|
var _useMap = useMap(),
|
|
19
19
|
location = _useMap.location,
|
|
20
20
|
zoom = _useMap.zoom,
|
|
21
|
-
center = _useMap.center
|
|
22
|
-
|
|
21
|
+
center = _useMap.center;
|
|
22
|
+
_useMap.commuteLocation;
|
|
23
|
+
var selectLocationEntity = _useMap.selectLocationEntity,
|
|
23
24
|
setLocation = _useMap.setLocation,
|
|
24
25
|
mapInteracted = _useMap.mapInteracted,
|
|
25
26
|
setMapInteracted = _useMap.setMapInteracted;
|
|
@@ -41,71 +42,67 @@ var Map = function Map(_ref) {
|
|
|
41
42
|
setSelectedPlaceMarker = _usePlaces.setSelectedPlaceMarker,
|
|
42
43
|
placesWindow = _usePlaces.placesWindow,
|
|
43
44
|
setPlacesWindow = _usePlaces.setPlacesWindow;
|
|
44
|
-
var onIdle =
|
|
45
|
+
var onIdle = function onIdle() {
|
|
45
46
|
if (!currentCenter || !mapRef.current) return;
|
|
46
47
|
var newCenter = mapRef.current.getCenter().toJSON();
|
|
47
48
|
var newZoom = mapRef.current.zoom;
|
|
48
49
|
setCurrentCenter(newCenter);
|
|
49
|
-
if (newZoom
|
|
50
|
+
if (newZoom != currentZoom) {
|
|
50
51
|
setCurrentZoom(newZoom);
|
|
51
52
|
}
|
|
52
|
-
}
|
|
53
|
+
};
|
|
53
54
|
useEffect(function () {
|
|
54
|
-
|
|
55
|
-
if (current) {
|
|
55
|
+
if (mapContainerRef.current) {
|
|
56
56
|
var handleScroll = function handleScroll() {
|
|
57
57
|
setMapInteracted(true);
|
|
58
58
|
};
|
|
59
|
-
current
|
|
59
|
+
var mapContainerRefCurrent = mapContainerRef.current;
|
|
60
|
+
mapContainerRef.current.addEventListener('wheel', handleScroll);
|
|
60
61
|
return function () {
|
|
61
|
-
return
|
|
62
|
+
return mapContainerRefCurrent.removeEventListener('wheel', handleScroll);
|
|
62
63
|
};
|
|
63
64
|
}
|
|
64
|
-
}, [mapContainerRef
|
|
65
|
+
}, [mapContainerRef.current]);
|
|
65
66
|
useEffect(function () {
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
var dragStartListener =
|
|
67
|
+
if (mapRef.current) {
|
|
68
|
+
var mapInstance = mapRef.current;
|
|
69
|
+
var dragStartListener = mapInstance.addListener('dragstart', function () {
|
|
69
70
|
return setMapInteracted(true);
|
|
70
71
|
});
|
|
71
|
-
var mouseDownListener =
|
|
72
|
+
var mouseDownListener = mapInstance.addListener('mousedown', function () {
|
|
72
73
|
return setMapInteracted(true);
|
|
73
74
|
});
|
|
74
75
|
return function () {
|
|
75
|
-
|
|
76
|
-
|
|
76
|
+
google.maps.event.removeListener(dragStartListener);
|
|
77
|
+
google.maps.event.removeListener(mouseDownListener);
|
|
77
78
|
};
|
|
78
79
|
}
|
|
79
|
-
}, [mapRef,
|
|
80
|
+
}, [mapRef.current, mapContainerRef.current]);
|
|
80
81
|
useEffect(function () {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
fitBounds(current);
|
|
82
|
+
if ((mapItems && mapItems.length > 0 || poiMarkers.length > 0) && mapRef.current) {
|
|
83
|
+
fitBounds(mapRef.current);
|
|
84
84
|
}
|
|
85
|
-
}, [mapItems,
|
|
85
|
+
}, [mapItems, mapRef.current, location]);
|
|
86
86
|
useEffect(function () {
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
fitBounds(current, true);
|
|
87
|
+
if (mapItems && mapItems.length > 0 || poiMarkers.length > 0 && mapRef.current && mapInteracted) {
|
|
88
|
+
fitBounds(mapRef.current, true);
|
|
90
89
|
}
|
|
91
|
-
if (current) {
|
|
92
|
-
var currZoom = current.zoom;
|
|
90
|
+
if (mapRef.current) {
|
|
91
|
+
var currZoom = mapRef.current.zoom;
|
|
93
92
|
var setZoomVal = currZoom < 13 ? currZoom : 12;
|
|
94
|
-
current.setZoom(setZoomVal);
|
|
93
|
+
mapRef.current.setZoom(setZoomVal);
|
|
95
94
|
}
|
|
96
|
-
}, [filteredListings
|
|
95
|
+
}, [filteredListings]);
|
|
97
96
|
useEffect(function () {
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
if (current) {
|
|
97
|
+
if (!mapRef.current || !location || mapInteracted) return;
|
|
98
|
+
mapRef.current.panTo(new google.maps.LatLng(location.latitude, location.longitude));
|
|
99
|
+
if (mapRef.current) {
|
|
102
100
|
var setZoomVal = zoom < 13 ? zoom : 12;
|
|
103
|
-
current.setZoom(setZoomVal);
|
|
101
|
+
mapRef.current.setZoom(setZoomVal);
|
|
104
102
|
}
|
|
105
|
-
}, [location, zoom,
|
|
106
|
-
var fitBounds =
|
|
103
|
+
}, [location, zoom, mapRef.current]);
|
|
104
|
+
var fitBounds = function fitBounds(map) {
|
|
107
105
|
var overload = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
108
|
-
var current = mapRef.current;
|
|
109
106
|
if ((mapInteracted === false || overload) && mapItems != null) {
|
|
110
107
|
var bounds = new window.google.maps.LatLngBounds();
|
|
111
108
|
mapItems.forEach(function (item) {
|
|
@@ -114,25 +111,26 @@ var Map = function Map(_ref) {
|
|
|
114
111
|
if (!map) return;
|
|
115
112
|
map.fitBounds(bounds);
|
|
116
113
|
}
|
|
117
|
-
if (current
|
|
118
|
-
current.setZoom(16);
|
|
114
|
+
if (mapRef.current.zoom > 17) {
|
|
115
|
+
mapRef.current.setZoom(16);
|
|
119
116
|
}
|
|
120
|
-
}
|
|
121
|
-
var markerClickHandler =
|
|
117
|
+
};
|
|
118
|
+
var markerClickHandler = function markerClickHandler(mapLocation) {
|
|
122
119
|
setMapInteracted(true);
|
|
123
120
|
selectLocationEntity(mapLocation);
|
|
124
|
-
}
|
|
125
|
-
var onLoad =
|
|
126
|
-
|
|
127
|
-
|
|
121
|
+
};
|
|
122
|
+
var onLoad = function onLoad(map) {
|
|
123
|
+
if (!location || location === null) {
|
|
124
|
+
mapRef.current = map;
|
|
128
125
|
fitBounds(map, true);
|
|
129
126
|
return;
|
|
130
127
|
}
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
128
|
+
mapRef.current = map;
|
|
129
|
+
if (mapInteracted === false) {
|
|
130
|
+
mapRef.current.panTo(new google.maps.LatLng(location.latitude, location.longitude));
|
|
131
|
+
mapRef.current.setZoom(zoom);
|
|
134
132
|
}
|
|
135
|
-
}
|
|
133
|
+
};
|
|
136
134
|
var pinIconUrl = pinIcon({
|
|
137
135
|
fillColor: markerConfigs.fillColor,
|
|
138
136
|
strokeColor: markerConfigs.strokeColor
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"map.js","sources":["../../../../src/components/modules/maps/map.js"],"sourcesContent":["/* eslint-disable no-undef */\nimport React, { useEffect, useRef, useCallback } from 'react';\nimport { GoogleMap, MarkerClustererF } from \"@react-google-maps/api\";\n\nimport MapMarker from \"~/components/modules/maps/map-marker\";\nimport PlaceMarker from \"~/components/modules/maps/place-marker\";\nimport ShowAllButton from \"~/components/modules/buttons/show-all-button\";\n\nimport { usePlaces } from \"~/contexts/placesContext\";\nimport { useMap } from \"~/contexts/mapContext\";\nimport { useMapList } from \"~/contexts/mapListContext\";\n\nimport { markerIconSelected, markerIcon, pinIcon } from \"~/util/mapIconUtil\";\nimport { clusterOptions } from \"~/util/mapUtil\";\n\nconst Map = ({\n\tmarkerConfigs,\n\tinfoWindowClasses,\n\tclusterGridSize = 60\n}) => {\n\tconst {\n\t\tlocation,\n\t\tzoom,\n\t\tcenter,\n\t\tselectLocationEntity,\n\t\tsetLocation,\n\t\tmapInteracted,\n\t\tsetMapInteracted\n\t} = useMap();\n\n\tconst {\n\t\tmapItems, filteredListings, setSelectedFilters,\n\t\tsetQuery\n\t} = useMapList();\n\n\tconst mapRef = useRef();\n\tconst markerRefs = useRef({});\n\tconst mapContainerRef = useRef(null);\n\tconst {\n\t\tpoiMarkers,\n\t\tsetCurrentCenter,\n\t\tcurrentCenter,\n\t\tsetCurrentZoom,\n\t\tcurrentZoom,\n\t\tselectedPlaceMarker,\n\t\tsetSelectedPlaceMarker,\n\t\tplacesWindow,\n\t\tsetPlacesWindow\n\t} = usePlaces();\n\n\tconst onIdle = useCallback(() => {\n\t\tif (!currentCenter || !mapRef.current) return;\n\t\tconst newCenter = mapRef.current.getCenter().toJSON();\n\t\tconst newZoom = mapRef.current.zoom;\n\n\t\tsetCurrentCenter(newCenter);\n\n\t\tif (newZoom !== currentZoom) {\n\t\t\tsetCurrentZoom(newZoom);\n\t\t}\n\t}, [currentCenter, currentZoom, setCurrentCenter, setCurrentZoom]);\n\n\tuseEffect(() => {\n\t\tconst { current } = mapContainerRef;\n\t\tif (current) {\n\t\t\tconst handleScroll = () => {\n\t\t\t\tsetMapInteracted(true);\n\t\t\t};\n\t\t\tcurrent.addEventListener('wheel', handleScroll);\n\t\t\treturn () => current.removeEventListener('wheel', handleScroll);\n\t\t}\n\t}, [mapContainerRef, setMapInteracted]);\n\n\tuseEffect(() => {\n\t\tconst { current } = mapRef;\n\t\tif (current) {\n\t\t\tconst dragStartListener = current.addListener('dragstart', () => setMapInteracted(true));\n\t\t\tconst mouseDownListener = current.addListener('mousedown', () => setMapInteracted(true));\n\t\t\treturn () => {\n\t\t\t\tdragStartListener.remove();\n\t\t\t\tmouseDownListener.remove();\n\t\t\t};\n\t\t}\n\t}, [mapRef, setMapInteracted]);\n\n\tuseEffect(() => {\n\t\tconst { current } = mapRef;\n\t\tif ((mapItems && mapItems.length > 0 || poiMarkers.length > 0) && current) {\n\t\t\tfitBounds(current);\n\t\t}\n\t}, [mapItems, poiMarkers, location, fitBounds]);\n\n\tuseEffect(() => {\n\t\tconst { current } = mapRef;\n\t\tif (mapItems && mapItems.length > 0 || poiMarkers.length > 0 && current && mapInteracted) {\n\t\t\tfitBounds(current, true);\n\t\t}\n\t\tif (current) {\n\t\t\tlet currZoom = current.zoom;\n\t\t\tlet setZoomVal = currZoom < 13 ? currZoom : 12;\n\t\t\tcurrent.setZoom(setZoomVal);\n\t\t}\n\t}, [filteredListings, fitBounds, mapInteracted, mapItems, poiMarkers.length]);\n\n\tuseEffect(() => {\n\t\tconst { current } = mapRef;\n\t\tif (!current || !location || mapInteracted) return;\n\t\tcurrent.panTo(\n\t\t\tnew google.maps.LatLng(location.latitude, location.longitude)\n\t\t);\n\t\tif (current) {\n\t\t\tlet setZoomVal = zoom < 13 ? zoom : 12;\n\t\t\tcurrent.setZoom(setZoomVal);\n\t\t}\n\t}, [location, zoom, mapInteracted]);\n\n\tconst fitBounds = useCallback((map, overload = false) => {\n\t\tconst { current } = mapRef;\n\t\tif ((mapInteracted === false || overload) && mapItems != null) {\n\t\t\tconst bounds = new window.google.maps.LatLngBounds();\n\t\t\tmapItems.forEach(item => {\n\t\t\t\tbounds.extend(new google.maps.LatLng(item.latitude, item.longitude));\n\t\t\t});\n\t\t\tif (!map) return;\n\t\t\tmap.fitBounds(bounds);\n\t\t}\n\t\tif (current && current.zoom > 17) {\n\t\t\tcurrent.setZoom(16);\n\t\t}\n\t}, [mapInteracted, mapItems]);\n\n\tconst markerClickHandler = useCallback(mapLocation => {\n\t\tsetMapInteracted(true);\n\t\tselectLocationEntity(mapLocation);\n\t}, [setMapInteracted, selectLocationEntity]);\n\n\tconst onLoad = useCallback(map => {\n\t\tmapRef.current = map;\n\t\tif (!location) {\n\t\t\tfitBounds(map, true);\n\t\t\treturn;\n\t\t}\n\n\t\tif (!mapInteracted) {\n\t\t\tmap.panTo(new google.maps.LatLng(location.latitude, location.longitude));\n\t\t\tmap.setZoom(zoom);\n\t\t}\n\t}, [fitBounds, location, mapInteracted, zoom]);\n\n\tconst pinIconUrl = pinIcon({\n\t\tfillColor: markerConfigs.fillColor,\n\t\tstrokeColor: markerConfigs.strokeColor\n\t});\n\n\treturn (\n\t\t<>\n\t\t\t{zoom && center && (\n\t\t\t\t<div ref={mapContainerRef} className=\"hc-h-full hc-relative\">\n\t\t\t\t\t<GoogleMap\n\t\t\t\t\t\tzoom={zoom}\n\t\t\t\t\t\tonLoad={onLoad}\n\t\t\t\t\t\tonIdle={onIdle}\n\t\t\t\t\t\tcenter={center}\n\t\t\t\t\t\tmapContainerStyle={{\n\t\t\t\t\t\t\twidth: \"100%\",\n\t\t\t\t\t\t\theight: \"100%\"\n\t\t\t\t\t\t}}\n\t\t\t\t\t\toptions={{\n\t\t\t\t\t\t\tstyles: [\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\tfeatureType: \"poi\",\n\t\t\t\t\t\t\t\t\telementType: \"labels\",\n\t\t\t\t\t\t\t\t\tstylers: [{ visibility: \"off\" }]\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t]\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<MarkerClustererF options={clusterOptions(clusterGridSize, markerConfigs.fillColor)}>\n\t\t\t\t\t\t\t{clusterer => (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t{mapItems.map(item => (\n\t\t\t\t\t\t\t\t\t\t<MapMarker\n\t\t\t\t\t\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t\t\t\t\t\titem={item}\n\t\t\t\t\t\t\t\t\t\t\tselectedLocation={location}\n\t\t\t\t\t\t\t\t\t\t\tmarkerRefs={markerRefs}\n\t\t\t\t\t\t\t\t\t\t\tinfoWindowClasses={infoWindowClasses}\n\t\t\t\t\t\t\t\t\t\t\tsetSelectedLocation={setLocation}\n\t\t\t\t\t\t\t\t\t\t\tmarkerClickHandler={markerClickHandler}\n\t\t\t\t\t\t\t\t\t\t\tclusterer={clusterer}\n\t\t\t\t\t\t\t\t\t\t\tmarkerIcon={markerIcon(markerConfigs)}\n\t\t\t\t\t\t\t\t\t\t\tmarkerIconSelected={markerIconSelected(markerConfigs)}\n\t\t\t\t\t\t\t\t\t\t\tsetMapInteracted={setMapInteracted}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t\t{poiMarkers && poiMarkers.markers.map((marker, index) => (\n\t\t\t\t\t\t\t\t\t\t<PlaceMarker\n\t\t\t\t\t\t\t\t\t\t\tkey={`marker-${marker.title}-${index}`}\n\t\t\t\t\t\t\t\t\t\t\tmarker={marker}\n\t\t\t\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\t\t\t\tselectedPlaceMarker={selectedPlaceMarker}\n\t\t\t\t\t\t\t\t\t\t\tplacesWindow={placesWindow}\n\t\t\t\t\t\t\t\t\t\t\tsetPlacesWindow={setPlacesWindow}\n\t\t\t\t\t\t\t\t\t\t\tsetSelectedPlaceMarker={setSelectedPlaceMarker}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</MarkerClustererF>\n\t\t\t\t\t</GoogleMap>\n\t\t\t\t\t{mapInteracted && markerConfigs && (\n\t\t\t\t\t\t<ShowAllButton\n\t\t\t\t\t\t\tmapInteracted={mapInteracted}\n\t\t\t\t\t\t\tmarkerConfigs={markerConfigs}\n\t\t\t\t\t\t\tsetMapInteracted={setMapInteracted}\n\t\t\t\t\t\t\tfitBounds={fitBounds}\n\t\t\t\t\t\t\tmapRef={mapRef}\n\t\t\t\t\t\t\tpinIconUrl={pinIconUrl}\n\t\t\t\t\t\t\tsetQuery={setQuery}\n\t\t\t\t\t\t\tlistingCount={filteredListings.length}\n\t\t\t\t\t\t\tsetSelectedFilters={setSelectedFilters}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</>\n\t);\n};\n\nexport default Map;\n"],"names":["Map","_ref","markerConfigs","infoWindowClasses","_ref$clusterGridSize","clusterGridSize","_useMap","useMap","location","zoom","center","selectLocationEntity","setLocation","mapInteracted","setMapInteracted","_useMapList","useMapList","mapItems","filteredListings","setSelectedFilters","setQuery","mapRef","useRef","markerRefs","mapContainerRef","_usePlaces","usePlaces","poiMarkers","setCurrentCenter","currentCenter","setCurrentZoom","currentZoom","selectedPlaceMarker","setSelectedPlaceMarker","placesWindow","setPlacesWindow","onIdle","useCallback","current","newCenter","getCenter","toJSON","newZoom","useEffect","handleScroll","addEventListener","removeEventListener","dragStartListener","addListener","mouseDownListener","remove","length","fitBounds","currZoom","setZoomVal","setZoom","panTo","google","maps","LatLng","latitude","longitude","map","overload","arguments","undefined","bounds","window","LatLngBounds","forEach","item","extend","markerClickHandler","mapLocation","onLoad","pinIconUrl","pinIcon","fillColor","strokeColor","React","createElement","Fragment","ref","className","GoogleMap","mapContainerStyle","width","height","options","styles","featureType","elementType","stylers","visibility","MarkerClustererF","clusterOptions","clusterer","MapMarker","key","id","selectedLocation","setSelectedLocation","markerIcon","markerIconSelected","markers","marker","index","PlaceMarker","concat","title","ShowAllButton","listingCount"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"map.js","sources":["../../../../src/components/modules/maps/map.js"],"sourcesContent":["/* eslint-disable no-undef */\nimport React, { useEffect, useRef } from 'react';\nimport { GoogleMap, MarkerClustererF } from \"@react-google-maps/api\";\n\nimport MapMarker from \"~/components/modules/maps/map-marker\";\nimport PlaceMarker from \"~/components/modules/maps/place-marker\";\nimport ShowAllButton from \"~/components/modules/buttons/show-all-button\";\n\nimport { usePlaces } from \"~/contexts/placesContext\";\nimport { useMap } from \"~/contexts/mapContext\";\nimport { useMapList } from \"~/contexts/mapListContext\";\n\nimport { markerIconSelected, markerIcon, pinIcon } from \"~/util/mapIconUtil\";\nimport { clusterOptions } from \"~/util/mapUtil\";\n\nconst Map = ({\n\tmarkerConfigs,\n\tinfoWindowClasses,\n\tclusterGridSize = 60\n}) => {\n\tconst {\n\t\tlocation,\n\t\tzoom,\n\t\tcenter,\n\t\tcommuteLocation,\n\t\tselectLocationEntity,\n\t\tsetLocation,\n\t\tmapInteracted,\n\t\tsetMapInteracted\n\t} = useMap();\n\n\tconst {\n\t\tmapItems, filteredListings, setSelectedFilters,\n\t\tsetQuery\n\t} = useMapList();\n\n\tconst mapRef = useRef();\n\tconst markerRefs = useRef({});\n\tconst mapContainerRef = useRef(null);\n\tconst {\n\t\tpoiMarkers,\n\t\tsetCurrentCenter,\n\t\tcurrentCenter,\n\t\tsetCurrentZoom,\n\t\tcurrentZoom,\n\t\tselectedPlaceMarker,\n\t\tsetSelectedPlaceMarker,\n\t\tplacesWindow,\n\t\tsetPlacesWindow } = usePlaces();\n\n\tconst onIdle = () => {\n\t\tif (!currentCenter || !mapRef.current) return;\n\t\tconst newCenter = mapRef.current.getCenter().toJSON();\n\t\tconst newZoom = mapRef.current.zoom;\n\n\t\tsetCurrentCenter(newCenter);\n\n\t\tif (newZoom != currentZoom) {\n\t\t\tsetCurrentZoom(newZoom);\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tif (mapContainerRef.current) {\n\t\t\tconst handleScroll = () => {\n\t\t\t\tsetMapInteracted(true);\n\t\t\t};\n\t\t\tvar mapContainerRefCurrent = mapContainerRef.current;\n\t\t\tmapContainerRef.current.addEventListener('wheel', handleScroll);\n\t\t\treturn () => mapContainerRefCurrent.removeEventListener('wheel', handleScroll);\n\t\t}\n\t}, [mapContainerRef.current]);\n\n\tuseEffect(() => {\n\t\tif (mapRef.current) {\n\t\t\tconst mapInstance = mapRef.current;\n\t\t\tconst dragStartListener = mapInstance.addListener('dragstart', () => setMapInteracted(true));\n\t\t\tconst mouseDownListener = mapInstance.addListener('mousedown', () => setMapInteracted(true));\n\t\t\treturn () => {\n\t\t\t\tgoogle.maps.event.removeListener(dragStartListener);\n\t\t\t\tgoogle.maps.event.removeListener(mouseDownListener);\n\t\t\t};\n\t\t}\n\t}, [mapRef.current, mapContainerRef.current]);\n\n\tuseEffect(() => {\n\t\tif ((mapItems && mapItems.length > 0 || poiMarkers.length > 0) && mapRef.current) {\n\t\t\tfitBounds(mapRef.current);\n\t\t}\n\t}, [mapItems, mapRef.current, location]);\n\n\tuseEffect(() => {\n\t\tif (mapItems && mapItems.length > 0 || poiMarkers.length > 0 && mapRef.current && mapInteracted) {\n\t\t\tfitBounds(mapRef.current, true);\n\t\t}\n\t\tif (mapRef.current) {\n\t\t\tlet currZoom = mapRef.current.zoom;\n\t\t\tlet setZoomVal = currZoom < 13 ? currZoom : 12;\n\t\t\tmapRef.current.setZoom(setZoomVal);\n\t\t}\n\t}, [filteredListings]);\n\n\tuseEffect(() => {\n\t\tif (!mapRef.current || !location || mapInteracted) return;\n\t\tmapRef.current.panTo(\n\t\t\tnew google.maps.LatLng(location.latitude, location.longitude)\n\t\t);\n\t\tif (mapRef.current) {\n\t\t\tlet setZoomVal = zoom < 13 ? zoom : 12;\n\t\t\tmapRef.current.setZoom(setZoomVal);\n\t\t}\n\t}, [location, zoom, mapRef.current]);\n\n\tconst fitBounds = (map, overload = false) => {\n\t\tif ((mapInteracted === false || overload) && mapItems != null) {\n\t\t\tconst bounds = new window.google.maps.LatLngBounds();\n\t\t\tmapItems.forEach(item => {\n\t\t\t\tbounds.extend(new google.maps.LatLng(item.latitude, item.longitude));\n\t\t\t});\n\t\t\tif (!map) return;\n\t\t\tmap.fitBounds(bounds);\n\t\t}\n\t\tif (mapRef.current.zoom > 17) {\n\t\t\tmapRef.current.setZoom(16);\n\t\t}\n\t};\n\n\tconst markerClickHandler = mapLocation => {\n\t\tsetMapInteracted(true);\n\t\tselectLocationEntity(mapLocation);\n\t};\n\n\tconst onLoad = map => {\n\t\tif (!location || location === null) {\n\t\t\tmapRef.current = map;\n\t\t\tfitBounds(map, true);\n\t\t\treturn;\n\t\t}\n\t\tmapRef.current = map;\n\n\t\tif (mapInteracted === false) {\n\t\t\tmapRef.current.panTo(\n\t\t\t\tnew google.maps.LatLng(location.latitude, location.longitude)\n\t\t\t);\n\n\t\t\tmapRef.current.setZoom(zoom);\n\t\t}\n\t};\n\n\tconst pinIconUrl = pinIcon({\n\t\tfillColor: markerConfigs.fillColor,\n\t\tstrokeColor: markerConfigs.strokeColor\n\t});\n\n\treturn (\n\t\t<>{zoom && center && <div ref={mapContainerRef} className=\"hc-h-full hc-relative\">\n\t\t\t<GoogleMap\n\t\t\t\tzoom={zoom}\n\t\t\t\tonLoad={onLoad}\n\t\t\t\tonIdle={onIdle}\n\t\t\t\tcenter={center}\n\t\t\t\tmapContainerStyle={{\n\t\t\t\t\twidth: \"100%\",\n\t\t\t\t\theight: \"100%\"\n\t\t\t\t}}\n\t\t\t\toptions={{\n\t\t\t\t\tstyles: [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tfeatureType: \"poi\",\n\t\t\t\t\t\t\telementType: \"labels\",\n\t\t\t\t\t\t\tstylers: [{ visibility: \"off\" }]\n\t\t\t\t\t\t}\n\t\t\t\t\t]\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<MarkerClustererF options={clusterOptions(clusterGridSize, markerConfigs.fillColor)}>\n\t\t\t\t\t{clusterer => (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{mapItems.map(item => (\n\t\t\t\t\t\t\t\t<MapMarker\n\t\t\t\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t\t\t\titem={item}\n\t\t\t\t\t\t\t\t\tselectedLocation={location}\n\t\t\t\t\t\t\t\t\tmarkerRefs={markerRefs}\n\t\t\t\t\t\t\t\t\tinfoWindowClasses={infoWindowClasses}\n\t\t\t\t\t\t\t\t\tsetSelectedLocation={setLocation}\n\t\t\t\t\t\t\t\t\tmarkerClickHandler={markerClickHandler}\n\t\t\t\t\t\t\t\t\tclusterer={clusterer}\n\t\t\t\t\t\t\t\t\tmarkerIcon={markerIcon(markerConfigs)}\n\t\t\t\t\t\t\t\t\tmarkerIconSelected={markerIconSelected(markerConfigs)}\n\t\t\t\t\t\t\t\t\tsetMapInteracted={setMapInteracted}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t{poiMarkers && poiMarkers.markers.map((marker, index) => {\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<PlaceMarker\n\t\t\t\t\t\t\t\t\t\tkey={`marker-${marker.title}-${index}`}\n\t\t\t\t\t\t\t\t\t\tmarker={marker}\n\t\t\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\t\t\tselectedPlaceMarker={selectedPlaceMarker}\n\t\t\t\t\t\t\t\t\t\tplacesWindow={placesWindow}\n\t\t\t\t\t\t\t\t\t\tsetPlacesWindow={setPlacesWindow}\n\t\t\t\t\t\t\t\t\t\tsetSelectedPlaceMarker={setSelectedPlaceMarker}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</>\n\t\t\t\t\t)}\n\t\t\t\t</MarkerClustererF>\n\t\t\t</GoogleMap>\n\t\t\t{mapInteracted && markerConfigs && (\n\t\t\t\t<ShowAllButton\n\t\t\t\t\tmapInteracted={mapInteracted}\n\t\t\t\t\tmarkerConfigs={markerConfigs}\n\t\t\t\t\tsetMapInteracted={setMapInteracted}\n\t\t\t\t\tfitBounds={fitBounds}\n\t\t\t\t\tmapRef={mapRef}\n\t\t\t\t\tpinIconUrl={pinIconUrl}\n\t\t\t\t\tsetQuery={setQuery}\n\t\t\t\t\tlistingCount={filteredListings.length}\n\t\t\t\t\tsetSelectedFilters={setSelectedFilters}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</div>\n\t\t}\n\t\t</>\n\t);\n};\n\nexport default Map;\n"],"names":["Map","_ref","markerConfigs","infoWindowClasses","_ref$clusterGridSize","clusterGridSize","_useMap","useMap","location","zoom","center","commuteLocation","selectLocationEntity","setLocation","mapInteracted","setMapInteracted","_useMapList","useMapList","mapItems","filteredListings","setSelectedFilters","setQuery","mapRef","useRef","markerRefs","mapContainerRef","_usePlaces","usePlaces","poiMarkers","setCurrentCenter","currentCenter","setCurrentZoom","currentZoom","selectedPlaceMarker","setSelectedPlaceMarker","placesWindow","setPlacesWindow","onIdle","current","newCenter","getCenter","toJSON","newZoom","useEffect","handleScroll","mapContainerRefCurrent","addEventListener","removeEventListener","mapInstance","dragStartListener","addListener","mouseDownListener","google","maps","event","removeListener","length","fitBounds","currZoom","setZoomVal","setZoom","panTo","LatLng","latitude","longitude","map","overload","arguments","undefined","bounds","window","LatLngBounds","forEach","item","extend","markerClickHandler","mapLocation","onLoad","pinIconUrl","pinIcon","fillColor","strokeColor","React","createElement","Fragment","ref","className","GoogleMap","mapContainerStyle","width","height","options","styles","featureType","elementType","stylers","visibility","MarkerClustererF","clusterOptions","clusterer","MapMarker","key","id","selectedLocation","setSelectedLocation","markerIcon","markerIconSelected","markers","marker","index","PlaceMarker","concat","title","ShowAllButton","listingCount"],"mappings":"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"}
|
package/dist/hooks/useList.js
CHANGED
|
@@ -69,7 +69,7 @@ var useListLogic = function useListLogic() {
|
|
|
69
69
|
scrollContainerRef.current.scrollTop = parseInt(savedScrollPosition, 10);
|
|
70
70
|
}, 300);
|
|
71
71
|
}
|
|
72
|
-
}, [
|
|
72
|
+
}, []);
|
|
73
73
|
useEffect(function () {
|
|
74
74
|
var current = scrollContainerRef.current;
|
|
75
75
|
if (current) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useList.js","sources":["../../src/hooks/useList.js"],"sourcesContent":["import { useEffect, useState, useRef } from 'react';\n\nimport { getStorageObject } from '~/util/localStorageUtil';\nimport { dynamicSort } from '~/util/sortUtil';\n\nimport { useMapList } from '~/contexts/mapListContext';\n\nconst getDefaultItemId = () => {\n\tlet item = getStorageObject(\"selectedListItem\");\n\tif (item?.expanded == true) {\n\t\treturn item.id;\n\t} else {\n\t\treturn null;\n\t}\n};\n\nconst useListLogic = () => {\n\tconst [itemLimit, setItemLimit] = useState(100);\n\tconst [expandedId] = useState(getDefaultItemId());\n\tconst [sortSetting, setSortSetting] = useState(getStorageObject('sortSetting', null));\n\tconst [scrollPosition, setScrollPosition] = useState(getStorageObject('scrollPosition', 0));\n\tconst loader = useRef(null);\n\tconst scrollContainerRef = useRef(null);\n\tconst itemRefs = useRef({});\n\tconst observer = useRef(null);\n\tconst { filteredListings, setFilteredListings } = useMapList();\n\n\tuseEffect(() => {\n\t\tif (!sortSetting) return;\n\t\tlocalStorage.setItem('sortSetting', JSON.stringify(sortSetting));\n\t\tlet listingFiltered = dynamicSort(filteredListings, sortSetting.field, sortSetting.type);\n\t\tsetFilteredListings(listingFiltered);\n\t}, [sortSetting, filteredListings, setFilteredListings]);\n\n\tuseEffect(() => {\n\t\tobserver.current = new IntersectionObserver(handleObserver, {\n\t\t\troot: scrollContainerRef.current,\n\t\t\trootMargin: \"100px 0px\",\n\t\t\tthreshold: 0.5\n\t\t});\n\t\tconst { current } = loader;\n\t\tif (current) {\n\t\t\tobserver.current.observe(current);\n\t\t}\n\t\treturn () => {\n\t\t\tif (observer.current && current) {\n\t\t\t\tobserver.current.unobserve(current);\n\t\t\t}\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [filteredListings.length, itemLimit]);\n\n\tuseEffect(() => {\n\t\tlocalStorage.setItem('scrollPosition', scrollPosition.toString());\n\t\tconst savedScrollPosition = scrollPosition;\n\t\tif (parseInt(savedScrollPosition) > 3000) {\n\t\t\tsetItemLimit(savedScrollPosition / 10);\n\t\t}\n\t\tif (savedScrollPosition && scrollContainerRef.current) {\n\t\t\tsetTimeout(() => {\n\t\t\t\tscrollContainerRef.current.scrollTop = parseInt(savedScrollPosition, 10);\n\t\t\t}, 300);\n\t\t}\n\t}, [
|
|
1
|
+
{"version":3,"file":"useList.js","sources":["../../src/hooks/useList.js"],"sourcesContent":["import { useEffect, useState, useRef } from 'react';\n\nimport { getStorageObject } from '~/util/localStorageUtil';\nimport { dynamicSort } from '~/util/sortUtil';\n\nimport { useMapList } from '~/contexts/mapListContext';\n\nconst getDefaultItemId = () => {\n\tlet item = getStorageObject(\"selectedListItem\");\n\tif (item?.expanded == true) {\n\t\treturn item.id;\n\t} else {\n\t\treturn null;\n\t}\n};\n\nconst useListLogic = () => {\n\tconst [itemLimit, setItemLimit] = useState(100);\n\tconst [expandedId] = useState(getDefaultItemId());\n\tconst [sortSetting, setSortSetting] = useState(getStorageObject('sortSetting', null));\n\tconst [scrollPosition, setScrollPosition] = useState(getStorageObject('scrollPosition', 0));\n\tconst loader = useRef(null);\n\tconst scrollContainerRef = useRef(null);\n\tconst itemRefs = useRef({});\n\tconst observer = useRef(null);\n\tconst { filteredListings, setFilteredListings } = useMapList();\n\n\tuseEffect(() => {\n\t\tif (!sortSetting) return;\n\t\tlocalStorage.setItem('sortSetting', JSON.stringify(sortSetting));\n\t\tlet listingFiltered = dynamicSort(filteredListings, sortSetting.field, sortSetting.type);\n\t\tsetFilteredListings(listingFiltered);\n\t}, [sortSetting, filteredListings, setFilteredListings]);\n\n\tuseEffect(() => {\n\t\tobserver.current = new IntersectionObserver(handleObserver, {\n\t\t\troot: scrollContainerRef.current,\n\t\t\trootMargin: \"100px 0px\",\n\t\t\tthreshold: 0.5\n\t\t});\n\t\tconst { current } = loader;\n\t\tif (current) {\n\t\t\tobserver.current.observe(current);\n\t\t}\n\t\treturn () => {\n\t\t\tif (observer.current && current) {\n\t\t\t\tobserver.current.unobserve(current);\n\t\t\t}\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [filteredListings.length, itemLimit]);\n\n\tuseEffect(() => {\n\t\tlocalStorage.setItem('scrollPosition', scrollPosition.toString());\n\t\tconst savedScrollPosition = scrollPosition;\n\t\tif (parseInt(savedScrollPosition) > 3000) {\n\t\t\tsetItemLimit(savedScrollPosition / 10);\n\t\t}\n\t\tif (savedScrollPosition && scrollContainerRef.current) {\n\t\t\tsetTimeout(() => {\n\t\t\t\tscrollContainerRef.current.scrollTop = parseInt(savedScrollPosition, 10);\n\t\t\t}, 300);\n\t\t}\n\t}, []);\n\n\tuseEffect(() => {\n\t\tconst { current } = scrollContainerRef;\n\t\tif (current) {\n\t\t\tcurrent.addEventListener('scroll', handleScroll);\n\t\t}\n\t\treturn () => {\n\t\t\tif (current) {\n\t\t\t\tcurrent.removeEventListener('scroll', handleScroll);\n\t\t\t}\n\t\t};\n\t}, []);\n\n\tconst handleObserver = entities => {\n\t\tconst target = entities[0];\n\t\tif (!target.isIntersecting) return;\n\t\tif (filteredListings.length > itemLimit) {\n\t\t\tsetItemLimit(prevLimit => prevLimit + 100);\n\t\t} else if (observer.current) {\n\t\t\tobserver.current.disconnect();\n\t\t}\n\t};\n\n\tconst handleScroll = () => {\n\t\tif (scrollContainerRef.current) {\n\t\t\tsetScrollPosition(scrollContainerRef.current.scrollTop);\n\t\t}\n\t};\n\n\treturn { itemLimit, expandedId, sortSetting, scrollPosition, loader, scrollContainerRef, itemRefs, setSortSetting, setScrollPosition, dynamicSort, filteredListings };\n};\n\nexport default useListLogic;\n"],"names":["getDefaultItemId","item","getStorageObject","expanded","id","useListLogic","_useState","useState","_useState2","_slicedToArray","itemLimit","setItemLimit","_useState3","_useState4","expandedId","_useState5","_useState6","sortSetting","setSortSetting","_useState7","_useState8","scrollPosition","setScrollPosition","loader","useRef","scrollContainerRef","itemRefs","observer","_useMapList","useMapList","filteredListings","setFilteredListings","useEffect","localStorage","setItem","JSON","stringify","listingFiltered","dynamicSort","field","type","current","IntersectionObserver","handleObserver","root","rootMargin","threshold","observe","unobserve","length","toString","savedScrollPosition","parseInt","setTimeout","scrollTop","addEventListener","handleScroll","removeEventListener","entities","target","isIntersecting","prevLimit","disconnect"],"mappings":";;;;;;AAOA,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgBA,GAAS;AAC9B,EAAA,IAAIC,IAAI,GAAGC,gBAAgB,CAAC,kBAAkB,CAAC,CAAA;EAC/C,IAAI,CAAAD,IAAI,KAAA,IAAA,IAAJA,IAAI,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAJA,IAAI,CAAEE,QAAQ,KAAI,IAAI,EAAE;IAC3B,OAAOF,IAAI,CAACG,EAAE,CAAA;AACf,GAAC,MAAM;AACN,IAAA,OAAO,IAAI,CAAA;AACZ,GAAA;AACD,CAAC,CAAA;AAED,IAAMC,YAAY,GAAG,SAAfA,YAAYA,GAAS;AAC1B,EAAA,IAAAC,SAAA,GAAkCC,QAAQ,CAAC,GAAG,CAAC;IAAAC,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAAxCI,IAAAA,SAAS,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,YAAY,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;AAC9B,EAAA,IAAAI,UAAA,GAAqBL,QAAQ,CAACP,gBAAgB,EAAE,CAAC;IAAAa,UAAA,GAAAJ,cAAA,CAAAG,UAAA,EAAA,CAAA,CAAA;AAA1CE,IAAAA,UAAU,GAAAD,UAAA,CAAA,CAAA,CAAA,CAAA;EACjB,IAAAE,UAAA,GAAsCR,QAAQ,CAACL,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;IAAAc,UAAA,GAAAP,cAAA,CAAAM,UAAA,EAAA,CAAA,CAAA;AAA9EE,IAAAA,WAAW,GAAAD,UAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,cAAc,GAAAF,UAAA,CAAA,CAAA,CAAA,CAAA;EAClC,IAAAG,UAAA,GAA4CZ,QAAQ,CAACL,gBAAgB,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC;IAAAkB,UAAA,GAAAX,cAAA,CAAAU,UAAA,EAAA,CAAA,CAAA;AAApFE,IAAAA,cAAc,GAAAD,UAAA,CAAA,CAAA,CAAA;AAAEE,IAAAA,iBAAiB,GAAAF,UAAA,CAAA,CAAA,CAAA,CAAA;AACxC,EAAA,IAAMG,MAAM,GAAGC,MAAM,CAAC,IAAI,CAAC,CAAA;AAC3B,EAAA,IAAMC,kBAAkB,GAAGD,MAAM,CAAC,IAAI,CAAC,CAAA;AACvC,EAAA,IAAME,QAAQ,GAAGF,MAAM,CAAC,EAAE,CAAC,CAAA;AAC3B,EAAA,IAAMG,QAAQ,GAAGH,MAAM,CAAC,IAAI,CAAC,CAAA;AAC7B,EAAA,IAAAI,WAAA,GAAkDC,UAAU,EAAE;IAAtDC,gBAAgB,GAAAF,WAAA,CAAhBE,gBAAgB;IAAEC,mBAAmB,GAAAH,WAAA,CAAnBG,mBAAmB,CAAA;AAE7CC,EAAAA,SAAS,CAAC,YAAM;IACf,IAAI,CAACf,WAAW,EAAE,OAAA;IAClBgB,YAAY,CAACC,OAAO,CAAC,aAAa,EAAEC,IAAI,CAACC,SAAS,CAACnB,WAAW,CAAC,CAAC,CAAA;AAChE,IAAA,IAAIoB,eAAe,GAAGC,WAAW,CAACR,gBAAgB,EAAEb,WAAW,CAACsB,KAAK,EAAEtB,WAAW,CAACuB,IAAI,CAAC,CAAA;IACxFT,mBAAmB,CAACM,eAAe,CAAC,CAAA;GACpC,EAAE,CAACpB,WAAW,EAAEa,gBAAgB,EAAEC,mBAAmB,CAAC,CAAC,CAAA;AAExDC,EAAAA,SAAS,CAAC,YAAM;AACfL,IAAAA,QAAQ,CAACc,OAAO,GAAG,IAAIC,oBAAoB,CAACC,cAAc,EAAE;MAC3DC,IAAI,EAAEnB,kBAAkB,CAACgB,OAAO;AAChCI,MAAAA,UAAU,EAAE,WAAW;AACvBC,MAAAA,SAAS,EAAE,GAAA;AACZ,KAAC,CAAC,CAAA;AACF,IAAA,IAAQL,OAAO,GAAKlB,MAAM,CAAlBkB,OAAO,CAAA;AACf,IAAA,IAAIA,OAAO,EAAE;AACZd,MAAAA,QAAQ,CAACc,OAAO,CAACM,OAAO,CAACN,OAAO,CAAC,CAAA;AAClC,KAAA;AACA,IAAA,OAAO,YAAM;AACZ,MAAA,IAAId,QAAQ,CAACc,OAAO,IAAIA,OAAO,EAAE;AAChCd,QAAAA,QAAQ,CAACc,OAAO,CAACO,SAAS,CAACP,OAAO,CAAC,CAAA;AACpC,OAAA;KACA,CAAA;AACD;GACA,EAAE,CAACX,gBAAgB,CAACmB,MAAM,EAAEvC,SAAS,CAAC,CAAC,CAAA;AAExCsB,EAAAA,SAAS,CAAC,YAAM;IACfC,YAAY,CAACC,OAAO,CAAC,gBAAgB,EAAEb,cAAc,CAAC6B,QAAQ,EAAE,CAAC,CAAA;IACjE,IAAMC,mBAAmB,GAAG9B,cAAc,CAAA;AAC1C,IAAA,IAAI+B,QAAQ,CAACD,mBAAmB,CAAC,GAAG,IAAI,EAAE;AACzCxC,MAAAA,YAAY,CAACwC,mBAAmB,GAAG,EAAE,CAAC,CAAA;AACvC,KAAA;AACA,IAAA,IAAIA,mBAAmB,IAAI1B,kBAAkB,CAACgB,OAAO,EAAE;AACtDY,MAAAA,UAAU,CAAC,YAAM;QAChB5B,kBAAkB,CAACgB,OAAO,CAACa,SAAS,GAAGF,QAAQ,CAACD,mBAAmB,EAAE,EAAE,CAAC,CAAA;OACxE,EAAE,GAAG,CAAC,CAAA;AACR,KAAA;GACA,EAAE,EAAE,CAAC,CAAA;AAENnB,EAAAA,SAAS,CAAC,YAAM;AACf,IAAA,IAAQS,OAAO,GAAKhB,kBAAkB,CAA9BgB,OAAO,CAAA;AACf,IAAA,IAAIA,OAAO,EAAE;AACZA,MAAAA,OAAO,CAACc,gBAAgB,CAAC,QAAQ,EAAEC,YAAY,CAAC,CAAA;AACjD,KAAA;AACA,IAAA,OAAO,YAAM;AACZ,MAAA,IAAIf,OAAO,EAAE;AACZA,QAAAA,OAAO,CAACgB,mBAAmB,CAAC,QAAQ,EAAED,YAAY,CAAC,CAAA;AACpD,OAAA;KACA,CAAA;GACD,EAAE,EAAE,CAAC,CAAA;AAEN,EAAA,IAAMb,cAAc,GAAG,SAAjBA,cAAcA,CAAGe,QAAQ,EAAI;AAClC,IAAA,IAAMC,MAAM,GAAGD,QAAQ,CAAC,CAAC,CAAC,CAAA;AAC1B,IAAA,IAAI,CAACC,MAAM,CAACC,cAAc,EAAE,OAAA;AAC5B,IAAA,IAAI9B,gBAAgB,CAACmB,MAAM,GAAGvC,SAAS,EAAE;MACxCC,YAAY,CAAC,UAAAkD,SAAS,EAAA;QAAA,OAAIA,SAAS,GAAG,GAAG,CAAA;OAAC,CAAA,CAAA;AAC3C,KAAC,MAAM,IAAIlC,QAAQ,CAACc,OAAO,EAAE;AAC5Bd,MAAAA,QAAQ,CAACc,OAAO,CAACqB,UAAU,EAAE,CAAA;AAC9B,KAAA;GACA,CAAA;AAED,EAAA,IAAMN,YAAY,GAAG,SAAfA,YAAYA,GAAS;IAC1B,IAAI/B,kBAAkB,CAACgB,OAAO,EAAE;AAC/BnB,MAAAA,iBAAiB,CAACG,kBAAkB,CAACgB,OAAO,CAACa,SAAS,CAAC,CAAA;AACxD,KAAA;GACA,CAAA;EAED,OAAO;AAAE5C,IAAAA,SAAS,EAATA,SAAS;AAAEI,IAAAA,UAAU,EAAVA,UAAU;AAAEG,IAAAA,WAAW,EAAXA,WAAW;AAAEI,IAAAA,cAAc,EAAdA,cAAc;AAAEE,IAAAA,MAAM,EAANA,MAAM;AAAEE,IAAAA,kBAAkB,EAAlBA,kBAAkB;AAAEC,IAAAA,QAAQ,EAARA,QAAQ;AAAER,IAAAA,cAAc,EAAdA,cAAc;AAAEI,IAAAA,iBAAiB,EAAjBA,iBAAiB;AAAEgB,IAAAA,WAAW,EAAXA,WAAW;AAAER,IAAAA,gBAAgB,EAAhBA,gBAAAA;GAAkB,CAAA;AACtK;;;;"}
|
package/package.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/* eslint-disable no-undef */
|
|
2
|
-
import React, { useEffect, useRef
|
|
2
|
+
import React, { useEffect, useRef } from 'react';
|
|
3
3
|
import { GoogleMap, MarkerClustererF } from "@react-google-maps/api";
|
|
4
4
|
|
|
5
5
|
import MapMarker from "~/components/modules/maps/map-marker";
|
|
@@ -22,6 +22,7 @@ const Map = ({
|
|
|
22
22
|
location,
|
|
23
23
|
zoom,
|
|
24
24
|
center,
|
|
25
|
+
commuteLocation,
|
|
25
26
|
selectLocationEntity,
|
|
26
27
|
setLocation,
|
|
27
28
|
mapInteracted,
|
|
@@ -45,77 +46,72 @@ const Map = ({
|
|
|
45
46
|
selectedPlaceMarker,
|
|
46
47
|
setSelectedPlaceMarker,
|
|
47
48
|
placesWindow,
|
|
48
|
-
setPlacesWindow
|
|
49
|
-
} = usePlaces();
|
|
49
|
+
setPlacesWindow } = usePlaces();
|
|
50
50
|
|
|
51
|
-
const onIdle =
|
|
51
|
+
const onIdle = () => {
|
|
52
52
|
if (!currentCenter || !mapRef.current) return;
|
|
53
53
|
const newCenter = mapRef.current.getCenter().toJSON();
|
|
54
54
|
const newZoom = mapRef.current.zoom;
|
|
55
55
|
|
|
56
56
|
setCurrentCenter(newCenter);
|
|
57
57
|
|
|
58
|
-
if (newZoom
|
|
58
|
+
if (newZoom != currentZoom) {
|
|
59
59
|
setCurrentZoom(newZoom);
|
|
60
60
|
}
|
|
61
|
-
}
|
|
61
|
+
};
|
|
62
62
|
|
|
63
63
|
useEffect(() => {
|
|
64
|
-
|
|
65
|
-
if (current) {
|
|
64
|
+
if (mapContainerRef.current) {
|
|
66
65
|
const handleScroll = () => {
|
|
67
66
|
setMapInteracted(true);
|
|
68
67
|
};
|
|
69
|
-
current
|
|
70
|
-
|
|
68
|
+
var mapContainerRefCurrent = mapContainerRef.current;
|
|
69
|
+
mapContainerRef.current.addEventListener('wheel', handleScroll);
|
|
70
|
+
return () => mapContainerRefCurrent.removeEventListener('wheel', handleScroll);
|
|
71
71
|
}
|
|
72
|
-
}, [mapContainerRef
|
|
72
|
+
}, [mapContainerRef.current]);
|
|
73
73
|
|
|
74
74
|
useEffect(() => {
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
const dragStartListener =
|
|
78
|
-
const mouseDownListener =
|
|
75
|
+
if (mapRef.current) {
|
|
76
|
+
const mapInstance = mapRef.current;
|
|
77
|
+
const dragStartListener = mapInstance.addListener('dragstart', () => setMapInteracted(true));
|
|
78
|
+
const mouseDownListener = mapInstance.addListener('mousedown', () => setMapInteracted(true));
|
|
79
79
|
return () => {
|
|
80
|
-
|
|
81
|
-
|
|
80
|
+
google.maps.event.removeListener(dragStartListener);
|
|
81
|
+
google.maps.event.removeListener(mouseDownListener);
|
|
82
82
|
};
|
|
83
83
|
}
|
|
84
|
-
}, [mapRef,
|
|
84
|
+
}, [mapRef.current, mapContainerRef.current]);
|
|
85
85
|
|
|
86
86
|
useEffect(() => {
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
fitBounds(current);
|
|
87
|
+
if ((mapItems && mapItems.length > 0 || poiMarkers.length > 0) && mapRef.current) {
|
|
88
|
+
fitBounds(mapRef.current);
|
|
90
89
|
}
|
|
91
|
-
}, [mapItems,
|
|
90
|
+
}, [mapItems, mapRef.current, location]);
|
|
92
91
|
|
|
93
92
|
useEffect(() => {
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
fitBounds(current, true);
|
|
93
|
+
if (mapItems && mapItems.length > 0 || poiMarkers.length > 0 && mapRef.current && mapInteracted) {
|
|
94
|
+
fitBounds(mapRef.current, true);
|
|
97
95
|
}
|
|
98
|
-
if (current) {
|
|
99
|
-
let currZoom = current.zoom;
|
|
96
|
+
if (mapRef.current) {
|
|
97
|
+
let currZoom = mapRef.current.zoom;
|
|
100
98
|
let setZoomVal = currZoom < 13 ? currZoom : 12;
|
|
101
|
-
current.setZoom(setZoomVal);
|
|
99
|
+
mapRef.current.setZoom(setZoomVal);
|
|
102
100
|
}
|
|
103
|
-
}, [filteredListings
|
|
101
|
+
}, [filteredListings]);
|
|
104
102
|
|
|
105
103
|
useEffect(() => {
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
current.panTo(
|
|
104
|
+
if (!mapRef.current || !location || mapInteracted) return;
|
|
105
|
+
mapRef.current.panTo(
|
|
109
106
|
new google.maps.LatLng(location.latitude, location.longitude)
|
|
110
107
|
);
|
|
111
|
-
if (current) {
|
|
108
|
+
if (mapRef.current) {
|
|
112
109
|
let setZoomVal = zoom < 13 ? zoom : 12;
|
|
113
|
-
current.setZoom(setZoomVal);
|
|
110
|
+
mapRef.current.setZoom(setZoomVal);
|
|
114
111
|
}
|
|
115
|
-
}, [location, zoom,
|
|
112
|
+
}, [location, zoom, mapRef.current]);
|
|
116
113
|
|
|
117
|
-
const fitBounds =
|
|
118
|
-
const { current } = mapRef;
|
|
114
|
+
const fitBounds = (map, overload = false) => {
|
|
119
115
|
if ((mapInteracted === false || overload) && mapItems != null) {
|
|
120
116
|
const bounds = new window.google.maps.LatLngBounds();
|
|
121
117
|
mapItems.forEach(item => {
|
|
@@ -124,28 +120,32 @@ const Map = ({
|
|
|
124
120
|
if (!map) return;
|
|
125
121
|
map.fitBounds(bounds);
|
|
126
122
|
}
|
|
127
|
-
if (current
|
|
128
|
-
current.setZoom(16);
|
|
123
|
+
if (mapRef.current.zoom > 17) {
|
|
124
|
+
mapRef.current.setZoom(16);
|
|
129
125
|
}
|
|
130
|
-
}
|
|
126
|
+
};
|
|
131
127
|
|
|
132
|
-
const markerClickHandler =
|
|
128
|
+
const markerClickHandler = mapLocation => {
|
|
133
129
|
setMapInteracted(true);
|
|
134
130
|
selectLocationEntity(mapLocation);
|
|
135
|
-
}
|
|
131
|
+
};
|
|
136
132
|
|
|
137
|
-
const onLoad =
|
|
138
|
-
|
|
139
|
-
|
|
133
|
+
const onLoad = map => {
|
|
134
|
+
if (!location || location === null) {
|
|
135
|
+
mapRef.current = map;
|
|
140
136
|
fitBounds(map, true);
|
|
141
137
|
return;
|
|
142
138
|
}
|
|
139
|
+
mapRef.current = map;
|
|
143
140
|
|
|
144
|
-
if (
|
|
145
|
-
|
|
146
|
-
|
|
141
|
+
if (mapInteracted === false) {
|
|
142
|
+
mapRef.current.panTo(
|
|
143
|
+
new google.maps.LatLng(location.latitude, location.longitude)
|
|
144
|
+
);
|
|
145
|
+
|
|
146
|
+
mapRef.current.setZoom(zoom);
|
|
147
147
|
}
|
|
148
|
-
}
|
|
148
|
+
};
|
|
149
149
|
|
|
150
150
|
const pinIconUrl = pinIcon({
|
|
151
151
|
fillColor: markerConfigs.fillColor,
|
|
@@ -153,76 +153,76 @@ const Map = ({
|
|
|
153
153
|
});
|
|
154
154
|
|
|
155
155
|
return (
|
|
156
|
-
<>
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
{
|
|
180
|
-
|
|
181
|
-
{
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
)}
|
|
209
|
-
</MarkerClustererF>
|
|
210
|
-
</GoogleMap>
|
|
211
|
-
{mapInteracted && markerConfigs && (
|
|
212
|
-
<ShowAllButton
|
|
213
|
-
mapInteracted={mapInteracted}
|
|
214
|
-
markerConfigs={markerConfigs}
|
|
215
|
-
setMapInteracted={setMapInteracted}
|
|
216
|
-
fitBounds={fitBounds}
|
|
217
|
-
mapRef={mapRef}
|
|
218
|
-
pinIconUrl={pinIconUrl}
|
|
219
|
-
setQuery={setQuery}
|
|
220
|
-
listingCount={filteredListings.length}
|
|
221
|
-
setSelectedFilters={setSelectedFilters}
|
|
222
|
-
/>
|
|
156
|
+
<>{zoom && center && <div ref={mapContainerRef} className="hc-h-full hc-relative">
|
|
157
|
+
<GoogleMap
|
|
158
|
+
zoom={zoom}
|
|
159
|
+
onLoad={onLoad}
|
|
160
|
+
onIdle={onIdle}
|
|
161
|
+
center={center}
|
|
162
|
+
mapContainerStyle={{
|
|
163
|
+
width: "100%",
|
|
164
|
+
height: "100%"
|
|
165
|
+
}}
|
|
166
|
+
options={{
|
|
167
|
+
styles: [
|
|
168
|
+
{
|
|
169
|
+
featureType: "poi",
|
|
170
|
+
elementType: "labels",
|
|
171
|
+
stylers: [{ visibility: "off" }]
|
|
172
|
+
}
|
|
173
|
+
]
|
|
174
|
+
}}
|
|
175
|
+
>
|
|
176
|
+
<MarkerClustererF options={clusterOptions(clusterGridSize, markerConfigs.fillColor)}>
|
|
177
|
+
{clusterer => (
|
|
178
|
+
<>
|
|
179
|
+
{mapItems.map(item => (
|
|
180
|
+
<MapMarker
|
|
181
|
+
key={item.id}
|
|
182
|
+
item={item}
|
|
183
|
+
selectedLocation={location}
|
|
184
|
+
markerRefs={markerRefs}
|
|
185
|
+
infoWindowClasses={infoWindowClasses}
|
|
186
|
+
setSelectedLocation={setLocation}
|
|
187
|
+
markerClickHandler={markerClickHandler}
|
|
188
|
+
clusterer={clusterer}
|
|
189
|
+
markerIcon={markerIcon(markerConfigs)}
|
|
190
|
+
markerIconSelected={markerIconSelected(markerConfigs)}
|
|
191
|
+
setMapInteracted={setMapInteracted}
|
|
192
|
+
/>
|
|
193
|
+
))}
|
|
194
|
+
{poiMarkers && poiMarkers.markers.map((marker, index) => {
|
|
195
|
+
return (
|
|
196
|
+
<PlaceMarker
|
|
197
|
+
key={`marker-${marker.title}-${index}`}
|
|
198
|
+
marker={marker}
|
|
199
|
+
index={index}
|
|
200
|
+
selectedPlaceMarker={selectedPlaceMarker}
|
|
201
|
+
placesWindow={placesWindow}
|
|
202
|
+
setPlacesWindow={setPlacesWindow}
|
|
203
|
+
setSelectedPlaceMarker={setSelectedPlaceMarker}
|
|
204
|
+
/>
|
|
205
|
+
);
|
|
206
|
+
})}
|
|
207
|
+
</>
|
|
223
208
|
)}
|
|
224
|
-
</
|
|
209
|
+
</MarkerClustererF>
|
|
210
|
+
</GoogleMap>
|
|
211
|
+
{mapInteracted && markerConfigs && (
|
|
212
|
+
<ShowAllButton
|
|
213
|
+
mapInteracted={mapInteracted}
|
|
214
|
+
markerConfigs={markerConfigs}
|
|
215
|
+
setMapInteracted={setMapInteracted}
|
|
216
|
+
fitBounds={fitBounds}
|
|
217
|
+
mapRef={mapRef}
|
|
218
|
+
pinIconUrl={pinIconUrl}
|
|
219
|
+
setQuery={setQuery}
|
|
220
|
+
listingCount={filteredListings.length}
|
|
221
|
+
setSelectedFilters={setSelectedFilters}
|
|
222
|
+
/>
|
|
225
223
|
)}
|
|
224
|
+
</div>
|
|
225
|
+
}
|
|
226
226
|
</>
|
|
227
227
|
);
|
|
228
228
|
};
|
package/src/hooks/useList.js
CHANGED