diff options
| -rw-r--r-- | modern/src/reports/ReplayPage.js | 13 |
1 files changed, 12 insertions, 1 deletions
diff --git a/modern/src/reports/ReplayPage.js b/modern/src/reports/ReplayPage.js index afb7d04..fa94a06 100644 --- a/modern/src/reports/ReplayPage.js +++ b/modern/src/reports/ReplayPage.js @@ -12,9 +12,10 @@ import MainToolbar from '../MainToolbar'; import Map from '../map/Map'; import ReplayPathMap from '../map/ReplayPathMap'; import PositionsMap from '../map/PositionsMap'; -import { formatPosition } from '../common/formatter'; +import { formatPosition, formatSpeed } from '../common/formatter'; import ReportFilter from './ReportFilter'; import { useTranslation } from '../LocalizationProvider'; +import { useAttributePreference } from '../common/preferences'; const useStyles = makeStyles((theme) => ({ root: { @@ -49,6 +50,8 @@ const ReplayPage = () => { const { id } = useParams(); const t = useTranslation(); + const speedUnit = useAttributePreference('speedUnit'); + const [expanded, setExpanded] = useState(true); const [positions, setPositions] = useState([]); const [index, setIndex] = useState(0); @@ -80,9 +83,17 @@ const ReplayPage = () => { <IconButton color="primary" disabled={index === 0} onClick={() => setIndex(index - 1)}> <SkipPreviousIcon /> </IconButton> + <Box flexGrow={1} textAlign="center"> + {/* Date time */} <Typography variant="button">{formatPosition(positions[index], 'fixTime', t)}</Typography> + {/* Speed */} + {positions[index].speed != undefined && + <> + <br/><Typography variant="secondary">{formatSpeed(positions[index].speed, speedUnit, t)}</Typography> + </>} </Box> + {/* Speed */} {/* Next position button*/} <IconButton color="primary" disabled={index === positions.length - 1} onClick={() => setIndex(index + 1)}> <SkipNextIcon /> |