2016-12-22 21:22:47 -05:00
|
|
|
var React = require('react');
|
|
|
|
|
|
|
|
var ReactBootstrap = require('react-bootstrap');
|
|
|
|
var Jumbotron = ReactBootstrap.Jumbotron;
|
|
|
|
var Tabs = ReactBootstrap.Tabs;
|
|
|
|
var Tab = ReactBootstrap.Tab;
|
|
|
|
var Modal = ReactBootstrap.Modal;
|
|
|
|
|
|
|
|
var TopBarContainer = require('../containers/TopBarContainer');
|
2016-12-28 09:25:20 -05:00
|
|
|
var RecordLunchContainer = require('../containers/RecordLunchContainer');
|
2016-12-22 21:22:47 -05:00
|
|
|
var AccountSettingsModalContainer = require('../containers/AccountSettingsModalContainer');
|
2017-01-03 11:36:06 -05:00
|
|
|
var LunchStats = require('../components/LunchStats');
|
2016-12-28 09:25:20 -05:00
|
|
|
var NewUserForm = require('./NewUserForm');
|
2016-12-22 21:22:47 -05:00
|
|
|
|
|
|
|
module.exports = React.createClass({
|
|
|
|
displayName: "LunchApp",
|
|
|
|
getInitialState: function() {
|
|
|
|
return {
|
|
|
|
hash: "home",
|
|
|
|
showAccountSettingsModal: false
|
|
|
|
};
|
|
|
|
},
|
|
|
|
componentDidMount: function() {
|
|
|
|
this.props.tryResumingSession();
|
|
|
|
this.handleHashChange();
|
|
|
|
if ("onhashchange" in window) {
|
|
|
|
window.onhashchange = this.handleHashChange;
|
|
|
|
}
|
|
|
|
},
|
|
|
|
handleHashChange: function() {
|
|
|
|
var hash = location.hash.replace(/^#/, '');
|
|
|
|
if (hash.length == 0)
|
|
|
|
hash = "home";
|
|
|
|
if (hash != this.state.hash)
|
|
|
|
this.setHash(hash);
|
|
|
|
},
|
|
|
|
setHash: function(hash) {
|
|
|
|
location.hash = hash;
|
|
|
|
if (this.state.hash != hash)
|
|
|
|
this.setState({hash: hash});
|
|
|
|
},
|
|
|
|
handleAccountSettings: function() {
|
|
|
|
this.setState({showAccountSettingsModal: true});
|
|
|
|
},
|
|
|
|
handleSettingsSubmitted: function(user) {
|
|
|
|
this.setState({
|
|
|
|
showAccountSettingsModal: false
|
|
|
|
});
|
|
|
|
},
|
|
|
|
handleSettingsCanceled: function() {
|
|
|
|
this.setState({showAccountSettingsModal: false});
|
|
|
|
},
|
|
|
|
handleCreateNewUser: function() {
|
|
|
|
this.setHash("new_user");
|
|
|
|
},
|
|
|
|
handleGoHome: function() {
|
|
|
|
this.setHash("home");
|
|
|
|
},
|
|
|
|
render: function() {
|
|
|
|
var mainContent;
|
|
|
|
if (this.state.hash == "new_user") {
|
|
|
|
mainContent = <NewUserForm onNewUser={this.handleGoHome} onCancel={this.handleGoHome}/>
|
|
|
|
} else {
|
|
|
|
if (this.props.user.isUser())
|
|
|
|
mainContent = (
|
|
|
|
<Tabs defaultActiveKey={1} id='mainNavigationTabs'>
|
2016-12-28 09:25:20 -05:00
|
|
|
<Tab title="Record Lunch" eventKey={1} >
|
|
|
|
<RecordLunchContainer />
|
2016-12-22 21:22:47 -05:00
|
|
|
</Tab>
|
2017-01-03 11:36:06 -05:00
|
|
|
<Tab title="Statistics" eventKey={2} >
|
|
|
|
<LunchStats />
|
2016-12-22 21:22:47 -05:00
|
|
|
</Tab>
|
|
|
|
</Tabs>);
|
|
|
|
else
|
|
|
|
mainContent = (
|
|
|
|
<Jumbotron>
|
|
|
|
<center>
|
|
|
|
<h1>Lunch App</h1>
|
|
|
|
</center>
|
|
|
|
</Jumbotron>);
|
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
|
|
|
<div className="fullheight ui">
|
|
|
|
<TopBarContainer
|
|
|
|
onCreateNewUser={this.handleCreateNewUser}
|
|
|
|
onAccountSettings={this.handleAccountSettings} />
|
|
|
|
{mainContent}
|
|
|
|
<AccountSettingsModalContainer
|
|
|
|
show={this.state.showAccountSettingsModal}
|
|
|
|
onSubmit={this.handleSettingsSubmitted}
|
|
|
|
onCancel={this.handleSettingsCanceled}/>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
});
|