@geops/rvf-mobility-web-component 0.1.93 → 0.1.95
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.
- package/CHANGELOG.md +23 -0
- package/doc/package.json +1 -1
- package/index.js +207 -207
- package/package.json +21 -21
- package/src/GeolocationButton/GeolocationButton.tsx +1 -2
- package/src/GeolocationButton/index.tsx +1 -1
- package/src/LayoutState/LayoutState.tsx +22 -4
- package/src/MobilityMap/MobilityMap.tsx +6 -1
- package/src/MobilityMap/MobilityMapAttributes.ts +8 -2
- package/src/MobilityNotifications/MobilityNotifications.tsx +19 -1
- package/src/MobilityNotifications/MobilityNotificationsAttributes.ts +8 -1
- package/src/NotificationDetails/NotificationDetails.tsx +21 -8
- package/src/NotificationsLayer/NotificationsLayer.tsx +5 -1
- package/src/RvfFeatureDetails/RvfNotificationDetails/RvfNotificationDetails.tsx +8 -5
- package/src/RvfMapLayout/RvfMapLayout.tsx +1 -1
- package/src/SituationDetails/SituationDetails.tsx +19 -4
- package/src/utils/applyInitialLayerVisibility.ts +2 -20
- package/src/utils/hooks/useInitialLayersVisiblity.tsx +23 -1
- package/src/utils/hooks/useMapContext.tsx +4 -0
- package/src/utils/translations.ts +1 -1
- package/.yarnrc.yml +0 -1
- package/src/RvfGeolocationButton/GeolocationButton.tsx +0 -98
- package/src/RvfGeolocationButton/index.tsx +0 -1
|
@@ -1,98 +0,0 @@
|
|
|
1
|
-
import { Feature, Geolocation } from "ol";
|
|
2
|
-
import { Point } from "ol/geom";
|
|
3
|
-
import VectorLayer from "ol/layer/Vector";
|
|
4
|
-
import { unByKey } from "ol/Observable";
|
|
5
|
-
import { fromLonLat } from "ol/proj";
|
|
6
|
-
import VectorSource from "ol/source/Vector";
|
|
7
|
-
import { Icon, Style } from "ol/style";
|
|
8
|
-
import { memo } from "preact/compat";
|
|
9
|
-
import { useEffect, useMemo } from "preact/hooks";
|
|
10
|
-
|
|
11
|
-
import GeolocationIcon from "../icons/Geolocation";
|
|
12
|
-
import locationSvg from "../icons/Geolocation/location.svg";
|
|
13
|
-
import IconButton from "../ui/IconButton";
|
|
14
|
-
import useMapContext from "../utils/hooks/useMapContext";
|
|
15
|
-
|
|
16
|
-
import type { JSX, PreactDOMAttributes } from "preact";
|
|
17
|
-
|
|
18
|
-
const point = new Point([0, 0]);
|
|
19
|
-
const feature = new Feature(point);
|
|
20
|
-
const layer = new VectorLayer({
|
|
21
|
-
source: new VectorSource({ features: [feature] }),
|
|
22
|
-
style: new Style({
|
|
23
|
-
image: new Icon({
|
|
24
|
-
anchor: [0.5, 1],
|
|
25
|
-
src: locationSvg,
|
|
26
|
-
}),
|
|
27
|
-
}),
|
|
28
|
-
});
|
|
29
|
-
|
|
30
|
-
export type GeolocationButtonProps = JSX.HTMLAttributes<HTMLButtonElement> &
|
|
31
|
-
PreactDOMAttributes;
|
|
32
|
-
|
|
33
|
-
const TRACKING_ZOOM = 16;
|
|
34
|
-
|
|
35
|
-
function GeolocationButton({ ...props }: GeolocationButtonProps) {
|
|
36
|
-
const mapContext = useMapContext();
|
|
37
|
-
const { isTracking, map, setIsTracking } = mapContext;
|
|
38
|
-
|
|
39
|
-
const geolocation = useMemo(() => {
|
|
40
|
-
return new Geolocation();
|
|
41
|
-
}, []);
|
|
42
|
-
|
|
43
|
-
useEffect(() => {
|
|
44
|
-
let keys = [];
|
|
45
|
-
if (!map || !geolocation) {
|
|
46
|
-
return;
|
|
47
|
-
}
|
|
48
|
-
keys = [
|
|
49
|
-
// First time we zoom and center on the position
|
|
50
|
-
geolocation.once("change:position", (evt) => {
|
|
51
|
-
const position = evt.target.getPosition();
|
|
52
|
-
if (evt.target.getPosition()) {
|
|
53
|
-
const coord = fromLonLat(position, "EPSG:3857");
|
|
54
|
-
map.getView().setZoom(TRACKING_ZOOM);
|
|
55
|
-
map.getView().setCenter(coord);
|
|
56
|
-
point.setCoordinates(coord);
|
|
57
|
-
}
|
|
58
|
-
}),
|
|
59
|
-
// then we only center the map.
|
|
60
|
-
geolocation.on("change:position", (evt) => {
|
|
61
|
-
const position = evt.target.getPosition();
|
|
62
|
-
if (evt.target.getPosition()) {
|
|
63
|
-
const coord = fromLonLat(position, "EPSG:3857");
|
|
64
|
-
map.getView().setCenter(coord);
|
|
65
|
-
point.setCoordinates(coord);
|
|
66
|
-
}
|
|
67
|
-
}),
|
|
68
|
-
];
|
|
69
|
-
|
|
70
|
-
return () => {
|
|
71
|
-
unByKey(keys);
|
|
72
|
-
};
|
|
73
|
-
}, [map, geolocation]);
|
|
74
|
-
|
|
75
|
-
useEffect(() => {
|
|
76
|
-
geolocation.setTracking(isTracking);
|
|
77
|
-
if (isTracking) {
|
|
78
|
-
layer.setMap(map);
|
|
79
|
-
}
|
|
80
|
-
return () => {
|
|
81
|
-
layer.setMap(null);
|
|
82
|
-
};
|
|
83
|
-
}, [map, geolocation, isTracking]);
|
|
84
|
-
|
|
85
|
-
return (
|
|
86
|
-
<IconButton
|
|
87
|
-
onClick={() => {
|
|
88
|
-
setIsTracking(!isTracking);
|
|
89
|
-
}}
|
|
90
|
-
selected={isTracking}
|
|
91
|
-
{...props}
|
|
92
|
-
>
|
|
93
|
-
<GeolocationIcon className={isTracking ? "animate-pulse" : ""} />
|
|
94
|
-
</IconButton>
|
|
95
|
-
);
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
export default memo(GeolocationButton);
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { default } from "./GeolocationButton";
|