26 |
27 | {time.formatTime(this.state.date)}
28 |
29 |
30 | {this.state.date.format('dddd, MMMM D, YYYY')}
31 |
32 |
46 |
51 |
52 | {temp}°F
53 |
54 |
55 | {weather.summary}
56 |
57 |
56 |
57 |
61 |
62 |
Memes
63 |
64 | {body}
65 |
{React.createElement(panel.component)}
;
40 | });
41 | return
42 |
43 |
47 | {panelDivs}
48 |
49 |
;
50 | }
51 | });
52 |
53 | ReactDOM.render(
54 | React.createElement(ACMDisplay),
55 | document.getElementById('main')
56 | );
57 |
--------------------------------------------------------------------------------
/src/panels/mtd.js:
--------------------------------------------------------------------------------
1 | var React = require('react');
2 | var $ = require('jquery');
3 | var classNames = require('classnames');
4 |
5 | var secrets = require('../secrets');
6 |
7 | var apiUrl = 'https://developer.cumtd.com/api/v2.2/json/GetDeparturesByStop';
8 |
9 | /**
10 | * MTD bus times panel.
11 | */
12 | var MTDPanel = React.createClass({
13 | getInitialState: function() {
14 | return {
15 | departures: []
16 | };
17 | },
18 |
19 | updateDepartures: function() {
20 | var params = $.param({stop_id: 'GWNMN', key: secrets.mtdApiKey});
21 | var url = apiUrl + '?' + params;
22 | $.get(url, function(data) {
23 | this.setState({departures: data.departures});
24 | }.bind(this));
25 | },
26 |
27 | componentDidMount: function() {
28 | // MTD limits requests to once per minute
29 | this.updateDepartures();
30 | setInterval(this.updateDepartures, 60000);
31 | },
32 |
33 | getMinsText: function(mins) {
34 | if (mins === 0) {
35 | return 'due';
36 | }
37 | return mins + ' min' + (mins !== 1 ? 's' : '');
38 | },
39 |
40 | render: function() {
41 | var departures = this.state.departures.slice(0, 5);
42 |
43 | var body;
44 | if (departures.length > 0) {
45 | body = departures.map(function(departure) {
46 | var headsign = departure.headsign.split(' ');
47 | var num = headsign[0];
48 | var name = headsign.slice(1).join(' ');
49 | var mins = departure.expected_mins;
50 | return
51 |
52 | {num} {name}
53 |
54 |
{this.getMinsText(mins)}
55 |
No upcoming departures
;
59 | }
60 |
61 | var bodyClass = classNames({
62 | 'panel-body': true,
63 | 'mtd-body-no-departures': departures.length == 0
64 | });
65 |
66 | return
67 |
68 |
MTD - Goodwin & Main
69 |
70 |
71 | {body}
72 |
73 |
82 |
Error fetching Now Playing from Concert: {error}
83 |
92 |
})
93 |
94 |
95 | {nowPlaying.current_track}
96 |
97 |
{elapsedStr} / {durationStr}
98 |
{playedby}
99 |
100 |
104 |
105 |
ACM Concert - Now Playing
106 |
107 | {body}
108 |
No upcoming events
;
86 | }
87 | return events.map(function(event) {
88 | var loc = event.location ? {event.location}
: null;
89 | return
90 |
{event.name}
91 |
{this.formatEventTime(event)}
92 | {loc}
93 |
107 |
Error fetching events.
108 |
112 | {this.getEvents()}
113 |
;
114 | }
115 |
116 | return
117 |
118 |
Events
119 |
120 | {body}
121 |
69 |
Error fetching meeting times.
70 |
82 | | {meeting.name} |
83 | {location} |
84 | {fulltime} |
85 |
;
86 | });
87 |
88 | var dots = [];
89 | for (var i = 0; i < this.state.groups.length; i += ROWS_PER_PAGE) {
90 | var dotClass = classNames({
91 | dot: true,
92 | active: i == index
93 | });
94 | dots.push();
95 | }
96 |
97 | body =
98 |
99 |
100 |
101 | | Name |
102 | Location |
103 | Time |
104 |
105 |
106 |
107 | {items}
108 |
109 |
110 |
111 | {dots}
112 |
113 |
116 |
117 |
Meeting Times
118 |
119 | {body}
120 |
12 |