Commit 9c639a4f authored by Sharp Hall's avatar Sharp Hall

Show notices where there is no data shown.

Closes #2
parent add43955
......@@ -48,6 +48,13 @@ $(function () {
document.getElementById('app'));
});
function Notice(props) {
return (
<div class="notice">{props.text}</div>
);
}
class WhereSepta extends React.Component {
constructor(props) {
super(props);
......@@ -221,22 +228,33 @@ class Vehicle extends React.Component {
class VehicleList extends React.Component {
render() {
var noVehicles = "You're near the SETPA routes listed above, " +
"but no vehicles for these routes were found " +
"within range.";
var routeMarkers = _.map(this.props.routeList, routeName => ({
routeName,
className: "route-marker route-" + routeName
}));
return (
<div>
<div id="route-list">
{routeMarkers.map(routeMarker => (
<span className={routeMarker.className} key={routeMarker.routeName}>{routeMarker.routeName}</span>
))}
</div>
<div>
{this.props.vehicleList.map(vehicle => (
<Vehicle vehicleData={vehicle} key={vehicle.VehicleID} />
))}
</div>
{routeMarkers.length > 0 ?
<div id="route-list">
{routeMarkers.map(routeMarker => (
<span className={routeMarker.className} key={routeMarker.routeName}>{routeMarker.routeName}</span>
))}
</div>
:
<Notice text="You are not near any SEPTA stops." />
}
{this.props.vehicleList.length > 0 ?
<div>
{this.props.vehicleList.map(vehicle => (
<Vehicle vehicleData={vehicle} key={vehicle.VehicleID} />
))}
</div>
:
<Notice text={noVehicles} />
}
</div>
);
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment