greg/bart-tile
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Improve elevator widget

Browse Source
This commit is contained in:
ronreg-ribdev 2020-06-01 02:48:17 -07:00
parent 3ade81e666
commit 38fca5a783
1 changed files with 48 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
src/js/components/root.js
View File

@ -5,8 +5,10 @@ import { HeaderBar } from "./lib/header-bar.js"
class ElevatorWidget extends Component { class ElevatorWidget extends Component {
render() { render() {
return (<div> return (<div className="cf w-100 flex flex-column pa4 ba-m ba-l ba-xl b--gray2 br1 h-100 h-100-minus-40-s h-100-minus-40-m h-100-minus-40-l h-100-minus-40-xl f9 white-d overflow-x-hidden">
Elevator info <h1 className="mt0 f8 fw4">BART Info - Elevator status</h1>
<Link to="/~bartinfo">Route planner</Link>
No elevators are known to be out of service.
</div>); </div>);
} }
} }
@ -39,14 +41,13 @@ class TimeScheduleWidget extends Component {
} }
} }
class RoutePlanner extends Component {
export class Root extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = store.state; this.state = {
store.setStateHandler((newState) => { fromStation: null,
this.setState(newState); toStation: null,
}); };
} }
stationSearch() { stationSearch() {
@ -64,7 +65,7 @@ export class Root extends Component {
} }
renderStationOptions() { renderStationOptions() {
const stations = this.state.stations || []; const stations = this.props.stations;
return _.map(stations, (station) => { return _.map(stations, (station) => {
const abbr = station.abbr; const abbr = station.abbr;
const name = station.name; const name = station.name;
@ -88,12 +89,6 @@ export class Root extends Component {
} }
render() { render() {
return (
<BrowserRouter>
<div className="absolute h-100 w-100 bg-gray0-d ph4-m ph4-l ph4-xl pb4-m pb4-l pb4-xl">
<HeaderBar/>
<Route exact path="/~bartinfo/elevators" render={ () => <ElevatorWidget/> }/>
<Route exact path="/~bartinfo" render={ () => {
return ( return (
<div className="cf w-100 flex flex-column pa4 ba-m ba-l ba-xl b--gray2 br1 h-100 h-100-minus-40-s h-100-minus-40-m h-100-minus-40-l h-100-minus-40-xl f9 white-d overflow-x-hidden"> <div className="cf w-100 flex flex-column pa4 ba-m ba-l ba-xl b--gray2 br1 h-100 h-100-minus-40-s h-100-minus-40-m h-100-minus-40-l h-100-minus-40-xl f9 white-d overflow-x-hidden">
<h1 className="mt0 f8 fw4">BART Info</h1> <h1 className="mt0 f8 fw4">BART Info</h1>
@ -111,8 +106,30 @@ export class Root extends Component {
</div> </div>
</div> </div>
</div> </div>
)}} );
/> }
}
export class Root extends Component {
constructor(props) {
super(props);
this.state = store.state;
store.setStateHandler((newState) => {
this.setState(newState);
});
}
render() {
return (
<BrowserRouter>
<div className="absolute h-100 w-100 bg-gray0-d ph4-m ph4-l ph4-xl pb4-m pb4-l pb4-xl">
<HeaderBar/>
<Route exact path="/~bartinfo/elevators" render={ () => <ElevatorWidget/> }/>
<Route exact path="/~bartinfo" render={ () =>
<RoutePlanner
stations={this.state.stations || []}
/> } />
</div> </div>
</BrowserRouter> </BrowserRouter>
) )