Wired up station dropdowns
This commit is contained in:
parent
e915e3b338
commit
7e379ba576
@ -7,16 +7,40 @@ import { HeaderBar } from "./lib/header-bar.js"
|
||||
export class Root extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.state = { fromValue: "ashby", toValue: "24th" };
|
||||
this.state = store.state;
|
||||
store.setStateHandler((newState) => {
|
||||
this.setState(newState);
|
||||
});
|
||||
}
|
||||
|
||||
action() {
|
||||
console.log("Clickin'");
|
||||
}
|
||||
|
||||
render() {
|
||||
renderStationOptions() {
|
||||
const stations = this.state.stations || [];
|
||||
return _.map(stations, (station) => {
|
||||
const abbr = station.abbr;
|
||||
const name = station.name;
|
||||
return <option key={abbr} value={abbr}>{name}</option>;
|
||||
});
|
||||
}
|
||||
|
||||
renderStationForm() {
|
||||
return (<form name="bartSearch">
|
||||
From:
|
||||
<select value={this.state.fromValue || ""}>
|
||||
{ this.renderStationOptions() }
|
||||
</select>
|
||||
<br/>
|
||||
To:
|
||||
<select value={this.state.toValue || ""}>
|
||||
{ this.renderStationOptions() }
|
||||
</select>
|
||||
</form>);
|
||||
}
|
||||
|
||||
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">
|
||||
@ -35,19 +59,9 @@ export class Root extends Component {
|
||||
</div>
|
||||
<div className="searchsidebar" style={{gridColumn: "2", gridRow: "2"}}>
|
||||
Search scheduled trains:
|
||||
{ this.renderStationForm() }
|
||||
<form name="bartSearch">
|
||||
From:
|
||||
<select value={this.state.fromValue}>
|
||||
<option value="ashby">Ashby</option>
|
||||
<option value="fremont">Fremont</option>
|
||||
</select>
|
||||
<br/>
|
||||
To:
|
||||
<select value={this.state.toValue}>
|
||||
<option value="ashby">Ashby</option>
|
||||
<option value="fremont">Fremont</option>
|
||||
<option value="24th">24th st</option>
|
||||
</select>
|
||||
</form>
|
||||
<button onClick={this.action.bind(this)}>Search</button>
|
||||
</div>
|
||||
|
@ -1,11 +0,0 @@
|
||||
import _ from 'lodash';
|
||||
|
||||
|
||||
export class ConfigReducer {
|
||||
reduce(json, state) {
|
||||
let data = _.get(json, 'bartinfo', false);
|
||||
if (data) {
|
||||
state.inbox = data.inbox;
|
||||
}
|
||||
}
|
||||
}
|
@ -1,11 +0,0 @@
|
||||
import _ from 'lodash';
|
||||
|
||||
|
||||
export class InitialReducer {
|
||||
reduce(json, state) {
|
||||
let data = _.get(json, 'initial', false);
|
||||
if (data) {
|
||||
state.inbox = data.inbox;
|
||||
}
|
||||
}
|
||||
}
|
@ -5,13 +5,10 @@ export class UpdateReducer {
|
||||
reduce(json, state) {
|
||||
let data = _.get(json, 'update', false);
|
||||
if (data) {
|
||||
this.reduceInbox(_.get(data, 'inbox', false), state);
|
||||
}
|
||||
}
|
||||
|
||||
reduceInbox(inbox, state) {
|
||||
if (inbox) {
|
||||
state.inbox = inbox;
|
||||
const stations = _.get(data, 'stations', false);
|
||||
if (stations) {
|
||||
state.stations = stations;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1,33 +1,25 @@
|
||||
import { InitialReducer } from '/reducers/initial';
|
||||
import { ConfigReducer } from '/reducers/config';
|
||||
import { UpdateReducer } from '/reducers/update';
|
||||
|
||||
|
||||
class Store {
|
||||
constructor() {
|
||||
this.state = {
|
||||
inbox: {}
|
||||
};
|
||||
this.state = {}
|
||||
|
||||
this.initialReducer = new InitialReducer();
|
||||
this.configReducer = new ConfigReducer();
|
||||
this.updateReducer = new UpdateReducer();
|
||||
this.setState = () => { };
|
||||
}
|
||||
|
||||
setStateHandler(setState) {
|
||||
console.log("Calling setStateHandler");
|
||||
this.setState = setState;
|
||||
}
|
||||
|
||||
handleEvent(data) {
|
||||
console.log("Handling event");
|
||||
console.log(data);
|
||||
let json = data.data;
|
||||
|
||||
console.log("Storing event");
|
||||
console.log(json);
|
||||
this.initialReducer.reduce(json, this.state);
|
||||
this.configReducer.reduce(json, this.state);
|
||||
this.updateReducer.reduce(json, this.state);
|
||||
|
||||
this.setState(this.state);
|
||||
}
|
||||
}
|
||||
|
@ -14,9 +14,16 @@ export class Subscription {
|
||||
}
|
||||
|
||||
initializebartinfo() {
|
||||
/*
|
||||
api.bind('/primary', 'PUT', api.authTokens.ship, 'bartinfo',
|
||||
this.handleEvent.bind(this),
|
||||
this.handleError.bind(this));
|
||||
*/
|
||||
|
||||
api.bind('/bartstations', 'PUT', api.authTokens.ship, 'bartinfo',
|
||||
this.handleEvent.bind(this),
|
||||
this.handleError.bind(this));
|
||||
|
||||
}
|
||||
|
||||
handleEvent(diff) {
|
||||
|
@ -73,7 +73,7 @@
|
||||
|= =path
|
||||
^- (quip card _this)
|
||||
~& "on-watch path: {<path>}"
|
||||
?: ?=([%primary *] path)
|
||||
?: ?=([%bartstations *] path)
|
||||
=/ bart-station-request
|
||||
=/ out *outbound-config:iris
|
||||
=/ req bart-api-request-stations:cc
|
||||
@ -96,7 +96,9 @@
|
||||
?+ wire ~
|
||||
[%bartstationrequest *]
|
||||
=/ value=json (parse-request-stations-response:cc client-response.sign-arvo)
|
||||
[%give %fact ~[/primary] %json !>(value)]~
|
||||
?> ?=(%o -.value)
|
||||
=/ update=json (pairs:enjs:format [update+o+p.value ~])
|
||||
[%give %fact ~[/bartstations] %json !>(update)]~
|
||||
==
|
||||
[http-moves this]
|
||||
?. ?=(%bound +<.sign-arvo)
|
||||
|
Loading…
Reference in New Issue
Block a user