diff options
author | Iván Ávalos <avalos@disroot.org> | 2021-12-14 19:26:50 -0600 |
---|---|---|
committer | Iván Ávalos <avalos@disroot.org> | 2021-12-14 19:26:50 -0600 |
commit | 26085c61fa72cc0f40d631aa2bbb31a722b7c35f (patch) | |
tree | 34699d274c7f890fee620275d0e3f76d6d575243 /modern/src | |
parent | 03f9a3ef2b00b8024533e5b720861953bc79e704 (diff) | |
download | etbsa-traccar-web-26085c61fa72cc0f40d631aa2bbb31a722b7c35f.tar.gz etbsa-traccar-web-26085c61fa72cc0f40d631aa2bbb31a722b7c35f.tar.bz2 etbsa-traccar-web-26085c61fa72cc0f40d631aa2bbb31a722b7c35f.zip |
Added speed to replay page slider
Diffstat (limited to 'modern/src')
-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 /> |