+
+ {
+ if (e.keyCode === 13) this.userSearch()
+ }} />
+
+
+ {isFetching
+ ?
+
+ : organizations.data && organizations.data.map((organization, i) => {
+ const orgUsers = users.data ? users.data.filter(u => {
+ const permissions = new UserPermissions(u.app_metadata && u.app_metadata.datatools ? u.app_metadata.datatools : null)
+ return permissions.getOrganizationId() === organization.id
+ }) : []
+ return
+
+
+
+ Create Organization
+
+
+
+
+
+
+
+
+ )
+ }
+}
+
+class OrganizationRow extends Component {
+ static propTypes = {
+ organization: PropTypes.object,
+ users: PropTypes.array
+ }
+ constructor (props) {
+ super(props)
+ this.state = {
+ isEditing: false
+ }
+ }
+ toggleExpansion () {
+ this.setState({
+ isEditing: !this.state.isEditing
+ })
+ }
+
+ cancel () {
+ this.toggleExpansion()
+ }
+
+ save () {
+ const settings = this.refs.orgSettings.getSettings()
+ this.props.updateOrganization(this.props.organization, settings)
+ this.toggleExpansion()
+ }
+
+ delete () {
+ this.props.deleteOrganization(this.props.organization)
+ this.toggleExpansion()
+ }
+ render () {
+ const {
+ organization,
+ users
+ } = this.props
+ return (
+ + {organization.name}{' '} + {users.length ? : null} +
+ + +{getMessage(messages, 'orgDetails')}
+ {orgFields.map((f, index) => ( +{getMessage(messages, 'subDetails')}
+
+
+
+
+
+
+
+
+
+ User management Organizations Application logs Regions
+
+
+
+ : + +
+ : activeComponent === 'organizations' && isApplicationAdmin && !isModuleEnabled('enterprise') + ?
+ {user
+ ?
+
+ }
+
+ }
+ {getMessage(messages, 'noAccess')}
+ :
+
+ }
+
+
+
+
+
+
+ {userCount > 0
+ ? {getMessage(messages, 'showing')} {minUserIndex } - {maxUserIndex} {getMessage(messages, 'of')} {userCount}
+ : (No results to show)
+ }
+
+
+
+
+ {
+ if (e.keyCode === 13) this.userSearch()
+ }} />
+
+ {
+ ReactDOM.findDOMNode(this.refs.searchInput).value = ''
+ userSearch('')
+ }} />
+
+
+
+ {/* TODO: add filter for organization */}
+ {/* isApplicationAdmin &&
+
+
+ */}
+
+
+ {isFetching
+ ?
+
+ : users.map((user, i) => {
+ return
+
+
+ )
+ }
+}
+
+class UserRow extends Component {
+ static propTypes = {
+ user: PropTypes.object,
+ saveUser: PropTypes.func,
+ deleteUser: PropTypes.func,
+ fetchProjectFeeds: PropTypes.func,
+ organizations: PropTypes.array,
+ projects: PropTypes.array
+ }
+ constructor (props) {
+ super(props)
+ this.state = {
+ isEditing: false
+ }
+ }
+
+ toggleExpansion () {
+ this.setState({
+ isEditing: !this.state.isEditing
+ })
+ }
+
+ cancel () {
+ this.toggleExpansion()
+ }
+
+ save () {
+ const settings = this.refs.userSettings.getSettings()
+ this.props.saveUser(this.props.user, settings)
+ this.toggleExpansion()
+ }
+
+ delete () {
+ const messages = getComponentMessages('UserRow')
+ this.refs.confirm.open({
+ title: `${getMessage(messages, 'delete')} ${this.props.user.email}?`,
+ body: getMessage(messages, 'deleteConfirm'),
+ onConfirm: () => {
+ this.props.deleteUser(this.props.user)
+ this.toggleExpansion()
+ }
+ })
+ }
+
+ render () {
+ const {
+ creatingUser,
+ user,
+ organizations,
+ projects,
+ fetchProjectFeeds
+ } = this.props
+ const messages = getComponentMessages('UserRow')
+ const permissions = new UserPermissions(user.app_metadata && user.app_metadata.datatools ? user.app_metadata.datatools : null)
+ const creatorIsApplicationAdmin = creatingUser.permissions.isApplicationAdmin()
+ const userOrganization = organizations.find(o => o.id === permissions.getOrganizationId())
+ // return null if creating user is not app admin and list item user is part of a different org
+ if (!creatorIsApplicationAdmin && !creatingUser.permissions.hasOrganization(permissions.getOrganizationId())) {
+ return null
+ }
+ return (
+ + {user.email}{' '} + {permissions.isApplicationAdmin() + ? + : permissions.canAdministerAnOrganization() + ? + : null + }{' '} + {userOrganization && creatorIsApplicationAdmin ? : null} +
+ + +
+
+ {this.state.organization &&
+ this.orgAdminClicked(evt.target.checked, orgProjects, this.state.organization)}
+ ref='orgAdminCheckbox'
+ >
+ {getMessage(messages, 'org.admin')}
+
+ }
+
+ : null
+ }
+ {getMessage(messages, 'project.feeds')}
+ {feedSources + ? feedSources.map((feed, i) => { + const name = (feed.name === '') ? '(unnamed feed)' : feed.name + const refName = 'feed-' + feed.id + const checked = settings.defaultFeeds.indexOf(feed.id) !== -1 + return{getMessage(messages, 'project.permissions')}
+ {allPermissions.map((permission, i) => { + const refName = 'permission-' + permission.type + const checked = settings.permissions.indexOf(permission.type) !== -1 + return+ Note: this selection will apply to all stops and routes for {agencyName}. + + ) + case 'STOP' : + summary = stopName + if (routeName) { + summary += ` for ${routeName}` + } + return
+ Note: this selection will apply to all {val.name.toLowerCase()} routes{stopName && ` stopping at ${stopName}`}. + + ) + } + } + renderHeader () { + return ( +
+
+
+
+ Agency:
+
+ )
+ case 'MODE':
+ return (
+
+ Mode:
+
+ )
+ case 'STOP':
+ return (
+
+ Refine by Agency:
+
+
+ Stop:
+
+ )
+ case 'ROUTE':
+ return (
+
+ Refine by Route:
+
+
+ Route:
+
+ )
+ }
+ }
+ render () {
+ return (
+
+ Refine by Stop:
+
+
+ {
+ entityUpdated(entity, 'AGENCY', getFeed(feeds, evt.target.value))
+ }}
+ >
+ {feeds.map((feed) => {
+ return
+ })}
+
+
+ )
+ }
+}
diff --git a/lib/alerts/components/AlertEditor.js b/lib/alerts/components/AlertEditor.js
new file mode 100644
index 000000000..d4239a5be
--- /dev/null
+++ b/lib/alerts/components/AlertEditor.js
@@ -0,0 +1,288 @@
+import {Icon} from '@conveyal/woonerf'
+import React from 'react'
+import Helmet from 'react-helmet'
+import { sentence as toSentenceCase } from 'change-case'
+import { Grid, Row, Col, ButtonToolbar, Button, FormControl, ControlLabel, FormGroup } from 'react-bootstrap'
+import DateTimeField from 'react-bootstrap-datetimepicker'
+import Toggle from 'react-toggle'
+// import Switch from 'rc-switch'
+
+import ManagerPage from '../../common/components/ManagerPage'
+import Loading from '../../common/components/Loading'
+import AffectedServices from './AffectedServices'
+import GtfsMapSearch from '../../gtfs/components/gtfsmapsearch'
+import GlobalGtfsFilter from '../../gtfs/containers/GlobalGtfsFilter'
+
+import { checkEntitiesForFeeds } from '../../common/util/permissions'
+import { CAUSES, EFFECTS } from '../util'
+import { browserHistory } from 'react-router'
+
+import moment from 'moment'
+
+export default class AlertEditor extends React.Component {
+ componentWillMount () {
+ this.props.onComponentMount(this.props)
+ }
+ validateAndSave = () => {
+ console.log('times', this.props.alert.end, this.props.alert.start)
+ if (!this.props.alert.title) {
+ window.alert('You must specify an alert title')
+ return
+ }
+ if (!this.props.alert.end || !this.props.alert.start) {
+ window.alert('Alert must have a start and end date')
+ return
+ }
+ if (this.props.alert.end < this.props.alert.start) {
+ window.alert('Alert end date cannot be before start date')
+ return
+ }
+ if (moment(this.props.alert.end).isBefore(moment())) {
+ window.alert('Alert end date cannot be before the current date')
+ return
+ }
+ if (this.props.alert.affectedEntities.length === 0) {
+ window.alert('You must specify at least one affected entity')
+ return
+ }
+ this.props.onSaveClick(this.props.alert)
+ }
+ render () {
+ const {
+ alert,
+ publishableFeeds,
+ editableFeeds,
+ onPublishClick,
+ onDeleteClick,
+ titleChanged,
+ startChanged,
+ endChanged,
+ causeChanged,
+ effectChanged,
+ descriptionChanged,
+ urlChanged,
+ activeFeeds,
+ editorStopClick,
+ editorRouteClick
+ } = this.props
+ if (!alert) {
+ return (
+ Note: alert title serves as text for eTID alerts. Use descriptive language so it can serve as a standalone alert.
+Start
+ {alert.start
+ ? End
+ {alert.end
+ ? {alert.title}
+ID: #{alert.id} {publishedLabel} {entitiesLabel}
+ ++ {moment(alert.start).format('MMM Do YYYY, h:mm:ssa')} to {moment(alert.end).format('MMM Do YYYY, h:mm:ssa')} + {publishedLabel} {alert.published ? 'Published' : 'Draft'} +
+{alert.description}
+URL: {alert.url}
++ {entitiesLabel} affected service(s) +
+
+
+
+ this.props.searchTextChanged(evt.target.value)}
+ defaultValue={this.props.visibilityFilter.searchText}
+ />
+
+
+
+ {/* Alert filters */}
+
+
+
+ {FILTERS.map(f => (
+
+ ))}
+
+
+
+ Sort by
+ {' '}
+ {
+ const values = evt.target.value.split(':')
+ const sort = {
+ type: values[0],
+ direction: values[1]
+ }
+ this.props.sortChanged(sort)
+ }}
+ >
+
+
+
+
+
+
+
+
+
+
+
+ Agency
+ {' '}
+ this.props.agencyFilterChanged(evt.target.value)}
+ >
+
+ {sortedFeeds.map(fs => (
+
+ ))}
+
+
+
+
+ {/* List of alerts */}
+
+
+
+ )
+ }
+}
diff --git a/src/main/client/alerts/components/AlertsViewer.js b/lib/alerts/components/AlertsViewer.js
similarity index 75%
rename from src/main/client/alerts/components/AlertsViewer.js
rename to lib/alerts/components/AlertsViewer.js
index 770d8aa48..04f15a26f 100644
--- a/src/main/client/alerts/components/AlertsViewer.js
+++ b/lib/alerts/components/AlertsViewer.js
@@ -1,7 +1,7 @@
import React from 'react'
import Helmet from 'react-helmet'
-
-import { Grid, Row, Col, Button } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+import { Grid, Row, Col } from 'react-bootstrap'
import ManagerPage from '../../common/components/ManagerPage'
import CreateAlert from '../components/CreateAlert'
@@ -9,33 +9,28 @@ import VisibleAlertsList from '../containers/VisibleAlertsList'
import GlobalGtfsFilter from '../../gtfs/containers/GlobalGtfsFilter'
import GtfsMapSearch from '../../gtfs/components/gtfsmapsearch'
-import { Link } from 'react-router'
-
export default class AlertsViewer extends React.Component {
-
- constructor (props) {
- super(props)
- //console.log("AV activeFeeds", this.props.activeFeeds);
- }
-
componentWillMount () {
this.props.onComponentMount(this.props)
}
-
render () {
- const createDisabled = this.props.project && this.props.user ? !this.props.user.permissions.hasProjectPermission(this.props.project.id, 'edit-alert') : true
+ const createDisabled = this.props.project && this.props.user ? !this.props.user.permissions.hasProjectPermission(this.props.project.organizationId, this.props.project.id, 'edit-alert') : true
return (
No alerts found.
+ } + +
+
+ { this.popover = SidebarPopover }}
+ title='Server Jobs'
+ {...this.props}>
+ {this.props.jobMonitor.retired.map(job => {
+ return (
+
+ )
+ }
+}
diff --git a/lib/common/components/LanguageSelect.js b/lib/common/components/LanguageSelect.js
new file mode 100644
index 000000000..c4d2fe3cf
--- /dev/null
+++ b/lib/common/components/LanguageSelect.js
@@ -0,0 +1,46 @@
+import React from 'react'
+import { shallowEqual } from 'react-pure-render'
+import Select from 'react-select'
+import ISO6391 from 'iso-639-1'
+
+import { getComponentMessages, getMessage } from '../util/config'
+
+export default class LanguageSelect extends React.Component {
+ constructor (props) {
+ super(props)
+ this.state = {
+ value: this.props.value
+ }
+ }
+ componentWillReceiveProps (nextProps) {
+ if (!shallowEqual(nextProps.value, this.props.value)) {
+ this.setState({value: nextProps.value})
+ console.log('props received', this.state.value)
+ }
+ }
+ _onChange = (value) => {
+ this.setState({value})
+ this.props.onChange && this.props.onChange(value)
+ }
+ _getOptions = () => {
+ return ISO6391.getAllCodes().map(code => ({value: code, label: ISO6391.getName(code)}))
+ }
+ render () {
+ const messages = getComponentMessages('LanguageSelect')
+ const placeholder = getMessage(messages, 'placeholder')
+ return (
+
+ )
+ }
+}
diff --git a/lib/common/components/Loading.js b/lib/common/components/Loading.js
new file mode 100644
index 000000000..c62a58576
--- /dev/null
+++ b/lib/common/components/Loading.js
@@ -0,0 +1,16 @@
+import React from 'react'
+import { Row, Col } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+
+export default class Loading extends React.Component {
+
+ render () {
+ return (
+
+
+ )
+ }
+}
diff --git a/lib/common/components/ManagerPage.js b/lib/common/components/ManagerPage.js
new file mode 100644
index 000000000..5a37ed114
--- /dev/null
+++ b/lib/common/components/ManagerPage.js
@@ -0,0 +1,106 @@
+import React, {Component} from 'react'
+import Helmet from 'react-helmet'
+
+import CurrentStatusMessage from '../containers/CurrentStatusMessage'
+import CurrentStatusModal from '../containers/CurrentStatusModal'
+import ConfirmModal from './ConfirmModal.js'
+import SelectFileModal from './SelectFileModal.js'
+import InfoModal from './InfoModal.js'
+import ActiveSidebar from '../containers/ActiveSidebar'
+import ActiveSidebarNavItem from '../containers/ActiveSidebarNavItem'
+import PageContent from '../containers/PageContent'
+
+import { getConfigProperty, isModuleEnabled } from '../util/config'
+
+export default class ManagerPage extends Component {
+ showInfoModal (props) {
+ this.refs.infoModal.open(props)
+ }
+ showConfirmModal (props) {
+ this.refs.confirmModal.open(props)
+ }
+ showSelectFileModal (props) {
+ this.refs.selectFileModal.open(props)
+ }
+ isActive (path) {
+ return window.location.pathname.split('/')[1] === path
+ }
+ render () {
+ return (
+
-
- : null
+ const marker = this.state.marker
+ ?
- this._onEditPath(e)}
- onCreated={(e) => this._onCreate(e)}
- onDeleted={(e) => this._onDeleted(e)}
- position='topright'
- draw={this.state.draw
- ? {
- circle: false,
- polyline: false,
- polygon: false,
- marker: false
- }
- : {
- circle: false,
- polyline: false,
- polygon: false,
- marker: false,
- rectangle: false
- }
+ ref='drawnItems'
+ >
+ {/* this._onEditPath(e)}
+ onCreated={(e) => this._onCreate(e)}
+ onDeleted={(e) => this._onDeleted(e)}
+ position='topright'
+ draw={this.state.draw
+ ? {
+ circle: false,
+ polyline: false,
+ polygon: false,
+ marker: false
}
- />
-
+ : {
+ circle: false,
+ polyline: false,
+ polygon: false,
+ marker: false,
+ rectangle: false
+ }
+ }
+ />
+ */}
+
: null
}
- {/*this.state.marker
+ {/* this.state.marker
? this.state.marker.map(m => {
return (
@@ -16,7 +12,7 @@ export default class PageNotFound extends React.Component {
@@ -24,12 +20,4 @@ export default class PageNotFound extends React.Component {
)
}
- render() {
- return (
-
{this.state.isEditing
?
-
+
+
+ this.handleKeyDown(e)}
+ onFocus={(e) => e.target.select()}
+ defaultValue={this.state.value}
+ />
+ {saveButton}
+
+
+
:
- {this.props.link
- ? {displayValue}
- : displayValue || '(none)'
- }
- {this.props.hideEditButton
- ? null
- :
- {' '}
-
-
- }
-
+ title={this.state.value}
+ style={spanStyle}>
+ {this.props.link
+ ? {displayValue}
+ : displayValue || '(none)'
+ }
+ {this.props.hideEditButton
+ ? null
+ :
+ {' '}
+
+
+ }
+
}
)
diff --git a/src/main/client/common/components/InfoModal.js b/lib/common/components/InfoModal.js
similarity index 87%
rename from src/main/client/common/components/InfoModal.js
rename to lib/common/components/InfoModal.js
index f7b49c3ce..0331fedb1 100644
--- a/src/main/client/common/components/InfoModal.js
+++ b/lib/common/components/InfoModal.js
@@ -1,5 +1,5 @@
-import React from 'react'
-import { Modal, Button, Glyphicon } from 'react-bootstrap'
+import React from 'react'
+import { Modal, Button } from 'react-bootstrap'
export default class InfoModal extends React.Component {
@@ -20,7 +20,7 @@ export default class InfoModal extends React.Component {
this.setState({
showModal: true,
title: props.title,
- body: props.body,
+ body: props.body
})
}
diff --git a/lib/common/components/JobMonitor.js b/lib/common/components/JobMonitor.js
new file mode 100644
index 000000000..6c3ff2111
--- /dev/null
+++ b/lib/common/components/JobMonitor.js
@@ -0,0 +1,92 @@
+import React, {PropTypes} from 'react'
+import {ProgressBar, Button} from 'react-bootstrap'
+import {Icon, Pure} from '@conveyal/woonerf'
+import truncate from 'truncate'
+
+import SidebarPopover from './SidebarPopover'
+
+export default class JobMonitor extends Pure {
+ static propTypes = {
+ expanded: PropTypes.bool,
+ jobMonitor: PropTypes.object,
+ target: PropTypes.object,
+ visible: PropTypes.bool.isRequired,
+ close: PropTypes.func,
+ removeRetiredJob: PropTypes.func
+ }
+ removeJob (job) {
+ this.props.removeRetiredJob(job)
+ }
+ componentWillReceiveProps (nextProps) {
+ // TODO: fix resizing when jobs are removed (height of popover appears to be incorrect)
+ // if (nextProps.jobMonitor.retired.length !== this.props.jobMonitor.retired.length) {
+ // this.popover._onResize()
+ // } else if (nextProps.jobMonitor.jobs.length !== this.props.jobMonitor.jobs.length) {
+ // this.popover._onResize()
+ // }
+ }
+ render () {
+ const jobContainerStyle = {
+ marginBottom: 20
+ }
+
+ const progressBarStyle = {
+ marginBottom: 2
+ }
+
+ const statusMessageStyle = {
+ fontSize: '12px',
+ color: 'darkGray'
+ }
+
+ return (
+
+
+ )
+ })}
+ {this.props.jobMonitor.jobs.length
+ ? this.props.jobMonitor.jobs.map(job => (
+
+ {job.status && job.status.error
+ ?
+
+
+
+
+ {truncate(job.name, 25)}
+
+ {job.status && job.status.error ? 'Error!' : 'Completed!'}
+
+
+ ))
+ :
+
+
+
+
+ {job.name}
+
+ {job.status ? job.status.message : 'waiting'}
+ No active jobs.
+ } +
+
+
+
+ {/*
+
+
+ )
+ }
+}
diff --git a/src/main/client/common/components/MapModal.js b/lib/common/components/MapModal.js
similarity index 62%
rename from src/main/client/common/components/MapModal.js
rename to lib/common/components/MapModal.js
index 7aadbcba2..fe710ff4a 100644
--- a/src/main/client/common/components/MapModal.js
+++ b/lib/common/components/MapModal.js
@@ -1,28 +1,19 @@
-import React from 'react'
+import React, { Component } from 'react'
import { Modal, Button } from 'react-bootstrap'
import { Map, Marker, TileLayer, FeatureGroup } from 'react-leaflet'
-import { EditControl } from 'react-leaflet-draw'
+// import { EditControl } from 'react-leaflet-draw'
import { getConfigProperty } from '../util/config'
let polyline
-export default class MapModal extends React.Component {
+export default class MapModal extends Component {
constructor (props) {
super(props)
this.state = {
showModal: false
}
}
- // componentWillReceiveProps (newProps) {
- // if (newProps.title) {
- // this.setState({
- // showModal: true,
- // title: newProps.title,
- // body: newProps.body,
- // })
- // }
- // }
close () {
this.setState({
showModal: false
@@ -43,7 +34,7 @@ export default class MapModal extends React.Component {
draw: true
})
}
- getMap() {
+ getMap () {
return this.refs.map
}
_onEditPath (e) {
@@ -51,7 +42,7 @@ export default class MapModal extends React.Component {
}
_onCreate (e) {
- polyline = e.layer;
+ polyline = e.layer
this.setState({rectangle: e.layer})
// To edit this polyline call : polyline.handler.enable()
console.log('Path created !', polyline)
@@ -62,19 +53,19 @@ export default class MapModal extends React.Component {
_onDeleted (e) {
console.log('Path deleted !')
- if (this.refs.drawnItems.getLayers().length === 0){
- this.setState({draw: true})
+ if (this.refs.drawnItems.getLayers().length === 0) {
+ this.setState({draw: true})
}
}
- initializeMap() {
- if(this.mapInitialized || this.props.initialized) return
+ initializeMap () {
+ if (this.mapInitialized || this.props.initialized) return
const leafletMap = this.getMap().leafletElement
leafletMap.invalidateSize()
this.mapInitialized = true
}
ok () {
- if(this.state.markerSelect) this.state.onConfirm(this.state.marker)
- if(this.state.rectangleSelect) this.state.onConfirm(this.state.rectangle)
+ if (this.state.markerSelect) this.state.onConfirm(this.state.marker)
+ if (this.state.rectangleSelect) this.state.onConfirm(this.state.rectangle)
else this.state.onConfirm()
this.close()
}
@@ -87,12 +78,12 @@ export default class MapModal extends React.Component {
height: '300px',
width: '100%'
}
- const marker = this.state.marker ?
+ {this.props.children}
+
+
+
+ Page Not Found.
-Go to Home Page
+Go to Home Page
-
- )
- }
}
diff --git a/src/main/client/common/components/SelectFileModal.js b/lib/common/components/SelectFileModal.js
similarity index 81%
rename from src/main/client/common/components/SelectFileModal.js
rename to lib/common/components/SelectFileModal.js
index 8d6e349d4..1be3d892f 100644
--- a/src/main/client/common/components/SelectFileModal.js
+++ b/lib/common/components/SelectFileModal.js
@@ -1,8 +1,8 @@
-import React from 'react'
-import { Modal, Button, FormControl, Glyphicon } from 'react-bootstrap'
+import React, { Component } from 'react'
+import { Modal, Button, FormControl } from 'react-bootstrap'
import ReactDOM from 'react-dom'
-export default class SelectFileModal extends React.Component {
+export default class SelectFileModal extends Component {
constructor (props) {
super(props)
@@ -12,6 +12,7 @@ export default class SelectFileModal extends React.Component {
}
close () {
+ if (this.props.onClose) this.props.onClose()
this.setState({
showModal: false
})
@@ -24,6 +25,7 @@ export default class SelectFileModal extends React.Component {
title: props.title,
body: props.body,
onConfirm: props.onConfirm,
+ onClose: props.onClose,
errorMessage: props.errorMessage
})
} else {
@@ -32,23 +34,19 @@ export default class SelectFileModal extends React.Component {
}
ok () {
- if(this.props.onConfirm) {
+ if (this.props.onConfirm) {
if (this.props.onConfirm(ReactDOM.findDOMNode(this.refs.fileInput).files)) {
this.close()
- }
- else {
+ } else {
this.setState({error: this.props.errorMessage || this.state.errorMessage})
}
- }
- else if(this.state.onConfirm) {
+ } else if (this.state.onConfirm) {
if (this.state.onConfirm(ReactDOM.findDOMNode(this.refs.fileInput).files)) {
this.close()
- }
- else {
+ } else {
this.setState({error: this.props.errorMessage || this.state.errorMessage})
}
- }
- else {
+ } else {
this.close()
}
}
diff --git a/lib/common/components/Sidebar.js b/lib/common/components/Sidebar.js
new file mode 100644
index 000000000..6cd7c251c
--- /dev/null
+++ b/lib/common/components/Sidebar.js
@@ -0,0 +1,178 @@
+import React, {PropTypes} from 'react'
+import {Navbar, Button, ButtonToolbar, Checkbox} from 'react-bootstrap'
+import {Link} from 'react-router'
+import {Icon, Pure} from '@conveyal/woonerf'
+
+import SidebarNavItem from './SidebarNavItem'
+import SidebarPopover from './SidebarPopover'
+import JobMonitor from './JobMonitor'
+
+export default class Sidebar extends Pure {
+ static propTypes = {
+ expanded: PropTypes.bool,
+ jobMonitor: PropTypes.object,
+ username: PropTypes.string,
+ userPicture: PropTypes.string,
+ loginHandler: PropTypes.func,
+ logoutHandler: PropTypes.func,
+ resetPassword: PropTypes.func,
+ setJobMonitorVisible: PropTypes.func,
+ removeRetiredJob: PropTypes.func,
+ setSidebarExpanded: PropTypes.func,
+ startJobMonitor: PropTypes.func
+ }
+
+ state = {
+ visiblePopover: null
+ }
+
+ componentWillReceiveProps (nextProps) {
+ if (!this.props.jobMonitor.timer && nextProps.jobMonitor.timer) {
+ this.setState({ visiblePopover: 'job' })
+ }
+ }
+ componentWillMount () {
+ // const showMonitor = false
+ // this.props.startJobMonitor(showMonitor)
+ }
+ _clickChangePassword = () => {
+ this.setState({visiblePopover: null})
+ this.props.resetPassword()
+ }
+
+ _clickLogOut = () => {
+ this.setState({visiblePopover: null})
+ this.props.logoutHandler()
+ }
+
+ _closePopover = () => {
+ this.setState({visiblePopover: null})
+ }
+
+ _select = (key) => this.setState({visiblePopover: (key === this.state.visiblePopover) ? null : key})
+ _selectHelp = () => this._select('help')
+ _selectJob = () => this._select('job')
+ _selectUser = () => this._select('user')
+
+ _toggleLabels = () => {
+ this.props.setSidebarExpanded(!this.props.expanded)
+ }
+
+ _toggleTutorial = () => {
+ this.props.setTutorialHidden(!this.props.hideTutorial)
+ }
+
+ render () {
+ const {children, expanded, userPicture} = this.props
+ const navbarStyle = {
+ width: expanded ? 130 : 50,
+ minHeight: '500px'
+ }
+ const hasActiveJobs = this.props.jobMonitor.jobs.length > 0
+ return (
+ Page Not Found.
-Go to Home Page
-
+
+
+
+
+
+
+
+
+
+
+
+ )
+ }
+}
+
+class Brand extends Pure {
+ static propTypes = {
+ expanded: PropTypes.bool.isRequired
+ }
+
+ render () {
+ const {expanded} = this.props
+ return (
+
+
+ {children}
+
+
+ 0}
+ label='Job Monitor'
+ onClick={this._selectJob}
+ />
+
+
+
+ Show Sidebar Labels
+
+
+ Hide editor tutorial
+
+
+
+
+ {expanded &&
+
+ )
+ }
+}
diff --git a/lib/common/components/SidebarNavItem.js b/lib/common/components/SidebarNavItem.js
new file mode 100644
index 000000000..7b8924cff
--- /dev/null
+++ b/lib/common/components/SidebarNavItem.js
@@ -0,0 +1,115 @@
+import React, { Component, PropTypes } from 'react'
+import { Icon } from '@conveyal/woonerf'
+import { Link } from 'react-router'
+import { Tooltip, OverlayTrigger } from 'react-bootstrap'
+
+export default class SidebarNavItem extends Component {
+
+ static propTypes = {
+ active: PropTypes.bool,
+ expanded: PropTypes.bool,
+ icon: PropTypes.string,
+ label: PropTypes.string,
+ onClick: PropTypes.func,
+ image: PropTypes.string,
+ link: PropTypes.string
+ }
+
+ constructor (props) {
+ super(props)
+ this.state = { hover: false }
+ }
+
+ toggleHover () {
+ this.setState({ hover: !this.state.hover })
+ }
+
+ render () {
+ const activeColor = this.props.active ? '#fff' : this.state.hover ? '#fff' : '#ccc'
+ const containerStyle = {
+ paddingTop: 10,
+ paddingBottom: 10,
+ paddingRight: this.props.expanded ? 10 : 10,
+ paddingLeft: 10,
+ marginTop: 5,
+ marginBottom: 5,
+ marginLeft: -15,
+ cursor: 'pointer',
+ color: activeColor,
+ borderLeft: this.props.active ? '4px solid #2889CA' : '4px solid rgba(0,0,0,0)',
+ textDecoration: 'none',
+ borderRight: this.props.active ? '5px solid rgba(0,0,0,0)' : '5px solid rgba(0,0,0,0)',
+ backgroundColor: this.props.active ? '#313131' : 'rgba(0,0,0,0)'
+ }
+
+ const iconContainerStyle = {
+ width: 20,
+ height: 20,
+ textAlign: 'center',
+ float: 'left'
+ }
+
+ const imageContainerStyle = {
+ width: 30,
+ height: 30,
+ textAlign: 'center',
+ float: 'left'
+ }
+
+ const iconStyle = {
+ }
+
+ const labelStyle = {
+ fontWeight: 'bold',
+ marginTop: 3,
+ fontSize: 12,
+ marginLeft: 30
+ }
+ const icon = this.props.image
+ ? GTFS Data
Manager
}
+
+ Manager
+ 
+
+ :
+
+ const tooltip =
+ {icon}
+ {this.props.expanded
+ ?
+ )
+ const navItem = this.props.link
+ ?
+ {container}
+
+ : container
+ return this.props.expanded
+ ? navItem
+ : {this.props.label}
+ : null
+ }
+
+
- {this.props.title}
- this.props.close() }
- />
-
)
+ const title = (
+
+ {this.props.title}
+
+ )
return (
-
{this.props.message && this.state.visible
?
+ bsStyle='info'
+ bsSize='large'
+ onClick={() => this.clear()}
+ >
+ {this.props.message}
+
: null
}
diff --git a/src/main/client/common/components/StatusModal.js b/lib/common/components/StatusModal.js
similarity index 97%
rename from src/main/client/common/components/StatusModal.js
rename to lib/common/components/StatusModal.js
index 4b2a10c31..8414c89b3 100644
--- a/src/main/client/common/components/StatusModal.js
+++ b/lib/common/components/StatusModal.js
@@ -14,7 +14,7 @@ export default class StatusModal extends React.Component {
this.setState({
showModal: true,
title: newProps.title,
- body: newProps.body,
+ body: newProps.body
})
}
}
diff --git a/src/main/client/common/components/TimezoneSelect.js b/lib/common/components/TimezoneSelect.js
similarity index 60%
rename from src/main/client/common/components/TimezoneSelect.js
rename to lib/common/components/TimezoneSelect.js
index d55f75b2b..beef5cd54 100644
--- a/src/main/client/common/components/TimezoneSelect.js
+++ b/lib/common/components/TimezoneSelect.js
@@ -1,19 +1,21 @@
import React, { PropTypes } from 'react'
-import fetch from 'isomorphic-fetch'
-import { Glyphicon, Label, FormControl } from 'react-bootstrap'
-import { PureComponent, shallowEqual } from 'react-pure-render'
+import { Glyphicon } from 'react-bootstrap'
+import { shallowEqual } from 'react-pure-render'
import Select from 'react-select'
// import timezones from '../util/timezones'
-import moment_tz from 'moment-timezone'
+import momentTZ from 'moment-timezone'
import { getComponentMessages, getMessage } from '../util/config'
export default class TimezoneSelect extends React.Component {
- constructor(props) {
+ static propTypes = {
+ value: PropTypes.string
+ }
+ constructor (props) {
super(props)
this.state = {
value: this.props.value
- };
+ }
}
cacheOptions (options) {
@@ -29,16 +31,16 @@ export default class TimezoneSelect extends React.Component {
}
}
renderOption (option) {
- return {option.region ?
{isStarred
- ?
+ {
+ createSnapshot(feedSource, name, comment)
+ }}
+ />
+
+
+
+
+
+ )
+ }
+}
+
+class SnapshotItem extends Component {
+ static propTypes = {
+ snapshot: PropTypes.object,
+ feedSource: PropTypes.object
+ }
+ render () {
+ const {
+ snapshot,
+ feedSource,
+ restoreSnapshot,
+ downloadSnapshot,
+ exportSnapshotAsVersion,
+ deleteSnapshot
+ } = this.props
+ const dateFormat = getConfigProperty('application.date_format')
+ const timeFormat = 'h:MMa'
+ const messages = getComponentMessages('EditorFeedSourcePanel')
+ return (
+
+
+ )
+ }
+}
diff --git a/src/main/client/editor/components/EditorHelpModal.js b/lib/editor/components/EditorHelpModal.js
similarity index 73%
rename from src/main/client/editor/components/EditorHelpModal.js
rename to lib/editor/components/EditorHelpModal.js
index 02232540c..b1cec30c0 100644
--- a/src/main/client/editor/components/EditorHelpModal.js
+++ b/lib/editor/components/EditorHelpModal.js
@@ -8,10 +8,14 @@ export default class EditorHelpModal extends Component {
constructor (props) {
super(props)
this.state = {
- showModal: this.props.show
+ showModal: this.props.show,
+ hideTutorial: this.props.hideTutorial
}
}
close () {
+ if (this.state.hideTutorial !== this.props.hideTutorial) {
+ this.props.setTutorialHidden(!this.props.hideTutorial)
+ }
this.setState({ showModal: false })
}
open () {
@@ -32,21 +36,21 @@ export default class EditorHelpModal extends Component {
- 
+
-
+
-
+
- Do not show when editor opens
+
+ this.setState({hideTutorial: !this.state.hideTutorial})}
+ >
+ Do not show when editor opens
+
+
diff --git a/lib/editor/components/EditorInput.js b/lib/editor/components/EditorInput.js
new file mode 100644
index 000000000..d56e0c26a
--- /dev/null
+++ b/lib/editor/components/EditorInput.js
@@ -0,0 +1,540 @@
+import React, {Component, PropTypes} from 'react'
+import { Checkbox, FormControl, FormGroup, ControlLabel, Tooltip, OverlayTrigger } from 'react-bootstrap'
+import Select from 'react-select'
+import reactCSS from 'reactcss'
+import moment from 'moment'
+import DateTimeField from 'react-bootstrap-datetimepicker'
+import { sentence as toSentenceCase } from 'change-case'
+
+import { getEntityName } from '../util/gtfs'
+import VirtualizedEntitySelect from './VirtualizedEntitySelect'
+import GtfsSearch from '../../gtfs/components/gtfssearch'
+import TimezoneSelect from '../../common/components/TimezoneSelect'
+import LanguageSelect from '../../common/components/LanguageSelect'
+import { SketchPicker } from 'react-color'
+import Dropzone from 'react-dropzone'
+
+export default class EditorInput extends Component {
+ static propTypes = {
+ entities: PropTypes.array
+ }
+ constructor (props) {
+ super(props)
+ this.state = {
+ color: {
+ r: '241',
+ g: '112',
+ b: '19',
+ a: '1'
+ }
+ }
+ }
+ handleClick (field) {
+ this.setState({ [field]: !this.state[field] })
+ }
+ handleClose (field) {
+ this.setState({ [field]: !this.state[field] })
+ }
+ render () {
+ const {
+ activeEntity,
+ updateActiveEntity,
+ activeComponent,
+ uploadBrandingAsset,
+ feedSource,
+ getGtfsEntity,
+ fieldEdited,
+ gtfsEntitySelected,
+ tableData,
+ row,
+ field,
+ currentValue,
+ approveGtfsDisabled,
+ zoneOptions,
+ table,
+ isNotValid
+ } = this.props
+ const formProps = {
+ controlId: `${editorField}`,
+ className: `col-xs-${field.columnWidth}`
+ }
+ if (isNotValid) {
+ formProps.validationState = 'error'
+ } else if (field.required) {
+ formProps.validationState = 'success'
+ }
+ const simpleFormProps = {
+ controlId: `${editorField}`,
+ className: `col-xs-${field.columnWidth}`
+ }
+ const styles = reactCSS({
+ 'default': {
+ swatch: {
+ padding: '5px',
+ marginRight: '30px',
+ background: '#fff',
+ zIndex: 1,
+ borderRadius: '1px',
+ boxShadow: '0 0 0 1px rgba(0,0,0,.1)',
+ display: 'inline-block',
+ cursor: 'pointer'
+ },
+ popover: {
+ position: 'absolute',
+ zIndex: '200'
+ },
+ cover: {
+ position: 'fixed',
+ top: '0',
+ right: '0',
+ bottom: '0',
+ left: '0'
+ }
+ }
+ })
+ const editorField = field.displayName || field.name
+ const basicLabel = field.helpContent
+ ? {field.helpContent}}>
+ {editorField}{field.required ? ' *' : ''}
+
+ : {editorField}{field.required ? ' *' : ''}
+ switch (field.inputType) {
+ case 'GTFS_ID':
+ return (
+
+ {basicLabel}
+ {
+ const props = {}
+ props[field.name] = evt.target.value
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }}
+ />
+
+ )
+ case 'TEXT':
+ case 'GTFS_TRIP':
+ case 'GTFS_SHAPE':
+ case 'GTFS_BLOCK':
+ case 'GTFS_FARE':
+ case 'GTFS_SERVICE':
+ return (
+
+ {basicLabel}
+ {
+ const props = {}
+ props[field.name] = evt.target.value
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }}
+ />
+
+ )
+ case 'URL':
+ const elements = [
+
+ {basicLabel}
+ {
+ const props = {}
+ props[field.name] = evt.target.value
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }}
+ />
+
+ ]
+ if (field.name === 'agency_branding_url' || field.name === 'route_branding_url') {
+ elements.push(
+
+ Upload {activeComponent} branding asset
+ {
+ uploadBrandingAsset(feedSource.id, activeEntity.id, activeComponent, files[0])
+ this.setState({file: files[0]})
+ }}>
+ 
+ : null
+ }
+
+
+ )
+ }
+ return {elements}
+ case 'EMAIL':
+ return (
+
+ {basicLabel}
+ {
+ const props = {}
+ props[field.name] = evt.target.value
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }}
+ />
+
+ )
+ case 'GTFS_ZONE':
+ return (
+
+ {basicLabel}
+
+ )
+ case 'TIMEZONE':
+ return (
+
+ {basicLabel}
+ {
+ const props = {}
+ props[field.name] = option.value
+ this.setState({[editorField]: option.value})
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }} />
+
+ )
+ case 'LANGUAGE':
+ return (
+
+ {basicLabel}
+ {
+ const props = {}
+ props[field.name] = option.value
+ this.setState({[editorField]: option.value})
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }} />
+
+ )
+ case 'TIME':
+ return (
+
+ {basicLabel}
+ {
+ const props = {}
+ props[field.name] = evt.target.value
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }} />
+
+ )
+ case 'LATITUDE':
+ case 'LONGITUDE':
+ return (
+
+ {basicLabel}
+ {
+ const props = {}
+ props[field.name] = evt.target.value
+ // this.setState({[editorField]: evt.target.value})
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }} />
+
+ )
+ case 'NUMBER':
+ return (
+
+ {basicLabel}
+ {
+ const props = {}
+ props[field.name] = evt.target.value
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }} />
+
+ )
+ case 'DATE':
+ const defaultValue = /end/.test(editorField) ? +moment().startOf('day').add(3, 'months') : +moment().startOf('day')
+ const dateTimeProps = {
+ mode: 'date',
+ dateTime: currentValue ? +moment(currentValue) : defaultValue,
+ onChange: (millis) => {
+ const props = {}
+ props[field.name] = +millis
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }
+ }
+ if (!currentValue) {
+ dateTimeProps.defaultText = 'Please select a date'
+ }
+ return (
+
+ {basicLabel}
+
+ )
+ case 'COLOR':
+ const hexColor = currentValue !== null ? `#${currentValue}` : '#000000'
+ const colorStyle = {
+ width: '36px',
+ height: '20px',
+ borderRadius: '2px',
+ background: hexColor
+ }
+ const wrapper = {
+ position: 'inherit',
+ zIndex: '100'
+ }
+ return (
+
+ {basicLabel}
+ {
+
+ }
+ {this.state[editorField]
+ ?
+ Active snapshot}>
+ {currentSnapshot
+ ?
+
+ :
+ No active snapshot
+
+ }
+
+ Inactive snapshots}>
+
+ {inactiveSnapshots.length === 0
+ ? No other snapshots
+ : inactiveSnapshots.map(s => {
+ return (
+
+
+
+ :
+
+
+
+ {' '}or{' '}
+
+
+ }
+
+ No snapshots loaded.
+Snapshots are save points you can always revert back to when editing a GTFS feed.
+A snapshot might represent a work-in-progress, future planning scenario or even different service patterns (e.g., summer schedule markup).
+
+
+
First slide label
Nulla vitae elit libero, a pharetra augue mollis interdum.
+
Second slide label
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
Third slide label
Praesent commodo cursus magna, vel scelerisque nisl consectetur.
@@ -55,7 +59,14 @@ export default class EditorHelpModal extends Component {Drop {activeComponent} image here, or click to select image to upload.
+ {activeEntity && activeEntity[field.name]
+ ?
+
+ {basicLabel}
+ {
+ const props = {}
+ props[field.name] = evt.target.value
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }} />
+
+ )
+ case 'POSITIVE_NUM':
+ return (
+
+ {basicLabel}
+ {
+ const props = {}
+ props[field.name] = evt.target.value
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }} />
+
+ )
+ case 'DAY_OF_WEEK_BOOLEAN':
+ return (
+
+
+ {editorField === 'monday'
+ ? Days of service : null
+ }
+
+
+ {
+ const props = {}
+ props[field.name] = evt.target.checked ? 1 : 0
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }}>
+ {toSentenceCase(editorField.substr(0, 3))}
+
+ {' '}
+
+
+ )
+ case 'DROPDOWN':
+ return (
+
+ {basicLabel}
+ {
+ const props = {}
+ props[field.name] = evt.target.value
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }}>
+ {field.options.map(option => {
+ return
+ })}
+
+
+ )
+ case 'GTFS_ROUTE':
+ const routeEntity = getGtfsEntity('route', currentValue)
+ const routeValue = routeEntity
+ ? {
+ 'value': routeEntity.route_id,
+ 'label': routeEntity.route_short_name
+ ? `${routeEntity.route_short_name} - ${routeEntity.route_long_name}`
+ : routeEntity.route_long_name
+ }
+ : ''
+ return (
+ {
+ fieldEdited(table.id, row, editorField, evt.route.route_id)
+ gtfsEntitySelected('route', evt.route)
+ }}
+ value={routeValue} />
+ )
+ case 'GTFS_AGENCY':
+ const agency = tableData.agency && tableData.agency.find(a => a.id === currentValue)
+ return (
+
+ {basicLabel}
+
+ )
+ case 'GTFS_STOP':
+ const stopIndex = tableData.stop && tableData.stop.findIndex(s => s.id === activeEntity.id)
+ const stop = tableData.stop.find(s => s.id === currentValue)
+ const stops = [...tableData.stop]
+ // remove current entity from list of stops
+ if (stopIndex !== -1) {
+ stops.splice(stopIndex, 1)
+ }
+ return (
+
+ {basicLabel}
+ {
+ console.log(input)
+ const props = {}
+ const val = input ? input.value : null
+ props[field.name] = val
+ this.setState({[editorField]: val})
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }} />
+
+ )
+ default:
+ return null
+ }
+ }
+}
diff --git a/lib/editor/components/EditorSidebar.js b/lib/editor/components/EditorSidebar.js
new file mode 100644
index 000000000..122017229
--- /dev/null
+++ b/lib/editor/components/EditorSidebar.js
@@ -0,0 +1,45 @@
+import React, {Component, PropTypes} from 'react'
+
+import { gtfsIcons } from '../util/ui'
+import ActiveSidebarNavItem from '../../common/containers/ActiveSidebarNavItem'
+import ActiveSidebar from '../../common/containers/ActiveSidebar'
+
+export default class EditorSidebar extends Component {
+
+ static propTypes = {
+ activeComponent: PropTypes.string,
+ feedSource: PropTypes.object,
+ feedInfo: PropTypes.object,
+ setActiveEntity: PropTypes.func
+ }
+ isActive (item, component) {
+ return component === item.id || component === 'scheduleexception' && item.id === 'calendar'
+ }
+ render () {
+ const { activeComponent, feedSource } = this.props
+
+ return (
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/EntityDetails.js b/lib/editor/components/EntityDetails.js
new file mode 100644
index 000000000..938b57dee
--- /dev/null
+++ b/lib/editor/components/EntityDetails.js
@@ -0,0 +1,158 @@
+import React, {Component, PropTypes} from 'react'
+import { Form } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+import { shallowEqual } from 'react-pure-render'
+
+import ActiveTripPatternList from '../containers/ActiveTripPatternList'
+import EditorInput from './EditorInput'
+import FareRulesForm from './FareRulesForm'
+import EntityDetailsHeader from './EntityDetailsHeader'
+import ScheduleExceptionForm from './ScheduleExceptionForm'
+import { getZones, getEditorTable, canApproveGtfs } from '../util'
+import { validate } from '../util/validation'
+
+export default class EntityDetails extends Component {
+
+ static propTypes = {
+ feedSource: PropTypes.object,
+ project: PropTypes.object,
+ entities: PropTypes.array,
+ activeEntity: PropTypes.object,
+ mapState: PropTypes.object,
+ activeEntityId: PropTypes.string,
+ width: PropTypes.number.isRequired,
+ setActiveEntity: PropTypes.func.isRequired,
+ saveActiveEntity: PropTypes.func.isRequired,
+ resetActiveEntity: PropTypes.func.isRequired,
+ updateActiveEntity: PropTypes.func.isRequired,
+ deleteEntity: PropTypes.func.isRequired,
+ newGtfsEntity: PropTypes.func.isRequired,
+ uploadBrandingAsset: PropTypes.func,
+ fieldEdited: PropTypes.func,
+ gtfsEntitySelected: PropTypes.func,
+ getGtfsEntity: PropTypes.func,
+ showConfirmModal: PropTypes.func,
+ updateMapSetting: PropTypes.func,
+ activeComponent: PropTypes.string.isRequired,
+ subEntityId: PropTypes.string,
+ user: PropTypes.object,
+ offset: PropTypes.number,
+ tableData: PropTypes.object,
+ entityEdited: PropTypes.bool,
+ subComponent: PropTypes.string
+ }
+ constructor (props) {
+ super(props)
+ this.state = {}
+ }
+ shouldComponentUpdate (nextProps, nextState) {
+ return !shallowEqual(nextState, this.state) || // for editFareRules
+ !shallowEqual(nextProps.feedSource, this.props.feedSource) ||
+ !shallowEqual(nextProps.subComponent, this.props.subComponent) ||
+ !shallowEqual(nextProps.subEntityId, this.props.subEntityId) ||
+ !shallowEqual(nextProps.mapState.target, this.props.mapState.target) ||
+ !shallowEqual(nextProps.entities, this.props.entities) ||
+ !shallowEqual(nextProps.activeEntity, this.props.activeEntity) ||
+ !shallowEqual(nextProps.activePattern, this.props.activePattern) ||
+ !shallowEqual(nextProps.activeEntityId, this.props.activeEntityId) ||
+ !shallowEqual(nextProps.width, this.props.width)
+ }
+ render () {
+ const {
+ activeComponent,
+ project,
+ feedSource,
+ user,
+ activeEntity,
+ width,
+ offset,
+ tableData,
+ subComponent,
+ showConfirmModal,
+ entities
+ } = this.props
+ const approveGtfsDisabled = canApproveGtfs(project, feedSource, user)
+ const panelStyle = {
+ width: `${width}px`,
+ height: '100%',
+ position: 'absolute',
+ overflowX: 'visible',
+ top: '0px',
+ left: offset || '0px',
+ zIndex: 2,
+ backgroundColor: '#F2F2F2',
+ paddingRight: '5px',
+ paddingLeft: '5px'
+ }
+ if (!activeEntity) {
+ return (
+ 0 ? 'right' : 'left'}`} transitionEnterTimeout={500} transitionLeaveTimeout={300}>
-
+
+
+ )
+ }
+ const feedVisibilityFilter = (feed) => {
+ const name = feed.name || 'unnamed'
+ const visible = name.toLowerCase().indexOf((visibilityFilter.searchText || '').toLowerCase()) !== -1
+ switch (visibilityFilter.filter) {
+ case 'ALL':
+ return visible
+ case 'STARRED':
+ return [].indexOf(feed.id) !== -1 // check userMetaData
+ case 'PUBLIC':
+ return feed.isPublic
+ case 'PRIVATE':
+ return !feed.isPublic
+ default:
+ return visible
+ }
+ // if (feed.isCreating) return true // feeds actively being created are always visible
+ }
+ return (
+ Feeds for {activeProject ? activeProject.name : '[choose project]'} {activeProject && activeProject.feedSources &&
+ {activeProject.feedSources.length}
+ }
+ }>
+
+
+ searchTextChanged(evt.target.value)}
+ />
+
+
+
+
+
+
+
+ {activeProject && activeProject.feedSources
+ ? activeProject.feedSources.filter(feedVisibilityFilter).map(fs => renderFeedItems(activeProject, fs))
+ : activeProject
+ ?
+
+ :
+
+ )
+ }
+}
diff --git a/lib/manager/components/FeedSourceTable.js b/lib/manager/components/FeedSourceTable.js
new file mode 100644
index 000000000..c0e76ab9d
--- /dev/null
+++ b/lib/manager/components/FeedSourceTable.js
@@ -0,0 +1,261 @@
+import React, { Component, PropTypes } from 'react'
+import moment from 'moment'
+
+import { Button, ListGroupItem, ListGroup, OverlayTrigger, Tooltip } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+import { shallowEqual } from 'react-pure-render'
+
+import EditableTextField from '../../common/components/EditableTextField'
+import FeedSourceDropdown from './FeedSourceDropdown'
+import { isModuleEnabled, getComponentMessages, getMessage, getConfigProperty } from '../../common/util/config'
+
+export default class FeedSourceTable extends Component {
+
+ static propTypes = {
+ feedSources: PropTypes.array,
+ project: PropTypes.object,
+ user: PropTypes.object,
+
+ isFetching: PropTypes.bool,
+
+ createDeploymentFromFeedSource: PropTypes.func,
+ deleteFeedSource: PropTypes.func,
+ updateFeedSourceProperty: PropTypes.func,
+ saveFeedSource: PropTypes.func,
+ fetchFeed: PropTypes.func,
+ uploadFeed: PropTypes.func,
+ onNewFeedSourceClick: PropTypes.func
+ }
+
+ constructor (props) {
+ super(props)
+
+ this.state = {
+ activeFeedSource: null
+ }
+ }
+
+ render () {
+ const messages = getComponentMessages('ProjectViewer')
+ const {
+ project,
+ user,
+ createDeploymentFromFeedSource,
+ deleteFeedSource,
+ uploadFeed,
+ fetchFeed,
+ isFetching,
+ feedSources,
+ updateFeedSourceProperty,
+ saveFeedSource,
+ onNewFeedSourceClick
+ } = this.props
+ const hover = createDeploymentFromFeedSource(fs)}
+ deleteFeedSource={(fs) => deleteFeedSource(fs)}
+ uploadFeed={(fs, file) => uploadFeed(fs, file)}
+ fetchFeed={(fs) => fetchFeed(fs)}
+ setHold={(fs) => this.setState({holdFeedSource: fs})}
+ />
+
+ return (
+
+ {isFetching
+ ? this.setState({activeFeedSource: fs})}
+ active={this.state.activeFeedSource && this.state.activeFeedSource.id === feedSource.id}
+ hold={this.state.holdFeedSource && this.state.holdFeedSource.id === feedSource.id}
+ />
+ })
+ :
+
+
+ }
+
+ )
+ }
+}
+
+class FeedSourceTableRow extends Component {
+
+ static propTypes = {
+ feedSource: PropTypes.object,
+ hoverComponent: PropTypes.node,
+ project: PropTypes.object,
+ user: PropTypes.object,
+
+ updateFeedSourceProperty: PropTypes.func,
+ saveFeedSource: PropTypes.func,
+ onHover: PropTypes.func,
+ active: PropTypes.bool,
+ hold: PropTypes.bool
+ }
+
+ constructor (props) {
+ super(props)
+
+ this.state = {
+ hovered: false
+ }
+ }
+ shouldComponentUpdate (nextProps, nextState) {
+ return !shallowEqual(nextProps.feedSource, this.props.feedSource) || this.props.active !== nextProps.active
+ }
+ render () {
+ const {
+ feedSource,
+ user,
+ project,
+ onHover,
+ hold,
+ active,
+ hoverComponent,
+ saveFeedSource,
+ updateFeedSourceProperty
+ } = this.props
+ // const na = (N/A)
+ const disabled = !user.permissions.hasFeedPermission(project.organizationId, project.id, feedSource.id, 'manage-feed')
+ // const dateFormat = getConfigProperty('application.date_format')
+ const messages = getComponentMessages('ProjectViewer')
+ return (
+ onHover(feedSource)}
+ onMouseLeave={() => {
+ if (!hold) {
+ onHover(null)
+ }
+ }}
+ >
+
+ )
+ }
+}
+
+class FeedSourceAttributes extends Component {
+ render () {
+ const { feedSource, messages } = this.props
+ const dateFormat = getConfigProperty('application.date_format')
+ const hasErrors = feedSource.latestValidation && feedSource.latestValidation.errorCount > 0
+ const hasVersion = feedSource.latestValidation
+ const isExpired = feedSource.latestValidation && feedSource.latestValidation.endDate < +moment()
+ const end = feedSource.latestValidation && moment(feedSource.latestValidation.endDate)
+ const endDate = end && end.format(dateFormat)
+ const timeTo = end && moment().to(end)
+ return (
+
+ {icon &&
+ )
+ return title
+ ? {title}}>
+ {li}
+
+ : li
+ }
+}
diff --git a/lib/manager/components/FeedSourceViewer.js b/lib/manager/components/FeedSourceViewer.js
new file mode 100644
index 000000000..954d591e6
--- /dev/null
+++ b/lib/manager/components/FeedSourceViewer.js
@@ -0,0 +1,316 @@
+import React, {Component, PropTypes} from 'react'
+import {Icon} from '@conveyal/woonerf'
+import Helmet from 'react-helmet'
+import { sentence as toSentenceCase } from 'change-case'
+import { LinkContainer } from 'react-router-bootstrap'
+import { Grid, Row, Col, ListGroup, ListGroupItem, Button, Badge, Panel, Glyphicon, Tabs, Tab, FormControl, InputGroup, ControlLabel, FormGroup, Checkbox } from 'react-bootstrap'
+import { Link, browserHistory } from 'react-router'
+
+import ManagerPage from '../../common/components/ManagerPage'
+import Breadcrumbs from '../../common/components/Breadcrumbs'
+import ExternalPropertiesTable from './ExternalPropertiesTable'
+import ManagerHeader from './ManagerHeader'
+import ActiveFeedVersionNavigator from '../containers/ActiveFeedVersionNavigator'
+import NotesViewer from './NotesViewer'
+import ActiveEditorFeedSourcePanel from '../../editor/containers/ActiveEditorFeedSourcePanel'
+import { isModuleEnabled, getComponentMessages, getMessage } from '../../common/util/config'
+
+export default class FeedSourceViewer extends Component {
+
+ static propTypes = {
+ feedSource: PropTypes.object,
+ feedSourceId: PropTypes.string,
+ feedVersionIndex: PropTypes.number,
+ isFetching: PropTypes.bool,
+ project: PropTypes.object,
+ routeParams: PropTypes.object,
+ user: PropTypes.object,
+ activeComponent: PropTypes.string,
+ activeSubComponent: PropTypes.string,
+
+ componentDidUpdate: PropTypes.func,
+ createDeployment: PropTypes.func,
+ deleteFeedSource: PropTypes.func,
+ deleteFeedVersionConfirmed: PropTypes.func,
+ downloadFeedClicked: PropTypes.func,
+ externalPropertyChanged: PropTypes.func,
+ feedSourcePropertyChanged: PropTypes.func,
+ feedVersionRenamed: PropTypes.func,
+ gtfsPlusDataRequested: PropTypes.func,
+ loadFeedVersionForEditing: PropTypes.func,
+ newNotePostedForFeedSource: PropTypes.func,
+ newNotePostedForVersion: PropTypes.func,
+ notesRequestedForFeedSource: PropTypes.func,
+ notesRequestedForVersion: PropTypes.func,
+ onComponentMount: PropTypes.func,
+ fetchFeed: PropTypes.func,
+ updateUserSubscription: PropTypes.func,
+ uploadFeed: PropTypes.func,
+ fetchValidationResult: PropTypes.func
+ }
+
+ constructor (props) {
+ super(props)
+ this.state = {}
+ }
+ componentWillMount () {
+ this.props.onComponentMount(this.props)
+ // this.setState({willMount: true})
+ }
+ componentDidMount () {
+ this.setState({didMount: true})
+ }
+ componentDidUpdate (prevProps) {
+ this.props.componentDidUpdate(prevProps, this.props)
+ if (this.props.feedSource && this.state.didMount) {
+ this.setState({didMount: false})
+ }
+ }
+ confirmDeleteFeedSource (feedSource) {
+ this.refs['page'].showConfirmModal({
+ title: 'Delete Feed Source?',
+ body: 'Are you sure you want to delete this feed source? This action cannot be undone and all feed versions will be deleted.',
+ onConfirm: () => {
+ this.props.deleteFeedSource(feedSource)
+ .then(() => browserHistory.push(`/project/${feedSource.projectId}`))
+ }
+ })
+ }
+
+ render () {
+ const fs = this.props.feedSource
+ if (this.props.isFetching && this.state.didMount) {
+ return (
+
+
+
+
+
+
+ )
+ } else if (!fs) {
+ return (
+
+
+
+
+
+
+ )
+ }
+ const {
+ user,
+ project,
+ activeComponent,
+ activeSubComponent,
+ routeParams,
+ feedSourcePropertyChanged,
+ externalPropertyChanged,
+ feedSource,
+ feedVersionIndex,
+ notesRequestedForFeedSource,
+ updateUserSubscription,
+ newNotePostedForFeedSource
+ } = this.props
+ const messages = getComponentMessages('FeedSourceViewer')
+ const disabled = !user.permissions.hasFeedPermission(project.organizationId, project.id, fs.id, 'manage-feed')
+ // const editGtfsDisabled = !user.permissions.hasFeedPermission(project.organizationId, project.id, fs.id, 'edit-gtfs')
+ const autoFetchFeed = fs.retrievalMethod === 'FETCHED_AUTOMATICALLY'
+ const resourceType = activeComponent === 'settings' && activeSubComponent && activeSubComponent.toUpperCase()
+ const activeTab = ['settings', 'comments', 'snapshots'].indexOf(activeComponent) === -1 || typeof routeParams.feedVersionIndex !== 'undefined'
+ ? ''
+ : activeComponent
+ // console.log(activeComponent, routeParams.feedVersionIndex)
+ const activeSettings = !resourceType
+ ? Settings}>
+
+
+
+ Feed source name
+
+ {
+ this.setState({name: evt.target.value})
+ }}
+ />
+
+
+
+
+
+
+
+
+ feedSourcePropertyChanged(fs, 'deployable', !fs.deployable)}>Make feed source deployable
+ Enable this feed source to be deployed to an OpenTripPlanner (OTP) instance (defined in organization settings) as part of a collection of feed sources or individually.
+
+
+
+
+ Automatic fetch}>
+
+
+
+ Feed source fetch URL
+
+ {
+ this.setState({url: evt.target.value})
+ }}
+ />
+
+
+
+
+
+
+
+
+ feedSourcePropertyChanged(fs, 'retrievalMethod', autoFetchFeed ? 'MANUALLY_UPLOADED' : 'FETCHED_AUTOMATICALLY')} bsStyle='danger'>Auto fetch feed source
+ Set this feed source to fetch automatically. (Feed source URL must be specified and project auto fetch must be enabled.)
+
+
+
+
+ Danger zone}>
+
+
+
+
+
+
+
+
+
+
+ : {
+ externalPropertyChanged(fs, resourceType, name, value)
+ }}
+ />
+
+ return (
+
+ browserHistory.push(`/feed/${fs.id}/${eventKey}`))}
+ >
+
+
+ {fs.editorSnapshots ? fs.editorSnapshots.length : 0} }
+ >
+ {fs.noteCount} }
+ onEnter={() => notesRequestedForFeedSource(fs)}
+ >
+ { notesRequestedForFeedSource(fs) }}
+ newNotePosted={(note) => { newNotePostedForFeedSource(fs, note) }}
+ />
+
+
+
+ General {toSentenceCase(resourceType)} properties
+
+
+
+
+
+
+ )
+ }
+}
diff --git a/lib/manager/components/FeedVersionNavigator.js b/lib/manager/components/FeedVersionNavigator.js
new file mode 100644
index 000000000..c6b043826
--- /dev/null
+++ b/lib/manager/components/FeedVersionNavigator.js
@@ -0,0 +1,211 @@
+import React, {Component, PropTypes} from 'react'
+import { Row, Col, ButtonGroup, ButtonToolbar, DropdownButton, MenuItem, Button, Glyphicon } from 'react-bootstrap'
+import { browserHistory } from 'react-router'
+import { LinkContainer } from 'react-router-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+
+import { isModuleEnabled, getComponentMessages, getMessage } from '../../common/util/config'
+import { isValidZipFile } from '../../common/util/util'
+import FeedVersionViewer from './FeedVersionViewer'
+import ConfirmModal from '../../common/components/ConfirmModal'
+import SelectFileModal from '../../common/components/SelectFileModal'
+
+export default class FeedVersionNavigator extends Component {
+
+ static propTypes = {
+ deleteDisabled: PropTypes.bool,
+ feedSource: PropTypes.object,
+ feedVersionIndex: PropTypes.number,
+ isPublic: PropTypes.bool,
+
+ deleteFeedVersionConfirmed: PropTypes.func,
+ downloadFeedClicked: PropTypes.func,
+ feedVersionRenamed: PropTypes.func,
+ gtfsPlusDataRequested: PropTypes.func,
+ loadFeedVersionForEditing: PropTypes.func,
+ newNotePostedForVersion: PropTypes.func,
+ notesRequestedForVersion: PropTypes.func,
+ createDeploymentFromFeedSource: PropTypes.func,
+ fetchValidationResult: PropTypes.func,
+ setVersionIndex: PropTypes.func
+ }
+ constructor (props) {
+ super(props)
+ this.state = {}
+ }
+ componentWillReceiveProps (nextProps) {
+ if (nextProps.feedVersionIndex !== this.props.feedVersionIndex && nextProps.feedSource && nextProps.feedSource.feedVersions) {
+ this.props.setVersionIndex(nextProps.feedSource, nextProps.feedVersionIndex, false)
+ }
+ }
+ render () {
+ console.log(this.props)
+ const versionTitleStyle = {
+ fontSize: '24px',
+ fontWeight: 'bold'
+ }
+ const { disabled } = this.props
+ const fs = this.props.feedSource
+ const versions = this.props.feedSource.feedVersions
+ const messages = getComponentMessages('FeedVersionNavigator')
+ const hasVersions = versions && versions.length > 0
+
+ const sortedVersions = hasVersions && versions.sort((a, b) => {
+ if (a.updated < b.updated) return -1
+ if (a.updated > b.updated) return 1
+ return 0
+ })
+
+ let version
+
+ if (typeof this.props.feedVersionIndex === 'undefined') {
+ return null
+ } else if (hasVersions && versions.length >= this.props.feedVersionIndex) {
+ version = sortedVersions[this.props.feedVersionIndex - 1]
+ } else {
+ console.log(`Error version ${this.props.feedVersionIndex} does not exist`)
+ }
+
+ return (
+
+ + + } else if (version.isochrones) { + return 'Reading transport network, please try again later.' + } else { + return 'Click on map above to show travel shed for this feed.' + } + } + renderValidatorTabs (version) { + if (!isModuleEnabled('validator')) { + return null + } + const validatorTabs = [ + { + title: 'Validation', + key: 'validation', + component: { this.props.fetchValidationResult(version) }}
+ />
+ },
+ {
+ title: 'Accessibility',
+ key: 'accessibility',
+ component:
+ {t.component}
+
+ ))
+ }
+ render () {
+ const version = this.props.version
+ const messages = getComponentMessages('FeedVersionReport')
+
+ if (!version) return
+
+
+
+
+
+
+
+
+ {isExtensionEnabled('mtc')
+ ?
+ : null
+ }
+
+
+
+ {
+ if (this.state.tab !== key) {
+ this.selectTab(key)
+ }
+ }}
+ id='uncontrolled-tab-example'
+ bsStyle='pills'
+ unmountOnExit
+ >
+
+
+ {countFields.map(c => (
+
+
+
+ this.selectTab(key)}
+ tableOptions={tableOptions}
+ />
+
+
+ this.selectTab(key)}
+ tableOptions={tableOptions}
+ />
+
+
+ this.selectTab(key)}
+ tableOptions={tableOptions}
+ />
+
+ {this.renderValidatorTabs(version)}
+
+
+
+
+
+ )
+ }
+
+ switch (this.props.versionSection) {
+ // case 'validation':
+ // return (
+ //
+ { this.props.fetchValidationResult(version) }}
+ />
+ : this.props.versionSection === 'gtfsplus' && isModuleEnabled('gtfsplus')
+ ? { this.props.notesRequested() }}
+ newNotePosted={(note) => { this.props.newNotePosted(note) }}
+ />
+ : null
+ }
+
+
+ )
+ }
+ }
+}
+
+export class VersionButtonToolbar extends Component {
+ static propTypes = {
+ version: PropTypes.object,
+ versions: PropTypes.array,
+ feedVersionIndex: PropTypes.number,
+ // versionSection: PropTypes.string,
+
+ isPublic: PropTypes.bool,
+ hasVersions: PropTypes.bool,
+
+ downloadFeedClicked: PropTypes.func,
+ deleteFeedVersionConfirmed: PropTypes.func,
+ loadFeedVersionForEditing: PropTypes.func
+ }
+ render () {
+ const version = this.props.version
+ const messages = getComponentMessages('FeedVersionViewer')
+ return (
+
+
+
+
+
+
+
+
+ {isModuleEnabled('gtfsplus')
+ ?
+
+
+
+ : null
+ }
+
+
+
+
+ )
+ }
+}
+
+class VersionList extends Component {
+ static propTypes = {
+ versions: PropTypes.array
+ }
+ getVersionDateLabel (version) {
+ const now = +moment()
+ const future = version.validationSummary && version.validationSummary.startDate > now
+ const expired = version.validationSummary && version.validationSummary.endDate < now
+ return version.validationSummary
+ ?
+ : null
+ }
+ render () {
+ return List of feed versions}>
+
+ {this.props.versions
+ ? this.props.versions.map(v => {
+ return (
+
+ {v.name}
+ {' '}
+
+ {this.getVersionDateLabel(v)}
+
+
+ )
+ })
+ :
+ No versions
+
+ }
+
+
+ }
+}
diff --git a/lib/manager/components/GeneralSettings.js b/lib/manager/components/GeneralSettings.js
new file mode 100644
index 000000000..adc5b9938
--- /dev/null
+++ b/lib/manager/components/GeneralSettings.js
@@ -0,0 +1,257 @@
+import React, {Component} from 'react'
+import {Icon} from '@conveyal/woonerf'
+import ReactDOM from 'react-dom'
+import DateTimeField from 'react-bootstrap-datetimepicker'
+import update from 'react-addons-update'
+import { shallowEqual } from 'react-pure-render'
+import moment from 'moment'
+import { Row, Col, Button, Panel, Glyphicon, Checkbox, FormGroup, InputGroup, ControlLabel, FormControl, ListGroup, ListGroupItem } from 'react-bootstrap'
+
+import { getMessage, getComponentMessages } from '../../common/util/config'
+import TimezoneSelect from '../../common/components/TimezoneSelect'
+import LanguageSelect from '../../common/components/LanguageSelect'
+
+export default class GeneralSettings extends Component {
+ constructor (props) {
+ super(props)
+ this.state = {
+ general: {}
+ }
+ }
+ componentWillReceiveProps (nextProps) {
+ this.setState({
+ general: {}
+ })
+ }
+ shouldComponentUpdate (nextProps, nextState) {
+ return !shallowEqual(nextProps, this.props) || !shallowEqual(nextState, this.state)
+ }
+ render () {
+ const messages = getComponentMessages('ProjectSettings')
+ const { project, editDisabled, updateProjectSettings, deleteProject } = this.props
+ const noEdits = Object.keys(this.state.general).length === 0 && this.state.general.constructor === Object
+ const autoFetchChecked = typeof this.state.general.autoFetchFeeds !== 'undefined' ? this.state.general.autoFetchFeeds : project.autoFetchFeeds
+ const DEFAULT_FETCH_TIME = moment().startOf('day').add(2, 'hours')
+ return (
+ {/* Title + Shortcut Buttons Row */}
+
+
+
+ )
+ }
+}
diff --git a/src/main/client/manager/components/NotesViewer.js b/lib/manager/components/NotesViewer.js
similarity index 56%
rename from src/main/client/manager/components/NotesViewer.js
rename to lib/manager/components/NotesViewer.js
index 0121f48bd..15415a88e 100644
--- a/src/main/client/manager/components/NotesViewer.js
+++ b/lib/manager/components/NotesViewer.js
@@ -1,7 +1,6 @@
import React, {Component, PropTypes} from 'react'
import moment from 'moment'
import gravatar from 'gravatar'
-import ReactDOM from 'react-dom'
import { Panel, Row, Col, Glyphicon, FormControl, Button, ButtonToolbar, Media } from 'react-bootstrap'
import WatchButton from '../../common/containers/WatchButton'
@@ -31,65 +30,74 @@ export default class NotesViewer extends Component {
this.props.notesRequested(this.props.feedSource)
}
render () {
+ const {
+ user,
+ feedSource,
+ stacked,
+ version,
+ notesRequested,
+ notes,
+ newNotePosted
+ } = this.props
const messages = getComponentMessages('NotesViewer')
- const userLink = this.props.user ? {this.props.user.profile.email} : 'Unknown user'
- const isWatchingComments = this.props.feedSource
- ? this.props.user.subscriptions.hasFeedSubscription(this.props.feedSource.projectId, this.props.feedSource.id, 'feed-commented-on')
+ const userLink = user ? {user.profile.email} : 'Unknown user'
+ const isWatchingComments = feedSource
+ ? user.subscriptions.hasFeedSubscription(feedSource.projectId, feedSource.id, 'feed-commented-on')
: false
return (
-
- {this.props.notes && this.props.notes.length > 0
- ? this.props.notes.map(note => {
- return (
-
-
- 
-
-
-
- {this.props.user.profile.email} commented {moment(note.date).fromNow()}
-
- }
- >
+ {notes && notes.length > 0
+ ? notes.map(note => {
+ return (
+
+
+
+
+
+
+ {user.profile.email} commented {moment(note.date).fromNow()}
+
+ }
+ >
-
-
- )
- })
+
+
+
+ )
+ })
:
-
- 
+
+ 
{userLink}}>
@@ -106,7 +114,7 @@ export default class NotesViewer extends Component {
style={{marginTop: '10px'}}
disabled={this.state.value === ''}
onClick={() => {
- this.props.newNotePosted({
+ newNotePosted({
body: this.state.value
})
this.setState({value: ''})
diff --git a/src/main/client/manager/components/NotesViewerPanel.js b/lib/manager/components/NotesViewerPanel.js
similarity index 100%
rename from src/main/client/manager/components/NotesViewerPanel.js
rename to lib/manager/components/NotesViewerPanel.js
diff --git a/lib/manager/components/ProjectSettings.js b/lib/manager/components/ProjectSettings.js
new file mode 100644
index 000000000..2e901ddd1
--- /dev/null
+++ b/lib/manager/components/ProjectSettings.js
@@ -0,0 +1,56 @@
+import React, {Component, PropTypes} from 'react'
+import { LinkContainer } from 'react-router-bootstrap'
+
+import { Row, Col, Panel, ListGroup, ListGroupItem } from 'react-bootstrap'
+import GeneralSettings from './GeneralSettings'
+import DeploymentSettings from './DeploymentSettings'
+import { isModuleEnabled, getComponentMessages, getMessage } from '../../common/util/config'
+import MapModal from '../../common/components/MapModal.js'
+
+export default class ProjectSettings extends Component {
+ static propTypes = {
+ project: PropTypes.object,
+ projectEditDisabled: PropTypes.bool,
+ updateProjectSettings: PropTypes.func,
+ deleteProject: PropTypes.func
+ }
+ render () {
+ const {
+ project,
+ projectEditDisabled,
+ activeSettingsPanel,
+ updateProjectSettings,
+ deleteProject
+ } = this.props
+ const messages = getComponentMessages('ProjectSettings')
+ const activePanel = !activeSettingsPanel
+ ?
+
+
+ {getMessage(messages, 'general.title')} {getMessage(messages, 'deployment.title')}
+
+
+
+ )
+ }
+}
diff --git a/lib/manager/components/ProjectViewer.js b/lib/manager/components/ProjectViewer.js
new file mode 100644
index 000000000..7c6a09239
--- /dev/null
+++ b/lib/manager/components/ProjectViewer.js
@@ -0,0 +1,324 @@
+import React, {Component, PropTypes} from 'react'
+import Helmet from 'react-helmet'
+import { Tabs, Tab, Grid, Row, Col, Button, InputGroup, ListGroup, ListGroupItem, FormControl, Glyphicon, ButtonToolbar, Panel, DropdownButton, MenuItem } from 'react-bootstrap'
+import { sentence as toSentenceCase } from 'change-case'
+import {Icon} from '@conveyal/woonerf'
+import { browserHistory, Link } from 'react-router'
+import { shallowEqual } from 'react-pure-render'
+
+import ManagerPage from '../../common/components/ManagerPage'
+import Breadcrumbs from '../../common/components/Breadcrumbs'
+import WatchButton from '../../common/containers/WatchButton'
+import ProjectSettings from './ProjectSettings'
+import DeploymentsPanel from './DeploymentsPanel'
+import FeedSourceTable from './FeedSourceTable'
+import ThirdPartySyncButton from './ThirdPartySyncButton'
+import { defaultSorter } from '../../common/util/util'
+import { isModuleEnabled, isExtensionEnabled, getComponentMessages, getMessage, getConfigProperty } from '../../common/util/config'
+
+export default class ProjectViewer extends Component {
+ static propTypes = {
+ project: PropTypes.object,
+ onComponentMount: PropTypes.func,
+
+ visibilityFilter: PropTypes.object,
+ visibilityFilterChanged: PropTypes.func,
+ searchTextChanged: PropTypes.func
+ }
+ constructor (props) {
+ super(props)
+
+ this.state = {}
+ }
+
+ deleteFeedSource (feedSource) {
+ this.refs['page'].showConfirmModal({
+ title: 'Delete Feed Source?',
+ body: `Are you sure you want to delete the feed source ${feedSource.name}?`,
+ onConfirm: () => {
+ console.log('OK, deleting')
+ this.props.deleteFeedSourceConfirmed(feedSource)
+ }
+ })
+ }
+ _selectTab (key) {
+ if (key === 'sources') {
+ browserHistory.push(`/project/${this.props.project.id}/`)
+ } else {
+ browserHistory.push(`/project/${this.props.project.id}/${key}`)
+ }
+ if (key === 'deployments' && !this.props.project.deployments) {
+ this.props.deploymentsRequested()
+ }
+ }
+ showUploadFeedModal (feedSource) {
+ this.refs.page.showSelectFileModal({
+ title: 'Upload Feed',
+ body: 'Select a GTFS feed to upload:',
+ onConfirm: (files) => {
+ const nameArray = files[0].name.split('.')
+ if (files[0].type !== 'application/zip' || nameArray[nameArray.length - 1] !== 'zip') {
+ return false
+ } else {
+ this.props.uploadFeedClicked(feedSource, files[0])
+ return true
+ }
+ },
+ errorMessage: 'Uploaded file must be a valid zip file (.zip).'
+ })
+ }
+ shouldComponentUpdate (newProps) {
+ if (!shallowEqual(newProps, this.props)) {
+ return true
+ } else {
+ return false
+ }
+ }
+ componentWillMount () {
+ this.props.onComponentMount(this.props)
+ }
+ render () {
+ const {
+ project,
+ user,
+ visibilityFilter,
+ visibilityFilterChanged,
+ searchTextChanged,
+ onNewFeedSourceClick,
+ thirdPartySync,
+ updateAllFeeds,
+ downloadMergedFeed,
+ activeComponent,
+ deployPublic,
+ activeSubComponent
+ } = this.props
+ if (!project) {
+ return
+
+ {
+ visibilityFilterChanged(key)
+ }}
+ >
+
+
+
+
+
+ searchTextChanged(evt.target.value)}
+ />
+
+
+
+ {isExtensionEnabled('transitland') || isExtensionEnabled('transitfeeds') || isExtensionEnabled('mtc')
+ ?
+
+
+ )
+ return (
+
+
+
+
+
+ this._selectTab(key)}
+ >
+
+
+
+
+
+ What is a feed source?}>
+ A feed source defines the location or upstream source of a GTFS feed. GTFS can be populated via automatic fetch, directly editing or uploading a zip file.
+
+
+
+
+ {isModuleEnabled('deployment')
+ ?
+
+
+ )
+ }
+}
+
+class ProjectSummaryPanel extends Component {
+ render () {
+ const { project, feedSources } = this.props
+ const errorCount = feedSources.map(fs => fs.latestValidation ? fs.latestValidation.errorCount : 0).reduce((a, b) => a + b, 0)
+ const serviceSeconds = feedSources.map(fs => fs.latestValidation ? fs.latestValidation.avgDailyRevenueTime : 0).reduce((a, b) => a + b, 0)
+ return (
+ {project.name} summary}>
+
+ Number of feeds: {feedSources.length}
+ Total errors: {errorCount}
+ Total service: {Math.floor(serviceSeconds / 60 / 60 * 100) / 100} hours per weekday
+
+
+ )
+ }
+}
diff --git a/lib/manager/components/ProjectsList.js b/lib/manager/components/ProjectsList.js
new file mode 100644
index 000000000..23cd3c02f
--- /dev/null
+++ b/lib/manager/components/ProjectsList.js
@@ -0,0 +1,134 @@
+import React, {Component, PropTypes} from 'react'
+import Helmet from 'react-helmet'
+import { Grid, Row, Col, Button, Table, FormControl, Panel, OverlayTrigger, Popover, Glyphicon } from 'react-bootstrap'
+
+import ManagerPage from '../../common/components/ManagerPage'
+import EditableTextField from '../../common/components/EditableTextField'
+import defaultSorter from '../../common/util/util'
+import { getComponentMessages, getMessage } from '../../common/util/config'
+
+export default class ProjectsList extends Component {
+ static propTypes = {
+ projects: PropTypes.array,
+ user: PropTypes.object,
+ visibilitySearchText: PropTypes.object,
+ onNewProjectClick: PropTypes.func,
+ searchTextChanged: PropTypes.func,
+ saveProject: PropTypes.func,
+ projectNameChanged: PropTypes.func
+ }
+ componentWillMount () {
+ this.props.onComponentMount(this.props)
+ }
+ _newProjectClicked = () => {
+ const project = {}
+ if (this.props.user.permissions.getOrganizationId()) {
+ project.organizationId = this.props.user.permissions.getOrganizationId()
+ }
+ this.props.onNewProjectClick(project)
+ }
+ render () {
+ const {
+ projects,
+ user,
+ visibilitySearchText,
+ searchTextChanged,
+ saveProject,
+ projectNameChanged
+ } = this.props
+ if (!projects) {
+ return
+
+ Projects)}>
+
+ searchTextChanged(evt.target.value)}
+ />
+
+ {getMessage(messages, 'help.content')}}>
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+ }
+}
diff --git a/lib/manager/components/RecentActivity.js b/lib/manager/components/RecentActivity.js
new file mode 100644
index 000000000..4251cb471
--- /dev/null
+++ b/lib/manager/components/RecentActivity.js
@@ -0,0 +1,59 @@
+import React, {Component, PropTypes} from 'react'
+import moment from 'moment'
+import {Icon} from '@conveyal/woonerf'
+import { Link } from 'react-router'
+
+import { getProfileLink } from '../../common/util/util'
+
+export default class RecentActivity extends Component {
+ static propTypes = {
+ item: PropTypes.object
+ }
+ render () {
+ const { item } = this.props
+ const containerStyle = {
+ marginTop: 10,
+ paddingBottom: 12,
+ borderBottom: '1px solid #ddd'
+ }
+
+ const iconStyle = {
+ float: 'left',
+ fontSize: 20,
+ color: '#bbb'
+ }
+
+ const dateStyle = {
+ color: '#999',
+ fontSize: 11,
+ marginBottom: 2
+ }
+
+ const innerContainerStyle = {
+ marginLeft: 36
+ }
+
+ const commentStyle = {
+ backgroundColor: '#f0f0f0',
+ marginTop: 8,
+ padding: 8,
+ fontSize: 12
+ }
+
+ switch (item.type) {
+ case 'feed-commented-on':
+ return (
+
+
+
+
+ 
+
+
+
+ )
+ }
+}
diff --git a/lib/manager/components/UserHomePage.js b/lib/manager/components/UserHomePage.js
new file mode 100644
index 000000000..638e26da8
--- /dev/null
+++ b/lib/manager/components/UserHomePage.js
@@ -0,0 +1,119 @@
+import React, {Component, PropTypes} from 'react'
+import { Grid, Row, Col, Button, ButtonToolbar, Jumbotron } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+import { LinkContainer } from 'react-router-bootstrap'
+import objectPath from 'object-path'
+
+import ManagerPage from '../../common/components/ManagerPage'
+import RecentActivity from './RecentActivity'
+import UserAccountInfoPanel from './UserAccountInfoPanel'
+import FeedSourcePanel from './FeedSourcePanel'
+import HomeProjectDropdown from './HomeProjectDropdown'
+import { getConfigProperty } from '../../common/util/config'
+import { defaultSorter } from '../../common/util/util'
+
+export default class UserHomePage extends Component {
+
+ static propTypes = {
+ user: PropTypes.object,
+ projects: PropTypes.array,
+ project: PropTypes.object,
+
+ onComponentMount: PropTypes.func,
+ logoutHandler: PropTypes.func,
+ fetchProjectFeeds: PropTypes.func,
+
+ visibilityFilter: PropTypes.object,
+ searchTextChanged: PropTypes.func,
+ visibilityFilterChanged: PropTypes.func
+ }
+ constructor (props) {
+ super(props)
+ this.state = {}
+ }
+ componentWillMount () {
+ this.props.onComponentMount(this.props)
+ }
+ componentWillReceiveProps (nextProps) {
+ const nextId = objectPath.get(nextProps, 'project.id')
+ const id = objectPath.get(this.props, 'project.id')
+ if (nextId && nextId !== id && !nextProps.project.feedSources) {
+ this.props.fetchProjectFeeds(nextProps.project.id)
+ }
+ }
+ componentWillUnmount () {
+ this.setState({showLoading: true})
+ }
+ render () {
+ const {
+ projects,
+ project,
+ user,
+ logoutHandler,
+ // setActiveProject,
+ visibilityFilter,
+ searchTextChanged,
+ visibilityFilterChanged
+ } = this.props
+ // const projectCreationDisabled = !this.props.user.permissions.isApplicationAdmin()
+ const visibleProjects = projects.sort(defaultSorter)
+ const activeProject = project
+ const sortByDate = (a, b) => {
+ if (a.date < b.date) return 1
+ if (a.date > b.date) return -1
+ return 0
+ }
+
+ return (
+
+
+ {this.state.showLoading ?
+
+
+ {/* Recent Activity List */}
+
+
+ {user.recentActivity && user.recentActivity.length
+ ? user.recentActivity.sort(sortByDate).map(item => {
+ return
+
+
+ )
+ }
+}
diff --git a/lib/manager/components/reporter/components/DateTimeFilter.js b/lib/manager/components/reporter/components/DateTimeFilter.js
new file mode 100644
index 000000000..441e5542f
--- /dev/null
+++ b/lib/manager/components/reporter/components/DateTimeFilter.js
@@ -0,0 +1,100 @@
+import React, { Component, PropTypes } from 'react'
+import { Row, Col, FormControl, Alert } from 'react-bootstrap'
+import moment from 'moment'
+import DateTimeField from 'react-bootstrap-datetimepicker'
+
+const timeOptions = [
+ {
+ label: 'Morning peak (6am - 9am)',
+ from: 60 * 60 * 6,
+ to: 60 * 60 * 9
+ },
+ {
+ label: 'Midday peak (11am - 2pm)',
+ from: 60 * 60 * 11,
+ to: 60 * 60 * 14
+ },
+ {
+ label: 'Afternoon peak (4pm - 7pm)',
+ from: 60 * 60 * 16,
+ to: 60 * 60 * 19
+ },
+ {
+ label: 'Evening service (7pm - 10pm)',
+ from: 60 * 60 * 19,
+ to: 60 * 60 * 22
+ },
+ {
+ label: '24 hours (12am - 11:59pm)',
+ from: 0,
+ to: 60 * 60 * 24 - 1 // 86399
+ }
+]
+
+export default class DateTimeFilter extends Component {
+ static propTypes = {
+ onChange: PropTypes.func,
+ dateTime: PropTypes.object,
+ version: PropTypes.object,
+
+ updateDateTimeFilter: PropTypes.func
+ }
+ render () {
+ const dateTime = this.props.dateTime || {date: null, from: null, to: null}
+ const dateTimeProps = {
+ mode: 'date',
+ dateTime: dateTime.date ? +moment(dateTime.date, 'YYYY-MM-DD') : +moment(),
+ onChange: (millis) => {
+ console.log(+millis)
+ const date = moment(+millis).format('YYYY-MM-DD')
+ console.log(date)
+ this.props.updateDateTimeFilter({date})
+ this.props.onChange && this.props.onChange({date})
+ }
+ }
+ if (!dateTime.date) {
+ dateTimeProps.defaultText = 'Please select a date'
+ }
+ const validDate = this.props.version && moment(dateTime.date).isBetween(this.props.version.validationSummary.startDate, this.props.version.validationSummary.endDate)
+ console.log(validDate, this.props, moment(dateTime.date).isBetween(this.props.version.validationSummary.startDate, this.props.version.validationSummary.endDate))
+ return (
+
+ Reports
+
+ {this.props.activeTab === 'feed' &&
+
+ )
+ }
+}
diff --git a/lib/manager/components/reporter/components/PatternLayout.js b/lib/manager/components/reporter/components/PatternLayout.js
new file mode 100644
index 000000000..26726f2da
--- /dev/null
+++ b/lib/manager/components/reporter/components/PatternLayout.js
@@ -0,0 +1,102 @@
+import React, { Component, PropTypes } from 'react'
+import { Row, Col, Alert, Button } from 'react-bootstrap'
+import {BootstrapTable, TableHeaderColumn} from 'react-bootstrap-table'
+import Select from 'react-select'
+import clone from 'clone'
+
+import { formatHeadway, formatSpeed } from '../../../../gtfs/util/stats'
+import ActiveDateTimeFilter from '../containers/ActiveDateTimeFilter'
+import Loading from '../../../../common/components/Loading'
+
+export default class PatternLayout extends Component {
+ static propTypes = {
+ onComponentMount: PropTypes.func,
+ patternRouteFilterChange: PropTypes.func,
+ patternDateTimeFilterChange: PropTypes.func,
+
+ version: PropTypes.object,
+ routes: PropTypes.object,
+ patterns: PropTypes.object,
+ tableOptions: PropTypes.object
+ }
+ componentWillMount () {
+ this.props.onComponentMount(this.props)
+ }
+ render () {
+ const self = this
+ const rows = this.props.patterns.data.map(p => {
+ const flat = clone(p)
+ if (p.stats) {
+ delete flat.stats
+ for (const key in p.stats) {
+ flat[key] = p.stats[key]
+ }
+ }
+ return flat
+ })
+ return (
+
+ {
+ this.setState({activeTab: key})
+ setTimeout(() => {
+ const map = this.refs[key + '-map']
+ if (map) map.initializeMap()
+ }, 100) // Adjust timeout to tab transition
+ }}
+ >
+
+
+ { this.props.fetchValidationResult(version) }}
+ />
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+ }
+}
diff --git a/src/main/client/manager/components/validation/GtfsValidationSummary.js b/lib/manager/components/validation/GtfsValidationSummary.js
similarity index 65%
rename from src/main/client/manager/components/validation/GtfsValidationSummary.js
rename to lib/manager/components/validation/GtfsValidationSummary.js
index d333693d2..ddb90c740 100644
--- a/src/main/client/manager/components/validation/GtfsValidationSummary.js
+++ b/lib/manager/components/validation/GtfsValidationSummary.js
@@ -1,36 +1,42 @@
-import React from 'react'
-import { Panel, Table, Glyphicon, Button } from 'react-bootstrap'
-import { browserHistory } from 'react-router'
+import React, { Component, PropTypes } from 'react'
+import { Table, Button } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+import { LinkContainer } from 'react-router-bootstrap'
-export default class GtfsValidationSummary extends React.Component {
+import Loading from '../../../common/components/Loading'
+export default class GtfsValidationSummary extends Component {
+ static propTypes = {
+ version: PropTypes.object,
+ feedVersionIndex: PropTypes.number,
+ fetchValidationResult: PropTypes.func
+ }
constructor (props) {
super(props)
this.state = { expanded: false }
}
-
+ componentWillMount () {
+ if (!this.props.version.validationResult) {
+ this.props.fetchValidationResult()
+ }
+ }
componentWillReceiveProps (nextProps) {
- if(!nextProps.validationResult) this.setState({ expanded: false })
+ if (!nextProps.version.validationResult) {
+ this.setState({ expanded: false })
+ }
}
-
render () {
-
- const result = this.props.validationResult
- let errors = {}
+ const result = this.props.version.validationResult
+ if (!result) {
+ return {
- if(!result) this.props.fetchValidationResult()
- this.setState({ expanded: !this.state.expanded })
- }}>
-
- )
let report = null
const tableStyle = {
@@ -75,6 +81,16 @@ export default class GtfsValidationSummary extends React.Component {
return (
0 )}
+// >
+// No issues found.
+// {this.props.invalidValues.length} )}
+// >
+//
+//
+//
+//
{
+ e.preventDefault()
+ // if [Esc] is pressed (for accessibility)
+ if (e.keyCode === 27) {
+ this.handleClose(editorField)
+ }
+ }}
+ onClick={() => this.handleClose(editorField)} />
+
+ : null
+ }
+
+ )
+ case 'POSITIVE_INT':
+ return (
+
+ {
+ const props = {}
+ props[field.name] = color.hex.split('#')[1]
+ updateActiveEntity(activeEntity, activeComponent, props)
+ }} />
+
+
+
+ )
+ }
+ const {zones, zoneOptions} = getZones(tableData.stop, activeEntity)
+ const rowIndex = 0
+ const validationErrors = []
+ const currentTable = getEditorTable(activeComponent)
+ const renderDefault = subComponent !== 'trippattern' && !this.state.editFareRules && activeComponent !== 'scheduleexception'
+ const inputs = renderDefault && currentTable.fields.map((field, colIndex) => {
+ const isNotValid = validate(field.inputType, field.required, field.name, activeEntity[field.name], entities, activeEntity.id)
+ isNotValid && validationErrors.push(isNotValid)
+ return (
+
+
+
+
+
+
+
+ {/* Render relevant form based on entity type */}
+ {subComponent === 'trippattern'
+ ? validationErrors.push(invalid)} />
+ :
+ )
+ return (
+
+
+
+ }
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/EntityDetailsHeader.js b/lib/editor/components/EntityDetailsHeader.js
new file mode 100644
index 000000000..59a2b2a39
--- /dev/null
+++ b/lib/editor/components/EntityDetailsHeader.js
@@ -0,0 +1,180 @@
+import React, {Component, PropTypes} from 'react'
+import update from 'react-addons-update'
+import {Icon} from '@conveyal/woonerf'
+import { Button, ButtonToolbar, Tooltip, OverlayTrigger, Nav, NavItem } from 'react-bootstrap'
+
+import { getEntityBounds, getEntityName } from '../util/gtfs'
+import { gtfsIcons } from '../util/ui'
+
+export default class EntityDetailsHeader extends Component {
+ static propTypes = {
+ activeComponent: PropTypes.string
+ }
+ render () {
+ const {
+ activeComponent,
+ subComponent,
+ mapState,
+ subEntityId,
+ updateMapSetting,
+ entityEdited,
+ resetActiveEntity,
+ saveActiveEntity,
+ activeEntity,
+ activePattern,
+ validationErrors,
+ setActiveEntity,
+ feedSource,
+ tableData,
+ editFareRules,
+ toggleEditFareRules
+ } = this.props
+ const entityName = activeComponent === 'feedinfo' ? 'Feed Info' : getEntityName(activeComponent, activeEntity)
+ const icon = gtfsIcons.find(i => i.id === activeComponent)
+ const iconName = icon ? icon.icon : null
+ return (
+
+ this.setState({editFareRules: bool})}
+ {...this.props} />
+ {detailsBody}
+
+
+
+
+ {!tableData[activeComponent] && activeComponent === 'feedinfo'
+ ? Complete feed info to begin editing GTFS.
+ : null
+ }
+ {validationErrors.length > 0
+ ? Fix validation issues before saving
+ : null
+ }
+ {activeComponent === 'route'
+ ?
+ : activeComponent === 'fare'
+ ?
+ : null
+ }
+
+ )
+ }
+}
diff --git a/lib/editor/components/EntityList.js b/lib/editor/components/EntityList.js
new file mode 100644
index 000000000..2c20ae2da
--- /dev/null
+++ b/lib/editor/components/EntityList.js
@@ -0,0 +1,266 @@
+import React, {Component, PropTypes} from 'react'
+import { Button, Nav, NavItem } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+import { Table, Column } from 'react-virtualized'
+import { shallowEqual } from 'react-pure-render'
+
+import VirtualizedEntitySelect from './VirtualizedEntitySelect'
+import EntityListButtons from './EntityListButtons'
+import { getEntityName } from '../util/gtfs'
+
+export default class EntityList extends Component {
+ static propTypes = {
+ feedSource: PropTypes.object,
+ entities: PropTypes.array,
+ activeEntity: PropTypes.object,
+ activeEntityId: PropTypes.string,
+ width: PropTypes.number.isRequired,
+ setActiveEntity: PropTypes.func.isRequired,
+ updateActiveEntity: PropTypes.func.isRequired,
+ deleteEntity: PropTypes.func.isRequired,
+ newGtfsEntity: PropTypes.func.isRequired,
+ activeComponent: PropTypes.string.isRequired
+ }
+ constructor (props) {
+ super(props)
+ this.state = {}
+ }
+ _onResize = () => {
+ this.setState({width: window.innerWidth, height: window.innerHeight})
+ }
+ componentWillMount () {
+ this._onResize()
+ }
+ componentDidMount () {
+ window.addEventListener('resize', this._onResize)
+ }
+ componentWillUnmount () {
+ window.removeEventListener('resize', this._onResize)
+ }
+ componentWillReceiveProps (nextProps) {
+ let fromIndex, toIndex
+ if (nextProps.activeComponent !== this.props.activeComponent) {
+ this.setState({fromIndex, toIndex})
+ }
+ }
+ shouldComponentUpdate (nextProps) {
+ // simply running shallowEqual on all props does not give us the performance we need here
+ // (especially with many, many stops)
+ return !shallowEqual(nextProps.entities, this.props.entities) ||
+ !shallowEqual(nextProps.activeEntity, this.props.activeEntity) ||
+ !shallowEqual(nextProps.activeEntityId, this.props.activeEntityId) ||
+ !shallowEqual(nextProps.activeComponent, this.props.activeComponent) ||
+ !shallowEqual(nextProps.feedSource, this.props.feedSource)
+ }
+ _optionRenderer = ({ focusedOption, focusedOptionIndex, focusOption, key, labelKey, option, options, selectValue, style, valueArray }) => {
+ const className = ['VirtualizedSelectOption']
+ if (option === focusedOption) {
+ className.push('VirtualizedSelectFocusedOption')
+ }
+ if (option.disabled) {
+ className.push('VirtualizedSelectDisabledOption')
+ }
+ const events = option.disabled
+ ? {}
+ : {
+ onClick: () => selectValue(option),
+ onMouseOver: () => focusOption(option)
+ }
+ return (
+
+
+ {activeComponent === 'stop' || activeComponent === 'route'
+ ? Zoom to {activeComponent}}>
+
+
+ : null
+ }
+ Undo changes}>
+
+
+ Save changes}>
+
+
+
+ {activeComponent === 'route' && activeEntity
+ ?
+
+ {!tableData[activeComponent] && activeComponent === 'feedinfo'
+ ? Complete feed info to begin editing GTFS.
+ : null
+ }
+ {validationErrors.length > 0
+ ? Fix validation issues before saving
+ : null
+ }
+ {activeComponent === 'route'
+ ?
+ : activeComponent === 'fare'
+ ?
+ : null
+ }
+
+
+ {option.label}
+
+
+ )
+ }
+ _getRowStyle (index, list) {
+ const activeColor = '#F2F2F2'
+ const rowStyle = {
+ borderBottom: 'solid 1px #ddd',
+ cursor: 'pointer',
+ outline: 'none'
+ }
+ if (list[index] && (list[index].isActive || list[index].isSelected)) {
+ rowStyle.backgroundColor = activeColor
+ }
+ return rowStyle
+ }
+ updateIndexes = (fromIndex, toIndex) => {
+ this.setState({fromIndex, toIndex})
+ }
+ _onRowClick (index, list, shiftKey) {
+ let fromIndex, toIndex
+ if (shiftKey && this.props.activeEntity && !list[index].isActive) {
+ const selectedIndex = list.findIndex(e => e.id === this.props.activeEntity.id)
+ fromIndex = selectedIndex > index ? index : selectedIndex
+ toIndex = selectedIndex < index ? index : selectedIndex
+ console.log(`select multiple from ${fromIndex} to ${toIndex}`)
+ this.props.setActiveEntity(this.props.feedSource.id, this.props.activeComponent)
+ } else
+ if (list[index].isActive) {
+ this.props.setActiveEntity(this.props.feedSource.id, this.props.activeComponent)
+ } else {
+ this.props.setActiveEntity(this.props.feedSource.id, this.props.activeComponent, list[index])
+ }
+ this.setState({fromIndex, toIndex})
+ }
+ // TODO: add hover to row rendering
+ // _rowRenderer (props) {
+ //
+ // }
+ render () {
+ const sidePadding = '5px'
+ const panelWidth = !this.props.tableView ? `${this.props.width}px` : '100%'
+ const panelStyle = {
+ width: panelWidth,
+ height: '100%',
+ position: 'absolute',
+ left: '0px',
+ zIndex: 1,
+ backgroundColor: 'white',
+ paddingRight: '0px',
+ paddingLeft: sidePadding
+ }
+ const entArray = this.props.entities
+ const activeEntity = this.props.activeEntity
+ let activeIndex
+ const list = entArray && entArray.length
+ ? entArray.map((entity, index) => {
+ if (activeEntity && entity.id === activeEntity.id) {
+ activeIndex = index
+ }
+ const isActive = activeEntity && entity.id === activeEntity.id
+ const isSelected = typeof this.state.fromIndex !== 'undefined' && typeof this.state.toIndex !== 'undefined' && index >= this.state.fromIndex && index <= this.state.toIndex
+ const name = getEntityName(this.props.activeComponent, entity) || '[Unnamed]'
+ return {name, id: entity.id, isActive, isSelected}
+ }
+ )
+ : []
+ let shiftKey
+ const entityList = list.length
+ ? {
+ console.log(e)
+ shiftKey = e.shiftKey
+ }}
+ style={{outline: 'none'}}
+ >
+ this._getRowStyle(index, list)}
+ rowCount={list.length}
+ onRowClick={({ index }) => {
+ // timeout set in order to get shiftkey from div event listener
+ setTimeout(() => {
+ this._onRowClick(index, list, shiftKey)
+ }, 15)
+ }}
+ rowGetter={({ index }) => list[index]}
+ >
+
+
+ :
+
+
+ return (
+
+ {
+ if (!value) {
+ this.props.setActiveEntity(this.props.feedSource.id, this.props.activeComponent)
+ } else {
+ this.props.setActiveEntity(this.props.feedSource.id, this.props.activeComponent, value.entity)
+ }
+ }}
+ />
+ : null
+ }
+ {!this.props.tableView
+ ? entityList
+ : null // GtfsTable fully removed from repo, last available at fe29528569f5f64c23a49d2af0bd224f3d63d010
+ }
+
+ )
+ }
+}
diff --git a/lib/editor/components/EntityListButtons.js b/lib/editor/components/EntityListButtons.js
new file mode 100644
index 000000000..9277ad6c0
--- /dev/null
+++ b/lib/editor/components/EntityListButtons.js
@@ -0,0 +1,106 @@
+import React, {Component} from 'react'
+import { ButtonToolbar, Tooltip, OverlayTrigger, Button } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+
+export default class EntityListButtons extends Component {
+ render () {
+ const {
+ activeComponent,
+ cloneEntity,
+ feedSource,
+ showConfirmModal,
+ deleteEntity,
+ setActiveEntity,
+ entities,
+ newGtfsEntity,
+ toIndex,
+ fromIndex,
+ activeEntity,
+ list,
+ updateIndexes
+ } = this.props
+ return (
+
+
+ {this.props.activeComponent === 'calendar' || this.props.activeComponent === 'scheduleexception'
+ ?
+ : this.props.activeComponent === 'stop' || this.props.activeComponent === 'route'
+ ?
+
+ {activeComponent === 'route'
+ ? Merge routes}>
+
+
+ : null
+ }
+ Duplicate {activeComponent}}>
+
+
+ Delete {activeComponent}}>
+
+
+
+ {// Create new entity
+ activeComponent === 'stop'
+ ? Right-click map for new stop
+ :
+ }
+
+ )
+ }
+}
diff --git a/lib/editor/components/FareRulesForm.js b/lib/editor/components/FareRulesForm.js
new file mode 100644
index 000000000..4fa27fc4b
--- /dev/null
+++ b/lib/editor/components/FareRulesForm.js
@@ -0,0 +1,179 @@
+import React, {Component, PropTypes} from 'react'
+import { Radio, Button, FormGroup, Panel } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+import Select from 'react-select'
+
+import VirtualizedEntitySelect from './VirtualizedEntitySelect'
+import { getEntityName } from '../util/gtfs'
+
+export default class FareRulesForm extends Component {
+ static propTypes = {
+ activeEntity: PropTypes.object,
+ updateActiveEntity: PropTypes.func,
+ activeComponent: PropTypes.string,
+ tableData: PropTypes.object,
+ zones: PropTypes.object,
+ zoneOptions: PropTypes.array
+ }
+ render () {
+ const {
+ activeEntity,
+ updateActiveEntity,
+ activeComponent,
+ tableData,
+ zones,
+ zoneOptions
+ } = this.props
+ return (
+
+
+
+
+ {
+ const rules = [...activeEntity.fareRules]
+ rules[index] = {fare_id: activeEntity.fare_id}
+ rules[index].route_id = true
+ updateActiveEntity(activeEntity, activeComponent, {fareRules: rules})
+ }}
+ >
+ Route
+
+ {' '}
+ {
+ const rules = [...activeEntity.fareRules]
+ rules[index] = {fare_id: activeEntity.fare_id}
+ rules[index].origin_id = true
+ updateActiveEntity(activeEntity, activeComponent, {fareRules: rules})
+ }}
+ >
+ To/From
+
+ {' '}
+ {
+ const rules = [...activeEntity.fareRules]
+ rules[index] = {fare_id: activeEntity.fare_id}
+ rules[index].contains_id = true
+ updateActiveEntity(activeEntity, activeComponent, {fareRules: rules})
+ }}
+ >
+ Contains
+
+
+ {rule.route_id
+ ? {
+ console.log(input)
+ const rules = [...activeEntity.fareRules]
+ rules[index].route_id = input ? input.value : null
+ updateActiveEntity(activeEntity, activeComponent, {fareRules: rules})
+ }}
+ />
+ : rule.contains_id // can be boolean (no zone specified) or string (specified zone_id)
+ ?
+ )
+ })}
+
+ )
+ }
+}
diff --git a/src/main/client/editor/components/FeedInfoPanel.js b/lib/editor/components/FeedInfoPanel.js
similarity index 63%
rename from src/main/client/editor/components/FeedInfoPanel.js
rename to lib/editor/components/FeedInfoPanel.js
index 7e5212dc4..baa8262bb 100644
--- a/src/main/client/editor/components/FeedInfoPanel.js
+++ b/lib/editor/components/FeedInfoPanel.js
@@ -1,12 +1,11 @@
import React, {Component, PropTypes} from 'react'
import { Button, ButtonGroup, DropdownButton, Dropdown, MenuItem, Tooltip, OverlayTrigger } from 'react-bootstrap'
-import Icon from 'react-fa'
+import {Icon} from '@conveyal/woonerf'
import { browserHistory } from 'react-router'
-import ReactCSSTransitionGroup from 'react-addons-css-transition-group'
import CreateSnapshotModal from './CreateSnapshotModal'
import SelectFileModal from '../../common/components/SelectFileModal.js'
-import { gtfsIcons } from '../util/gtfs'
+import { gtfsIcons } from '../util/ui'
export default class FeedInfoPanel extends Component {
@@ -29,11 +28,10 @@ export default class FeedInfoPanel extends Component {
title: 'Upload route shapefile',
body: 'Select a zipped shapefile to display on map:',
onConfirm: (files) => {
- let nameArray = files[0].name.split('.')
+ const nameArray = files[0].name.split('.')
if (files[0].type !== 'application/zip' || nameArray[nameArray.length - 1] !== 'zip') {
return false
- }
- else {
+ } else {
this.props.displayRoutesShapefile(feedSource, files[0])
return true
}
@@ -42,11 +40,11 @@ export default class FeedInfoPanel extends Component {
})
}
render () {
- let { feedSource, feedInfo } = this.props
+ const { feedSource, feedInfo } = this.props
if (!feedInfo) return null
- let panelWidth = 370
+ const panelWidth = 400
// let panelHeight = '100px'
- let panelStyle = {
+ const panelStyle = {
// backgroundColor: 'white',
position: 'absolute',
right: this.state.right,
@@ -66,14 +64,14 @@ export default class FeedInfoPanel extends Component {
: 'Unnamed'
return (
- Specify which routes or zones {activeEntity.fare_id} fare applies to.
+ {activeEntity && activeEntity.fareRules.length} rules apply to this fare + + {activeEntity.fareRules.map((rule, index) => { + let ruleEntity + if (rule.route_id) { + ruleEntity = tableData.route && tableData.route.find(r => r.route_id === rule.route_id) + } + return ( +
- {
- this.props.createSnapshot(feedSource, name, comment)
- }}
- />
+ this.showConfirmModal(props)}
+ {...this.props}
+ getGtfsEntity={(type, id) => {
+ return entities.find(ent => ent.id === id)
+ }}
+ getGtfsEntityIndex={(type, id) => {
+ return entities.findIndex(ent => ent.id === id)
+ }} />
+ : null
+ const defaultTitle = `${getConfigProperty('application.title')}: GTFS Editor`
+ return (
+ {
- if(!this.state.expanded) this.props.gtfsPlusDataRequested(this.props.version)
+ if (!this.state.expanded) gtfsPlusDataRequested(version)
this.setState({ expanded: !this.state.expanded })
}}>
+ }
+}
diff --git a/lib/manager/components/FeedSourcePanel.js b/lib/manager/components/FeedSourcePanel.js
new file mode 100644
index 000000000..df410ded5
--- /dev/null
+++ b/lib/manager/components/FeedSourcePanel.js
@@ -0,0 +1,108 @@
+import React, {Component, PropTypes} from 'react'
+import {Icon} from '@conveyal/woonerf'
+import { ListGroupItem, Panel, Badge, ListGroup, FormControl, Button, ButtonGroup } from 'react-bootstrap'
+import { Link } from 'react-router'
+
+import { getComponentMessages, getMessage } from '../../common/util/config'
+
+export default class FeedSourcePanel extends Component {
+ static propTypes = {
+ activeProject: PropTypes.object,
+ visibilityFilter: PropTypes.object,
+ searchTextChanged: PropTypes.func,
+ user: PropTypes.object,
+ visibilityFilterChanged: PropTypes.func
+ }
+ render () {
+ const messages = getComponentMessages('FeedSourcePanel')
+ const {
+ activeProject,
+ visibilityFilter,
+ searchTextChanged,
+ user,
+ visibilityFilterChanged
+ } = this.props
+ const renderFeedItems = (p, fs) => {
+ const feedName = `${p.name} / ${fs.name}`
+ return (
+
+
-
)
}
}
diff --git a/lib/editor/components/GtfsEditor.js b/lib/editor/components/GtfsEditor.js
new file mode 100644
index 000000000..674994b30
--- /dev/null
+++ b/lib/editor/components/GtfsEditor.js
@@ -0,0 +1,248 @@
+import React, {Component, PropTypes} from 'react'
+import Helmet from 'react-helmet'
+import { shallowEqual } from 'react-pure-render'
+
+import CurrentStatusMessage from '../../common/containers/CurrentStatusMessage'
+import ConfirmModal from '../../common/components/ConfirmModal.js'
+import CurrentStatusModal from '../../common/containers/CurrentStatusModal'
+import EditorMap from './map/EditorMap'
+import EditorHelpModal from './EditorHelpModal'
+import EditorSidebar from './EditorSidebar'
+import ActiveEntityList from '../containers/ActiveEntityList'
+import EntityDetails from './EntityDetails'
+import ActiveTimetableEditor from '../containers/ActiveTimetableEditor'
+import ActiveFeedInfoPanel from '../containers/ActiveFeedInfoPanel'
+
+import { getConfigProperty } from '../../common/util/config'
+
+export default class GtfsEditor extends Component {
+ static propTypes = {
+ currentTable: PropTypes.string,
+ feedSourceId: PropTypes.string,
+ feedSource: PropTypes.object,
+ project: PropTypes.object,
+ user: PropTypes.object,
+ tableData: PropTypes.object,
+ feedInfo: PropTypes.object,
+ mapState: PropTypes.object,
+
+ entities: PropTypes.array,
+
+ onComponentMount: PropTypes.func,
+ onComponentUpdate: PropTypes.func,
+ clearGtfsContent: PropTypes.func,
+ getGtfsTable: PropTypes.func,
+ fetchTripPatternsForRoute: PropTypes.func,
+ fetchTripsForCalendar: PropTypes.func,
+ saveTripsForCalendar: PropTypes.func,
+ deleteTripsForCalendar: PropTypes.func,
+ setActiveEntity: PropTypes.func,
+ updateActiveEntity: PropTypes.func,
+ saveActiveEntity: PropTypes.func,
+ resetActiveEntity: PropTypes.func,
+ deleteEntity: PropTypes.func,
+ cloneEntity: PropTypes.func,
+ newGtfsEntity: PropTypes.func,
+ setTutorialHidden: PropTypes.func,
+
+ sidebarExpanded: PropTypes.bool,
+
+ activeEntity: PropTypes.object,
+ activeEntityId: PropTypes.string,
+ subEntityId: PropTypes.string,
+ activeSubSubEntity: PropTypes.string,
+ activeComponent: PropTypes.string,
+ subSubComponent: PropTypes.string
+ }
+ constructor (props) {
+ super(props)
+
+ this.state = {
+ activeTableId: this.props.currentTable
+ }
+ }
+ componentWillMount () {
+ this.props.onComponentMount(this.props)
+ }
+ componentDidUpdate (prevProps) {
+ // handles back button
+ this.props.onComponentUpdate(prevProps, this.props)
+ }
+ componentWillReceiveProps (nextProps) {
+ // clear GTFS content if feedSource changes (i.e., user switches feed sources)
+ if (nextProps.feedSourceId !== this.props.feedSourceId) {
+ this.props.clearGtfsContent()
+ this.props.onComponentMount(nextProps)
+ this.props.getGtfsTable('calendar', this.props.feedSourceId)
+ }
+ // fetch table if it doesn't exist already and user changes tabs
+ if (nextProps.activeComponent && nextProps.activeComponent !== this.props.activeComponent && !nextProps.tableData[nextProps.activeComponent]) {
+ this.props.getGtfsTable(nextProps.activeComponent, nextProps.feedSource.id)
+ }
+ // fetch sub components of active entity on active entity switch (e.g., fetch trip patterns when route changed)
+ if (nextProps.activeComponent === 'route' && nextProps.feedSource && nextProps.activeEntity && (!this.props.activeEntity || nextProps.activeEntity.id !== this.props.activeEntity.id)) {
+ this.props.fetchTripPatternsForRoute(nextProps.feedSource.id, nextProps.activeEntity.id)
+ }
+ // fetch required sub sub component entities if active sub entity changes
+ if (nextProps.subSubComponent && nextProps.activeSubSubEntity && !shallowEqual(nextProps.activeSubSubEntity, this.props.activeSubSubEntity)) {
+ switch (nextProps.subSubComponent) {
+ case 'timetable':
+ const pattern = nextProps.activeEntity.tripPatterns.find(p => p.id === nextProps.subEntityId)
+ // fetch trips if they haven't been fetched
+ if (!pattern[nextProps.activeSubSubEntity]) {
+ this.props.fetchTripsForCalendar(nextProps.feedSource.id, pattern, nextProps.activeSubSubEntity)
+ }
+ break
+ }
+ }
+ }
+
+ showConfirmModal (props) {
+ this.refs.confirmModal.open(props)
+ }
+ getMapOffset (activeComponent, dWidth, activeEntityId, lWidth) {
+ return activeComponent === 'feedinfo'
+ ? dWidth
+ : activeEntityId
+ ? lWidth + dWidth
+ : activeComponent
+ ? lWidth
+ : 0
+ }
+ render () {
+ const {
+ feedSource,
+ user,
+ activeEntityId,
+ tableData,
+ entities,
+ activeComponent,
+ sidebarExpanded,
+ feedInfo,
+ setActiveEntity,
+ subSubComponent,
+ activeEntity,
+ subEntityId,
+ activeSubSubEntity,
+ deleteEntity,
+ updateActiveEntity,
+ resetActiveEntity,
+ saveActiveEntity,
+ fetchTripsForCalendar,
+ updateCellValue,
+ cloneEntity,
+ newGtfsEntity,
+ mapState,
+ hideTutorial,
+ setTutorialHidden,
+ project
+ } = this.props
+ const editingIsDisabled = feedSource ? !user.permissions.hasFeedPermission(feedSource.projectId, feedSource.id, 'edit-gtfs') : true
+ if (feedSource && editingIsDisabled) {
+ console.log('editing disabled')
+ // browserHistory.push(`/feed/${feedSource.id}`)
+ }
+ const LIST_WIDTH = 220
+ const DETAILS_WIDTH = 300
+ const entityDetails = activeEntityId
+ ?
+ {
+ this.props.createSnapshot(feedSource, name, comment)
+ }}
+ />
{/* Hide toolbar toggle */}
{toolbarVisible ? 'Hide toolbar' : 'Show toolbar'}}>
@@ -81,17 +79,19 @@ export default class FeedInfoPanel extends Component {
onClick={() => {
if (toolbarVisible) {
this.setState({right: 30 - panelWidth})
- }
- else {
+ } else {
this.setState({right: 5})
}
}}
>
-
{/* Navigation dropdown */}
- Editing {feedName}} id='navigation-dropdown'
+ Editing {feedName}}
+ id='navigation-dropdown'
onSelect={key => {
switch (key) {
case '1':
@@ -101,16 +101,18 @@ export default class FeedInfoPanel extends Component {
}
}}
>
-
-
+
+
{/* Add entity dropdown */}
- {
- let snapshot = this.props.feedSource.editorSnapshots.find(s => s.id === key)
+ const snapshot = this.props.feedSource.editorSnapshots.find(s => s.id === key)
this.props.showConfirmModal({
title: `Restore ${key}?`,
body: `Are you sure you want to restore this snapshot?`,
@@ -148,30 +151,30 @@ export default class FeedInfoPanel extends Component {
this.refs.snapshotModal.open()
}}
>
- {
- this.props.getSnapshots(feedSource)
- }}
- />
-
- {this.props.feedSource && this.props.feedSource.editorSnapshots
- ? this.props.feedSource.editorSnapshots.map(snapshot => {
- return (
-
- )
- })
- :
- }
-
+ {
+ this.props.getSnapshots(feedSource)
+ }}
+ />
+
+ {this.props.feedSource && this.props.feedSource.editorSnapshots
+ ? this.props.feedSource.editorSnapshots.map(snapshot => {
+ return (
+
+ )
+ })
+ :
+ }
+
}
+
+
+ )
+ }
+}
diff --git a/src/main/client/editor/components/GtfsVersionSummary.js b/lib/editor/components/GtfsVersionSummary.js
similarity index 56%
rename from src/main/client/editor/components/GtfsVersionSummary.js
rename to lib/editor/components/GtfsVersionSummary.js
index fcfab2f5a..0a4649508 100644
--- a/src/main/client/editor/components/GtfsVersionSummary.js
+++ b/lib/editor/components/GtfsVersionSummary.js
@@ -1,37 +1,39 @@
import React, {Component, PropTypes} from 'react'
-import { Panel, Row, Col, Table, Input, Button, Glyphicon, Well, Alert } from 'react-bootstrap'
-import { Link, browserHistory } from 'react-router'
+import { Panel, Row, Col, Table, Button, Glyphicon, Alert } from 'react-bootstrap'
+import { browserHistory } from 'react-router'
import moment from 'moment'
import { getConfigProperty } from '../../common/util/config'
export default class GtfsVersionSummary extends Component {
-
+ static propTypes = {
+ editor: PropTypes.object
+ }
constructor (props) {
super(props)
this.state = { expanded: false }
}
isTableIncluded (tableId) {
- if(!this.props.editor.tableData) return null
- return tableId in this.props.editor.tableData ? 'Yes' : 'No'
+ if (!this.props.editor.data.tables) return null
+ return tableId in this.props.editor.data.tables ? 'Yes' : 'No'
}
tableRecordCount (tableId) {
- if(!this.props.editor.tableData) return null
- if(!(tableId in this.props.editor.tableData)) return 'N/A'
- return this.props.editor.tableData[tableId].length.toLocaleString()
+ if (!this.props.editor.data.tables) return null
+ if (!(tableId in this.props.editor.data.tables)) return 'N/A'
+ return this.props.editor.data.tables[tableId].length.toLocaleString()
}
validationIssueCount (tableId) {
- if(!this.props.editor.validation) return null
- if(!(tableId in this.props.editor.validation)) return 'None'
+ if (!this.props.editor.validation) return null
+ if (!(tableId in this.props.editor.validation)) return 'None'
return this.props.editor.validation[tableId].length.toLocaleString()
}
feedStatus () {
- if(!this.props.editor.timestamp) return null
- if(!this.gtfsPlusEdited()) return GTFS+ data for this feed version has not been edited.
+ if (!this.props.editor.timestamp) return null
+ if (!this.gtfsPlusEdited()) return GTFS+ data for this feed version has not been edited.
return GTFS+ Data updated {moment(this.props.editor.timestamp).format('MMM. DD, YYYY, h:MMa')}
}
@@ -40,11 +42,17 @@ export default class GtfsVersionSummary extends Component {
}
render () {
- const editingIsDisabled = !this.props.user.permissions.hasFeedPermission(this.props.version.feedSource.projectId, this.props.version.feedSource.id, 'edit-gtfs')
- const publishingIsDisabled = !this.props.user.permissions.hasFeedPermission(this.props.version.feedSource.projectId, this.props.version.feedSource.id, 'approve-gtfs')
+ const {
+ gtfsPlusDataRequested,
+ user,
+ version,
+ publishClicked
+ } = this.props
+ const editingIsDisabled = !user.permissions.hasFeedPermission(version.feedSource.organizationId, version.feedSource.projectId, version.feedSource.id, 'edit-gtfs')
+ const publishingIsDisabled = !user.permissions.hasFeedPermission(version.feedSource.organizationId, version.feedSource.projectId, version.feedSource.id, 'approve-gtfs')
const header = (
+ {subSubComponent === 'timetable' // && activeEntity
+ ? this.showConfirmModal(props)}
+ activePatternId={subEntityId}
+ activeScheduleId={activeSubSubEntity}
+ setActiveEntity={setActiveEntity}
+ tableData={tableData}
+ deleteEntity={deleteEntity}
+ updateActiveEntity={updateActiveEntity}
+ resetActiveEntity={resetActiveEntity}
+ saveActiveEntity={saveActiveEntity}
+ fetchTripsForCalendar={fetchTripsForCalendar}
+ sidebarExpanded={sidebarExpanded}
+ updateCellValue={updateCellValue} />
+ : activeComponent === 'feedinfo'
+ ? this.showConfirmModal(props)}
+ entities={entities}
+ activeEntityId={activeEntityId}
+ activeComponent={activeComponent}
+ feedSource={feedSource}
+ key='entity-list' />,
+ entityDetails
+ ]
+ : null
+ }
+ this.showConfirmModal(props)}
+ drawStops={mapState.zoom > 14}
+ zoomToTarget={mapState.target}
+ sidebarExpanded={sidebarExpanded}
+ {...this.props} />
+ {!activeComponent && !hideTutorial && getConfigProperty('application.dev')
+ ? this.showConfirmModal(props)}
+ setActiveEntity={setActiveEntity}
+ feedInfo={feedInfo} />
+
+ {
- if(!this.state.expanded) this.props.gtfsPlusDataRequested(this.props.version)
+ if (!this.state.expanded) gtfsPlusDataRequested(version)
this.setState({ expanded: !this.state.expanded })
}}>
Included?
Records
Validation Issues
- {this.isTableIncluded(table.id)}
{this.tableRecordCount(table.id)}
{this.validationIssueCount(table.id)}
- se.id === this.props.activeEntity.id)
+ if (exceptionIndex !== -1) {
+ allExceptions.splice(exceptionIndex, 1)
+ }
+ allExceptions.push(this.props.activeEntity)
+ }
+ for (let i = 0; i < allExceptions.length; i++) {
+ allExceptions[i].dates && allExceptions[i].dates.map(d => {
+ if (typeof dateMap[moment(d).format('YYYYMMDD')] === 'undefined') {
+ dateMap[moment(d).format('YYYYMMDD')] = []
+ }
+ dateMap[moment(d).format('YYYYMMDD')].push(allExceptions[i].id)
+ })
+ }
+ activeEntity && activeEntity.dates.length === 0 && validate({field: 'dates', invalid: true})
+ return (
+
+
+
+ )
+ }
+}
diff --git a/src/main/client/editor/components/VirtualizedEntitySelect.js b/lib/editor/components/VirtualizedEntitySelect.js
similarity index 69%
rename from src/main/client/editor/components/VirtualizedEntitySelect.js
rename to lib/editor/components/VirtualizedEntitySelect.js
index 3304350c0..7924c8775 100644
--- a/src/main/client/editor/components/VirtualizedEntitySelect.js
+++ b/lib/editor/components/VirtualizedEntitySelect.js
@@ -1,18 +1,19 @@
import React, {Component, PropTypes} from 'react'
import VirtualizedSelect from 'react-virtualized-select'
-import 'react-virtualized/styles.css'
-import 'react-select/dist/react-select.css'
-import 'react-virtualized-select/styles.css'
import { getEntityName } from '../util/gtfs'
export default class VirtualizedEntitySelect extends Component {
-
- constructor(props) {
+ static propTypes = {
+ entities: PropTypes.array,
+ component: PropTypes.string,
+ entityKey: PropTypes.string
+ }
+ constructor (props) {
super(props)
this.state = {
value: this.props.value
- };
+ }
}
componentWillReceiveProps (nextProps) {
if (this.state.value !== nextProps.value && typeof this.props.value !== 'undefined') {
@@ -23,18 +24,20 @@ export default class VirtualizedEntitySelect extends Component {
this.setState({value})
this.props.onChange(value)
}
-
render () {
- let { entities, component, entityKey } = this.props
- let key = entityKey ? entityKey : 'id'
+ const { entities, component, entityKey } = this.props
+ const key = entityKey || 'id'
return (
({value: entity[key], label: getEntityName(component, entity) || '[Unnamed]', entity})) : []}
searchable
+ clearable={typeof this.props.clearable !== 'undefined' ? this.props.clearable : true}
onChange={(value) => this.onChange(value)}
value={this.state.value}
+ style={this.props.style}
+ optionRenderer={this.props.optionRenderer}
/>
)
}
diff --git a/lib/editor/components/map/AddableStopsLayer.js b/lib/editor/components/map/AddableStopsLayer.js
new file mode 100644
index 000000000..3d0c124b1
--- /dev/null
+++ b/lib/editor/components/map/AddableStopsLayer.js
@@ -0,0 +1,92 @@
+import React, { Component, PropTypes } from 'react'
+import { MenuItem, SplitButton } from 'react-bootstrap'
+import { divIcon } from 'leaflet'
+import {Icon} from '@conveyal/woonerf'
+import { Marker, Popup, FeatureGroup } from 'react-leaflet'
+
+export default class AddableStopsLayer extends Component {
+ static propTypes = {
+ stops: PropTypes.array
+ }
+ render () {
+ const {
+ stops,
+ activePattern,
+ editSettings,
+ mapState,
+ addStopToPattern
+ } = this.props
+ const { bounds } = mapState
+ return (
+
+ {stops && activePattern && editSettings.addStops && mapState.zoom > 14
+ ? stops
+ .filter(stop => {
+ if (!bounds) return false
+ if (stop.stop_lat > bounds.getNorth() || stop.stop_lat < bounds.getSouth() || stop.stop_lon > bounds.getEast() || stop.stop_lon < bounds.getWest()) {
+ return false
+ } else {
+ return true
+ }
+ })
+ .map((stop, index) => {
+ if (!stop) return null
+ const patternStop = activePattern.patternStops.find(ps => ps.stopId === stop.id)
+ if (patternStop) return null
+ const color = 'blue'
+ const busIcon = divIcon({
+ html: `
+
+
+ `,
+ className: '',
+ iconSize: [24, 24]
+ })
+ return (
+
+
+
+ {stop.stop_name}
+
+
+ )
+ })
+ : null
+ }
+
+ )
+ }
+}
diff --git a/lib/editor/components/map/ControlPoint.js b/lib/editor/components/map/ControlPoint.js
new file mode 100644
index 000000000..9fc1d0cd6
--- /dev/null
+++ b/lib/editor/components/map/ControlPoint.js
@@ -0,0 +1,61 @@
+import React, { Component, PropTypes } from 'react'
+import { Marker } from 'react-leaflet'
+
+import { handlePatternEdit, handleControlPointDragEnd } from '../../util/map'
+
+export default class ControlPoint extends Component {
+ static propTypes = {
+ position: PropTypes.array
+ }
+ constructor (props) {
+ super(props)
+ this.state = {
+ timer: null,
+ latlng: null
+ }
+ }
+ render () {
+ const { position, icon, previous, next, activePattern, index, permanent, removeControlPoint, updateActiveEntity, updateControlPoint, editSettings } = this.props
+ const { patternCoordinates, followStreets } = editSettings
+ return (
+ {
+ const timerFunction = () => {
+ const latlng = this.refs.marker.leafletElement.getLatLng()
+ // console.log(latlng)
+ handlePatternEdit(latlng, this.props.previous, this.props.next, this.props.activePattern, followStreets, patternCoordinates)
+ .then(coords => {
+ this.setState({latlng})
+ this.props.updatePatternCoordinates(coords)
+ })
+ }
+ timerFunction()
+ const timer = setInterval(timerFunction, 500)
+ this.setState({timer})
+ }}
+ onDragEnd={(e) => {
+ // console.log('drag end')
+ // clear timer
+ if (this.state.timer) clearInterval(this.state.timer)
+ const { snap, distTraveled } = handleControlPointDragEnd(e, patternCoordinates)
+ updateActiveEntity(activePattern, 'trippattern', {shape: {type: 'LineString', coordinates: patternCoordinates}})
+ updateControlPoint(index, snap, distTraveled)
+ this.setState({latlng: null})
+ }}
+ onClick={(e) => {
+ console.log('control point clicked', e)
+ // only remove controlPoint if it's not based on pattern stop (i.e., has permanent prop)
+ if (!permanent) {
+ removeControlPoint(activePattern, index, previous, next)
+ }
+ }}
+ color='black'
+ />
+ )
+ }
+}
diff --git a/lib/editor/components/map/ControlPointsLayer.js b/lib/editor/components/map/ControlPointsLayer.js
new file mode 100644
index 000000000..c4c73afb4
--- /dev/null
+++ b/lib/editor/components/map/ControlPointsLayer.js
@@ -0,0 +1,74 @@
+import React, { Component, PropTypes } from 'react'
+import { divIcon } from 'leaflet'
+import { FeatureGroup } from 'react-leaflet'
+import along from 'turf-along'
+
+import ControlPoint from './ControlPoint'
+
+export default class ControlPointsLayer extends Component {
+ static propTypes = {
+ stops: PropTypes.array,
+ handlePatternEdit: PropTypes.func,
+ polyline: PropTypes.object,
+ handleControlPointDragEnd: PropTypes.func,
+ onDrag: PropTypes.func,
+ removeControlPoint: PropTypes.func
+ }
+ getPrevious (index, controlPoints, pattern) {
+ const prevControlPoint = controlPoints[index - 1]
+ return prevControlPoint
+ ? prevControlPoint.point
+ : along(pattern.shape, 0, 'meters')
+ }
+ getNext (index, controlPoints) {
+ const nextControlPoint = controlPoints[index + 1]
+ if (nextControlPoint) {
+ return nextControlPoint.point
+ } else {
+ return null
+ }
+ }
+ render () {
+ const {
+ stops,
+ activePattern,
+ editSettings,
+ controlPoints
+ } = this.props
+ return (
+
+ {stops && activePattern && activePattern.shape && editSettings.editGeometry && controlPoints
+ ? controlPoints.map((cp, index) => {
+ // don't include controlPoint on end of segment (for now) or hidden controlPoints
+ if (cp.stopId && editSettings.snapToStops) {
+ return null
+ }
+ const position = cp.point
+ const color = cp.permanent ? '#000' : '#888'
+ const iconType = cp.stopId ? 'fa-square' : 'fa-times'
+ if (!position || !position.geometry || !position.geometry.coordinates) {
+ return null
+ }
+ const icon = divIcon({
+ className: '',
+ html: ``
+ })
+ return (
+
+ )
+ }
+}
diff --git a/lib/editor/components/map/DirectionIconsLayer.js b/lib/editor/components/map/DirectionIconsLayer.js
new file mode 100644
index 000000000..24885c6ee
--- /dev/null
+++ b/lib/editor/components/map/DirectionIconsLayer.js
@@ -0,0 +1,72 @@
+import React, { Component, PropTypes } from 'react'
+import bearing from 'turf-bearing'
+import { divIcon } from 'leaflet'
+import { Marker, FeatureGroup } from 'react-leaflet'
+import lineDistance from 'turf-line-distance'
+import lineString from 'turf-linestring'
+import along from 'turf-along'
+
+export default class DirectionIconsLayer extends Component {
+ static propTypes = {
+ patternCoordinates: PropTypes.array
+ }
+ render () {
+ const { patternCoordinates, mapState } = this.props
+ const { zoom, bounds } = mapState
+ // let zoom = this.refs.map ? this.refs.map.leafletElement.getZoom() : 11
+ // let bounds = this.refs.map && this.refs.map.leafletElement.getBounds()
+ // get intervals along path for arrow icons
+ const patternLine = patternCoordinates && patternCoordinates.length && lineString(patternCoordinates)
+ const patternLength = patternLine ? lineDistance(patternLine, 'meters') : 0
+ const iconInterval = zoom > 15
+ ? 200
+ : zoom > 14
+ ? 500
+ : zoom > 12
+ ? 2000
+ : zoom > 10
+ ? 4000
+ : zoom > 6
+ ? 8000
+ : 10000
+ const lengthsAlongPattern = []
+ for (var i = 0; i < Math.floor(patternLength / iconInterval); i++) {
+ const distance = i ? iconInterval * i : iconInterval / 2
+ const position = along(patternLine, distance, 'meters')
+ if (!bounds) continue
+ if (position.geometry.coordinates[1] > bounds.getNorth() || position.geometry.coordinates[1] < bounds.getSouth() || position.geometry.coordinates[0] > bounds.getEast() || position.geometry.coordinates[0] < bounds.getWest()) {
+ continue
+ }
+ lengthsAlongPattern.push([distance, position])
+ }
+ return (
+
+ {lengthsAlongPattern.length && patternLine // this.refs[activePattern.id]
+ ? lengthsAlongPattern.map((length, index) => {
+ const distance = length[0]
+ const position = length[1]
+
+ const nextPosition = along(patternLine, distance + 5, 'meters')
+ const dir = position && nextPosition ? bearing(position, nextPosition) : 0
+ const color = '#000'
+ const arrowIcon = divIcon({
+ html: ``,
+ className: ''
+ })
+ if (!position || !position.geometry || !position.geometry.coordinates) {
+ return null
+ }
+ return (
+
+ )
+ }
+}
diff --git a/lib/editor/components/map/EditorMap.js b/lib/editor/components/map/EditorMap.js
new file mode 100644
index 000000000..6bedbd13c
--- /dev/null
+++ b/lib/editor/components/map/EditorMap.js
@@ -0,0 +1,288 @@
+import React, { Component } from 'react'
+import { Map, ZoomControl, GeoJson, FeatureGroup } from 'react-leaflet'
+import { shallowEqual } from 'react-pure-render'
+
+import EditorMapLayersControl from './EditorMapLayersControl'
+import AddableStopsLayer from './AddableStopsLayer'
+import PatternStopsLayer from './PatternStopsLayer'
+import DirectionIconsLayer from './DirectionIconsLayer'
+import ControlPointsLayer from './ControlPointsLayer'
+// import StopMarkersLayer from './StopMarkersLayer'
+import StopsLayer from './StopsLayer'
+import EditorMapProps from '../../props'
+import PatternsLayer from './PatternsLayer'
+import { MAP_LAYERS, constructStop, clickToLatLng, getFeedBounds } from '../../util/map'
+
+export default class EditorMap extends Component {
+ static propTypes = EditorMapProps
+ constructor (props) {
+ super(props)
+ this.state = {}
+ }
+ _onResize = () => {
+ this.setState({width: window.innerWidth, height: window.innerHeight})
+ this.refs.map && setTimeout(() => this.refs.map.leafletElement.invalidateSize(), 500)
+ }
+ componentWillMount () {
+ this._onResize()
+ this.setState({willMount: true})
+ }
+ componentDidMount () {
+ window.addEventListener('resize', this._onResize)
+ this.setState({willMount: false})
+ }
+ componentWillUnmount () {
+ window.removeEventListener('resize', this._onResize)
+ }
+ componentWillReceiveProps (nextProps) {
+ if (nextProps.offset !== this.props.offset || nextProps.hidden !== this.props.hidden) {
+ this._onResize()
+ }
+ // if (nextProps.editSettings.controlPoints && nextProps.editSettings.controlPoints.length && !shallowEqual(nextProps.editSettings.controlPoints, this.props.editSettings.controlPoints)) {
+ // this.setState({controlPoints: nextProps.editSettings.controlPoints[nextProps.editSettings.controlPoints.length - 1]})
+ // }
+ if (nextProps.zoomToTarget && !shallowEqual(nextProps.zoomToTarget, this.props.zoomToTarget)) {
+ // this._onResize()
+ this.setState({zoomToTarget: true})
+ }
+ }
+ shouldComponentUpdate (nextProps, nextState) {
+ // don't bother updating if component is hidden
+ if (nextProps.hidden && this.props.hidden === nextProps.hidden) {
+ return false
+ }
+ // TODO: clean up this mess
+ const shouldUpdate =
+ !shallowEqual(nextState, this.state) ||
+ this.props.hidden !== nextProps.hidden ||
+ !shallowEqual(nextProps.mapState.routesGeojson, this.props.mapState.routesGeojson) ||
+ (nextProps.activeComponent === 'stop' || nextProps.activeComponent === 'route') && nextProps.activeEntityId !== this.props.activeEntityId ||
+ nextProps.activeEntity && this.props.activeEntity && nextProps.activeEntity.tripPatterns && !this.props.activeEntity.tripPatterns ||
+ !shallowEqual(nextProps.feedSource, this.props.feedSource) ||
+ nextProps.activeComponent !== this.props.activeComponent ||
+ !this.props.activeEntity && nextProps.activeEntity ||
+ // TODO: add bounds to shouldComponentUpdate and move mapZoom/bounds to mapState reducer
+ nextProps.drawStops && !shallowEqual(nextProps.mapState.bounds, this.props.mapState.bounds) ||
+ !shallowEqual(nextProps.drawStops, this.props.drawStops) ||
+ !shallowEqual(nextProps.tripPatterns, this.props.tripPatterns) ||
+ !shallowEqual(nextProps.zoomToTarget, this.props.zoomToTarget) ||
+ !shallowEqual(nextProps.editSettings, this.props.editSettings) ||
+ !shallowEqual(nextProps.subEntityId, this.props.subEntityId) ||
+ !shallowEqual(nextProps.currentPattern, this.props.activePattern) ||
+ // nextProps.activeComponent === 'stop' && this.props.mapState.zoom !== nextProps.mapState.zoom ||
+ nextProps.activeComponent === 'stop' && this.props.activeEntity && nextProps.activeEntity && (this.props.activeEntity.stop_lon !== nextProps.activeEntity.stop_lon || this.props.activeEntity.stop_lat !== nextProps.activeEntity.stop_lat) ||
+ nextProps.activeEntityId !== this.props.activeEntityId ||
+ nextProps.sidebarExpanded !== this.props.sidebarExpanded
+
+ return shouldUpdate
+ }
+ async _mapRightClicked (e) {
+ switch (this.props.activeComponent) {
+ case 'stop':
+ // if newly created stop is selected
+ const stopLatLng = clickToLatLng(e.latlng)
+ if (this.props.activeEntity && this.props.activeEntity.id === 'new') {
+ this.props.updateActiveEntity(this.props.activeEntity, this.props.activeComponent, stopLatLng)
+ this.refs[this.props.activeEntity.id].leafletElement.setLatLng(e.latlng)
+ } else if (this.props.entities && this.props.entities.findIndex(e => e.id === 'new') === -1) {
+ const stop = await constructStop(e.latlng, this.props.feedSource.id)
+ this.props.newGtfsEntity(this.props.feedSource.id, this.props.activeComponent, stop)
+ }
+ break
+ default:
+ break
+ }
+ }
+ // async addStopAtPoint (latlng, addToPattern = false, index) {
+ // // create stop
+ // const stop = await constructStop(latlng, this.props.feedSource.id)
+ // const s = await this.props.newGtfsEntity(this.props.feedSource.id, 'stop', stop, true)
+ // const gtfsStop = stopToGtfs(s)
+ // // add stop to end of pattern
+ // if (addToPattern) {
+ // await this.props.addStopToPattern(this.props.activePattern, gtfsStop, index)
+ // }
+ // return gtfsStop
+ // }
+ _mapBaseLayerChanged = (e) => {
+ const layer = MAP_LAYERS.find(l => l.name === e.name)
+ console.log('base layer changed', e)
+ this.props.updateUserMetadata(this.props.user.profile, {editor: {map_id: layer.id}})
+ }
+ async _mapClicked (e) {
+ if (this.props.activeComponent === 'stop') {
+ // TODO: replace with spatial tree
+ // locate stop based on latlng
+ const selectedStop = this.props.entities.find(stop => Math.round(stop.stop_lat * 1000) / 1000 === Math.round(e.latlng.lat * 1000) / 1000 && Math.round(stop.stop_lon * 1000) / 1000 === Math.round(e.latlng.lng * 1000) / 1000)
+ console.log('map click selected -->', selectedStop)
+ if (selectedStop) {
+ if (this.props.activeEntity && this.props.activeEntity.id === selectedStop.id) {
+ // do nothing, the user just clicked the current stop
+ } else {
+ this.props.setActiveEntity(this.props.feedSource.id, this.props.activeComponent, selectedStop)
+ }
+ }
+ }
+ if (this.props.subComponent === 'trippattern' && this.props.editSettings.editGeometry) {
+ switch (this.props.editSettings.onMapClick) {
+ case 'NO_ACTION':
+ break
+ case 'ADD_STOP_AT_CLICK':
+ return this.props.addStopAtPoint(e.latlng, true, null, this.props.activePattern)
+ case 'ADD_STOPS_AT_INTERSECTIONS':
+ return this.props.addStopAtIntersection(e.latlng, this.props.activePattern)
+ case 'ADD_STOPS_AT_INTERVAL':
+ return this.props.addStopAtInterval(e.latlng, this.props.activePattern)
+ default:
+ break
+ }
+ }
+ }
+ _mapBoundsChanged = (e) => {
+ if (this.state.zoomToTarget) {
+ setTimeout(() => { this.setState({zoomToTarget: false}) }, 200)
+ return false
+ } else {
+ const zoom = e.target.getZoom()
+ const bounds = e.target.getBounds()
+ if (this.props.mapState.zoom !== zoom) {
+ this.props.updateMapSetting({zoom})
+ }
+ if (!bounds.equals(this.props.mapState.bounds)) {
+ this.props.updateMapSetting({bounds: e.target.getBounds()})
+ }
+ }
+ }
+ getMapComponents (component, entity, subEntityId, activePattern, stops, editSettings, mapState) {
+ switch (component) {
+ case 'route':
+ if (!entity) return null
+ return (
+
+
+ )
+ case 'stop':
+ return (
+
+ {tripPatterns ? tripPatterns.map((tp) => {
+ if (!tp.latLngs) return null
+ return
+ },
+ {
+ name: 'Stop locations',
+ component:
+ {MAP_LAYERS.map((layer, index) => (
+
+
+ ))}
+ {isExtensionEnabled('nysdot') &&
+
+
+ }
+ {OVERLAYS.map((overlay, i) => (
+
+ {overlay.component}
+
+ ))}
+
+ )
+ }
+}
diff --git a/lib/editor/components/map/PatternStopPopup.js b/lib/editor/components/map/PatternStopPopup.js
new file mode 100644
index 000000000..9544275b1
--- /dev/null
+++ b/lib/editor/components/map/PatternStopPopup.js
@@ -0,0 +1,119 @@
+import React, { Component } from 'react'
+import { Button, Dropdown, OverlayTrigger, Tooltip, Row, Col, ButtonGroup, MenuItem, FormGroup, ControlLabel } from 'react-bootstrap'
+import { Icon } from '@conveyal/woonerf'
+
+import MinuteSecondInput from '../MinuteSecondInput'
+
+export default class PatternStopPopup extends Component {
+ render () {
+ const { stop, index, patternStop, activePattern, entityEdited, saveActiveEntity, setActiveEntity, feedSource, removeStopFromPattern, addStopToPattern, updateActiveEntity, controlPoints } = this.props
+ return (
+
+ {index + 1}. {stop.stop_name}
+
+
+
+ Edit stop}>
+
+
+ Remove from pattern}>
+
+
+ addStopToPattern(activePattern, stop, key)}
+ >
+
+
+
+ {activePattern.patternStops && activePattern.patternStops.map((stop, i) => {
+ const addIndex = activePattern.patternStops.length - i
+ if (index === activePattern.patternStops.length - 1 && index === addIndex - 1) {
+ return null
+ }
+ // disable adding stop to current position or directly before/after current position
+ return (
+
+ )
+ })}
+
+
+
+
+
+
+
+ Travel time
+ {
+ const patternStops = [...activePattern.patternStops]
+ patternStops[index].defaultTravelTime = value
+ updateActiveEntity(activePattern, 'trippattern', {patternStops: patternStops})
+ }}
+ />
+
+
+
+ Dwell time
+ {
+ const patternStops = [...activePattern.patternStops]
+ patternStops[index].defaultDwellTime = +evt.target.value
+ updateActiveEntity(activePattern, 'trippattern', {patternStops: patternStops})
+ }}
+ />
+
+
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/map/PatternStopsLayer.js b/lib/editor/components/map/PatternStopsLayer.js
new file mode 100644
index 000000000..2621daad0
--- /dev/null
+++ b/lib/editor/components/map/PatternStopsLayer.js
@@ -0,0 +1,66 @@
+import React, { Component, PropTypes } from 'react'
+import { divIcon } from 'leaflet'
+import { Marker, Popup, FeatureGroup } from 'react-leaflet'
+
+import PatternStopPopup from './PatternStopPopup'
+
+export default class PatternStopsLayer extends Component {
+ static propTypes = {
+ activePattern: PropTypes.object,
+ addStopToPattern: PropTypes.func,
+ editSettings: PropTypes.object,
+ removeStopFromPattern: PropTypes.func,
+ stops: PropTypes.array
+ }
+ render () {
+ const {
+ activePattern,
+ addStopToPattern,
+ editSettings,
+ removeStopFromPattern,
+ stops
+ } = this.props
+ return (
+
+ {stops && activePattern && !editSettings.hideStops
+ ? activePattern.patternStops && activePattern.patternStops.map((s, index) => {
+ const stop = stops.find(ps => ps.id === s.stopId)
+ if (!stop) return null
+ const patternStopIcon = divIcon({
+ html: `
+
+ ${index + 1}
+ `,
+ className: '',
+ iconSize: [24, 24]
+ })
+ return (
+
+
+
+
+ )
+ })
+ : null
+ }
+
+ )
+ }
+}
diff --git a/lib/editor/components/map/PatternsLayer.js b/lib/editor/components/map/PatternsLayer.js
new file mode 100644
index 000000000..67bf99940
--- /dev/null
+++ b/lib/editor/components/map/PatternsLayer.js
@@ -0,0 +1,58 @@
+import React, { Component, PropTypes } from 'react'
+import { FeatureGroup, Polyline } from 'react-leaflet'
+
+export default class PatternsLayer extends Component {
+ static propTypes = {
+ route: PropTypes.object
+ }
+ _onClick (pattern, isActive, controlPoints, e) {
+ return isActive && this.props.constructControlPoint(pattern, e.latlng, controlPoints)
+ // TODO: make clicked pattern active if non-active?
+ }
+ render () {
+ const {
+ route,
+ subEntityId,
+ activePattern,
+ activeEntity,
+ editSettings,
+ controlPoints,
+ patternCoordinates
+ } = this.props
+ return (
+
+ {route && route.tripPatterns
+ ? route.tripPatterns
+ .map(tp => {
+ const isActive = subEntityId === tp.id
+ const pattern = isActive ? activePattern : tp
+ const latLngs = pattern && pattern.shape ? pattern.shape.coordinates.map(c => ([c[1], c[0]])) : []
+
+ // NOTE: don't render pattern if latlngs don't exist or a single pattern is active
+ if (!latLngs || !isActive && subEntityId) {
+ return null
+ }
+ const lineColor = activeEntity.route_color && editSettings.editGeometry
+ ? '#F3F315' // yellow if editing
+ : activeEntity.route_color // otherwise, use route color if it exists
+ ? `#${activeEntity.route_color}`
+ : editSettings.editGeometry
+ ? '#F3F315' // yellow if editing
+ : 'blue'
+ return (
+ ([c[1], c[0]])) || latLngs}
+ key={tp.id}
+ onClick={e => this._onClick(pattern, isActive, controlPoints, e)}
+ lineCap='butt'
+ color={lineColor}
+ opacity={isActive ? 0.8 : 0.5}
+ />
+ )
+ })
+ : null
+ }
+
+ )
+ }
+}
diff --git a/src/main/client/editor/components/RouteLayer.js b/lib/editor/components/map/RouteLayer.js
similarity index 72%
rename from src/main/client/editor/components/RouteLayer.js
rename to lib/editor/components/map/RouteLayer.js
index 3445fe415..8d1c20274 100644
--- a/src/main/client/editor/components/RouteLayer.js
+++ b/lib/editor/components/map/RouteLayer.js
@@ -1,11 +1,11 @@
/**
-an layer for drawing route alignments, adapted from StopLayer
+a layer for drawing route alignments, adapted from StopLayer
*/
const MIN_ZOOM = 1 // don't draw stops below this zoom
import { BaseTileLayer } from 'react-leaflet'
-import { point, TileLayer } from 'leaflet'
+import { TileLayer } from 'leaflet'
export default class StopLayer extends BaseTileLayer {
static defaultProps = {
@@ -23,30 +23,30 @@ export default class StopLayer extends BaseTileLayer {
}
drawTile = (cvs, tilePt, z) => {
- let tileLength = 256
+ const tileLength = 256
if (z < this.props.minZoom) return // don't draw every transit stop in a country
- let ctx = cvs.getContext('2d')
+ const ctx = cvs.getContext('2d')
ctx.strokeStyle = '#888'
// get the bounds
- let topLeft = this.props.map.unproject([tilePt.x * tileLength, tilePt.y * tileLength], z)
- let brPoint = point([tilePt.x + 1, tilePt.y + 1])
- let botRight = this.props.map.unproject([brPoint.x * tileLength, brPoint.y * tileLength], z)
+ // let topLeft = this.props.map.unproject([tilePt.x * tileLength, tilePt.y * tileLength], z)
+ // let brPoint = point([tilePt.x + 1, tilePt.y + 1])
+ // let botRight = this.props.map.unproject([brPoint.x * tileLength, brPoint.y * tileLength], z)
- //console.log('tile', tilePt)
+ // console.log('tile', tilePt)
this.props.tripPatterns.forEach((p) => {
if (!p.latLngs) return
- //console.log(p);
+ // console.log(p);
for (let i = 0; i < p.latLngs.length - 1; i++) {
const p1 = p.latLngs[i]
const p2 = p.latLngs[i + 1]
- //console.log('pts', p1, p2)
- //console.log(this.props.map.project(p1, z));
+ // console.log('pts', p1, p2)
+ // console.log(this.props.map.project(p1, z));
- let pr1 = this.props.map.project(p1, z)
- let pr2 = this.props.map.project(p2, z)
+ const pr1 = this.props.map.project(p1, z)
+ const pr2 = this.props.map.project(p2, z)
ctx.beginPath()
ctx.moveTo(pr1.x %= tileLength, pr1.y %= tileLength)
@@ -74,6 +74,6 @@ export default class StopLayer extends BaseTileLayer {
ctx.beginPath()
ctx.arc(x, y, 2, 0, Math.PI * 2)
ctx.stroke()
- })*/
+ }) */
}
}
diff --git a/lib/editor/components/map/StopMarkersLayer.js b/lib/editor/components/map/StopMarkersLayer.js
new file mode 100644
index 000000000..883b73ab8
--- /dev/null
+++ b/lib/editor/components/map/StopMarkersLayer.js
@@ -0,0 +1,94 @@
+import React, { PropTypes } from 'react'
+import { divIcon } from 'leaflet'
+import {FeatureGroup, Marker} from 'react-leaflet'
+
+import {clickToLatLng} from '../../util/map'
+
+export default class StopMarkersLayer extends FeatureGroup {
+ static propTypes = {
+ stops: PropTypes.array,
+ activeEntity: PropTypes.object,
+ feedSource: PropTypes.object,
+ mapState: PropTypes.object,
+ setActiveEntity: PropTypes.func,
+ updateActiveEntity: PropTypes.func,
+ entityEdited: PropTypes.bool
+ }
+ render () {
+ const { stops, activeEntity, feedSource, mapState, setActiveEntity, updateActiveEntity, entityEdited } = this.props
+ return (
+
+ {stops
+ ? stops.map(stop => {
+ const isActive = activeEntity && activeEntity.id === stop.id
+ if (isActive) return null
+ if (!isActive) {
+ if (!mapState.zoom || mapState.zoom < 14) {
+ return null
+ }
+ if (stop.stop_lat > mapState.bounds.getNorth() || stop.stop_lat < mapState.bounds.getSouth() || stop.stop_lon > mapState.bounds.getEast() || stop.stop_lon < mapState.bounds.getWest()) {
+ return null
+ }
+ }
+ if (isNaN(stop.stop_lat) || isNaN(stop.stop_lon)) {
+ return null
+ }
+ const stopLatLng = [stop.stop_lat, stop.stop_lon]
+ const escapeListener = (e) => {
+ console.log(e)
+ // [Esc] is pressed
+ if (e.keyCode === 27 && entityEdited) {
+ console.log('escape pressed')
+ this.setState({editStop: null, editFinished: null, editStopLatLng: null})
+
+ // reset latlng
+ this.refs[stop.id].leafletElement.setLatLng(stopLatLng)
+
+ // set active entity
+ setActiveEntity(feedSource.id, 'stop', stop)
+
+ // remove listeners
+ this.refs.map.leafletElement.removeEventListener('mousemove')
+ document.removeEventListener('keydown', escapeListener, false)
+ }
+ }
+ const color = '#000'
+ const busIcon = divIcon({
+ html: ``,
+ className: '',
+ iconSize: [24, 24]
+ })
+
+ const marker = (
+ {
+ console.log(e)
+ const latlng = e.target.getLatLng()
+ const stopLatLng = clickToLatLng(latlng)
+ updateActiveEntity(activeEntity, 'stop', stopLatLng)
+ this.refs[`${stop.id}`].leafletElement.setLatLng(latlng)
+ }}
+ onClick={(e) => {
+ // set active entity
+ if (!isActive) {
+ setActiveEntity(feedSource.id, 'stop', stop)
+ }
+ }}
+ />
+ )
+ return marker
+ })
+ : null
+ }
+
+ )
+ }
+}
diff --git a/lib/editor/components/map/StopsLayer.js b/lib/editor/components/map/StopsLayer.js
new file mode 100644
index 000000000..bdcbddad1
--- /dev/null
+++ b/lib/editor/components/map/StopsLayer.js
@@ -0,0 +1,96 @@
+import React, { Component, PropTypes } from 'react'
+import { divIcon } from 'leaflet'
+import { Marker, FeatureGroup } from 'react-leaflet'
+
+import {clickToLatLng} from '../../util/map'
+
+export default class StopsLayer extends Component {
+ static propTypes = {
+ mapState: PropTypes.object
+ }
+ render () {
+ const {
+ mapState,
+ stopTree,
+ drawStops,
+ activeEntity,
+ updateActiveEntity,
+ setActiveEntity,
+ feedSource
+ } = this.props
+ const paddedBounds = mapState.bounds.pad(0.05)
+ var results = stopTree && drawStops
+ ? stopTree.search({
+ minX: paddedBounds.getWest(),
+ minY: paddedBounds.getSouth(),
+ maxX: paddedBounds.getEast(),
+ maxY: paddedBounds.getNorth()
+ })
+ : []
+ if (activeEntity && results.findIndex(r => r[2].id === activeEntity.id) === -1) {
+ results.push([0, 0, activeEntity])
+ }
+ const outOfZoom = !drawStops
+ // console.log(mapState.bounds, paddedBounds)
+ return (
+
+ {results
+ ? results.map(result => {
+ const stop = result[2]
+ const isActive = activeEntity && activeEntity.id === stop.id
+ const busIcon = divIcon({
+ html: ``,
+ className: '',
+ iconSize: [24, 24]
+ })
+ const activeBusIcon = divIcon({
+ html: ``,
+ className: '',
+ iconSize: [24, 24]
+ })
+ const hidden = !isActive && outOfZoom
+ if (hidden) {
+ return null
+ }
+ if (isNaN(stop.stop_lat) || isNaN(stop.stop_lon)) {
+ return null
+ }
+ const marker = (
+ {
+ console.log(e)
+ const latlng = e.target.getLatLng()
+ const stopLatLng = clickToLatLng(latlng)
+ updateActiveEntity(activeEntity, 'stop', stopLatLng)
+ this.refs[`${stop.id}`].leafletElement.setLatLng(latlng)
+ }}
+ onClick={(e) => {
+ // set active entity
+ if (!isActive) {
+ setActiveEntity(feedSource.id, 'stop', stop)
+ }
+ }}
+ />
+ )
+ return marker
+ })
+ : null
+ }
+
+ )
+ }
+}
diff --git a/lib/editor/components/pattern/CalculateDefaultTimesForm.js b/lib/editor/components/pattern/CalculateDefaultTimesForm.js
new file mode 100644
index 000000000..291163a8a
--- /dev/null
+++ b/lib/editor/components/pattern/CalculateDefaultTimesForm.js
@@ -0,0 +1,69 @@
+import React, { Component } from 'react'
+import { Icon } from '@conveyal/woonerf'
+import { Button, FormGroup, InputGroup, Form, FormControl, ControlLabel } from 'react-bootstrap'
+
+import MinuteSecondInput from '../MinuteSecondInput'
+
+const DEFAULT_SPEED = 20 // km/hr
+
+export default class CalculateDefaultTimesForm extends Component {
+ constructor (props) {
+ super(props)
+ this.state = {}
+ }
+ calculateDefaultTimes (pattern, speed = DEFAULT_SPEED, dwellTime = 0) {
+ if (!speed) {
+ speed = DEFAULT_SPEED
+ }
+ const patternStops = [...pattern.patternStops]
+ const convertedSpeed = speed * 1000 / 60 / 60 // km/hr -> m/s
+ for (var i = 0; i < patternStops.length; i++) {
+ patternStops[i].defaultDwellTime = dwellTime
+ patternStops[i].defaultTravelTime = patternStops[i].shapeDistTraveled / convertedSpeed
+ }
+ this.props.updateActiveEntity(pattern, 'trippattern', {patternStops})
+ this.props.saveActiveEntity('trippattern')
+ }
+ render () {
+ const { activePattern } = this.props
+ return (
+
+ )
+ }
+}
diff --git a/lib/editor/components/pattern/EditSchedulePanel.js b/lib/editor/components/pattern/EditSchedulePanel.js
new file mode 100644
index 000000000..08dfa2030
--- /dev/null
+++ b/lib/editor/components/pattern/EditSchedulePanel.js
@@ -0,0 +1,73 @@
+import React, { Component } from 'react'
+import {Icon} from '@conveyal/woonerf'
+import { Button, FormGroup, ControlLabel, ButtonGroup, DropdownButton, MenuItem } from 'react-bootstrap'
+
+export default class EditSchedulePanel extends Component {
+ render () {
+ const { activePattern, activePatternId, feedSource, activeEntity } = this.props
+ const timetableOptions = [
+ Schedules
+
+ {
+ const useFrequency = key !== 'timetables'
+ const other = key === 'timetables' ? 'frequencies' : 'timetables'
+ this.props.showConfirmModal({
+ title: `Use ${key} for ${activePattern.name}?`,
+ body: `Are you sure you want to use ${key} for this trip pattern? Any trips created using ${other} will be lost.`,
+ onConfirm: () => {
+ console.log('use ' + key)
+ this.props.updateActiveEntity(activePattern, 'trippattern', {useFrequency})
+ this.props.saveActiveEntity('trippattern')
+ }
+ })
+ }}
+ title={activePattern.useFrequency ? timetableOptions[1] : timetableOptions[0]} id='frequency-dropdown'>
+
+
+
+
+ Direction
+
+
+
+
+
+
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/pattern/EditShapePanel.js b/lib/editor/components/pattern/EditShapePanel.js
new file mode 100644
index 000000000..ec0bb9a4a
--- /dev/null
+++ b/lib/editor/components/pattern/EditShapePanel.js
@@ -0,0 +1,211 @@
+import React, { Component } from 'react'
+import {Icon} from '@conveyal/woonerf'
+import { Button, Alert, Checkbox, ButtonToolbar, FormGroup, Form, FormControl, ControlLabel } from 'react-bootstrap'
+import { sentence as toSentenceCase } from 'change-case'
+import Rcslider from 'rc-slider'
+
+import { polyline as getPolyline } from '../../../scenario-editor/utils/valhalla'
+import { CLICK_OPTIONS } from '../../util'
+
+export default class EditShapePanel extends Component {
+ async drawPatternFromStops (pattern, stops) {
+ const newShape = await getPolyline(stops)
+ if (newShape) {
+ this.props.updateActiveEntity(pattern, 'trippattern', {shape: {type: 'LineString', coordinates: newShape}})
+ this.props.saveActiveEntity('trippattern')
+ return true
+ } else {
+ this.props.setErrorMessage('Error drawing pattern from stops! Some stops may be unreachable by streets.')
+ return false
+ }
+ }
+ renderEditSettings (isEditing) {
+ return isEditing
+ ?
+ Edit settings
+ this.props.updateEditSetting('followStreets', !this.props.editSettings.followStreets)}>
+ Snap to streets
+
+ this.props.updateEditSetting('snapToStops', !this.props.editSettings.snapToStops)}>
+ Snap to stops
+
+ this.props.updateEditSetting('hideStops', !this.props.editSettings.hideStops)}>
+ Show stops
+
+ Editing mode
+ this.props.updateEditSetting('onMapClick', evt.target.value)}
+ >
+ {CLICK_OPTIONS.map(v => {
+ return
+ })}
+
+ {this.props.editSettings.onMapClick === 'ADD_STOPS_AT_INTERVAL'
+ ?
+ this.props.updateEditSetting('stopInterval', value)}
+ step={25}
+ marks={{
+ 100: '100m',
+ 400: 400m,
+ 800: '800m',
+ 1600: '1600m'
+ }}
+ tipFormatter={(value) => {
+ return `${value}m (${Math.round(value * 0.000621371 * 100) / 100}mi)`
+ }}
+ />
+
+ : this.props.editSettings.onMapClick === 'ADD_STOPS_AT_INTERSECTIONS'
+ ?
+ : null
+ }
+ {this.props.editSettings.onMapClick.includes('ADD_')
+ ?
+ Warning! This editing mode creates new stops. Unless no existing stops are nearby, this mode is not recommended.
+
+ : null
+ }
+
+ : null
+ }
+ renderEditButtons (isEditing, activePattern) {
+ const buttons = []
+ if (isEditing) {
+ buttons.push()
+ buttons.push()
+ buttons.push()
+ } else {
+ buttons.push()
+ buttons.push()
+ buttons.push()
+ }
+ return buttons
+ }
+ render () {
+ const { activePattern } = this.props
+ return (
+
+
+ Pattern Shape
+
+
+ {this.renderEditButtons(this.props.editSettings.editGeometry, activePattern)}
+ {this.renderEditSettings(this.props.editSettings.editGeometry)}
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/pattern/PatternStopCard.js b/lib/editor/components/pattern/PatternStopCard.js
new file mode 100644
index 000000000..292f6e982
--- /dev/null
+++ b/lib/editor/components/pattern/PatternStopCard.js
@@ -0,0 +1,195 @@
+import React, { Component, PropTypes } from 'react'
+import { DragSource, DropTarget } from 'react-dnd'
+import { Row, Col, Button, Collapse, FormGroup, ControlLabel, Checkbox } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+
+import { getEntityName, getAbbreviatedStopName } from '../../util/gtfs'
+import MinuteSecondInput from '../MinuteSecondInput'
+
+const cardSource = {
+ beginDrag (props) {
+ return {
+ id: props.id,
+ originalIndex: props.findCard(props.id).index
+ }
+ },
+
+ endDrag (props, monitor) {
+ const { id: droppedId, originalIndex } = monitor.getItem()
+ const didDrop = monitor.didDrop()
+ if (!didDrop) {
+ console.log('endDrag')
+ props.moveCard(droppedId, originalIndex)
+ }
+ }
+}
+
+const cardTarget = {
+ drop (props, monitor) {
+ const { id: droppedId, originalIndex } = monitor.getItem()
+ const { index: droppedIndex } = props.findCard(droppedId)
+ if (droppedIndex !== originalIndex) {
+ console.log('dropped in new location')
+ props.dropCard()
+ }
+ },
+ hover (props, monitor) {
+ const { id: draggedId } = monitor.getItem()
+ const { id: overId } = props
+ if (draggedId !== overId) {
+ const { index: overIndex } = props.findCard(overId)
+ props.moveCard(draggedId, overIndex)
+ }
+ }
+}
+
+class PatternStopCard extends Component {
+ static propTypes = {
+ connectDragSource: PropTypes.func.isRequired,
+ connectDropTarget: PropTypes.func.isRequired,
+ index: PropTypes.number.isRequired,
+ isDragging: PropTypes.bool.isRequired,
+ id: PropTypes.any.isRequired,
+ moveCard: PropTypes.func.isRequired,
+ style: PropTypes.object,
+
+ cumulativeTravelTime: PropTypes.number,
+ stopIsActive: PropTypes.bool,
+
+ stop: PropTypes.object,
+ activePattern: PropTypes.object,
+
+ patternStop: PropTypes.object,
+ rowStyle: PropTypes.object,
+
+ activeStop: PropTypes.string,
+
+ setActiveStop: PropTypes.func,
+ updateActiveEntity: PropTypes.func,
+ saveActiveEntity: PropTypes.func
+ }
+ constructor (props) {
+ super(props)
+ this.state = {}
+ }
+ handleClick (stopIsActive) {
+ if (!stopIsActive) this.props.setActiveStop(this.props.id)
+ else this.props.setActiveStop(null)
+ }
+ render () {
+ const { isDragging, connectDragSource, connectDropTarget, stop, index, patternStop, cumulativeTravelTime, updateActiveEntity, saveActiveEntity, activePattern } = this.props
+ const opacity = isDragging ? 0 : 1
+ const stopIsActive = this.props.activeStop === this.props.id
+ const stopName = getEntityName('stop', stop)
+ const abbreviatedStopName = getAbbreviatedStopName(stop)
+ const titleStopName = stop ? `${index + 1}. ${stopName}` : `${index + 1}. ${stop.stop_id}`
+ const fullStopName = stop ? `${index + 1}. ${abbreviatedStopName}` : `${index + 1}. ${stop.stop_id}`
+
+ return connectDragSource(connectDropTarget(
+
+ {/* Main card title */}
+ this.handleClick(stopIsActive)}
+ onKeyDown={(e) => {
+ console.log(e.keyCode)
+ if (e.keyCode === 13) {
+ this.handleClick(stopIsActive)
+ }
+ }}>
+
+
+
+
+
+ {Math.round(cumulativeTravelTime / 60)} (+{Math.round(patternStop.defaultTravelTime / 60)}{patternStop.defaultDwellTime > 0 ? ` +${Math.round(patternStop.defaultDwellTime / 60)}` : ''})
+ {' '}
+
+
+
+
+ {/* Collapsible interior div */}
+
+
+ {/* Remove from pattern button */}
+
+ {
+ const patternStops = [...activePattern.patternStops]
+ patternStops[index].timepoint = !patternStop.timepoint
+ updateActiveEntity(activePattern, 'trippattern', {patternStops})
+ saveActiveEntity('trippattern')
+ }}
+ >
+ Timepoint?
+
+
+
+ {/* default travel time inputs */}
+
+
+ Default travel time
+ {
+ const patternStops = [...activePattern.patternStops]
+ patternStops[index].defaultTravelTime = value
+ this.setState({defaultTravelTime: value})
+ updateActiveEntity(activePattern, 'trippattern', {patternStops: patternStops})
+ }}
+ />
+
+
+
+ Default dwell time
+ {
+ const patternStops = [...activePattern.patternStops]
+ patternStops[index].defaultDwellTime = value
+ this.setState({defaultDwellTime: value})
+ updateActiveEntity(activePattern, 'trippattern', {patternStops: patternStops})
+ }}
+ />
+
+
+
+
+
+
+ ))
+ }
+}
+
+const dropTargetCollect = (connect) => ({connectDropTarget: connect.dropTarget()})
+const dragSourceCollect = (connect, monitor) => ({connectDragSource: connect.dragSource(), isDragging: monitor.isDragging()})
+
+export default DropTarget('card', cardTarget, dropTargetCollect)(DragSource('card', cardSource, dragSourceCollect)(PatternStopCard))
diff --git a/src/main/client/editor/components/PatternStopContainer.js b/lib/editor/components/pattern/PatternStopContainer.js
similarity index 59%
rename from src/main/client/editor/components/PatternStopContainer.js
rename to lib/editor/components/pattern/PatternStopContainer.js
index bd874c70c..18444ce91 100644
--- a/src/main/client/editor/components/PatternStopContainer.js
+++ b/lib/editor/components/pattern/PatternStopContainer.js
@@ -3,32 +3,24 @@ import update from 'react/lib/update'
import { shallowEqual } from 'react-pure-render'
import PatternStopCard from './PatternStopCard'
import { DropTarget, DragDropContext } from 'react-dnd'
-import Scrollzone from 'react-dnd-scrollzone'
import HTML5Backend from 'react-dnd-html5-backend'
-import { getEntityName } from '../util/gtfs'
-import VirtualizedEntitySelect from './VirtualizedEntitySelect'
-import { polyline as getPolyline, getSegment } from '../../scenario-editor/utils/valhalla'
-import ll from 'lonlng'
-
/* This component and its child components (Card.js) are based on the react-dnd sortable
example found here: http://gaearon.github.io/react-dnd/examples-sortable-cancel-on-drop-outside.html
*/
-const scrollStyle = {
- // overflowX: 'scroll',
- overflowY: 'scroll',
-}
const cardTarget = {
drop () {
}
}
-@DragDropContext(HTML5Backend)
-@DropTarget('card', cardTarget, connect => ({
- connectDropTarget: connect.dropTarget()
-}))
-export default class PatternStopContainer extends Component {
+
+class PatternStopContainer extends Component {
static propTypes = {
- connectDropTarget: PropTypes.func.isRequired
+ connectDropTarget: PropTypes.func.isRequired,
+ activePattern: PropTypes.object.isRequired,
+ updateActiveEntity: PropTypes.func,
+ saveActiveEntity: PropTypes.func,
+ stops: PropTypes.array,
+ cardStyle: PropTypes.object
}
constructor (props) {
super(props)
@@ -47,19 +39,20 @@ export default class PatternStopContainer extends Component {
}
}
componentWillReceiveProps (nextProps) {
- if (nextProps.activePattern.patternStops && !shallowEqual(nextProps.activePattern.patternStops, this.props.activePattern.patternStops)){
+ // Updates cards when pattern stops order changes (does not account for changes to default travel/dwell times)
+ if (nextProps.activePattern.patternStops && !shallowEqual(nextProps.activePattern.patternStops, this.props.activePattern.patternStops)) {
this.setState({cards: nextProps.activePattern.patternStops.map(this.addUniqueId)})
}
}
dropCard () {
- let patternStops = [...this.state.cards]
- let pattern = Object.assign({}, this.props.activePattern)
+ const patternStops = [...this.state.cards]
+ const pattern = Object.assign({}, this.props.activePattern)
pattern.patternStops = patternStops
this.props.updateActiveEntity(this.props.activePattern, 'trippattern', {patternStops})
this.props.saveActiveEntity('trippattern')
}
moveCard (id, atIndex) {
- const { card, index } = this.findCard(id);
+ const { card, index } = this.findCard(id)
this.setState(update(this.state, {
cards: {
$splice: [
@@ -67,7 +60,7 @@ export default class PatternStopContainer extends Component {
[atIndex, 0, card]
]
}
- }));
+ }))
}
findCard (id) {
@@ -78,7 +71,6 @@ export default class PatternStopContainer extends Component {
index: cards.indexOf(card)
}
}
-
render () {
const { connectDropTarget } = this.props
const { cards } = this.state
@@ -87,9 +79,6 @@ export default class PatternStopContainer extends Component {
let cumulativeTravelTime = 0
return connectDropTarget(
- {
- /**/
- }
{cards.map((card, i) => {
if (!card) {
return null
@@ -98,29 +87,28 @@ export default class PatternStopContainer extends Component {
cumulativeTravelTime += card.defaultDwellTime + card.defaultTravelTime
return (
this.dropCard()}
- activeStop={this.state.activeStop}
- setActiveStop={(stopKey) => this.setState({activeStop: stopKey})}
+ key={card.id}
+ id={card.id}
+ index={i}
+ style={this.props.cardStyle}
+ cumulativeTravelTime={cumulativeTravelTime}
+ stop={stop}
+ activePattern={this.props.activePattern}
+ updateActiveEntity={this.props.updateActiveEntity}
+ saveActiveEntity={this.props.saveActiveEntity}
+ patternStop={card}
+ moveCard={this.moveCard}
+ findCard={this.findCard}
+ dropCard={() => this.dropCard()}
+ activeStop={this.state.activeStop}
+ setActiveStop={(stopKey) => this.setState({activeStop: stopKey})}
/>
)
})}
- {
- /* */
- }
)
}
}
+
+// TODO: Verify correct order
+export default DragDropContext(HTML5Backend)(DropTarget('card', cardTarget, (connect) => ({connectDropTarget: connect.dropTarget()}))(PatternStopContainer))
diff --git a/lib/editor/components/pattern/PatternStopsPanel.js b/lib/editor/components/pattern/PatternStopsPanel.js
new file mode 100644
index 000000000..3e445e5c4
--- /dev/null
+++ b/lib/editor/components/pattern/PatternStopsPanel.js
@@ -0,0 +1,113 @@
+import React, {PropTypes} from 'react'
+import {Icon, Pure} from '@conveyal/woonerf'
+import { Button, ButtonToolbar } from 'react-bootstrap'
+
+import PatternStopContainer from './PatternStopContainer'
+import VirtualizedEntitySelect from '../VirtualizedEntitySelect'
+
+export default class PatternStopsPanel extends Pure {
+ static propTypes = {
+ activePattern: PropTypes.object,
+ editSettings: PropTypes.object,
+ mapState: PropTypes.object,
+ saveActiveEntity: PropTypes.func,
+ stops: PropTypes.array,
+ updateActiveEntity: PropTypes.func,
+ updateEditSetting: PropTypes.func
+ }
+ addStopFromSelect = (input) => {
+ if (!input) {
+ return
+ }
+ const stop = input.entity
+ return this.props.addStopToPattern(this.props.activePattern, stop)
+ }
+ render () {
+ const {
+ activePattern,
+ editSettings,
+ mapState,
+ saveActiveEntity,
+ stops,
+ updateActiveEntity,
+ updateEditSetting
+ } = this.props
+ const cardStyle = {
+ border: '1px dashed gray',
+ padding: '0.5rem 0.5rem',
+ marginBottom: '.5rem',
+ backgroundColor: '#f2f2f2',
+ cursor: 'pointer'
+ }
+ return (
+
+
+
+
+
+ {editSettings.addStops && mapState.zoom <= 14
+ ? Zoom to view stops
+ : null
+ }
+ Stops
+
+ {/* List of pattern stops */}
+
+ Stop sequence
+
+
+ Travel time
+
+
+ updateEditSetting('addStops', !editSettings.addStops)}
+ className='small'
+ >
+
+
+ }
+
+ )
+ }
+}
diff --git a/lib/editor/components/pattern/TripPatternList.js b/lib/editor/components/pattern/TripPatternList.js
new file mode 100644
index 000000000..5cdb0483c
--- /dev/null
+++ b/lib/editor/components/pattern/TripPatternList.js
@@ -0,0 +1,118 @@
+import React, {Component, PropTypes} from 'react'
+import { Table, Collapse } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+
+import Loading from '../../../common/components/Loading'
+import TripPatternViewer from './TripPatternViewer'
+import TripPatternListControls from './TripPatternListControls'
+
+export default class TripPatternList extends Component {
+ static propTypes = {
+ stops: PropTypes.array,
+
+ updateActiveEntity: PropTypes.func.isRequired,
+ saveActiveEntity: PropTypes.func.isRequired,
+ updateEditSetting: PropTypes.func.isRequired,
+ resetActiveEntity: PropTypes.func.isRequired,
+ setActiveEntity: PropTypes.func.isRequired,
+ cloneEntity: PropTypes.func.isRequired,
+ deleteEntity: PropTypes.func.isRequired,
+ newGtfsEntity: PropTypes.func.isRequired,
+ undoActiveTripPatternEdits: PropTypes.func,
+
+ showConfirmModal: PropTypes.func,
+
+ editSettings: PropTypes.object,
+ entity: PropTypes.object,
+ activeEntity: PropTypes.object,
+ feedSource: PropTypes.object,
+ mapState: PropTypes.object,
+
+ // activeComponent: PropTypes.string.isRequired,
+ // subSubComponent: PropTypes.string,
+ subEntityId: PropTypes.string,
+ currentPattern: PropTypes.object
+ }
+ shouldComponentUpdate (nextProps) {
+ return true
+ }
+ renderPatternRow (pattern, patternId, route) {
+ const rowStyle = {
+ paddingTop: 5,
+ paddingBottom: 5
+ }
+ const activeColor = '#fff'
+ const activeRowStyle = {
+ backgroundColor: activeColor,
+ paddingTop: 5,
+ paddingBottom: 5
+ }
+ const isActive = patternId && pattern.id === patternId
+ const patternName = `${`${pattern.name.length > 35 ? pattern.name.substr(0, 35) + '...' : pattern.name}`} ${pattern.patternStops ? `(${pattern.patternStops.length} stops)` : ''}`
+ return (
+
+
+ this._selectRow(isActive, route, pattern)}>
+
+
+ {isActive
+ ?
+
+
+ )
+ }
+ _selectRow (isActive, route, pattern) {
+ if (isActive) this.props.setActiveEntity(this.props.feedSource.id, 'route', route, 'trippattern')
+ else this.props.setActiveEntity(this.props.feedSource.id, 'route', route, 'trippattern', pattern)
+ }
+ render () {
+ const { activeEntity, activePatternId } = this.props
+ if (!activeEntity.tripPatterns) {
+ return
+
+ {activeEntity.tripPatterns
+ ? activeEntity.tripPatterns.map(pattern => this.renderPatternRow(pattern, activePatternId, activeEntity))
+ :
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/pattern/TripPatternListControls.js b/lib/editor/components/pattern/TripPatternListControls.js
new file mode 100644
index 000000000..a8dd9bae3
--- /dev/null
+++ b/lib/editor/components/pattern/TripPatternListControls.js
@@ -0,0 +1,84 @@
+import React, { Component } from 'react'
+import { Icon } from '@conveyal/woonerf'
+
+import { OverlayTrigger, Tooltip, ButtonToolbar, Button } from 'react-bootstrap'
+
+export default class TripPatternListControls extends Component {
+ render () {
+ const { activePattern, activePatternId, feedSource, activeEntity } = this.props
+ return (
+
+
+
+ Reverse trip pattern}>
+
+
+ Duplicate trip pattern}>
+
+
+ Delete trip pattern}>
+
+
+
+
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/pattern/TripPatternViewer.js b/lib/editor/components/pattern/TripPatternViewer.js
new file mode 100644
index 000000000..20a92aadf
--- /dev/null
+++ b/lib/editor/components/pattern/TripPatternViewer.js
@@ -0,0 +1,32 @@
+import React, { Component } from 'react'
+
+import EditableTextField from '../../../common/components/EditableTextField'
+import EditShapePanel from './EditShapePanel'
+import EditSchedulePanel from './EditSchedulePanel'
+import CalculateDefaultTimesForm from './CalculateDefaultTimesForm'
+import PatternStopsPanel from './PatternStopsPanel'
+
+export default class TripPatternViewer extends Component {
+ savePatternName = (name) => {
+ this.props.updateActiveEntity(this.props.activePattern, 'trippattern', {name})
+ this.props.saveActiveEntity('trippattern')
+ }
+ render () {
+ const { activePattern } = this.props
+ return (
+
+
+
+
+
+
+
+ )
+ }
+}
diff --git a/src/main/client/editor/components/VirtualizedEntitySelect.js b/lib/editor/components/VirtualizedEntitySelect.js
similarity index 69%
rename from src/main/client/editor/components/VirtualizedEntitySelect.js
rename to lib/editor/components/VirtualizedEntitySelect.js
index 3304350c0..7924c8775 100644
--- a/src/main/client/editor/components/VirtualizedEntitySelect.js
+++ b/lib/editor/components/VirtualizedEntitySelect.js
@@ -1,18 +1,19 @@
import React, {Component, PropTypes} from 'react'
import VirtualizedSelect from 'react-virtualized-select'
-import 'react-virtualized/styles.css'
-import 'react-select/dist/react-select.css'
-import 'react-virtualized-select/styles.css'
import { getEntityName } from '../util/gtfs'
export default class VirtualizedEntitySelect extends Component {
-
- constructor(props) {
+ static propTypes = {
+ entities: PropTypes.array,
+ component: PropTypes.string,
+ entityKey: PropTypes.string
+ }
+ constructor (props) {
super(props)
this.state = {
value: this.props.value
- };
+ }
}
componentWillReceiveProps (nextProps) {
if (this.state.value !== nextProps.value && typeof this.props.value !== 'undefined') {
@@ -23,18 +24,20 @@ export default class VirtualizedEntitySelect extends Component {
this.setState({value})
this.props.onChange(value)
}
-
render () {
- let { entities, component, entityKey } = this.props
- let key = entityKey ? entityKey : 'id'
+ const { entities, component, entityKey } = this.props
+ const key = entityKey || 'id'
return (
+
+ {stop.stop_name}
+
+
+
+
+ Edit stop}>
+
+
+ Remove from pattern}>
+
+
+ addStopToPattern(activePattern, stop, key)}
+ >
+
+
+
+ {activePattern.patternStops && activePattern.patternStops.map((stop, i) => {
+ const addIndex = activePattern.patternStops.length - i
+ if (index === activePattern.patternStops.length - 1 && index === addIndex - 1) {
+ return null
+ }
+ // disable adding stop to current position or directly before/after current position
+ return (
+
+ )
+ })}
+
+
+
+
+
+
+
+ Travel time
+ {
+ const patternStops = [...activePattern.patternStops]
+ patternStops[index].defaultTravelTime = value
+ updateActiveEntity(activePattern, 'trippattern', {patternStops: patternStops})
+ }}
+ />
+
+
+
+ Dwell time
+ {
+ const patternStops = [...activePattern.patternStops]
+ patternStops[index].defaultDwellTime = +evt.target.value
+ updateActiveEntity(activePattern, 'trippattern', {patternStops: patternStops})
+ }}
+ />
+
+
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/map/PatternStopsLayer.js b/lib/editor/components/map/PatternStopsLayer.js
new file mode 100644
index 000000000..2621daad0
--- /dev/null
+++ b/lib/editor/components/map/PatternStopsLayer.js
@@ -0,0 +1,66 @@
+import React, { Component, PropTypes } from 'react'
+import { divIcon } from 'leaflet'
+import { Marker, Popup, FeatureGroup } from 'react-leaflet'
+
+import PatternStopPopup from './PatternStopPopup'
+
+export default class PatternStopsLayer extends Component {
+ static propTypes = {
+ activePattern: PropTypes.object,
+ addStopToPattern: PropTypes.func,
+ editSettings: PropTypes.object,
+ removeStopFromPattern: PropTypes.func,
+ stops: PropTypes.array
+ }
+ render () {
+ const {
+ activePattern,
+ addStopToPattern,
+ editSettings,
+ removeStopFromPattern,
+ stops
+ } = this.props
+ return (
+ {index + 1}. {stop.stop_name}
+
+
+ {
+ const useFrequency = key !== 'timetables'
+ const other = key === 'timetables' ? 'frequencies' : 'timetables'
+ this.props.showConfirmModal({
+ title: `Use ${key} for ${activePattern.name}?`,
+ body: `Are you sure you want to use ${key} for this trip pattern? Any trips created using ${other} will be lost.`,
+ onConfirm: () => {
+ console.log('use ' + key)
+ this.props.updateActiveEntity(activePattern, 'trippattern', {useFrequency})
+ this.props.saveActiveEntity('trippattern')
+ }
+ })
+ }}
+ title={activePattern.useFrequency ? timetableOptions[1] : timetableOptions[0]} id='frequency-dropdown'>
+
+
+
+
+ Direction
+
+
+
+
+
+
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/pattern/EditShapePanel.js b/lib/editor/components/pattern/EditShapePanel.js
new file mode 100644
index 000000000..ec0bb9a4a
--- /dev/null
+++ b/lib/editor/components/pattern/EditShapePanel.js
@@ -0,0 +1,211 @@
+import React, { Component } from 'react'
+import {Icon} from '@conveyal/woonerf'
+import { Button, Alert, Checkbox, ButtonToolbar, FormGroup, Form, FormControl, ControlLabel } from 'react-bootstrap'
+import { sentence as toSentenceCase } from 'change-case'
+import Rcslider from 'rc-slider'
+
+import { polyline as getPolyline } from '../../../scenario-editor/utils/valhalla'
+import { CLICK_OPTIONS } from '../../util'
+
+export default class EditShapePanel extends Component {
+ async drawPatternFromStops (pattern, stops) {
+ const newShape = await getPolyline(stops)
+ if (newShape) {
+ this.props.updateActiveEntity(pattern, 'trippattern', {shape: {type: 'LineString', coordinates: newShape}})
+ this.props.saveActiveEntity('trippattern')
+ return true
+ } else {
+ this.props.setErrorMessage('Error drawing pattern from stops! Some stops may be unreachable by streets.')
+ return false
+ }
+ }
+ renderEditSettings (isEditing) {
+ return isEditing
+ ? Schedules
++
+ this.props.updateEditSetting('stopInterval', value)}
+ step={25}
+ marks={{
+ 100: '100m',
+ 400: 400m,
+ 800: '800m',
+ 1600: '1600m'
+ }}
+ tipFormatter={(value) => {
+ return `${value}m (${Math.round(value * 0.000621371 * 100) / 100}mi)`
+ }}
+ />
+
+ : this.props.editSettings.onMapClick === 'ADD_STOPS_AT_INTERSECTIONS'
+ ?
+ : null
+ }
+ {this.props.editSettings.onMapClick.includes('ADD_')
+ ?
+
+ {this.renderEditButtons(this.props.editSettings.editGeometry, activePattern)}
+ {this.renderEditSettings(this.props.editSettings.editGeometry)}
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/pattern/PatternStopCard.js b/lib/editor/components/pattern/PatternStopCard.js
new file mode 100644
index 000000000..292f6e982
--- /dev/null
+++ b/lib/editor/components/pattern/PatternStopCard.js
@@ -0,0 +1,195 @@
+import React, { Component, PropTypes } from 'react'
+import { DragSource, DropTarget } from 'react-dnd'
+import { Row, Col, Button, Collapse, FormGroup, ControlLabel, Checkbox } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+
+import { getEntityName, getAbbreviatedStopName } from '../../util/gtfs'
+import MinuteSecondInput from '../MinuteSecondInput'
+
+const cardSource = {
+ beginDrag (props) {
+ return {
+ id: props.id,
+ originalIndex: props.findCard(props.id).index
+ }
+ },
+
+ endDrag (props, monitor) {
+ const { id: droppedId, originalIndex } = monitor.getItem()
+ const didDrop = monitor.didDrop()
+ if (!didDrop) {
+ console.log('endDrag')
+ props.moveCard(droppedId, originalIndex)
+ }
+ }
+}
+
+const cardTarget = {
+ drop (props, monitor) {
+ const { id: droppedId, originalIndex } = monitor.getItem()
+ const { index: droppedIndex } = props.findCard(droppedId)
+ if (droppedIndex !== originalIndex) {
+ console.log('dropped in new location')
+ props.dropCard()
+ }
+ },
+ hover (props, monitor) {
+ const { id: draggedId } = monitor.getItem()
+ const { id: overId } = props
+ if (draggedId !== overId) {
+ const { index: overIndex } = props.findCard(overId)
+ props.moveCard(draggedId, overIndex)
+ }
+ }
+}
+
+class PatternStopCard extends Component {
+ static propTypes = {
+ connectDragSource: PropTypes.func.isRequired,
+ connectDropTarget: PropTypes.func.isRequired,
+ index: PropTypes.number.isRequired,
+ isDragging: PropTypes.bool.isRequired,
+ id: PropTypes.any.isRequired,
+ moveCard: PropTypes.func.isRequired,
+ style: PropTypes.object,
+
+ cumulativeTravelTime: PropTypes.number,
+ stopIsActive: PropTypes.bool,
+
+ stop: PropTypes.object,
+ activePattern: PropTypes.object,
+
+ patternStop: PropTypes.object,
+ rowStyle: PropTypes.object,
+
+ activeStop: PropTypes.string,
+
+ setActiveStop: PropTypes.func,
+ updateActiveEntity: PropTypes.func,
+ saveActiveEntity: PropTypes.func
+ }
+ constructor (props) {
+ super(props)
+ this.state = {}
+ }
+ handleClick (stopIsActive) {
+ if (!stopIsActive) this.props.setActiveStop(this.props.id)
+ else this.props.setActiveStop(null)
+ }
+ render () {
+ const { isDragging, connectDragSource, connectDropTarget, stop, index, patternStop, cumulativeTravelTime, updateActiveEntity, saveActiveEntity, activePattern } = this.props
+ const opacity = isDragging ? 0 : 1
+ const stopIsActive = this.props.activeStop === this.props.id
+ const stopName = getEntityName('stop', stop)
+ const abbreviatedStopName = getAbbreviatedStopName(stop)
+ const titleStopName = stop ? `${index + 1}. ${stopName}` : `${index + 1}. ${stop.stop_id}`
+ const fullStopName = stop ? `${index + 1}. ${abbreviatedStopName}` : `${index + 1}. ${stop.stop_id}`
+
+ return connectDragSource(connectDropTarget(
+ + Pattern Shape +
+
+ {/* Main card title */}
+
+
+
+ ))
+ }
+}
+
+const dropTargetCollect = (connect) => ({connectDropTarget: connect.dropTarget()})
+const dragSourceCollect = (connect, monitor) => ({connectDragSource: connect.dragSource(), isDragging: monitor.isDragging()})
+
+export default DropTarget('card', cardTarget, dropTargetCollect)(DragSource('card', cardSource, dragSourceCollect)(PatternStopCard))
diff --git a/src/main/client/editor/components/PatternStopContainer.js b/lib/editor/components/pattern/PatternStopContainer.js
similarity index 59%
rename from src/main/client/editor/components/PatternStopContainer.js
rename to lib/editor/components/pattern/PatternStopContainer.js
index bd874c70c..18444ce91 100644
--- a/src/main/client/editor/components/PatternStopContainer.js
+++ b/lib/editor/components/pattern/PatternStopContainer.js
@@ -3,32 +3,24 @@ import update from 'react/lib/update'
import { shallowEqual } from 'react-pure-render'
import PatternStopCard from './PatternStopCard'
import { DropTarget, DragDropContext } from 'react-dnd'
-import Scrollzone from 'react-dnd-scrollzone'
import HTML5Backend from 'react-dnd-html5-backend'
-import { getEntityName } from '../util/gtfs'
-import VirtualizedEntitySelect from './VirtualizedEntitySelect'
-import { polyline as getPolyline, getSegment } from '../../scenario-editor/utils/valhalla'
-import ll from 'lonlng'
-
/* This component and its child components (Card.js) are based on the react-dnd sortable
example found here: http://gaearon.github.io/react-dnd/examples-sortable-cancel-on-drop-outside.html
*/
-const scrollStyle = {
- // overflowX: 'scroll',
- overflowY: 'scroll',
-}
const cardTarget = {
drop () {
}
}
-@DragDropContext(HTML5Backend)
-@DropTarget('card', cardTarget, connect => ({
- connectDropTarget: connect.dropTarget()
-}))
-export default class PatternStopContainer extends Component {
+
+class PatternStopContainer extends Component {
static propTypes = {
- connectDropTarget: PropTypes.func.isRequired
+ connectDropTarget: PropTypes.func.isRequired,
+ activePattern: PropTypes.object.isRequired,
+ updateActiveEntity: PropTypes.func,
+ saveActiveEntity: PropTypes.func,
+ stops: PropTypes.array,
+ cardStyle: PropTypes.object
}
constructor (props) {
super(props)
@@ -47,19 +39,20 @@ export default class PatternStopContainer extends Component {
}
}
componentWillReceiveProps (nextProps) {
- if (nextProps.activePattern.patternStops && !shallowEqual(nextProps.activePattern.patternStops, this.props.activePattern.patternStops)){
+ // Updates cards when pattern stops order changes (does not account for changes to default travel/dwell times)
+ if (nextProps.activePattern.patternStops && !shallowEqual(nextProps.activePattern.patternStops, this.props.activePattern.patternStops)) {
this.setState({cards: nextProps.activePattern.patternStops.map(this.addUniqueId)})
}
}
dropCard () {
- let patternStops = [...this.state.cards]
- let pattern = Object.assign({}, this.props.activePattern)
+ const patternStops = [...this.state.cards]
+ const pattern = Object.assign({}, this.props.activePattern)
pattern.patternStops = patternStops
this.props.updateActiveEntity(this.props.activePattern, 'trippattern', {patternStops})
this.props.saveActiveEntity('trippattern')
}
moveCard (id, atIndex) {
- const { card, index } = this.findCard(id);
+ const { card, index } = this.findCard(id)
this.setState(update(this.state, {
cards: {
$splice: [
@@ -67,7 +60,7 @@ export default class PatternStopContainer extends Component {
[atIndex, 0, card]
]
}
- }));
+ }))
}
findCard (id) {
@@ -78,7 +71,6 @@ export default class PatternStopContainer extends Component {
index: cards.indexOf(card)
}
}
-
render () {
const { connectDropTarget } = this.props
const { cards } = this.state
@@ -87,9 +79,6 @@ export default class PatternStopContainer extends Component {
let cumulativeTravelTime = 0
return connectDropTarget(
this.handleClick(stopIsActive)}
+ onKeyDown={(e) => {
+ console.log(e.keyCode)
+ if (e.keyCode === 13) {
+ this.handleClick(stopIsActive)
+ }
+ }}>
+
+ {/* Collapsible interior div */}
+
+
+
+
+
+
+ {Math.round(cumulativeTravelTime / 60)} (+{Math.round(patternStop.defaultTravelTime / 60)}{patternStop.defaultDwellTime > 0 ? ` +${Math.round(patternStop.defaultDwellTime / 60)}` : ''})
+ {' '}
+
+ {/* Remove from pattern button */}
+
+ {
+ const patternStops = [...activePattern.patternStops]
+ patternStops[index].timepoint = !patternStop.timepoint
+ updateActiveEntity(activePattern, 'trippattern', {patternStops})
+ saveActiveEntity('trippattern')
+ }}
+ >
+ Timepoint?
+
+
+
+ {/* default travel time inputs */}
+
+
+ Default travel time
+ {
+ const patternStops = [...activePattern.patternStops]
+ patternStops[index].defaultTravelTime = value
+ this.setState({defaultTravelTime: value})
+ updateActiveEntity(activePattern, 'trippattern', {patternStops: patternStops})
+ }}
+ />
+
+
+
+ Default dwell time
+ {
+ const patternStops = [...activePattern.patternStops]
+ patternStops[index].defaultDwellTime = value
+ this.setState({defaultDwellTime: value})
+ updateActiveEntity(activePattern, 'trippattern', {patternStops: patternStops})
+ }}
+ />
+
+
+
+
+
- {
- /**/
- }
{cards.map((card, i) => {
if (!card) {
return null
@@ -98,29 +87,28 @@ export default class PatternStopContainer extends Component {
cumulativeTravelTime += card.defaultDwellTime + card.defaultTravelTime
return (
this.dropCard()}
- activeStop={this.state.activeStop}
- setActiveStop={(stopKey) => this.setState({activeStop: stopKey})}
+ key={card.id}
+ id={card.id}
+ index={i}
+ style={this.props.cardStyle}
+ cumulativeTravelTime={cumulativeTravelTime}
+ stop={stop}
+ activePattern={this.props.activePattern}
+ updateActiveEntity={this.props.updateActiveEntity}
+ saveActiveEntity={this.props.saveActiveEntity}
+ patternStop={card}
+ moveCard={this.moveCard}
+ findCard={this.findCard}
+ dropCard={() => this.dropCard()}
+ activeStop={this.state.activeStop}
+ setActiveStop={(stopKey) => this.setState({activeStop: stopKey})}
/>
)
})}
- {
- /* */
- }
)
}
}
+
+// TODO: Verify correct order
+export default DragDropContext(HTML5Backend)(DropTarget('card', cardTarget, (connect) => ({connectDropTarget: connect.dropTarget()}))(PatternStopContainer))
diff --git a/lib/editor/components/pattern/PatternStopsPanel.js b/lib/editor/components/pattern/PatternStopsPanel.js
new file mode 100644
index 000000000..3e445e5c4
--- /dev/null
+++ b/lib/editor/components/pattern/PatternStopsPanel.js
@@ -0,0 +1,113 @@
+import React, {PropTypes} from 'react'
+import {Icon, Pure} from '@conveyal/woonerf'
+import { Button, ButtonToolbar } from 'react-bootstrap'
+
+import PatternStopContainer from './PatternStopContainer'
+import VirtualizedEntitySelect from '../VirtualizedEntitySelect'
+
+export default class PatternStopsPanel extends Pure {
+ static propTypes = {
+ activePattern: PropTypes.object,
+ editSettings: PropTypes.object,
+ mapState: PropTypes.object,
+ saveActiveEntity: PropTypes.func,
+ stops: PropTypes.array,
+ updateActiveEntity: PropTypes.func,
+ updateEditSetting: PropTypes.func
+ }
+ addStopFromSelect = (input) => {
+ if (!input) {
+ return
+ }
+ const stop = input.entity
+ return this.props.addStopToPattern(this.props.activePattern, stop)
+ }
+ render () {
+ const {
+ activePattern,
+ editSettings,
+ mapState,
+ saveActiveEntity,
+ stops,
+ updateActiveEntity,
+ updateEditSetting
+ } = this.props
+ const cardStyle = {
+ border: '1px dashed gray',
+ padding: '0.5rem 0.5rem',
+ marginBottom: '.5rem',
+ backgroundColor: '#f2f2f2',
+ cursor: 'pointer'
+ }
+ return (
+
+
+
+ {/* List of pattern stops */}
+
+ )
+ }
+}
diff --git a/lib/editor/components/pattern/TripPatternList.js b/lib/editor/components/pattern/TripPatternList.js
new file mode 100644
index 000000000..5cdb0483c
--- /dev/null
+++ b/lib/editor/components/pattern/TripPatternList.js
@@ -0,0 +1,118 @@
+import React, {Component, PropTypes} from 'react'
+import { Table, Collapse } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+
+import Loading from '../../../common/components/Loading'
+import TripPatternViewer from './TripPatternViewer'
+import TripPatternListControls from './TripPatternListControls'
+
+export default class TripPatternList extends Component {
+ static propTypes = {
+ stops: PropTypes.array,
+
+ updateActiveEntity: PropTypes.func.isRequired,
+ saveActiveEntity: PropTypes.func.isRequired,
+ updateEditSetting: PropTypes.func.isRequired,
+ resetActiveEntity: PropTypes.func.isRequired,
+ setActiveEntity: PropTypes.func.isRequired,
+ cloneEntity: PropTypes.func.isRequired,
+ deleteEntity: PropTypes.func.isRequired,
+ newGtfsEntity: PropTypes.func.isRequired,
+ undoActiveTripPatternEdits: PropTypes.func,
+
+ showConfirmModal: PropTypes.func,
+
+ editSettings: PropTypes.object,
+ entity: PropTypes.object,
+ activeEntity: PropTypes.object,
+ feedSource: PropTypes.object,
+ mapState: PropTypes.object,
+
+ // activeComponent: PropTypes.string.isRequired,
+ // subSubComponent: PropTypes.string,
+ subEntityId: PropTypes.string,
+ currentPattern: PropTypes.object
+ }
+ shouldComponentUpdate (nextProps) {
+ return true
+ }
+ renderPatternRow (pattern, patternId, route) {
+ const rowStyle = {
+ paddingTop: 5,
+ paddingBottom: 5
+ }
+ const activeColor = '#fff'
+ const activeRowStyle = {
+ backgroundColor: activeColor,
+ paddingTop: 5,
+ paddingBottom: 5
+ }
+ const isActive = patternId && pattern.id === patternId
+ const patternName = `${`${pattern.name.length > 35 ? pattern.name.substr(0, 35) + '...' : pattern.name}`} ${pattern.patternStops ? `(${pattern.patternStops.length} stops)` : ''}`
+ return (
+
+
+
+
+ {editSettings.addStops && mapState.zoom <= 14
+ ? Zoom to view stops
+ : null
+ }
+ Stops
+
+ {/* List of pattern stops */}
+
+
+ Stop sequence
+
+
+
+ Travel time
+
+
+ :
+
+
+
+
+ }
+ updateEditSetting('addStops', !editSettings.addStops)}
+ className='small'
+ >
+
this._selectRow(isActive, route, pattern)}>
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/pattern/TripPatternListControls.js b/lib/editor/components/pattern/TripPatternListControls.js
new file mode 100644
index 000000000..a8dd9bae3
--- /dev/null
+++ b/lib/editor/components/pattern/TripPatternListControls.js
@@ -0,0 +1,84 @@
+import React, { Component } from 'react'
+import { Icon } from '@conveyal/woonerf'
+
+import { OverlayTrigger, Tooltip, ButtonToolbar, Button } from 'react-bootstrap'
+
+export default class TripPatternListControls extends Component {
+ render () {
+ const { activePattern, activePatternId, feedSource, activeEntity } = this.props
+ return (
+
+
+
+ {activeEntity.tripPatterns
+ ? activeEntity.tripPatterns.map(pattern => this.renderPatternRow(pattern, activePatternId, activeEntity))
+ :
+
+
+
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/pattern/TripPatternViewer.js b/lib/editor/components/pattern/TripPatternViewer.js
new file mode 100644
index 000000000..20a92aadf
--- /dev/null
+++ b/lib/editor/components/pattern/TripPatternViewer.js
@@ -0,0 +1,32 @@
+import React, { Component } from 'react'
+
+import EditableTextField from '../../../common/components/EditableTextField'
+import EditShapePanel from './EditShapePanel'
+import EditSchedulePanel from './EditSchedulePanel'
+import CalculateDefaultTimesForm from './CalculateDefaultTimesForm'
+import PatternStopsPanel from './PatternStopsPanel'
+
+export default class TripPatternViewer extends Component {
+ savePatternName = (name) => {
+ this.props.updateActiveEntity(this.props.activePattern, 'trippattern', {name})
+ this.props.saveActiveEntity('trippattern')
+ }
+ render () {
+ const { activePattern } = this.props
+ return (
+
+
+ Reverse trip pattern}>
+
+
+ Duplicate trip pattern}>
+
+
+ Delete trip pattern}>
+
+
+
+
+
+
+
+
+
+
+ )
+ }
+}
diff --git a/lib/editor/components/timetable/CalendarSelect.js b/lib/editor/components/timetable/CalendarSelect.js
new file mode 100644
index 000000000..80133510a
--- /dev/null
+++ b/lib/editor/components/timetable/CalendarSelect.js
@@ -0,0 +1,64 @@
+import React, {Component} from 'react'
+import {Icon} from '@conveyal/woonerf'
+import { Label } from 'react-bootstrap'
+import Select from 'react-select'
+
+export default class CalendarSelect extends Component {
+ _render = (option) => {
+ const patternTrips = this.props.activePattern && this.props.activePattern.tripCountByCalendar[option.value] || 0
+ const routeCount = Object.keys(option.calendar.routes).length
+ return (
+
+ +
+
+
+ No feeds yet.{' '} + {user.permissions.isProjectAdmin(activeProject.id, activeProject.organizationId) && Create one.} +
+Choose a project to view feeds
+
+ {active
+ ? hoverComponent
+ : null
+ }
+
+
+
+
+
+ {
+ if (feedSource.isCreating) saveFeedSource(value)
+ else updateFeedSourceProperty(feedSource, 'name', value)
+ }}
+ link={`/feed/${feedSource.id}`}
+ />
+ {' '}
+ {!feedSource.isPublic ?
+ -
+
+
+ No feed source found for {this.props.feedSourceId}
+Return to list of projects
+ +Make this feed source {fs.isPublic ? 'private' : 'public'}.
+This feed source is currently {fs.isPublic ? 'public' : 'private'}.
+Delete this feed source.
+Once you delete a feed source, it cannot be recovered.
+
+ {
+ console.log('OK, deleting')
+ this.props.deleteFeedSource(fs)
+ }}
+ />
+ {
+ console.log(files[0].type)
+ if (isValidZipFile(files[0])) {
+ this.props.uploadFeed(fs, files[0])
+ return true
+ } else {
+ return false
+ }
+ }}
+ errorMessage='Uploaded file must be a valid zip file (.zip).'
+ />
+
+ {/* Version Navigation Widget and Name Editor */}
+
+
+
+
+
+ {this.state.listView
+ ? null
+ : {/* Version Navigation/Selection Widget */}
+ {/* Previous Version Button */}
+
+
+ {/* Version Selector Dropdown */}
+ {
+ if (key !== this.props.feedVersionIndex) {
+ this.props.setVersionIndex(fs, key)
+ }
+ }}
+ >
+ {versions.map((version, k) => {
+ k = k + 1
+ return
+ })}
+
+
+ {/* Next Version Button */}
+
+
+ }
+
+ {isModuleEnabled('deployment')
+ ?
+ : null
+ }
+ {isModuleEnabled('editor')
+ ?
+
+
+ : null
+ }
+
+
+
+
+
+ {
+ this.props.fetchValidationResult(version, this.props.isPublic)
+ }}
+ gtfsPlusDataRequested={(version) => {
+ this.props.gtfsPlusDataRequested(version)
+ }}
+ notesRequested={() => { this.props.notesRequestedForVersion(version) }}
+ newNotePosted={(note) => { this.props.newNotePostedForVersion(version, note) }}
+ {...this.props}
+ />
+
+
+
+ )
+ }
+}
diff --git a/lib/manager/components/FeedVersionReport.js b/lib/manager/components/FeedVersionReport.js
new file mode 100644
index 000000000..816158bd8
--- /dev/null
+++ b/lib/manager/components/FeedVersionReport.js
@@ -0,0 +1,324 @@
+import React, {Component, PropTypes} from 'react'
+import { Row, Col, Button, Panel, ControlLabel, Label, Tabs, Tab, ButtonGroup, ListGroup, ListGroupItem } from 'react-bootstrap'
+import moment from 'moment'
+import {Icon} from '@conveyal/woonerf'
+import numeral from 'numeral'
+import Rcslider from 'rc-slider'
+import fileDownload from 'react-file-download'
+import area from 'turf-area'
+import bboxPoly from 'turf-bbox-polygon'
+
+import EditableTextField from '../../common/components/EditableTextField'
+import ActiveGtfsMap from '../../gtfs/containers/ActiveGtfsMap'
+import { VersionButtonToolbar } from './FeedVersionViewer'
+import { getComponentMessages, getConfigProperty, getMessage, isModuleEnabled, isExtensionEnabled } from '../../common/util/config'
+import { getProfileLink } from '../../common/util/util'
+// import { downloadAsShapefile } from '../util'
+import Patterns from './reporter/containers/Patterns'
+import Routes from './reporter/containers/Routes'
+import Stops from './reporter/containers/Stops'
+import GtfsValidationSummary from './validation/GtfsValidationSummary'
+import TripsChart from './validation/TripsChart'
+import ActiveDateTimeFilter from './reporter/containers/ActiveDateTimeFilter'
+
+const dateFormat = 'MMM. DD, YYYY'
+const timeFormat = 'h:MMa'
+const MAP_HEIGHTS = [200, 400]
+const ISO_BANDS = []
+for (var i = 0; i < 24; i++) {
+ ISO_BANDS.push(300 * (i + 1))
+}
+export default class FeedVersionReport extends Component {
+
+ static propTypes = {
+ version: PropTypes.object,
+ versions: PropTypes.array,
+ feedVersionIndex: PropTypes.number,
+ isPublic: PropTypes.bool,
+ hasVersions: PropTypes.bool,
+ feedVersionRenamed: PropTypes.func,
+ fetchValidationResult: PropTypes.func,
+ publishFeedVersion: PropTypes.func
+ }
+ constructor (props) {
+ super(props)
+ this.state = {
+ tab: 'feed',
+ mapHeight: MAP_HEIGHTS[0],
+ isochroneBand: 60 * 60
+ }
+ }
+ getBoundsArea (bounds) {
+ const poly = bounds && bboxPoly([bounds.west, bounds.south, bounds.east, bounds.east])
+ return poly && area(poly)
+ }
+ getVersionDateLabel (version) {
+ const now = +moment()
+ const future = version.validationSummary && version.validationSummary.startDate > now
+ const expired = version.validationSummary && version.validationSummary.endDate < now
+ return version.validationSummary
+ ?
+ : null
+ }
+ selectTab (tab) {
+ this.setState({tab})
+ }
+ renderIsochroneMessage (version) {
+ if (version.isochrones && version.isochrones.features) {
+ return
+ Move marker or change date/time to recalculate travel shed.+ + + } else if (version.isochrones) { + return 'Reading transport network, please try again later.' + } else { + return 'Click on map above to show travel shed for this feed.' + } + } + renderValidatorTabs (version) { + if (!isModuleEnabled('validator')) { + return null + } + const validatorTabs = [ + { + title: 'Validation', + key: 'validation', + component:
+
+
+
+ Travel time
+ this.setState({isochroneBand: value * 60})}
+ step={5}
+ marks={{
+ 15: '¼ hour',
+ 30: '½ hour',
+ 60: 1 hour,
+ 120: '2 hours'
+ }}
+ tipFormatter={(value) => {
+ return `${value} minutes`
+ }}
+ />
+
+
+
+ },
+ {
+ title: 'Timeline',
+ key: 'timeline',
+ component: + {this.renderIsochroneMessage(version)} +
+ +
+
+
+ { this.props.fetchValidationResult(version) }}
+ />
+
+ }
+ ]
+ return validatorTabs.map(t => (
+ Number of trips per date of service.
+ +{getMessage(messages, 'noVersionsExist')}
+ + const versionHeader = ( +
+
+ {/* Name Display / Editor */}
+ {version.validationSummary.loadStatus === 'SUCCESS' && version.validationSummary.errorCount === 0
+ ?
+
+
+ )
+ const tableOptions = {
+ striped: true,
+ search: true,
+ hover: true,
+ exportCSV: true,
+ // maxHeight: '500px',
+ pagination: true,
+ options: {
+ paginationShowsTotal: true,
+ sizePerPageList: [10, 20, 50, 100]
+ }
+ }
+ const countFields = ['agencyCount', 'routeCount', 'tripCount', 'stopTimesCount']
+ return (
+
+ {/* Name Display / Editor */}
+ {version.validationSummary.loadStatus === 'SUCCESS' && version.validationSummary.errorCount === 0
+ ? this.props.feedVersionRenamed(version, value)} />
+ }
+
+
+
+ {isExtensionEnabled('mtc')
+ ?
+ : null
+ }
+
+
+ {version.validationSummary && version.validationSummary.avgDailyRevenueTime
+ ?
{numeral(version.validationSummary[c]).format('0 a')}
+{getMessage(messages, c)}
+ + ))} +{getMessage(messages, 'noVersionsExist')}
+ + if (this.props.listView) { + // List view of feed versions + return ( +
+
+
+ {/* "Download Feed" Button */}
+
+
+ {/* "Load for Editing" Button */}
+ {isModuleEnabled('editor') && !this.props.isPublic
+ ?
+ : null
+ }
+
+ {/* "Delete Version" Button */}
+ {!this.props.isPublic
+ ?
+ : null
+ }
+
+
+ )
+ }
+}
+
+class VersionSectionSelector extends Component {
+ static propTypes = {
+ version: PropTypes.object,
+ feedVersionIndex: PropTypes.number,
+ versionSection: PropTypes.string
+ }
+ renderIssuesLabel (version) {
+ const color = version.validationSummary.loadStatus !== 'SUCCESS'
+ ? 'danger'
+ : version.validationSummary.errorCount
+ ? 'warning'
+ : 'success'
+ const text = version.validationSummary.loadStatus !== 'SUCCESS'
+ ? 'critical error'
+ : version.validationSummary.errorCount
+ return (
+
+ )
+ }
+ render () {
+ const { version } = this.props
+ return (
+
+ {getMessage(messages, 'title')}}>
+
+
+
+ Organization name
+
+ {
+ this.setState({name: evt.target.value})
+ }}
+ />
+
+
+
+
+
+
+
+
+ {getMessage(messages, 'general.updates.title')}}>
+
+
+
+ {
+ const minutes = moment(DEFAULT_FETCH_TIME).minutes()
+ const hours = moment(DEFAULT_FETCH_TIME).hours()
+ const stateUpdate = { general: { $merge: { autoFetchFeeds: evt.target.checked, autoFetchMinute: minutes, autoFetchHour: hours } } }
+ this.setState(update(this.state, stateUpdate))
+ }}
+ >
+ {getMessage(messages, 'general.updates.autoFetchFeeds')}
+
+ {autoFetchChecked
+ ? {
+ const time = moment(+seconds)
+ const minutes = moment(time).minutes()
+ const hours = moment(time).hours()
+ const stateUpdate = { general: { $merge: { autoFetchMinute: minutes, autoFetchHour: hours } } }
+ this.setState(update(this.state, stateUpdate))
+ }}
+ />
+ : null
+ }
+
+
+
+
+ {getMessage(messages, 'general.location.title')}}>
+
+
+
+
+ {
+ const latLng = evt.target.value.split(',')
+ if (typeof latLng[0] !== 'undefined' && typeof latLng[1] !== 'undefined') {
+ const stateUpdate = { general: { $merge: {defaultLocationLat: latLng[0], defaultLocationLon: latLng[1]} } }
+ this.setState(update(this.state, stateUpdate))
+ } else {
+ console.log('invalid value for latlng')
+ }
+ }}
+ />
+
+
+
+
+
+
+
+
+
+ {
+ const bBox = evt.target.value.split(',')
+ if (bBox.length === 4) {
+ const stateUpdate = { general: { $merge: {west: bBox[0], south: bBox[1], east: bBox[2], north: bBox[3]} } }
+ this.setState(update(this.state, stateUpdate))
+ }
+ }}
+ />
+ {
+
+
+
+ }
+
+
+
+
+ {
+ const stateUpdate = { general: { $merge: { defaultTimeZone: option.value } } }
+ this.setState(update(this.state, stateUpdate))
+ }}
+ />
+
+
+ {
+ const stateUpdate = { general: { $merge: { defaultLanguage: option.value } } }
+ this.setState(update(this.state, stateUpdate))
+ }}
+ />
+
+
+
+ Danger zone}>
+
+
+
+
+
+
+
+
+
+ )
+ }
+}
diff --git a/lib/manager/components/HomeProjectDropdown.js b/lib/manager/components/HomeProjectDropdown.js
new file mode 100644
index 000000000..a21084cef
--- /dev/null
+++ b/lib/manager/components/HomeProjectDropdown.js
@@ -0,0 +1,66 @@
+import React, {Component, PropTypes} from 'react'
+import {Icon} from '@conveyal/woonerf'
+import { Button, DropdownButton, MenuItem } from 'react-bootstrap'
+import { LinkContainer } from 'react-router-bootstrap'
+
+export default class HomeProjectDropdown extends Component {
+ static propTypes = {
+ activeProject: PropTypes.object
+ }
+ render () {
+ const {
+ activeProject,
+ user,
+ visibleProjects
+ } = this.props
+ const isAdmin = user.permissions.isApplicationAdmin()
+ return (
+ Delete this organization.
+Once you delete an organization, the organization and all feed sources it contains cannot be recovered.
+
+ {activeProject
+ ?
+
+
+ : null
+ }
+
+
+
+ )}
+ {activeProject && }
+ {visibleProjects.length > 0
+ ? visibleProjects.map((project, index) => {
+ if (activeProject && project.id === activeProject.id) {
+ return null
+ }
+ return (
+
+
+
+ )
+ })
+ : null
+ }
+ {activeProject && visibleProjects.length > 1 || !activeProject ? : null}
+ {isAdmin &&
+ )
+ }
+}
diff --git a/lib/manager/components/ManagerHeader.js b/lib/manager/components/ManagerHeader.js
new file mode 100644
index 000000000..f00e34f9e
--- /dev/null
+++ b/lib/manager/components/ManagerHeader.js
@@ -0,0 +1,89 @@
+import React, {Component, PropTypes} from 'react'
+import {Icon} from '@conveyal/woonerf'
+import { Row, Col, Button, ButtonToolbar } from 'react-bootstrap'
+import { Link } from 'react-router'
+import moment from 'moment'
+import numeral from 'numeral'
+
+import WatchButton from '../../common/containers/WatchButton'
+import StarButton from '../../common/containers/StarButton'
+import { getConfigProperty } from '../../common/util/config'
+
+export default class ManagerHeader extends Component {
+ static propTypes = {
+ feedSource: PropTypes.object,
+ user: PropTypes.object
+ }
+ getAverageFileSize (feedVersions) {
+ let sum = 0
+ let avg
+ if (feedVersions) {
+ for (var i = 0; i < feedVersions.length; i++) {
+ sum += feedVersions[i].fileSize
+ }
+ avg = sum / feedVersions.length
+ }
+ return numeral(avg || 0).format('0 b')
+ }
+ render () {
+ const { feedSource, project, user } = this.props
+ const isWatchingFeed = user.subscriptions.hasFeedSubscription(project.id, feedSource.id, 'feed-updated')
+ const dateFormat = getConfigProperty('application.date_format')
+ return (
+
+
+ {getConfigProperty('application.dev') &&
+
+
+ -
+
{feedSource.lastUpdated ? moment(feedSource.lastUpdated).format(dateFormat) : 'n/a'}
+ {feedSource.url ? feedSource.url : '(none)'} +
+ {{this.getAverageFileSize(feedSource.feedVersions)} }
+
{getMessage(messages, 'all')}
- {this.props.notes && this.props.notes.length > 0
- ? this.props.notes.map(note => {
- return (
-
-
+ {note.body || '(no content)'}
-{getMessage(messages, 'none')}
} -{getMessage(messages, 'postComment')}
+
+ {getConfigProperty('application.notifications_enabled')
+ ?
+
+ -
+
{project.defaultLocationLon ? `${project.defaultLocationLat}, ${project.defaultLocationLon}` : 'n/a'}
+ {project.autoFetchFeeds ? `${project.autoFetchHour}:${project.autoFetchMinute < 10 ? '0' + project.autoFetchMinute : project.autoFetchMinute}` : 'Auto fetch disabled'}
+ {/*
+ {fs.feedVersions ? `${this.getAverageFileSize(fs.feedVersions)} MB` : 'n/a'}
+ */}
+
+
+
+ }
+ + Note: Public feeds page can be viewed here. +
+| {getMessage(messages, 'table.name')} | ++ |
|---|---|
|
+
+
+ |
+ + |
| + {getMessage(messages, 'noProjects')} + {' '} + + | +
+
+ )
+ }
+ }
+}
diff --git a/lib/manager/components/ThirdPartySyncButton.js b/lib/manager/components/ThirdPartySyncButton.js
new file mode 100644
index 000000000..6bdbe0ebb
--- /dev/null
+++ b/lib/manager/components/ThirdPartySyncButton.js
@@ -0,0 +1,58 @@
+import React, {Component} from 'react'
+import { DropdownButton, MenuItem, Glyphicon } from 'react-bootstrap'
+import {Icon} from '@conveyal/woonerf'
+
+import { isExtensionEnabled } from '../../common/util/config'
+
+export default class ThirdPartySyncButton extends Component {
+ render () {
+ const { projectEditDisabled, thirdPartySync } = this.props
+ return (
+
+
+
+
+ {moment(item.date).fromNow()}
+ {item.userName} commented on feed {item.targetName}:
+ {item.body}
+ + + Hello, {user.profile.nickname}. +
+ +
+
+ {user.permissions.isApplicationAdmin()
+ ? 'Application admin'
+ : user.permissions.canAdministerAnOrganization()
+ ? 'Organization admin'
+ : 'Standard user'
+ }
+
+ {/* TODO: fetch organization for user and show badge here */}
+ {' '}
+ {/* userOrganization &&
+
+ user.permissions.getOrganizationId()
+
+ */}
+
+
+
+
+
+
+ {user.permissions.isApplicationAdmin() || user.permissions.canAdministerAnOrganization()
+ ?
+
+
+ : null
+ }
+
+
+
+ Welcome to {getConfigProperty('application.title')}!
+Manage, edit, validate and deploy your data in a streamlined workflow.
+
+
+
+ {user.recentActivity && user.recentActivity.length
+ ? user.recentActivity.sort(sortByDate).map(item => {
+ return
+
+ {
+ const fromTo = evt.target.value.split('-')
+ const from = +fromTo[0]
+ const to = +fromTo[1]
+ this.props.updateDateTimeFilter({from, to})
+ this.props.onChange && this.props.onChange({from, to})
+ }}
+ >
+ {timeOptions.map((t, i) => {
+ return
+ })}
+
+
+
+ {!validDate
+ ?
+
+ Warning! Chosen date is outside of valid date range for feed version.
+
+
+
+ : null
+ }
+
+ )
+ }
+}
diff --git a/lib/manager/components/reporter/components/FeedLayout.js b/lib/manager/components/reporter/components/FeedLayout.js
new file mode 100644
index 000000000..d9ea1c180
--- /dev/null
+++ b/lib/manager/components/reporter/components/FeedLayout.js
@@ -0,0 +1,46 @@
+import React, { PropTypes, Component } from 'react'
+import { Alert } from 'react-bootstrap'
+import {BootstrapTable, TableHeaderColumn} from 'react-bootstrap-table'
+
+import Loading from '../../../../common/components/Loading'
+
+export default class FeedLayout extends Component {
+
+ static propTypes = {
+ feed: PropTypes.object
+ }
+ componentWillMount () {
+ this.props.onComponentMount(this.props)
+ }
+
+ render () {
+ return (
+
+
+
+ {this.props.feed.fetchStatus.fetching &&
+
+ An error occurred while trying to fetch the data
+
+ }
+
+ {this.props.feed.fetchStatus.fetched &&
+
+
+ Statistic
+ Value
+
+ }
+
+
+ )
+ }
+}
diff --git a/lib/manager/components/reporter/components/PageLayout.js b/lib/manager/components/reporter/components/PageLayout.js
new file mode 100644
index 000000000..1ecfcfc4e
--- /dev/null
+++ b/lib/manager/components/reporter/components/PageLayout.js
@@ -0,0 +1,41 @@
+import React from 'react'
+import { Grid, PageHeader, Nav, NavItem } from 'react-bootstrap'
+
+import 'react-bootstrap-table/dist/react-bootstrap-table.min.css'
+import 'react-select/dist/react-select.css'
+
+import Feed from '../containers/Feed'
+import Patterns from '../containers/Patterns'
+import Routes from '../containers/Routes'
+import Stops from '../containers/Stops'
+
+export default class PageLayout extends React.Component {
+
+ render () {
+ console.log(this.props)
+ return (
+
+
+ {this.props.routes.fetchStatus.fetched &&
+
+ An error occurred while trying to fetch the data
+
+ }
+
+ {this.props.patterns.fetchStatus.fetched &&
+
+ Name
+ # of Trips
+ # of Stops
+ Headway
+ Avg. Speed
+ {
+ return (
+
+ )
+ }}>
+ Stops
+
+
+ }
+
+ )
+ }
+}
diff --git a/lib/manager/components/reporter/components/RouteLayout.js b/lib/manager/components/reporter/components/RouteLayout.js
new file mode 100644
index 000000000..de9ffe391
--- /dev/null
+++ b/lib/manager/components/reporter/components/RouteLayout.js
@@ -0,0 +1,71 @@
+import React, { Component, PropTypes } from 'react'
+import { Alert, Button } from 'react-bootstrap'
+import {BootstrapTable, TableHeaderColumn} from 'react-bootstrap-table'
+
+import Loading from '../../../../common/components/Loading'
+
+export default class RouteLayout extends Component {
+ static propTypes = {
+ onComponentMount: PropTypes.func,
+ routes: PropTypes.object,
+ tableOptions: PropTypes.object
+ }
+ componentWillMount () {
+ this.props.onComponentMount(this.props)
+ }
+
+ render () {
+ const self = this
+ return (
+
+
+
+
+ }
+
+ {this.props.patterns.fetchStatus.fetching &&
+
+
+ {this.props.routes.fetchStatus.fetching &&
+
+ An error occurred while trying to fetch the data
+
+ }
+
+ {this.props.routes.fetchStatus.fetched &&
+
+ ID
+ Short Name
+ Long Name
+ {/*
+ Description
+ {
+ return cell ? ( Link ) : ''
+ }}>
+ Route URL
+
+ */}
+ # of Trips
+ # of Patterns
+ {
+ return (
+
+ )
+ }}>
+ Patterns
+
+
+ }
+
+ )
+ }
+}
diff --git a/lib/manager/components/reporter/components/StopLayout.js b/lib/manager/components/reporter/components/StopLayout.js
new file mode 100644
index 000000000..556385d51
--- /dev/null
+++ b/lib/manager/components/reporter/components/StopLayout.js
@@ -0,0 +1,111 @@
+import React, { Component, PropTypes } from 'react'
+import { Row, Col, Alert } from 'react-bootstrap'
+import Select from 'react-select'
+import {BootstrapTable, TableHeaderColumn} from 'react-bootstrap-table'
+import moment from 'moment'
+import clone from 'clone'
+
+import { formatHeadway } from '../../../../gtfs/util/stats'
+import Loading from '../../../../common/components/Loading'
+import ActiveDateTimeFilter from '../containers/ActiveDateTimeFilter'
+
+export default class StopLayout extends Component {
+ static propTypes = {
+ onComponentMount: PropTypes.func,
+ stopRouteFilterChange: PropTypes.func,
+ stopPatternFilterChange: PropTypes.func,
+ stopDateTimeFilterChange: PropTypes.func,
+
+ version: PropTypes.object,
+ routes: PropTypes.object,
+ patterns: PropTypes.object,
+ stops: PropTypes.object,
+ tableOptions: PropTypes.object,
+ timeOptions: PropTypes.array,
+ dateTime: PropTypes.object
+ }
+ componentWillMount () {
+ this.props.onComponentMount(this.props)
+ }
+ render () {
+ const rows = this.props.stops.data.map(s => {
+ const flat = clone(s)
+ if (s.stats) {
+ delete flat.stats
+ for (const key in s.stats) {
+ flat[key] = s.stats[key]
+ }
+ }
+ return flat
+ })
+ const dateTimeProps = {
+ mode: 'date',
+ dateTime: this.props.dateTime.date ? +moment(this.props.dateTime.date, 'YYYY-MM-DD') : +moment(),
+ onChange: (millis) => {
+ console.log(+millis)
+ const date = moment(+millis).format('YYYY-MM-DD')
+ console.log(date)
+ this.props.stopDateTimeFilterChange({date})
+ }
+ }
+ if (!this.props.dateTime.date) {
+ dateTimeProps.defaultText = 'Please select a date'
+ }
+
+ return (
+
+
+
+
+ An error occurred while trying to fetch the data
+
+ }
+ {this.props.stops.fetchStatus.fetched &&
+
+ ID
+ Name
+ # of Trips
+ Headway
+ {/* Best Headway */}
+ {/* Network Importance */}
+
+ }
+
+ )
+ }
+}
diff --git a/lib/manager/components/reporter/containers/ActiveDateTimeFilter.js b/lib/manager/components/reporter/containers/ActiveDateTimeFilter.js
new file mode 100644
index 000000000..37441ca2c
--- /dev/null
+++ b/lib/manager/components/reporter/containers/ActiveDateTimeFilter.js
@@ -0,0 +1,27 @@
+import { connect } from 'react-redux'
+
+import DateTimeFilter from '../components/DateTimeFilter'
+import { updateDateTimeFilter } from '../../../../gtfs/actions/filter'
+
+const mapStateToProps = (state, ownProps) => {
+ return {
+ dateTime: state.gtfs.filter.dateTimeFilter
+ }
+}
+
+const mapDispatchToProps = (dispatch, ownProps) => {
+ return {
+ onComponentMount: (initialProps) => {
+ },
+ updateDateTimeFilter: (props) => {
+ dispatch(updateDateTimeFilter(props))
+ }
+ }
+}
+
+const ActiveDateTimeFilter = connect(
+ mapStateToProps,
+ mapDispatchToProps
+)(DateTimeFilter)
+
+export default ActiveDateTimeFilter
diff --git a/lib/manager/components/reporter/containers/Feed.js b/lib/manager/components/reporter/containers/Feed.js
new file mode 100644
index 000000000..86c9c9d42
--- /dev/null
+++ b/lib/manager/components/reporter/containers/Feed.js
@@ -0,0 +1,28 @@
+import { connect } from 'react-redux'
+
+import { fetchFeed } from '../../../../gtfs/actions/feed'
+import FeedLayout from '../components/FeedLayout'
+
+const mapStateToProps = (state, ownProps) => {
+ return {
+ feed: state.gtfs.feed
+ }
+}
+
+const mapDispatchToProps = (dispatch, ownProps) => {
+ const feedId = ownProps.version.id.replace('.zip', '')
+ return {
+ onComponentMount: (initialProps) => {
+ if (!initialProps.feed.fetchStatus.fetched) {
+ dispatch(fetchFeed(feedId))
+ }
+ }
+ }
+}
+
+const Feed = connect(
+ mapStateToProps,
+ mapDispatchToProps
+)(FeedLayout)
+
+export default Feed
diff --git a/lib/manager/components/reporter/containers/Patterns.js b/lib/manager/components/reporter/containers/Patterns.js
new file mode 100644
index 000000000..079c04a3b
--- /dev/null
+++ b/lib/manager/components/reporter/containers/Patterns.js
@@ -0,0 +1,44 @@
+import { connect } from 'react-redux'
+
+import PatternLayout from '../components/PatternLayout'
+import { patternRouteFilterChange, patternDateTimeFilterChange } from '../../../../gtfs/actions/patterns'
+import { stopPatternFilterChange } from '../../../../gtfs/actions/stops'
+import { fetchRoutes } from '../../../../gtfs/actions/routes'
+
+const mapStateToProps = (state, ownProps) => {
+ return {
+ routes: state.gtfs.routes,
+ patterns: state.gtfs.patterns
+ }
+}
+
+const mapDispatchToProps = (dispatch, ownProps) => {
+ const feedId = ownProps.version.id.replace('.zip', '')
+ return {
+ onComponentMount: (initialProps) => {
+ if (!initialProps.routes.fetchStatus.fetched) {
+ dispatch(fetchRoutes(feedId))
+ }
+ // if (!initialProps.patterns.fetchStatus.fetched) {
+ // dispatch(fetchPatterns(feedId, null))
+ // }
+ },
+ patternRouteFilterChange: (newValue) => {
+ dispatch(patternRouteFilterChange(feedId, newValue))
+ },
+ viewStops: (row) => {
+ dispatch(stopPatternFilterChange(feedId, row))
+ ownProps.selectTab('stops')
+ },
+ patternDateTimeFilterChange: (props) => {
+ dispatch(patternDateTimeFilterChange(feedId, props))
+ }
+ }
+}
+
+const Patterns = connect(
+ mapStateToProps,
+ mapDispatchToProps
+)(PatternLayout)
+
+export default Patterns
diff --git a/lib/manager/components/reporter/containers/Routes.js b/lib/manager/components/reporter/containers/Routes.js
new file mode 100644
index 000000000..a0964f82b
--- /dev/null
+++ b/lib/manager/components/reporter/containers/Routes.js
@@ -0,0 +1,33 @@
+import { connect } from 'react-redux'
+
+import RouteLayout from '../components/RouteLayout'
+import { fetchRoutes } from '../../../../gtfs/actions/routes'
+import { patternRouteFilterChange } from '../../../../gtfs/actions/patterns'
+
+const mapStateToProps = (state, ownProps) => {
+ return {
+ routes: state.gtfs.routes
+ }
+}
+
+const mapDispatchToProps = (dispatch, ownProps) => {
+ const feedId = ownProps.version.id.replace('.zip', '')
+ return {
+ onComponentMount: (initialProps) => {
+ if (!initialProps.routes.fetchStatus.fetched) {
+ dispatch(fetchRoutes(feedId))
+ }
+ },
+ viewPatterns: (row) => {
+ dispatch(patternRouteFilterChange(feedId, row))
+ ownProps.selectTab('patterns')
+ }
+ }
+}
+
+const Routes = connect(
+ mapStateToProps,
+ mapDispatchToProps
+)(RouteLayout)
+
+export default Routes
diff --git a/lib/manager/components/reporter/containers/Stops.js b/lib/manager/components/reporter/containers/Stops.js
new file mode 100644
index 000000000..90a20d29a
--- /dev/null
+++ b/lib/manager/components/reporter/containers/Stops.js
@@ -0,0 +1,48 @@
+import { connect } from 'react-redux'
+
+import StopLayout from '../components/StopLayout'
+import { stopPatternFilterChange, stopRouteFilterChange, stopDateTimeFilterChange } from '../../../../gtfs/actions/stops'
+import { fetchRoutes } from '../../../../gtfs/actions/routes'
+
+const mapStateToProps = (state, ownProps) => {
+ return {
+ stops: state.gtfs.stops,
+ routes: state.gtfs.routes,
+ patterns: state.gtfs.patterns,
+ dateTime: state.gtfs.filter.dateTimeFilter
+ }
+}
+
+const mapDispatchToProps = (dispatch, ownProps) => {
+ const feedId = ownProps.version.id.replace('.zip', '')
+ return {
+ onComponentMount: (initialProps) => {
+ if (!initialProps.routes.fetchStatus.fetched) {
+ dispatch(fetchRoutes(feedId))
+ }
+ // if (!initialProps.patterns.fetchStatus.fetched) {
+ // dispatch(fetchPatterns(feedId, null))
+ // }
+ },
+ stopRouteFilterChange: (newValue) => {
+ dispatch(stopRouteFilterChange(feedId, newValue))
+ },
+ stopPatternFilterChange: (newValue) => {
+ dispatch(stopPatternFilterChange(feedId, newValue))
+ },
+ stopDateTimeFilterChange: (props) => {
+ dispatch(stopDateTimeFilterChange(feedId, props))
+ }
+ // viewStops: (row) => {
+ // dispatch(stopPatternFilterChange(feedId, row))
+ // dispatch(ownProps.selectTab('stops'))
+ // }
+ }
+}
+
+const Stops = connect(
+ mapStateToProps,
+ mapDispatchToProps
+)(StopLayout)
+
+export default Stops
diff --git a/lib/manager/components/validation/GtfsValidationExplorer.js b/lib/manager/components/validation/GtfsValidationExplorer.js
new file mode 100644
index 000000000..b931410b2
--- /dev/null
+++ b/lib/manager/components/validation/GtfsValidationExplorer.js
@@ -0,0 +1,98 @@
+import React, {Component, PropTypes} from 'react'
+import { Row, Col, Tabs, Tab } from 'react-bootstrap'
+
+import IssuesMap from './IssuesMap'
+import IsochroneMap from './IsochroneMap'
+import GtfsValidationSummary from './GtfsValidationSummary'
+import TripsChart from './TripsChart'
+
+export default class GtfsValidationExplorer extends Component {
+ static propTypes = {
+ version: PropTypes.object
+ }
+ constructor (props) {
+ super(props)
+ this.state = {
+ activeTab: 'issues'
+ }
+ }
+ componentWillMount () {
+ // this.props.onComponentMount(this.props)
+ if (this.props.version && !this.props.version.validationResult) {
+ this.props.fetchValidationResult(this.props.version)
+ }
+ }
+ componentWillReceiveProps (nextProps) {
+ if (this.props.version && nextProps && nextProps.version &&
+ this.props.version.id !== nextProps.version.id &&
+ !nextProps.version.validationResult) {
+ this.props.fetchValidationResult(nextProps.version)
+ }
+ }
+ render () {
+ const version = this.props.version
+
+ if (!version || !this.props.version.validationResult) {
+ return null
+ }
+
+ const tabRowStyle = { marginTop: '20px' }
+
+ return (
+ {
- if(!result) this.props.fetchValidationResult()
- this.setState({ expanded: !this.state.expanded })
- }}>
-
- )
let report = null
const tableStyle = {
@@ -75,6 +81,16 @@ export default class GtfsValidationSummary extends React.Component {
return (
{report}
+
+
+
)
}
@@ -88,7 +104,7 @@ class ResultTable extends React.Component {
overflowWrap: 'break-word'
}
- let problemMap = {}
+ const problemMap = {}
this.props.invalidValues && this.props.invalidValues.map(val => {
if (!problemMap[val.errorType]) {
problemMap[val.errorType] = {
@@ -97,7 +113,7 @@ class ResultTable extends React.Component {
file: val.file,
affected: [val.affectedEntityId],
description: val.problemDescription,
- data: [val.problemData],
+ data: [val.problemData]
}
}
problemMap[val.errorType].count++
@@ -121,3 +137,5 @@ class ResultTable extends React.Component {
)
}
}
+
+// export default connect()(GtfsValidationSummary)
diff --git a/lib/manager/components/validation/GtfsValidationViewer.js b/lib/manager/components/validation/GtfsValidationViewer.js
new file mode 100644
index 000000000..141db8e55
--- /dev/null
+++ b/lib/manager/components/validation/GtfsValidationViewer.js
@@ -0,0 +1,191 @@
+import React from 'react'
+import { Panel, Table,
+ // Badge,
+ Button } from 'react-bootstrap'
+import { LinkContainer } from 'react-router-bootstrap'
+// import {Icon} from '@conveyal/woonerf'
+import {BootstrapTable, TableHeaderColumn} from 'react-bootstrap-table'
+
+// import { getComponentMessages, getMessage } from '../../../common/util/config'
+
+export default class GtfsValidationViewer extends React.Component {
+
+ constructor (props) {
+ super(props)
+ this.state = { expanded: false }
+ }
+ componentWillMount () {
+ this.props.fetchValidationResult()
+ }
+ componentWillReceiveProps (nextProps) {
+ if (!nextProps.validationResult) this.setState({ expanded: false })
+ }
+ sortPriority (a, b, order) {
+ const priorityToNum = p => {
+ switch (p) {
+ case 'HIGH':
+ return 3
+ case 'MEDIUM':
+ return 2
+ case 'LOW':
+ return 1
+ default:
+ return 0
+ }
+ }
+ if (order === 'desc') {
+ return priorityToNum(a.priority) - priorityToNum(b.priority)
+ } else {
+ return priorityToNum(b.priority) - priorityToNum(a.priority)
+ }
+ }
+ formatter (cell, row) {
+ return {cell}
+ }
+ render () {
+ const result = this.props.validationResult
+ // const messages = getComponentMessages('GtfsValidationViewer')
+ const tableOptions = {
+ striped: true,
+ search: true,
+ hover: true,
+ exportCSV: true,
+ // maxHeight: '500px',
+ tableStyle: { marginLeft: '0px', marginRight: '0px' },
+ pagination: true,
+ options: {
+ paginationShowsTotal: true,
+ sizePerPageList: [10, 20, 50, 100]
+ }
+ }
+ // let report = null
+ const files = ['routes', 'stops', 'trips', 'shapes', 'stop_times']
+ const errors = {}
+ result && result.errors.map((error, i) => {
+ error.index = i
+ const key = files.indexOf(error.file) !== -1 ? error.file : 'other'
+ if (!errors[error.file]) {
+ errors[key] = []
+ }
+ errors[key].push(error)
+ })
+ // if (result && errors) {
+ // report = (
+ //
+ // {files.map(file => {
+ // return (
+ //
+ // )
+ // } else if (result) {
+ // report = ({getMessage(messages, 'noResults')}
)
+ // }
+
+ return (
+
+ Validation Summary}>
+
+
+
+ File
+ Field
+ Line
+ Type
+ Description
+ Priority
+ Entity ID
+ {
+ return (
+
+
+
+ )
+ }} width='90' dataField='affectedEntityId'>Action
+ {/*
+ Description
+ {
+ return cell ? ( Link ) : ''
+ }}>
+ Route URL
+
+ */}
+
+
+ )
+ }
+}
+
+// class ResultTable extends React.Component {
+//
+// render () {
+// const tableStyle = {
+// tableLayout: 'fixed'
+// }
+// const messages = getComponentMessages('ResultTable')
+//
+// const breakWordStyle = {
+// wordWrap: 'break-word',
+// overflowWrap: 'break-word'
+// }
+// if (!this.props.invalidValues) {
+// return (
+// | {getMessage(messages, 'problemType')} | +//{getMessage(messages, 'priority')} | +//{getMessage(messages, 'affectedIds')} | +//{getMessage(messages, 'line')} | +//{getMessage(messages, 'description')} | +//
|---|---|---|---|---|
| {val.errorType} | +//{val.priority} | +//{val.affectedEntityId} | +//{val.line} | +//{val.message} | +//
+
+
+ )
+ }
+}
diff --git a/src/main/client/manager/containers/ActiveDeploymentViewer.js b/lib/manager/containers/ActiveDeploymentViewer.js
similarity index 66%
rename from src/main/client/manager/containers/ActiveDeploymentViewer.js
rename to lib/manager/containers/ActiveDeploymentViewer.js
index 0f0f1cfd5..b23038c13 100644
--- a/src/main/client/manager/containers/ActiveDeploymentViewer.js
+++ b/lib/manager/containers/ActiveDeploymentViewer.js
@@ -1,10 +1,7 @@
-import React from 'react'
import { connect } from 'react-redux'
import DeploymentViewer from '../components/DeploymentViewer'
-import { fetchDeployment,
- fetchDeploymentAndProject,
- fetchDeploymentTargets,
+import { fetchDeploymentAndProject,
deployToTarget,
updateDeployment,
fetchDeploymentStatus,
@@ -14,29 +11,14 @@ import { fetchDeployment,
import { fetchProjectFeeds } from '../actions/feeds'
const mapStateToProps = (state, ownProps) => {
- let deploymentId = ownProps.routeParams.deploymentId
- let user = state.user
- let project = state.projects.all
- ? state.projects.all.find(p => {
- if (!p.deployments) return false
- return (p.deployments.findIndex(dep => dep.id === deploymentId) !== -1)
- })
- : null
-
- let deployment
- if (project) {
- deployment = project.deployments.find(dep => dep.id === deploymentId)
- }
-
+ const user = state.user
return {
- deployment,
- project,
user
}
}
const mapDispatchToProps = (dispatch, ownProps) => {
- const deploymentId = ownProps.routeParams.deploymentId
+ const deploymentId = ownProps.deployment && ownProps.deployment.id
return {
onComponentMount: (initialProps) => {
if (initialProps.user.profile === null) {
@@ -50,7 +32,6 @@ const mapDispatchToProps = (dispatch, ownProps) => {
})
}
},
- onDeploymentTargetsClick: () => { dispatch(fetchDeploymentTargets()) },
deployToTargetClicked: (deployment, target) => { dispatch(deployToTarget(deployment, target)) },
downloadDeployment: (deployment) => { dispatch(downloadDeployment(deployment)) },
// updateProjectSettings: (project, newSettings) => { dispatch(updateProject(project, newSettings)) }, // dispatch(updateProject(project, { [propName] : newValue }))
@@ -61,24 +42,24 @@ const mapDispatchToProps = (dispatch, ownProps) => {
// },
// deploymentsRequested: () => { dispatch(fetchProjectDeployments(projectId)) },
// searchTextChanged: (text) => { dispatch(setVisibilitySearchText(text))},
- getDeploymentStatus: (deployment, target) => {dispatch(fetchDeploymentStatus(deployment, target))},
+ getDeploymentStatus: (deployment, target) => { dispatch(fetchDeploymentStatus(deployment, target)) },
updateVersionForFeedSource: (deployment, feedSource, feedVersion) => {
- let feedVersions = [...deployment.feedVersions]
- let index = feedVersions.findIndex(v => v.feedSource.id === feedSource.id)
+ const feedVersions = [...deployment.feedVersions]
+ const index = feedVersions.findIndex(v => v.feedSource.id === feedSource.id)
feedVersions.splice(index, 1)
feedVersions.push(feedVersion)
dispatch(updateDeployment(deployment, {feedVersions}))
},
addFeedVersion: (deployment, feedVersion) => {
- let feedVersions = [...deployment.feedVersions, feedVersion]
+ const feedVersions = [...deployment.feedVersions, feedVersion]
dispatch(updateDeployment(deployment, {feedVersions}))
},
deleteFeedVersion: (deployment, feedVersion) => {
- let feedVersions = deployment.feedVersions
- let index = feedVersions.findIndex(v => v.id === feedVersion.id)
+ const feedVersions = deployment.feedVersions
+ const index = feedVersions.findIndex(v => v.id === feedVersion.id)
feedVersions.splice(index, 1)
dispatch(updateDeployment(deployment, {feedVersions}))
- },
+ }
}
}
diff --git a/src/main/client/manager/containers/ActiveFeedSourceViewer.js b/lib/manager/containers/ActiveFeedSourceViewer.js
similarity index 76%
rename from src/main/client/manager/containers/ActiveFeedSourceViewer.js
rename to lib/manager/containers/ActiveFeedSourceViewer.js
index 647870ce2..8f1c66527 100644
--- a/src/main/client/manager/containers/ActiveFeedSourceViewer.js
+++ b/lib/manager/containers/ActiveFeedSourceViewer.js
@@ -1,43 +1,44 @@
import { connect } from 'react-redux'
-import { browserHistory } from 'react-router'
import FeedSourceViewer from '../components/FeedSourceViewer'
-
import { createFeedInfo } from '../../editor/actions/feedInfo'
-
import {
- deleteFeedVersion,
- downloadFeedViaToken,
fetchFeedSourceAndProject,
fetchFeedSource,
- fetchFeedVersions,
- fetchNotesForFeedSource,
- fetchNotesForFeedVersion,
- fetchValidationResult,
- postNoteForFeedSource,
- postNoteForFeedVersion,
- renameFeedVersion,
+ deleteFeedSource,
runFetchFeed,
updateExternalFeedResource,
- uploadFeed,
updateFeedSource
} from '../actions/feeds'
-
+import {
+ deleteFeedVersion,
+ downloadFeedViaToken,
+ fetchFeedVersions,
+ fetchValidationResult,
+ uploadFeed,
+ renameFeedVersion
+} from '../actions/versions'
+import {
+ fetchNotesForFeedSource,
+ fetchNotesForFeedVersion,
+ postNoteForFeedSource,
+ postNoteForFeedVersion
+} from '../actions/notes'
import { updateTargetForSubscription } from '../../manager/actions/user'
import { createDeploymentFromFeedSource } from '../../manager/actions/deployments'
import { loadFeedVersionForEditing } from '../../editor/actions/snapshots'
import { downloadGtfsPlusFeed } from '../../gtfsplus/actions/gtfsplus'
const mapStateToProps = (state, ownProps) => {
- let feedSourceId = ownProps.routeParams.feedSourceId
- let user = state.user
+ const feedSourceId = ownProps.routeParams.feedSourceId
+ const user = state.user
// find the containing project
- let project = state.projects.all
+ const project = state.projects.all
? state.projects.all.find(p => {
- if (!p.feedSources) return false
- return (p.feedSources.findIndex(fs => fs.id === feedSourceId) !== -1)
- })
+ if (!p.feedSources) return false
+ return (p.feedSources.findIndex(fs => fs.id === feedSourceId) !== -1)
+ })
: null
let feedSource
@@ -46,26 +47,11 @@ const mapStateToProps = (state, ownProps) => {
} else if (!project && !state.projects.isFetching) {
feedSource = null
}
- let isFetching = state.projects.isFetching
- /*let feedVersionIndex
- let routeVersionIndex = +ownProps.routeParams.feedVersionIndex
- let hasVersionIndex = typeof ownProps.routeParams.feedVersionIndex !== 'undefined'
- if (feedSource && typeof feedSource.feedVersions !== 'undefined') {
- if ((hasVersionIndex && isNaN(routeVersionIndex)) || routeVersionIndex > feedSource.feedVersions.length || routeVersionIndex < 0) {
- console.log(`version index ${routeVersionIndex} is invalid`)
- // cannot use browserHistory.push in middle of state transition
- // browserHistory.push(`/feed/${feedSourceId}`)
- window.location.href = `/feed/${feedSourceId}`
- } else {
- feedVersionIndex = hasVersionIndex
- ? routeVersionIndex
- : feedSource.feedVersions.length
- }
- }*/
+ const isFetching = state.projects.isFetching
+
return {
feedSource,
feedSourceId,
- //feedVersionIndex,
activeComponent: ownProps.routeParams.subpage,
activeSubComponent: ownProps.routeParams.subsubpage,
project,
@@ -79,14 +65,11 @@ const mapDispatchToProps = (dispatch, ownProps) => {
return {
createDeployment: (feedSource) => {
dispatch(createDeploymentFromFeedSource(feedSource))
- .then((deployment) => {
- browserHistory.push(`/deployment/${deployment.id}`)
- })
},
loadFeedVersionForEditing: (feedVersion) => {
dispatch(loadFeedVersionForEditing(feedVersion))
},
- deleteFeedVersionConfirmed: (feedSource, feedVersion) => {
+ deleteFeedVersion: (feedSource, feedVersion) => {
dispatch(deleteFeedVersion(feedSource, feedVersion))
},
downloadFeedClicked: (feedVersion) => { dispatch(downloadFeedViaToken(feedVersion)) },
@@ -96,8 +79,8 @@ const mapDispatchToProps = (dispatch, ownProps) => {
feedSourcePropertyChanged: (feedSource, propName, newValue) => {
return dispatch(updateFeedSource(feedSource, { [propName]: newValue }))
},
- feedVersionRenamed: (feedSource, feedVersion, name) => {
- dispatch(renameFeedVersion(feedSource, feedVersion, name))
+ feedVersionRenamed: (feedVersion, name) => {
+ dispatch(renameFeedVersion(feedVersion, name))
},
gtfsPlusDataRequested: (feedVersion) => {
dispatch(downloadGtfsPlusFeed(feedVersion.id))
@@ -151,6 +134,7 @@ const mapDispatchToProps = (dispatch, ownProps) => {
}
},
fetchFeed: (feedSource) => { dispatch(runFetchFeed(feedSource)) },
+ deleteFeedSource: (feedSource) => { return dispatch(deleteFeedSource(feedSource)) },
updateUserSubscription: (profile, target, subscriptionType) => { dispatch(updateTargetForSubscription(profile, target, subscriptionType)) },
uploadFeed: (feedSource, file) => { dispatch(uploadFeed(feedSource, file)) },
fetchValidationResult: (feedSource, feedVersion) => {
diff --git a/src/main/client/manager/containers/ActiveFeedVersionNavigator.js b/lib/manager/containers/ActiveFeedVersionNavigator.js
similarity index 63%
rename from src/main/client/manager/containers/ActiveFeedVersionNavigator.js
rename to lib/manager/containers/ActiveFeedVersionNavigator.js
index b2e973500..97961e055 100644
--- a/src/main/client/manager/containers/ActiveFeedVersionNavigator.js
+++ b/lib/manager/containers/ActiveFeedVersionNavigator.js
@@ -1,30 +1,32 @@
import { connect } from 'react-redux'
+import { browserHistory } from 'react-router'
import FeedVersionNavigator from '../components/FeedVersionNavigator'
-
import {
deleteFeedVersion,
downloadFeedViaToken,
- fetchNotesForFeedVersion,
fetchValidationResult,
- postNoteForFeedVersion,
- renameFeedVersion
-} from '../actions/feeds'
-
+ renameFeedVersion,
+ setActiveVersion,
+ publishFeedVersion
+} from '../actions/versions'
+import { postNoteForFeedVersion, fetchNotesForFeedVersion } from '../actions/notes'
+import { createDeploymentFromFeedSource } from '../../manager/actions/deployments'
import { loadFeedVersionForEditing } from '../../editor/actions/snapshots'
import { downloadGtfsPlusFeed } from '../../gtfsplus/actions/gtfsplus'
const mapStateToProps = (state, ownProps) => {
let feedVersionIndex
- let routeVersionIndex = parseInt(ownProps.routeParams.feedVersionIndex, 10)
- let hasVersionIndex = typeof ownProps.routeParams.feedVersionIndex !== 'undefined'
+ const routeVersionIndex = parseInt(ownProps.routeParams.feedVersionIndex, 10)
+ const hasVersionIndex = typeof ownProps.routeParams.feedVersionIndex !== 'undefined'
if (ownProps.feedSource && typeof ownProps.feedSource.feedVersions !== 'undefined') {
if ((hasVersionIndex && isNaN(routeVersionIndex)) ||
routeVersionIndex > ownProps.feedSource.feedVersions.length ||
routeVersionIndex < 0) {
console.log(`version index ${routeVersionIndex} is invalid`)
- // cannot use browserHistory.push in middle of state transition
+
+ // CANNOT use browserHistory.push in middle of state transition
// browserHistory.push(`/feed/${feedSourceId}`)
window.location.href = `/feed/${ownProps.feedSource.id}`
} else {
@@ -41,7 +43,21 @@ const mapStateToProps = (state, ownProps) => {
}
const mapDispatchToProps = (dispatch, ownProps) => {
+ const publicPrefix = ownProps.isPublic ? '/public' : ''
return {
+ setVersionIndex: (fs, index, push = true) => {
+ dispatch(setActiveVersion(fs.feedVersions[index - 1]))
+
+ if (push) {
+ browserHistory.push(`${publicPrefix}/feed/${fs.id}/version/${index}`)
+ }
+ },
+ createDeploymentFromFeedSource: (feedSource) => {
+ dispatch(createDeploymentFromFeedSource(feedSource))
+ .then((deployment) => {
+ browserHistory.push(`/deployment/${deployment.id}`)
+ })
+ },
loadFeedVersionForEditing: (feedVersion) => {
dispatch(loadFeedVersionForEditing(feedVersion))
},
@@ -65,6 +81,12 @@ const mapDispatchToProps = (dispatch, ownProps) => {
},
fetchValidationResult: (feedVersion, isPublic) => {
dispatch(fetchValidationResult(feedVersion, isPublic))
+ },
+ publishFeedVersion: (feedVersion) => {
+ dispatch(publishFeedVersion(feedVersion))
+ // .then(() => {
+ // dispatch(fetchFeedSource(feedVersion.feedSource.id, true, true))
+ // })
}
}
}
diff --git a/src/main/client/manager/containers/ActiveProjectViewer.js b/lib/manager/containers/ActiveProjectViewer.js
similarity index 90%
rename from src/main/client/manager/containers/ActiveProjectViewer.js
rename to lib/manager/containers/ActiveProjectViewer.js
index 26099b91f..7ca768c66 100644
--- a/src/main/client/manager/containers/ActiveProjectViewer.js
+++ b/lib/manager/containers/ActiveProjectViewer.js
@@ -1,4 +1,3 @@
-import React from 'react'
import { connect } from 'react-redux'
import { browserHistory } from 'react-router'
import ProjectViewer from '../components/ProjectViewer'
@@ -10,7 +9,8 @@ import {
thirdPartySync,
fetchFeedsForProject,
updateProject,
- downloadFeedForProject
+ downloadFeedForProject,
+ deployPublic
} from '../actions/projects'
import {
fetchProjectFeeds,
@@ -18,8 +18,7 @@ import {
saveFeedSource,
updateFeedSource,
runFetchFeed,
- deleteFeedSource,
- uploadFeed
+ deleteFeedSource
} from '../actions/feeds'
import {
@@ -30,7 +29,9 @@ import {
deleteDeployment,
updateDeployment
} from '../actions/deployments'
-
+import {
+ uploadFeed
+} from '../actions/versions'
const mapStateToProps = (state, ownProps) => {
return {
project: state.projects.all
@@ -57,8 +58,9 @@ const mapDispatchToProps = (dispatch, ownProps) => {
.then(project => {
dispatch(fetchProjectFeeds(projectId))
})
+ } else if (!initialProps.project.feedSources || initialProps.project.feedSources.length !== initialProps.project.numberOfFeeds) {
+ dispatch(fetchProjectFeeds(projectId))
}
- else if (!initialProps.project.feedSources || initialProps.project.feedSources.length !== initialProps.project.numberOfFeeds) dispatch(fetchProjectFeeds(projectId))
},
onNewFeedSourceClick: () => { dispatch(createFeedSource(projectId)) },
updateProjectSettings: (project, newSettings) => {
@@ -71,11 +73,9 @@ const mapDispatchToProps = (dispatch, ownProps) => {
dispatch(updateFeedSource(feedSource, { [propName]: newValue }))
},
deploymentsRequested: () => { dispatch(fetchProjectDeployments(projectId)) },
+ deployPublic: (project) => { return dispatch(deployPublic(project)) },
createDeploymentFromFeedSource: (feedSource) => {
dispatch(createDeploymentFromFeedSource(feedSource))
- .then((deployment) => {
- browserHistory.push(`/deployment/${deployment.id}`)
- })
},
onNewDeploymentClick: () => { dispatch(createDeployment(projectId)) },
newDeploymentNamed: (name) => { dispatch(saveDeployment({ projectId, name })) },
diff --git a/src/main/client/manager/containers/ActiveProjectsList.js b/lib/manager/containers/ActiveProjectsList.js
similarity index 73%
rename from src/main/client/manager/containers/ActiveProjectsList.js
rename to lib/manager/containers/ActiveProjectsList.js
index 45b6d6aed..76ce4868a 100644
--- a/src/main/client/manager/containers/ActiveProjectsList.js
+++ b/lib/manager/containers/ActiveProjectsList.js
@@ -1,13 +1,12 @@
-import React from 'react'
import { connect } from 'react-redux'
import { fetchProjects, updateProject, createProject, saveProject } from '../actions/projects'
import { setVisibilitySearchText } from '../actions/visibilityFilter'
-import ProjectsList from '../components/ProjectsList'
+import ProjectsList from '../components/ProjectsList'
const mapStateToProps = (state, ownProps) => {
return {
- projects: state.projects.all ? state.projects.all.filter(p => p.isCreating || state.user.permissions.isApplicationAdmin() || state.user.permissions.hasProject(p.id)) : [],
+ projects: state.projects.all ? state.projects.all.filter(p => p.isCreating || state.user.permissions.isApplicationAdmin() || state.user.permissions.hasProject(p.id, p.organizationId)) : [],
visibilitySearchText: state.projects.filter.searchText,
user: state.user
}
@@ -19,14 +18,14 @@ const mapDispatchToProps = (dispatch, ownProps) => {
dispatch(setVisibilitySearchText(null))
dispatch(fetchProjects())
},
- onNewProjectClick: () => { dispatch(createProject()) },
- newProjectNamed: (name) => {
- dispatch(saveProject({ name }))
+ onNewProjectClick: (project) => { dispatch(createProject(project)) },
+ saveProject: (project) => {
+ dispatch(saveProject(project))
},
projectNameChanged: (project, newName) => {
- dispatch(updateProject(project, { name : newName }))
+ dispatch(updateProject(project, { name: newName }))
},
- searchTextChanged: (text) => { dispatch(setVisibilitySearchText(text))}
+ searchTextChanged: (text) => { dispatch(setVisibilitySearchText(text)) }
}
}
diff --git a/src/main/client/manager/containers/ActiveUserHomePage.js b/lib/manager/containers/ActiveUserHomePage.js
similarity index 54%
rename from src/main/client/manager/containers/ActiveUserHomePage.js
rename to lib/manager/containers/ActiveUserHomePage.js
index 9f2f51db5..21fe5bb76 100644
--- a/src/main/client/manager/containers/ActiveUserHomePage.js
+++ b/lib/manager/containers/ActiveUserHomePage.js
@@ -1,4 +1,5 @@
import { connect } from 'react-redux'
+import { browserHistory } from 'react-router'
import UserHomePage from '../components/UserHomePage'
import { getRecentActivity, logout } from '../actions/user'
@@ -9,23 +10,35 @@ import { setVisibilitySearchText, setVisibilityFilter } from '../actions/visibil
const mapStateToProps = (state, ownProps) => {
return {
user: state.user,
- projects: state.projects.all ? state.projects.all.filter(p => p.isCreating || state.user.permissions.isApplicationAdmin() || state.user.permissions.hasProject(p.id)) : [],
+ projects: state.projects.all ? state.projects.all.filter(p => p.isCreating || state.user.permissions && state.user.permissions.isApplicationAdmin() || state.user.permissions && state.user.permissions.hasProject(p.id, p.organizationId)) : [],
project: ownProps.routeParams.projectId && state.projects.all ? state.projects.all.find(p => p.id === ownProps.routeParams.projectId) : null,
visibilityFilter: state.projects.filter
}
}
const mapDispatchToProps = (dispatch, ownProps) => {
+ let activeProjectId = ownProps.routeParams.projectId
return {
- onComponentMount: (props) => {
- dispatch(getRecentActivity(props.user))
+ onComponentMount: (initialProps) => {
+ dispatch(getRecentActivity(initialProps.user))
+ // dispatch(fetchOrganizationForUser(initialProps.user))
dispatch(fetchProjects())
.then(projects => {
- for (var i = 0; i < projects.length; i++) {
- dispatch(fetchProjectFeeds(projects[i].id))
+ if (!activeProjectId) {
+ const userProjectIds = initialProps.user && projects.map(p => {
+ if (initialProps.user.permissions.hasProject(p.id, p.organizationId)) {
+ return p.id
+ }
+ })
+ activeProjectId = userProjectIds && userProjectIds[0]
+ }
+ if (activeProjectId) {
+ dispatch(fetchProjectFeeds(activeProjectId))
+ .then(() => browserHistory.push(`/home/${activeProjectId}`))
}
})
},
+ fetchProjectFeeds: (projectId) => { dispatch(fetchProjectFeeds(projectId)) },
logoutHandler: () => { dispatch(logout()) },
searchTextChanged: (text) => { dispatch(setVisibilitySearchText(text)) },
visibilityFilterChanged: (filter) => dispatch(setVisibilityFilter(filter))
diff --git a/src/main/client/manager/containers/validation/ActiveGtfsValidationExplorer.js b/lib/manager/containers/validation/ActiveGtfsValidationExplorer.js
similarity index 74%
rename from src/main/client/manager/containers/validation/ActiveGtfsValidationExplorer.js
rename to lib/manager/containers/validation/ActiveGtfsValidationExplorer.js
index 5417b12bc..3ae05b8eb 100644
--- a/src/main/client/manager/containers/validation/ActiveGtfsValidationExplorer.js
+++ b/lib/manager/containers/validation/ActiveGtfsValidationExplorer.js
@@ -1,28 +1,24 @@
-import React from 'react'
import { connect } from 'react-redux'
import GtfsValidationExplorer from '../../components/validation/GtfsValidationExplorer'
-
+import { fetchFeedSourceAndProject } from '../../actions/feeds'
import {
- fetchFeedSourceAndProject,
fetchFeedVersions,
fetchValidationResult,
fetchFeedVersionIsochrones
-} from '../../actions/feeds'
-
-import { updateTargetForSubscription } from '../../actions/user'
+} from '../../actions/versions'
const mapStateToProps = (state, ownProps) => {
- let feedSourceId = ownProps.routeParams.feedSourceId
- let feedVersionIndex = ownProps.routeParams.feedVersionIndex
- let user = state.user
+ const feedSourceId = ownProps.routeParams.feedSourceId
+ const feedVersionIndex = ownProps.routeParams.feedVersionIndex
+ const user = state.user
// find the containing project
- let project = state.projects.all
+ const project = state.projects.all
? state.projects.all.find(p => {
- if (!p.feedSources) return false
- return (p.feedSources.findIndex(fs => fs.id === feedSourceId) !== -1)
- })
+ if (!p.feedSources) return false
+ return (p.feedSources.findIndex(fs => fs.id === feedSourceId) !== -1)
+ })
: null
let feedSource, version
@@ -30,7 +26,7 @@ const mapStateToProps = (state, ownProps) => {
feedSource = project.feedSources.find(fs => fs.id === feedSourceId)
}
if (feedSource && feedSource.feedVersions) {
- version = feedSource.feedVersions[feedVersionIndex-1]
+ version = feedSource.feedVersions[feedVersionIndex - 1]
}
return {
version,
@@ -56,7 +52,7 @@ const mapDispatchToProps = (dispatch, ownProps) => {
return dispatch(fetchFeedVersions(feedSource, unsecured))
})
.then((feedVersions) => {
- let version = feedVersions[feedVersionIndex - 1]
+ const version = feedVersions[feedVersionIndex - 1]
dispatch(fetchValidationResult(version))
})
}
@@ -66,7 +62,7 @@ const mapDispatchToProps = (dispatch, ownProps) => {
},
fetchIsochrones: (feedVersion, fromLat, fromLon, toLat, toLon) => {
dispatch(fetchFeedVersionIsochrones(feedVersion, fromLat, fromLon, toLat, toLon))
- },
+ }
}
}
diff --git a/lib/manager/reducers/index.js b/lib/manager/reducers/index.js
new file mode 100644
index 000000000..00822a3bd
--- /dev/null
+++ b/lib/manager/reducers/index.js
@@ -0,0 +1,7 @@
+module.exports = {
+ user: require('./user'),
+ projects: require('./projects'),
+ status: require('./status'),
+ languages: require('./languages'),
+ ui: require('./ui')
+}
diff --git a/src/main/client/manager/reducers/languages.js b/lib/manager/reducers/languages.js
similarity index 64%
rename from src/main/client/manager/reducers/languages.js
rename to lib/manager/reducers/languages.js
index 7cc06d66c..a710085a0 100644
--- a/src/main/client/manager/reducers/languages.js
+++ b/lib/manager/reducers/languages.js
@@ -4,15 +4,15 @@ import { getConfigProperty } from '../../common/util/config'
const languages = (state = {
all: getConfigProperty('messages.all'),
// set active default to english
- active: getConfigProperty('messages.active'),
+ active: getConfigProperty('messages.active')
}, action) => {
let languageIndex
switch (action.type) {
case 'SET_ACTIVE_LANGUAGE':
languageIndex = state.all.findIndex(l => l.id === action.languageId)
- DT_CONFIG.messages.active = state.all[languageIndex]
- localStorage.setItem('lang', action.languageId)
- return update(state, { active: { $set: state.all[languageIndex] }})
+ window.DT_CONFIG.messages.active = state.all[languageIndex]
+ window.localStorage.setItem('lang', action.languageId)
+ return update(state, {active: { $set: state.all[languageIndex] }})
default:
return state
}
diff --git a/src/main/client/manager/reducers/projects.js b/lib/manager/reducers/projects.js
similarity index 61%
rename from src/main/client/manager/reducers/projects.js
rename to lib/manager/reducers/projects.js
index e616ce760..424c02f39 100644
--- a/src/main/client/manager/reducers/projects.js
+++ b/lib/manager/reducers/projects.js
@@ -10,7 +10,7 @@ const projects = (state = {
searchText: null
}
}, action) => {
- let projects, sources, projectIndex, sourceIndex, versionIndex, activeProject, activeIndex, feeds, activeProjectId, project, newState, deployment
+ let projects, projectIndex, sourceIndex, versionIndex, activeProject, activeIndex, feeds, activeProjectId, project, newState, deployment
switch (action.type) {
case 'SET_PROJECT_VISIBILITY_SEARCH_TEXT':
return update(state, {filter: {searchText: {$set: action.text}}})
@@ -19,20 +19,20 @@ const projects = (state = {
case 'CREATE_PROJECT':
projects = [{
isCreating: true,
- name: ''
+ name: '',
+ ...action.project
}, ...state.all]
- return update(state, { all: { $set: projects }})
+ return update(state, { all: { $set: projects } })
case 'CREATE_FEEDSOURCE':
projectIndex = state.all.findIndex(p => p.id === action.projectId)
project = state.all[projectIndex]
newState = null
- console.log("adding fs to project", state.all[projectIndex]);
-
+ console.log('adding fs to project', state.all[projectIndex])
// if project's feedSources array is undefined, add it
- if(!project.feedSources) {
- console.log('adding new fs array');
+ if (!project.feedSources) {
+ console.log('adding new fs array')
newState = update(state, {all: {[projectIndex]: {$merge: {feedSources: []}}}})
}
@@ -48,15 +48,10 @@ const projects = (state = {
projectIndex = state.all.findIndex(p => p.id === action.projectId)
project = state.all[projectIndex]
newState = null
- console.log("adding fs to project", state.all[projectIndex]);
-
-
// if project's deployment array is undefined, add it
- if(!project.deployments) {
- console.log('adding new fs array');
+ if (!project.deployments) {
newState = update(state, {all: {[projectIndex]: {$merge: {deployments: []}}}})
}
-
// add new empty feed source to feedSources array
deployment = {
isCreating: true,
@@ -68,7 +63,7 @@ const projects = (state = {
case 'REQUESTING_FEEDSOURCE':
case 'REQUESTING_FEEDSOURCES':
case 'REQUEST_PROJECTS':
- return update(state, { isFetching: { $set: true }})
+ return update(state, { isFetching: { $set: true } })
case 'RECEIVE_PROJECTS':
activeProjectId = state.active ? state.active.id : getConfigProperty('application.active_project')
activeIndex = action.projects.findIndex(p => p.id === activeProjectId)
@@ -81,7 +76,7 @@ const projects = (state = {
}
}
case 'SET_ACTIVE_PROJECT':
- return update(state, { active: { $set: action.project }})
+ return update(state, { active: { $set: action.project } })
case 'RECEIVE_PROJECT':
if (!action.project) {
return state
@@ -121,21 +116,19 @@ const projects = (state = {
...state.all[projectIndex].feedSources,
...action.feedSources
]
- }
- else {
+ } else {
feeds = action.feedSources
}
feeds = feeds.sort(defaultSorter)
if (state.active && action.projectId === state.active.id) {
- return update(state,
- {
+ return update(state, {
isFetching: {$set: false},
active: {$merge: {feedSources: feeds}},
all: {
[projectIndex]: {$merge: {feedSources: feeds}}
}
})
- } else { // if projectId does not match active project
+ } else if (feeds.length) { // if projectId does not match active project
return update(state,
{
isFetching: {$set: false},
@@ -144,14 +137,21 @@ const projects = (state = {
}
}
)
+ } else {
+ return update(state,
+ {
+ isFetching: {$set: false}
+ }
+ )
}
case 'RECEIVE_FEEDSOURCE':
if (!action.feedSource) {
- return update(state, { isFetching: { $set: false }})
+ return update(state, { isFetching: { $set: false } })
}
projectIndex = state.all.findIndex(p => p.id === action.feedSource.projectId)
- let existingSources = state.all[projectIndex].feedSources || [], updatedSources
+ const existingSources = state.all[projectIndex].feedSources || []
+ let updatedSources
sourceIndex = existingSources.findIndex(s => s.id === action.feedSource.id)
if (sourceIndex === -1) { // source does not currently; add it
updatedSources = [
@@ -165,35 +165,38 @@ const projects = (state = {
...existingSources.slice(sourceIndex + 1)
]
}
- return update(state,
- {
- all:
- {[projectIndex]:
- {$merge: {feedSources: updatedSources}}
- },
- isFetching: { $set: false }
- }
- )
+ return update(state, {
+ all: {
+ [projectIndex]: {
+ $merge: {
+ feedSources: updatedSources
+ }
+ }
+ },
+ isFetching: { $set: false }
+ })
case 'RECEIVE_FEEDVERSIONS':
projectIndex = state.all.findIndex(p => p.id === action.feedSource.projectId)
sourceIndex = state.all[projectIndex].feedSources.findIndex(s => s.id === action.feedSource.id)
- let versionSort = (a, b) => {
- if(a.version < b.version) return -1
- if(a.version > b.version) return 1
+ const versionSort = (a, b) => {
+ if (a.version < b.version) return -1
+ if (a.version > b.version) return 1
return 0
}
- return update(state,
- {all:
- {[projectIndex]:
- {feedSources:
- {[sourceIndex]:
- {$merge: {feedVersions: action.feedVersions.sort(versionSort)}}
+ return update(state, {
+ all: {
+ [projectIndex]: {
+ feedSources: {
+ [sourceIndex]: {
+ $merge: {
+ feedVersions: action.feedVersions.sort(versionSort)
+ }
}
}
}
}
- )
+ })
case 'RECEIVE_FEEDVERSION':
projectIndex = state.all.findIndex(p => p.id === action.feedVersion.feedSource.projectId)
@@ -202,7 +205,8 @@ const projects = (state = {
versionIndex = state.all[projectIndex].feedSources[sourceIndex].feedVersions
? state.all[projectIndex].feedSources[sourceIndex].feedVersions.findIndex(v => v.id === action.feedVersion.id)
: -1
- let existingVersions = state.all[projectIndex].feedSources[sourceIndex].feedVersions || [], updatedVersions
+ const existingVersions = state.all[projectIndex].feedSources[sourceIndex].feedVersions || []
+ let updatedVersions
if (versionIndex === -1) { // version does not currently; add it
updatedVersions = [
...existingVersions,
@@ -215,18 +219,36 @@ const projects = (state = {
...existingVersions.slice(versionIndex + 1)
]
}
- return update(state,
- {all:
- {[projectIndex]:
- {feedSources:
- {[sourceIndex]:
- {$merge: {feedVersions: updatedVersions}}
+ return update(state, {
+ all: {
+ [projectIndex]: {
+ feedSources: {
+ [sourceIndex]: {
+ $merge: {
+ feedVersions: updatedVersions
+ }
}
}
}
}
- )
-
+ })
+ case 'PUBLISHED_FEEDVERSION':
+ projectIndex = state.all.findIndex(p => p.id === action.feedVersion.feedSource.projectId)
+ sourceIndex = state.all[projectIndex].feedSources.findIndex(s => s.id === action.feedVersion.feedSource.id)
+ versionIndex = state.all[projectIndex].feedSources[sourceIndex].feedVersions.findIndex(v => v.id === action.feedVersion.id)
+ return update(state, {
+ all: {
+ [projectIndex]: {
+ feedSources: {
+ [sourceIndex]: {
+ publishedVersionId: {
+ $set: action.feedVersion.id
+ }
+ }
+ }
+ }
+ }
+ })
case 'RECEIVE_VALIDATION_RESULT':
projectIndex = state.all.findIndex(p => p.id === action.feedVersion.feedSource.projectId)
sourceIndex = state.all[projectIndex].feedSources.findIndex(s => s.id === action.feedVersion.feedSource.id)
@@ -238,134 +260,159 @@ const projects = (state = {
// }
// result[error.file].push(error)
// })
- return update(state,
- {all:
- {[projectIndex]:
- {feedSources:
- {[sourceIndex]:
- {feedVersions:
- {[versionIndex]:
- {$merge: {validationResult: action.validationResult}}
+ return update(state, {
+ all: {
+ [projectIndex]: {
+ feedSources: {
+ [sourceIndex]: {
+ feedVersions: {
+ [versionIndex]: {
+ $merge: {
+ validationResult: action.validationResult
+ }
}
}
}
}
}
}
- )
+ })
case 'RECEIVE_FEEDVERSION_ISOCHRONES':
projectIndex = state.all.findIndex(p => p.id === action.feedSource.projectId)
sourceIndex = state.all[projectIndex].feedSources.findIndex(s => s.id === action.feedSource.id)
versionIndex = state.all[projectIndex].feedSources[sourceIndex].feedVersions.findIndex(v => v.id === action.feedVersion.id)
- return update(state,
- {all:
- {[projectIndex]:
- {feedSources:
- {[sourceIndex]:
- {feedVersions:
- {[versionIndex]:
- {$merge: {isochrones: action.isochrones}}
+ const { fromLat, fromLon, date, fromTime, toTime } = action
+ action.isochrones.properties = { fromLat, fromLon, date, fromTime, toTime }
+ action.isochrones.features = action.isochrones.features.map(f => {
+ f.type = 'Feature'
+ return f
+ })
+ return update(state, {
+ all: {
+ [projectIndex]: {
+ feedSources: {
+ [sourceIndex]: {
+ feedVersions: {
+ [versionIndex]: {
+ $merge: {
+ isochrones: action.isochrones
+ }
}
}
}
}
}
}
- )
-
- case 'RECEIVE_DEPLOYMENTS':
- projectIndex = state.all.findIndex(p => p.id === action.projectId)
- if (state.active && action.projectId === state.active.id) {
- return update(state,
- {
- active: {$merge: {deployments: action.deployments}},
- all: {
- [projectIndex]: {$merge: {deployments: action.deployments}}
+ })
+ case 'RECEIVE_DEPLOYMENTS':
+ projectIndex = state.all.findIndex(p => p.id === action.projectId)
+ if (state.active && action.projectId === state.active.id) {
+ return update(state, {
+ active: {
+ $merge: {
+ deployments: action.deployments
}
- })
- } else { // if projectId does not match active project
- return update(state,
- {
- all: {
- [projectIndex]: {$merge: {deployments: action.deployments}}
+ },
+ all: {
+ [projectIndex]: {
+ $merge: {
+ deployments: action.deployments
}
}
- )
- }
-
- case 'RECEIVE_DEPLOYMENT':
- projectIndex = state.all.findIndex(p => p.id === action.deployment.project.id)
- let existingDeployments = state.all[projectIndex].deployments || [], updatedDeployments
- sourceIndex = existingDeployments.findIndex(s => s.id === action.deployment.id)
- if (sourceIndex === -1) { // source does not currently; add it
- updatedDeployments = [
- ...existingDeployments,
- action.deployment
- ]
- } else { // existing feedsource array includes this one, replace it
- updatedDeployments = [
- ...existingDeployments.slice(0, sourceIndex),
- action.deployment,
- ...existingDeployments.slice(sourceIndex + 1)
- ]
- }
- return update(state,
- {all:
- {[projectIndex]:
- {$merge: {deployments: updatedDeployments}}
+ }
+ })
+ } else { // if projectId does not match active project
+ return update(state, {
+ all: {
+ [projectIndex]: {
+ $merge: {
+ deployments: action.deployments
+ }
}
}
- )
-
+ })
+ }
+ case 'RECEIVE_DEPLOYMENT':
+ projectIndex = state.all.findIndex(p => p.id === action.deployment.project.id)
+ const existingDeployments = state.all[projectIndex].deployments || []
+ let updatedDeployments
+ sourceIndex = existingDeployments.findIndex(s => s.id === action.deployment.id)
+ if (sourceIndex === -1) { // source does not currently; add it
+ updatedDeployments = [
+ ...existingDeployments,
+ action.deployment
+ ]
+ } else { // existing feedsource array includes this one, replace it
+ updatedDeployments = [
+ ...existingDeployments.slice(0, sourceIndex),
+ action.deployment,
+ ...existingDeployments.slice(sourceIndex + 1)
+ ]
+ }
+ return update(state, {
+ all: {
+ [projectIndex]: {
+ $merge: {
+ deployments: updatedDeployments
+ }
+ }
+ }
+ })
case 'RECEIVE_NOTES_FOR_FEEDSOURCE':
projectIndex = state.all.findIndex(p => p.id === action.feedSource.projectId)
sourceIndex = state.all[projectIndex].feedSources.findIndex(s => s.id === action.feedSource.id)
- return update(state,
- {all:
- {[projectIndex]:
- {feedSources:
- {[sourceIndex]:
- {$merge: {notes: action.notes}}
+ return update(state, {
+ all: {
+ [projectIndex]: {
+ feedSources: {
+ [sourceIndex]: {
+ $merge: {
+ notes: action.notes
+ }
}
}
}
}
- )
+ })
case 'RECEIVE_NOTES_FOR_FEEDVERSION':
projectIndex = state.all.findIndex(p => p.id === action.feedVersion.feedSource.projectId)
sourceIndex = state.all[projectIndex].feedSources.findIndex(s => s.id === action.feedVersion.feedSource.id)
versionIndex = state.all[projectIndex].feedSources[sourceIndex].feedVersions.findIndex(v => v.id === action.feedVersion.id)
- return update(state,
- {all:
- {[projectIndex]:
- {feedSources:
- {[sourceIndex]:
- {feedVersions:
- {[versionIndex]:
- {$merge: {notes: action.notes}}
+ return update(state, {
+ all: {
+ [projectIndex]: {
+ feedSources: {
+ [sourceIndex]: {
+ feedVersions: {
+ [versionIndex]: {
+ $merge: {
+ notes: action.notes
+ }
}
}
}
}
}
}
- )
+ })
case 'RECEIVE_GTFSEDITOR_SNAPSHOTS':
projectIndex = state.all.findIndex(p => p.id === action.feedSource.projectId)
sourceIndex = state.all[projectIndex].feedSources.findIndex(s => s.id === action.feedSource.id)
- return update(state,
- {all:
- {[projectIndex]:
- {feedSources:
- {[sourceIndex]:
- {$merge: {editorSnapshots: action.snapshots}}
+ return update(state, {
+ all: {
+ [projectIndex]: {
+ feedSources: {
+ [sourceIndex]: {
+ $merge: {
+ editorSnapshots: action.snapshots
+ }
}
}
}
}
- )
+ })
default:
return state
diff --git a/src/main/client/manager/reducers/status.js b/lib/manager/reducers/status.js
similarity index 92%
rename from src/main/client/manager/reducers/status.js
rename to lib/manager/reducers/status.js
index 0c560fe12..54a9a132d 100644
--- a/src/main/client/manager/reducers/status.js
+++ b/lib/manager/reducers/status.js
@@ -91,6 +91,8 @@ const config = (state = {
return update(state, {message: {$set: 'Renaming feed version...'}})
case 'LOADING_FEEDVERSION_FOR_EDITING':
return update(state, {message: {$set: 'Loading version into editor...'}})
+ case 'REQUESTING_ORGANIZATIONS':
+ return update(state, {message: {$set: 'Loading organizations...'}})
// Status Modal
case 'SET_ERROR_MESSAGE':
@@ -120,22 +122,20 @@ const config = (state = {
case 'SET_JOBMONITOR_VISIBLE':
return update(state, { jobMonitor: { $merge: { visible: action.visible } } })
case 'REMOVE_RETIRED_JOB':
- let jobIndex = state.jobMonitor.retired.findIndex(job => job.jobId === action.job.jobId)
+ const jobIndex = state.jobMonitor.retired.findIndex(job => job.jobId === action.job.jobId)
if (jobIndex === -1) {
return state
}
return update(state, { jobMonitor: { retired: { $splice: [[jobIndex, 1]] } } })
case 'RECEIVE_JOBS':
- let visible = state.jobMonitor.visible
- let jobs = action.jobs || []
- let retired = state.jobMonitor.retired
- // make monitor visible if jobs are being received for the first time
- if (state.jobMonitor.jobs.length === 0 && jobs.length > 0) visible = true
+ // let visible = state.jobMonitor.visible
+ const jobs = action.jobs || []
+ const retired = state.jobMonitor.retired
for (var i = 0; i < state.jobMonitor.jobs.length; i++) {
- let jobIndex = jobs.findIndex(j => j.jobId === state.jobMonitor.jobs[i].jobId)
+ const jobIndex = jobs.findIndex(j => j.jobId === state.jobMonitor.jobs[i].jobId)
if (jobIndex === -1) retired.push(state.jobMonitor.jobs[i])
}
- return update(state, { jobMonitor: { $merge: { jobs, visible, retired } } })
+ return update(state, { jobMonitor: { $merge: { jobs, retired } } })
// case 'DEPLOYING_TO_TARGET':
// return update(state, { popover: { jobs: { $push: [{name: `Processing deployment`, percent_complete: 5, status: 'processing'}] } } })
@@ -147,6 +147,7 @@ const config = (state = {
case 'RECEIVE_FEEDSOURCES':
case 'RECEIVE_FEEDSOURCE':
case 'RECEIVE_FEEDVERSIONS':
+ case 'RECEIVE_FEEDVERSION':
case 'RECEIVE_FETCH_FEED_FOR_PROJECT':
case 'RECEIVE_PUBLIC_FEEDS':
case 'RECEIVE_VALIDATION_RESULT':
@@ -167,6 +168,7 @@ const config = (state = {
case 'DELETED_TRIPS_FOR_CALENDAR':
case 'RECEIVE_TRIPS_FOR_CALENDAR':
case 'RECEIVE_GTFSEDITOR_SNAPSHOTS':
+ case 'RECEIVE_ORGANIZATIONS':
return update(state, {message: {$set: null}})
default:
return state
diff --git a/src/main/client/manager/reducers/ui.js b/lib/manager/reducers/ui.js
similarity index 59%
rename from src/main/client/manager/reducers/ui.js
rename to lib/manager/reducers/ui.js
index 0a1c4caee..e9d33fd34 100644
--- a/src/main/client/manager/reducers/ui.js
+++ b/lib/manager/reducers/ui.js
@@ -2,14 +2,19 @@ import update from 'react-addons-update'
import { getUserMetadataProperty } from '../../common/util/user'
const ui = (state = {
- sidebarExpanded: true
+ sidebarExpanded: true,
+ hideTutorial: false
}, action) => {
switch (action.type) {
case 'USER_LOGGED_IN':
+ const hideTutorial = getUserMetadataProperty(action.profile, 'hideTutorial')
const sidebarExpanded = getUserMetadataProperty(action.profile, 'sidebarExpanded')
return update(state, {
- sidebarExpanded: { $set: sidebarExpanded }
+ sidebarExpanded: { $set: sidebarExpanded },
+ hideTutorial: { $set: hideTutorial }
})
+ case 'SETTING_TUTORIAL_VISIBILITY':
+ return update(state, { hideTutorial: { $set: action.value } })
case 'SETTING_SIDEBAR_EXPANDED':
return update(state, { sidebarExpanded: { $set: action.value } })
default:
diff --git a/src/main/client/manager/reducers/user.js b/lib/manager/reducers/user.js
similarity index 81%
rename from src/main/client/manager/reducers/user.js
rename to lib/manager/reducers/user.js
index ff5b56979..677101469 100644
--- a/src/main/client/manager/reducers/user.js
+++ b/lib/manager/reducers/user.js
@@ -16,31 +16,31 @@ const user = (state = {
}, action) => {
switch (action.type) {
case 'CHECKING_EXISTING_LOGIN':
- return update(state, { isCheckingLogin: { $set: true }})
+ return update(state, { isCheckingLogin: { $set: true } })
case 'NO_EXISTING_LOGIN':
- return update(state, { isCheckingLogin: { $set: false }})
+ return update(state, { isCheckingLogin: { $set: false } })
case 'USER_LOGGED_IN':
return update(state, {
isCheckingLogin: { $set: false },
token: { $set: action.token },
profile: { $set: action.profile },
- permissions: { $set: new UserPermissions(action.profile.app_metadata.datatools)},
- subscriptions: { $set: new UserSubscriptions(action.profile.app_metadata.datatools)},
+ permissions: { $set: new UserPermissions(action.profile.app_metadata.datatools) },
+ subscriptions: { $set: new UserSubscriptions(action.profile.app_metadata.datatools) }
})
case 'USER_LOGGED_OUT':
- console.log('USER_LOGGED_OUT');
+ console.log('USER_LOGGED_OUT')
return update(state, {
isCheckingLogin: { $set: false },
token: { $set: null },
profile: { $set: null },
- permissions: { $set: null},
- subscriptions: { $set: null}
+ permissions: { $set: null },
+ subscriptions: { $set: null }
})
case 'CREATED_PUBLIC_USER':
return update(state, {
profile: { $set: action.profile },
- permissions: { $set: new UserPermissions(action.profile.app_metadata.datatools)},
- subscriptions: { $set: new UserSubscriptions(action.profile.app_metadata.datatools)},
+ permissions: { $set: new UserPermissions(action.profile.app_metadata.datatools) },
+ subscriptions: { $set: new UserSubscriptions(action.profile.app_metadata.datatools) }
})
case 'RECEIVE_USER_RECENT_ACTIVITY':
return update(state, {
diff --git a/lib/manager/util/index.js b/lib/manager/util/index.js
new file mode 100644
index 000000000..b14326b4f
--- /dev/null
+++ b/lib/manager/util/index.js
@@ -0,0 +1,26 @@
+import shpwrite from 'shp-write'
+
+export function findProjectByFeedSource (state, feedSourceId) {
+ return state.projects.all
+ ? state.projects.all.find(p => {
+ if (!p.feedSources) {
+ return false
+ }
+ return (p.feedSources.findIndex(fs => fs.id === feedSourceId) !== -1)
+ })
+ : null
+}
+
+const DEFAULT_OPTIONS = {
+ folder: 'myshapes',
+ types: {
+ point: 'mypoints',
+ polygon: 'mypolygons',
+ line: 'mylines'
+ }
+}
+
+// Currently does not work for MultiPolygon isochrones
+export function downloadAsShapefile (geojson, options = DEFAULT_OPTIONS) {
+ shpwrite.download(geojson, options)
+}
diff --git a/src/main/client/public/components/FeedsMap.js b/lib/public/components/FeedsMap.js
similarity index 79%
rename from src/main/client/public/components/FeedsMap.js
rename to lib/public/components/FeedsMap.js
index 44529aaa1..7cb2f9491 100644
--- a/src/main/client/public/components/FeedsMap.js
+++ b/lib/public/components/FeedsMap.js
@@ -1,5 +1,5 @@
import React from 'react'
-import { Map, Marker, Popup, TileLayer, FeatureGroup } from 'react-leaflet'
+import { Map, Marker, Popup, TileLayer } from 'react-leaflet'
import { Button } from 'react-bootstrap'
import { getFeedsBounds } from '../../common/util/geo'
@@ -21,8 +21,8 @@ export default class FeedsMap extends React.Component {
height: '500px',
width: '100%'
}
- let feeds = []
- const feedsArray = this.props.projects.map(p => {
+ const feeds = []
+ this.props.projects.map(p => {
if (p.feedSources) {
return p.feedSources.map(f => {
feeds.push(f)
@@ -32,16 +32,14 @@ export default class FeedsMap extends React.Component {
})
const getFeedLocation = (bounds) => {
if (!bounds) return null
- let lngEast = bounds.east ? bounds.east : bounds.west // check for 0 values
- let lngWest = bounds.west ? bounds.west : bounds.east // check for 0 values
- let latNorth = bounds.north ? bounds.north : bounds.south // check for 0 values
- let latSouth = bounds.south ? bounds.south : bounds.north // check for 0 values
+ const lngEast = bounds.east ? bounds.east : bounds.west // check for 0 values
+ const lngWest = bounds.west ? bounds.west : bounds.east // check for 0 values
+ const latNorth = bounds.north ? bounds.north : bounds.south // check for 0 values
+ const latSouth = bounds.south ? bounds.south : bounds.north // check for 0 values
// return averaged location
return [(latNorth + latSouth) / 2, (lngWest + lngEast) / 2]
}
- console.log(feeds.filter(feed => feed.latestValidation))
- let position = [this.state.lat, this.state.lng];
if (feeds.length === 0) {
return (
+ const markers = []
feeds.map(feed => {
if (feed.latestValidation && feed.latestValidation.bounds) {
markers.push(
@@ -77,10 +71,7 @@ export default class FeedsMap extends React.Component {
)
}
})
- console.log(bounds)
bounds = bounds && bounds.north ? [[bounds.north, bounds.east], [bounds.south, bounds.west]] : this.state.bounds
- console.log(bounds)
- console.log(markers)
return (