diff --git a/sass/panels/meeting-times.scss b/sass/panels/meeting-times.scss
index 9010140..1ee314d 100644
--- a/sass/panels/meeting-times.scss
+++ b/sass/panels/meeting-times.scss
@@ -16,6 +16,14 @@ td, th {
width: calc(100% / 3);
}
+td.small {
+ font-size: .8em;
+}
+
+td.xsmall {
+ font-size: .75em;
+}
+
.dot-container {
text-align: center;
diff --git a/src/panels/meeting-times.js b/src/panels/meeting-times.js
index f6a51ed..2e866a8 100644
--- a/src/panels/meeting-times.js
+++ b/src/panels/meeting-times.js
@@ -20,6 +20,7 @@ var MeetingTimesPanel = React.createClass({
return {
index: 0,
groups: [],
+ displayingMeetings: true,
error: null
};
},
@@ -49,9 +50,13 @@ var MeetingTimesPanel = React.createClass({
},
nextPage: function() {
- var newIndex = this.state.index + ROWS_PER_PAGE;
- newIndex = newIndex >= this.state.groups.length ? 0 : newIndex;
- this.setState({index: newIndex});
+ var newIndex = this.state.index;
+ var displayingMeetings = !this.state.displayingMeetings;
+ if (displayingMeetings) {
+ newIndex = newIndex + ROWS_PER_PAGE;
+ newIndex = newIndex >= this.state.groups.length ? 0 : newIndex;
+ }
+ this.setState({index: newIndex, displayingMeetings: displayingMeetings});
},
componentDidMount: function() {
@@ -62,6 +67,7 @@ var MeetingTimesPanel = React.createClass({
render: function() {
var index = this.state.index;
+ var displayingMeetings = this.state.displayingMeetings;
var error = this.state.error;
var body = null;
if(error){
@@ -72,45 +78,106 @@ var MeetingTimesPanel = React.createClass({
else {
var pageTimes = this.state.groups.slice(index, index + ROWS_PER_PAGE);
var items = pageTimes.map(function(meeting) {
- var location = meeting.meetingLoc ? meeting.meetingLoc : 'TBA';
- var meeting_time = moment(meeting.meetingTime, 'h:mm A', true);
- meeting_time = meeting_time.isValid() ? time.formatTime(meeting_time, true) : undefined;
- var meeting_date = time.formatMeetingDate(meeting.meetingDay) || meeting.meetingDay;
- var fulltime = (meeting_date && meeting_time) ?
- (meeting_date + ', ' + meeting_time) : 'TBA';
- return
- {meeting.name} |
- {location} |
- {fulltime} |
-
;
+ if (displayingMeetings) {
+ var location = meeting.meetingLoc ? meeting.meetingLoc : 'TBA';
+ var meeting_time = moment(meeting.meetingTime, 'h:mm A', true);
+ meeting_time = meeting_time.isValid() ? time.formatTime(meeting_time, true) : undefined;
+ var meeting_date = time.formatMeetingDate(meeting.meetingDay) || meeting.meetingDay;
+
+ var fulltime = (meeting_date && meeting_time) ?
+ (meeting_date + ', ' + meeting_time) : 'TBA';
+ return
+ {meeting.name} |
+ {location} |
+ {fulltime} |
+
;
+ }
+ else {
+ var chairs = meeting.chairs.replace(' and ', ',').split(',');
+ var chair_name = 'N/A';
+ if (chairs.length > 0) {
+ var name_split = $.trim(chairs[0]);
+ chair_name = name_split;
+ }
+
+ var chair_contacts = meeting.chairContact.split(',');
+ var display_contact = 'N/A';
+ if (chairs.length > 0) {
+ display_contact = chair_contacts[0];
+ }
+
+ var name_class = '';
+ if (chair_name.length > 17) {
+ name_class = 'xsmall';
+ }
+ else if (chair_name.length > 14) {
+ name_class = 'small';
+ }
+
+ var fulltime = (meeting_date && meeting_time) ?
+ (meeting_date + ', ' + meeting_time) : 'TBA';
+ return
+ {meeting.name} |
+ {chair_name} |
+ {display_contact} |
+
;
+ }
+
});
var dots = [];
for (var i = 0; i < this.state.groups.length; i += ROWS_PER_PAGE) {
var dotClass = classNames({
dot: true,
- active: i == index
+ active: displayingMeetings && i == index
});
dots.push();
+
+ var dotClass2 = classNames({
+ dot: true,
+ active: !displayingMeetings && i == index
+ });
+ dots.push();
}
- body =
-
-
-
- Name |
- Location |
- Time |
-
-
-
- {items}
-
-
-
- {dots}
-
-
;
+ if (displayingMeetings) {
+ body =
+
+
+
+ Name |
+ Location |
+ Time |
+
+
+
+ {items}
+
+
+
+ {dots}
+
+
;
+ }
+ else {
+ body =
+
+
+
+ Name |
+ Chair |
+ Contact |
+
+
+
+ {items}
+
+
+
+ {dots}
+
+
;
+ }
}
return