Add more reports

js/actions/ReportActions.js

@@ -0,0 +1,50 @@
+var ReportConstants = require('../constants/ReportConstants');
+
+var ErrorActions = require('./ErrorActions');
+
+var Report = models.Report;
+var Error = models.Error;
+
+function fetchReport(reportId) {
+	return {
+		type: ReportConstants.FETCH_REPORT,
+		reportId: reportId
+	}
+}
+
+function reportFetched(report) {
+	return {
+		type: ReportConstants.REPORT_FETCHED,
+		report: report
+	}
+}
+
+function fetch(reportId) {
+	return function (dispatch) {
+		dispatch(fetchReport(reportId));
+
+		$.ajax({
+			type: "GET",
+			dataType: "json",
+			url: "report/?id="+reportId,
+			success: function(data, status, jqXHR) {
+				var e = new Error();
+				e.fromJSON(data);
+				if (e.isError()) {
+					dispatch(ErrorActions.serverError(e));
+				} else {
+					var r = new Report();
+					r.fromJSON(data);
+					dispatch(reportFetched(r));
+				}
+			},
+			error: function(jqXHR, status, error) {
+				dispatch(ErrorActions.ajaxError(e));
+			}
+		});
+	};
+}
+
+module.exports = {
+	fetch: fetch
+};

js/components/AttendeeFrequencyChart.js

@@ -1,23 +0,0 @@
-var React = require('react');
-
-var BarChart = require('../components/BarChart');
-
-module.exports = React.createClass({
-	displayName: "AttendeeFrequencyChart",
-	render: function() {
-		var data = [];
-		for (var i = 0; i < this.props.popularAttendees.length; i++) {
-			var attendee = this.props.popularAttendees[i];
-			data.push({
-				'label': attendee.Name,
-				'value': attendee.Popularity
-			});
-		}
-
-		data.sort(function(a, b){return b.value - a.value;});
-
-		return (
-			<BarChart title="Attendee Frequency" data={data}/>
-		);
-	}
-});

js/components/BarChart.js

@@ -7,17 +7,17 @@ module.exports = React.createClass({
 	render: function() {
 		/* Expects 'this.props.data' to be in the form:
 		 * var data = [
-		 * 	{'label': 'foo', 'value': 1.4},
-		 * 	{'label': 'bar', 'value': 8}
+		 * 	{'Label': 'foo', 'Value': 1.4},
+		 * 	{'Label': 'bar', 'Value': 8}
 		 * ];
 		 */
 		if (this.props.data.length < 1)
 			return (<div />);
 
-		var max = parseFloat(this.props.data[0].value);
-		var min = parseFloat(this.props.data[0].value);
+		var max = parseFloat(this.props.data[0].Value);
+		var min = parseFloat(this.props.data[0].Value);
 		for (var i = 0; i < this.props.data.length; i++) {
-			var cur = parseFloat(this.props.data[i].value);
+			var cur = parseFloat(this.props.data[i].Value);
 			if (cur > max)
 				max = cur;
 			if (cur < min)
@@ -30,12 +30,12 @@ module.exports = React.createClass({
 			if ((max - min) == 0.0)
 				var percent = 100;
 			else if (min < 0)
-				var percent = 100*(parseFloat(rowData.value)-min)/(max-min);
+				var percent = 100*(parseFloat(rowData.Value)-min)/(max-min);
 			else
-				var percent = 100*parseFloat(rowData.value)/max;
+				var percent = 100*parseFloat(rowData.Value)/max;
 			rows.push((
 				<tr key={i}>
-					<td style={{'width': '20%'}}>{rowData.label + " (" + rowData.value + ")"}</td>
+					<td style={{'width': '20%'}}>{rowData.Label + " (" + rowData.Value + ")"}</td>
 					<td style={{'width': '80%'}}><div style={{'width': percent + "%", 'backgroundColor': 'steelblue'}}>&nbsp;</div></td>
 				</tr>
 			));

js/components/LunchApp.js

@@ -9,7 +9,7 @@ var Modal = ReactBootstrap.Modal;
 var TopBarContainer = require('../containers/TopBarContainer');
 var RecordLunchContainer = require('../containers/RecordLunchContainer');
 var AccountSettingsModalContainer = require('../containers/AccountSettingsModalContainer');
-var LunchStats = require('../components/LunchStats');
+var LunchStatsContainer = require('../containers/LunchStatsContainer');
 var NewUserForm = require('./NewUserForm');
 
 module.exports = React.createClass({
@@ -67,8 +67,8 @@ module.exports = React.createClass({
 						<Tab title="Record Lunch" eventKey={1} >
 							<RecordLunchContainer />
 						</Tab>
-						<Tab title="Statistics" eventKey={2} >
-							<LunchStats />
+						<Tab title="Reports" eventKey={2} >
+							<LunchStatsContainer />
 						</Tab>
 					</Tabs>);
 			else

js/components/LunchStats.js

@@ -1,15 +1,50 @@
 var React = require('react');
 
-var PopularSuggestionsContainer = require('../containers/PopularSuggestionsContainer');
-var AttendeeFrequencyContainer = require('../containers/AttendeeFrequencyContainer');
+var ReactBootstrap = require('react-bootstrap');
+var ButtonGroup = ReactBootstrap.ButtonGroup;
+var DropdownButton = ReactBootstrap.DropdownButton;
+var MenuItem = ReactBootstrap.MenuItem;
+
+var BarChart = require('../components/BarChart');
 
 module.exports = React.createClass({
 	displayName: "LunchStats",
+	getInitialState: function() {
+		return {
+			selectedReportId: null
+		};
+	},
+	selectReport: function(reportId) {
+		this.props.fetchReport(reportId);
+		this.setState({
+			selectedReportId: reportId
+		});
+	},
 	render: function() {
+		var chart = (<div>Please select a report from above</div>);
+		if (this.state.selectedReportId &&
+				this.props.reports.hasOwnProperty(this.state.selectedReportId)) {
+			var report = this.props.reports[this.state.selectedReportId];
+			var data = report.Data;
+			data.sort(function(a, b){return b.Value - a.Value;});
+			var chart=(<BarChart title={report.Title} data={data}/>);
+		}
+
 		return (
 			<div>
-				<AttendeeFrequencyContainer />
-				<PopularSuggestionsContainer />
+				<ButtonGroup bsClass="lunch-report-dropdown">
+				<DropdownButton
+						title="Select Report"
+						id="lunch-report-selection-dropdown"
+						onSelect={this.selectReport}>
+					<MenuItem eventKey="suggestions">Suggestion Frequency</MenuItem>
+					<MenuItem eventKey="non-vetoed-suggestions">Non-Vetoed Suggestions</MenuItem>
+					<MenuItem eventKey="vetoed-suggestions">Vetoed Suggestions</MenuItem>
+					<MenuItem eventKey="attendees">Attendee Frequency</MenuItem>
+				</DropdownButton>
+				</ButtonGroup>
+
+				{chart}
 			</div>
 		);
 	}

js/components/PopularSuggestionsChart.js

@@ -1,23 +0,0 @@
-var React = require('react');
-
-var BarChart = require('../components/BarChart');
-
-module.exports = React.createClass({
-	displayName: "PopularSuggestionsChart",
-	render: function() {
-		var data = [];
-		for (var i = 0; i < this.props.popularSuggestions.length; i++) {
-			var suggestion = this.props.popularSuggestions[i];
-			data.push({
-				'label': suggestion.RestaurantName,
-				'value': suggestion.Popularity
-			});
-		}
-
-		data.sort(function(a, b){return b.value - a.value;});
-
-		return (
-			<BarChart title="Suggestion Frequency" data={data}/>
-		);
-	}
-});

js/constants/ReportConstants.js

@@ -0,0 +1,6 @@
+var keyMirror = require('keymirror');
+
+module.exports = keyMirror({
+	FETCH_REPORT: null,
+	REPORT_FETCHED: null
+});

js/containers/AttendeeFrequencyContainer.js

@@ -1,18 +0,0 @@
-var connect = require('react-redux').connect;
-
-var AttendeeFrequencyChart = require('../components/AttendeeFrequencyChart');
-
-function mapStateToProps(state) {
-	return {
-		popularAttendees: state.popularAttendees
-	}
-}
-
-function mapDispatchToProps(dispatch) {
-	return {}
-}
-
-module.exports = connect(
-	mapStateToProps,
-	mapDispatchToProps
-)(AttendeeFrequencyChart)

js/containers/LunchStatsContainer.js

@@ -0,0 +1,22 @@
+var connect = require('react-redux').connect;
+
+var LunchStats = require('../components/LunchStats');
+
+var ReportActions = require('../actions/ReportActions');
+
+function mapStateToProps(state) {
+	return {
+		reports: state.reports
+	}
+}
+
+function mapDispatchToProps(dispatch) {
+	return {
+		fetchReport: function(reportId) {dispatch(ReportActions.fetch(reportId))},
+	}
+}
+
+module.exports = connect(
+	mapStateToProps,
+	mapDispatchToProps
+)(LunchStats)

js/containers/PopularSuggestionsContainer.js

@@ -1,18 +0,0 @@
-var connect = require('react-redux').connect;
-
-var PopularSuggestionsChart = require('../components/PopularSuggestionsChart');
-
-function mapStateToProps(state) {
-	return {
-		popularSuggestions: state.popularSuggestions
-	}
-}
-
-function mapDispatchToProps(dispatch) {
-	return {}
-}
-
-module.exports = connect(
-	mapStateToProps,
-	mapDispatchToProps
-)(PopularSuggestionsChart)

js/models.js

@@ -218,6 +218,37 @@ Error.prototype.isError = function() {
 		this.ErrorString != empty_error.ErrorString;
 }
 
+function Report() {
+	this.ReportId = "invalid";
+	this.Title = "";
+	this.Data = [];
+}
+
+Report.prototype.toJSON = function() {
+	var json_obj = {};
+	json_obj.ReportId = this.ReportId;
+	json_obj.Title = this.Title;
+	json_obj.Data = this.Data;
+	return JSON.stringify(json_obj);
+}
+
+Report.prototype.fromJSON = function(json_input) {
+	var json_obj = getJSONObj(json_input);
+
+	if (json_obj.hasOwnProperty("ReportId"))
+		this.ReportId = json_obj.ReportId;
+	if (json_obj.hasOwnProperty("Title"))
+		this.Title = json_obj.Title;
+	if (json_obj.hasOwnProperty("Data"))
+		this.Data = json_obj.Data;
+}
+
+Report.prototype.isReport = function() {
+	var empty_report = new Report();
+	return this.ReportId != empty_report.ReportId ||
+		this.Title != empty_report.Title;
+}
+
 module.exports = models = {
 
 	// Classes
@@ -228,6 +259,7 @@ module.exports = models = {
 	PopularAttendee: PopularAttendee,
 	Suggestion: Suggestion,
 	PopularSuggestion: PopularSuggestion,
+	Report: Report,
 
 	// Constants
 	BogusPassword: "password"

js/reducers/LunchReducer.js

@@ -6,6 +6,7 @@ var AttendeeReducer = require('./AttendeeReducer');
 var PopularAttendeeReducer = require('./PopularAttendeeReducer');
 var SuggestionReducer = require('./SuggestionReducer');
 var PopularSuggestionReducer = require('./PopularSuggestionReducer');
+var ReportReducer = require('./ReportReducer');
 var ErrorReducer = require('./ErrorReducer');
 
 module.exports = Redux.combineReducers({
@@ -15,5 +16,6 @@ module.exports = Redux.combineReducers({
 	popularAttendees: PopularAttendeeReducer,
 	suggestions: SuggestionReducer,
 	popularSuggestions: PopularSuggestionReducer,
+	reports: ReportReducer,
 	error: ErrorReducer
 });

js/reducers/ReportReducer.js

@@ -0,0 +1,19 @@
+var assign = require('object-assign');
+
+var ReportConstants = require('../constants/ReportConstants');
+var UserConstants = require('../constants/UserConstants');
+
+module.exports = function(state = {}, action) {
+	switch (action.type) {
+		case ReportConstants.REPORT_FETCHED:
+			var report = action.report;
+			var reports = assign({}, state, {
+				[report.ReportId]: report
+			});
+			return reports;
+		case UserConstants.USER_LOGGEDOUT:
+			return {};
+		default:
+			return state;
+	}
+};