diff --git a/src/components/AppDrawer/index.jsx b/src/components/AppDrawer/index.jsx
index 46d75a1a..78ef3c30 100644
--- a/src/components/AppDrawer/index.jsx
+++ b/src/components/AppDrawer/index.jsx
@@ -1,11 +1,12 @@
import React, { useCallback, useEffect, useRef } from 'react';
import { connect } from 'react-redux';
import Obstruction from 'obstruction';
-import { Link } from 'react-router-dom';
+import { Link, useLocation } from 'react-router-dom';
import Drawer from '@material-ui/core/Drawer';
import DeviceList from '../Dashboard/DeviceList';
+import CarEventReenactment from '../CarEventReenactment';
import { selectDevice } from '../../actions';
@@ -33,6 +34,11 @@ const AppDrawer = ({
toggleDrawerOff();
}, [dispatch, toggleDrawerOff]);
+ const location = useLocation();
+ const currentPage = location.pathname;
+
+ const isReplayPage = currentPage.split('/').length === 4 ? true : false;
+
return (
connect
)}
-
+ {!isReplayPage && (
+
+ )}
+ {isReplayPage && (
+
+ )}
);
diff --git a/src/components/AppHeader/index.jsx b/src/components/AppHeader/index.jsx
index 2fb7d9f3..af255ce1 100644
--- a/src/components/AppHeader/index.jsx
+++ b/src/components/AppHeader/index.jsx
@@ -127,10 +127,14 @@ const AppHeader = ({
- {Boolean(!primeNav && !annotating && dongleId) &&
}
-
- {showRouteVisualizer ? 'View List' : 'View Map'}
-
+ {Boolean(!primeNav && !annotating && dongleId) && (
+ <>
+
+
+ {showRouteVisualizer ? 'View List' : 'View Map'}
+
+ >
+ )}
diff --git a/src/components/CarEventReenactment/index.jsx b/src/components/CarEventReenactment/index.jsx
new file mode 100644
index 00000000..0df50f8f
--- /dev/null
+++ b/src/components/CarEventReenactment/index.jsx
@@ -0,0 +1,69 @@
+import React, { Component } from 'react';
+import { connect } from 'react-redux';
+import Obstruction from 'obstruction';
+import { withStyles } from '@material-ui/core';
+
+import theme from '../../theme';
+import Colors from '../../colors';
+import ResizeHandler from '../ResizeHandler';
+
+const styles = () => ({
+
+});
+
+const initialState = {
+ windowWidth: window.innerWidth,
+};
+
+
+class RouteVisualizer extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ ...initialState,
+ };
+
+ this.onResize = this.onResize.bind(this);
+ }
+
+ componentDidMount() {
+
+ }
+
+ componentDidUpdate(prevProps) {
+
+ }
+
+ componentWillUnmount() {
+ this.setState({ ...initialState });
+ }
+
+
+ onResize(windowWidth) {
+ this.setState({ windowWidth });
+ }
+
+
+ render() {
+ const { classes } = this.props;
+ const { } = this.state;
+
+ return (
+
+
+
+ );
+ }
+}
+
+const stateToProps = Obstruction({
+ device: 'device',
+ dongleId: 'dongleId',
+ routes: 'routes',
+});
+
+export default connect(stateToProps)(withStyles(styles)(RouteVisualizer));
\ No newline at end of file