Merge branch 'master' of github.com:trynmaps/opentransit-map

trynmaps · Jan 10, 2019 · 554f9ab · 554f9ab
2 parents 24d6802 + 12cc6c4
commit 554f9ab
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 6 deletions.
diff --git a/src/ControlPanel.jsx b/src/ControlPanel.jsx
@@ -81,19 +81,19 @@ class ControlPanel extends Component {
         <div className="routes-header stops-toggle">
           <h3>Stops</h3>
           <Toggle
-            defaultChecked={this.state.showStops}
-            onChange={() => this.setState({ showStops: !this.state.showStops })}
+            defaultChecked
+            onChange={() => this.props.toggleStops()}
           />
         </div>
         <div className="routes-header">
           <h3>Routes</h3>
         </div>
-        <ul className="route-checkboxes">
+        <ul className="list-group">
           {sortedRoutes.map(route => (
             <Checkbox
               route={route}
               label={route.properties.name}
-              handleCheckboxChange={checkedRoute => this.props.filter(checkedRoute)}
+              handleCheckboxChange={checkedRoute => this.props.filterRoutes(checkedRoute)}
               key={route.id}
             />
           ))}
@@ -105,7 +105,8 @@ class ControlPanel extends Component {
 
 ControlPanel.propTypes = {
   relay: propTypes.element.isRequired,
-  filter: propTypes.element.isRequired,
+  filterRoutes: propTypes.element.isRequired,
+  toggleStops: propTypes.element.isRequired,
 };
 
 export default ControlPanel;
diff --git a/src/Map.jsx b/src/Map.jsx
@@ -47,6 +47,7 @@ class Map extends Component {
   constructor() {
     super();
     this.filterRoutes = this.filterRoutes.bind(this);
+    this.toggleStops = this.toggleStops.bind(this);
     this.state = {
       // Viewport settings that is shared between mapbox and deck.gl
       viewport: {
@@ -167,6 +168,10 @@ class Map extends Component {
     this.setState({ geojson: newGeojson });
   }
 
+  toggleStops() {
+    this.setState({ showStops: !this.state.showStops });
+  }
+
   renderMap() {
     const onViewportChange = viewport => this.setState({ viewport });
     const { trynState } = this.props.trynState || {};
@@ -232,7 +237,7 @@ class Map extends Component {
             {this.renderMap()}
           </div>
           <div className="col-sm-3 col-md-2 hidden-xs-down bg-faded sidebar">
-            <ControlPanel filter={this.filterRoutes} />
+            <ControlPanel filterRoutes={this.filterRoutes} toggleStops={this.toggleStops} />
           </div>
         </div>
       </div>