Merge pull request #147 from opentripplanner/otp-ui-itinerary-body

otp-ui itinerary body

Author: landonreed

__tests__/reducers/__snapshots__/create-otp-reducer.js.snap

@@ -8,13 +8,13 @@ Object {
     "debouncePlanTimeMs": 0,
     "homeTimezone": "America/Los_Angeles",
     "language": Object {},
-    "operators": Array [],
     "realtimeEffectsDisplayThreshold": 120,
     "routingTypes": Array [],
     "stopViewer": Object {
       "numberOfDepartures": 3,
       "timeRange": 345600,
     },
+    "transitOperators": Array [],
   },
   "currentQuery": Object {
     "bikeSpeed": 3.58,

lib/components/app/print-layout.js

@@ -1,17 +1,15 @@
-import BaseMap from '@opentripplanner/base-map'
-import EndpointsOverlay from '@opentripplanner/endpoints-overlay'
 import TriMetLegIcon from '@opentripplanner/icons/lib/trimet-leg-icon'
 import PrintableItinerary from '@opentripplanner/printable-itinerary'
-import TransitiveOverlay from '@opentripplanner/transitive-overlay'
 import PropTypes from 'prop-types'
 import React, { Component } from 'react'
 import { Button } from 'react-bootstrap'
 import { connect } from 'react-redux'
 
 import { parseUrlQueryString } from '../../actions/form'
 import { routingQuery } from '../../actions/api'
-import { getActiveItinerary } from '../../util/state'
+import DefaultMap from '../map/default-map'
 import TripDetails from '../narrative/connected-trip-details'
+import { getActiveItinerary } from '../../util/state'
 
 class PrintLayout extends Component {
   static propTypes = {
@@ -91,10 +89,7 @@ class PrintLayout extends Component {
         {/* The map, if visible */}
         {this.state.mapVisible &&
           <div className='map-container'>
-            <BaseMap>
-              <TransitiveOverlay />
-              <EndpointsOverlay />
-            </BaseMap>
+            <DefaultMap />
           </div>
         }
 

lib/components/narrative/line-itin/access-leg-body.js

@@ -0,0 +1,85 @@
+import isEqual from 'lodash.isequal'
+import TriMetLegIcon from '@opentripplanner/icons/lib/trimet-leg-icon'
+import TransitLegSummary from '@opentripplanner/itinerary-body/lib/defaults/transit-leg-summary'
+import ItineraryBody from '@opentripplanner/itinerary-body/lib/otp-react-redux/itinerary-body'
+import LineColumnContent from '@opentripplanner/itinerary-body/lib/otp-react-redux/line-column-content'
+import PlaceName from '@opentripplanner/itinerary-body/lib/otp-react-redux/place-name'
+import RouteDescription from '@opentripplanner/itinerary-body/lib/otp-react-redux/route-description'
+import React, { Component } from 'react'
+import { connect } from 'react-redux'
+import styled from 'styled-components'
+
+import { showLegDiagram } from '../../../actions/map'
+import { setActiveLeg } from '../../../actions/narrative'
+import { setViewedTrip } from '../../../actions/ui'
+import TransitLegSubheader from './connected-transit-leg-subheader'
+import TripDetails from '../connected-trip-details'
+import TripTools from '../trip-tools'
+
+const noop = () => {}
+
+const ItineraryBodyContainer = styled.div`
+  padding: 20px 0px;
+`
+
+class ConnectedItineraryBody extends Component {
+  /** avoid rerendering if the itinerary to display hasn't changed */
+  shouldComponentUpdate (nextProps, nextState) {
+    return !isEqual(this.props.itinerary, nextProps.itinerary)
+  }
+
+  render () {
+    const {
+      config,
+      diagramVisible,
+      itinerary,
+      setActiveLeg,
+      setViewedTrip,
+      showLegDiagram
+    } = this.props
+
+    return (
+      <ItineraryBodyContainer>
+        <ItineraryBody
+          config={config}
+          diagramVisible={diagramVisible}
+          itinerary={itinerary}
+          LegIcon={TriMetLegIcon}
+          LineColumnContent={LineColumnContent}
+          PlaceName={PlaceName}
+          RouteDescription={RouteDescription}
+          setActiveLeg={setActiveLeg}
+          setLegDiagram={showLegDiagram}
+          setViewedTrip={setViewedTrip}
+          showAgencyInfo
+          showElevationProfile
+          showLegIcon
+          showMapButtonColumn={false}
+          showViewTripButton
+          toRouteAbbreviation={noop}
+          TransitLegSubheader={TransitLegSubheader}
+          TransitLegSummary={TransitLegSummary}
+        />
+        <TripDetails itinerary={itinerary} />
+        <TripTools itinerary={itinerary} />
+      </ItineraryBodyContainer>
+    )
+  }
+}
+
+const mapStateToProps = (state, ownProps) => {
+  return {
+    config: state.otp.config,
+    diagramVisible: state.otp.ui.diagramLeg
+  }
+}
+
+const mapDispatchToProps = {
+  setActiveLeg,
+  setViewedTrip,
+  showLegDiagram
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(
+  ConnectedItineraryBody
+)

lib/components/narrative/line-itin/connected-itinerary-body.js

@@ -0,0 +1,33 @@
+import TransitLegSubheader from '@opentripplanner/itinerary-body/lib/otp-react-redux/transit-leg-subheader'
+import React, { Component } from 'react'
+import { connect } from 'react-redux'
+
+import { setMainPanelContent, setViewedStop } from '../../../actions/ui'
+
+class ConnectedTransitLegSubheader extends Component {
+  onClick = (payload) => {
+    const { setMainPanelContent, setViewedStop } = this.props
+    setMainPanelContent(null)
+    setViewedStop(payload)
+  }
+
+  render () {
+    const { languageConfig, leg } = this.props
+    return (
+      <TransitLegSubheader
+        languageConfig={languageConfig}
+        leg={leg}
+        onStopClick={this.onClick}
+      />
+    )
+  }
+}
+
+const mapDispatchToProps = {
+  setMainPanelContent,
+  setViewedStop
+}
+
+export default connect(null, mapDispatchToProps)(
+  ConnectedTransitLegSubheader
+)