aboutsummaryrefslogtreecommitdiff
path: root/modern/src/other/ReplayPage.js
diff options
context:
space:
mode:
authorAnton Tananaev <anton@traccar.org>2022-10-16 18:30:55 -0700
committerAnton Tananaev <anton@traccar.org>2022-10-16 18:30:55 -0700
commit79841c3f94ff2e50f51c38907ba2923735611af5 (patch)
treebb4a35cedc210c7fa8ecb61dfd83066baa2e855a /modern/src/other/ReplayPage.js
parent6bfe52d4e0578ea83761ff174ae6dc205b97a4ac (diff)
downloadtrackermap-web-79841c3f94ff2e50f51c38907ba2923735611af5.tar.gz
trackermap-web-79841c3f94ff2e50f51c38907ba2923735611af5.tar.bz2
trackermap-web-79841c3f94ff2e50f51c38907ba2923735611af5.zip
Add route points
Diffstat (limited to 'modern/src/other/ReplayPage.js')
-rw-r--r--modern/src/other/ReplayPage.js13
1 files changed, 8 insertions, 5 deletions
diff --git a/modern/src/other/ReplayPage.js b/modern/src/other/ReplayPage.js
index 9d8503a8..ee9e15d9 100644
--- a/modern/src/other/ReplayPage.js
+++ b/modern/src/other/ReplayPage.js
@@ -16,6 +16,7 @@ import { useNavigate } from 'react-router-dom';
import { useSelector } from 'react-redux';
import MapView from '../map/core/MapView';
import MapRoutePath from '../map/MapRoutePath';
+import MapRoutePoints from '../map/MapRoutePoints';
import MapPositions from '../map/MapPositions';
import { formatTime } from '../common/util/formatter';
import ReportFilter from '../reports/components/ReportFilter';
@@ -132,7 +133,11 @@ const ReplayPage = () => {
}
}, [index, positions]);
- const onMapClick = useCallback((positionId) => {
+ const onPointClick = useCallback((_, index) => {
+ setIndex(index);
+ }, [setIndex]);
+
+ const onMarkerClick = useCallback((positionId) => {
setShowCard(!!positionId);
}, [setShowCard]);
@@ -166,11 +171,9 @@ const ReplayPage = () => {
<MapView>
<MapGeofence />
<MapRoutePath positions={positions} />
+ <MapRoutePoints positions={positions} onClick={onPointClick} />
{index < positions.length && (
- <MapPositions
- positions={[positions[index]]}
- onClick={onMapClick}
- />
+ <MapPositions positions={[positions[index]]} onClick={onMarkerClick} />
)}
</MapView>
<MapCamera positions={positions} />