2016-02-12 20:36:59 -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;
|
|
|
|
|
2016-10-05 13:45:09 -04:00
|
|
|
var TopBarContainer = require('../containers/TopBarContainer');
|
|
|
|
var NewUserForm = require('./NewUserForm');
|
|
|
|
var AccountSettingsModalContainer = require('../containers/AccountSettingsModalContainer');
|
|
|
|
var AccountsTabContainer = require('../containers/AccountsTabContainer');
|
2016-10-26 06:58:14 -04:00
|
|
|
var SecuritiesTabContainer = require('../containers/SecuritiesTabContainer');
|
2016-02-12 20:36:59 -05:00
|
|
|
|
|
|
|
module.exports = React.createClass({
|
|
|
|
displayName: "MoneyGoApp",
|
|
|
|
getInitialState: function() {
|
|
|
|
return {
|
|
|
|
hash: "home",
|
|
|
|
showAccountSettingsModal: false
|
|
|
|
};
|
|
|
|
},
|
|
|
|
componentDidMount: function() {
|
2016-10-05 13:36:47 -04:00
|
|
|
this.props.tryResumingSession();
|
2016-02-12 20:36:59 -05:00
|
|
|
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
|
|
|
|
});
|
|
|
|
},
|
2016-10-05 13:36:47 -04:00
|
|
|
handleSettingsCanceled: function() {
|
2016-02-12 20:36:59 -05:00
|
|
|
this.setState({showAccountSettingsModal: false});
|
|
|
|
},
|
|
|
|
handleCreateNewUser: function() {
|
|
|
|
this.setHash("new_user");
|
|
|
|
},
|
2016-10-05 13:36:47 -04:00
|
|
|
handleGoHome: function() {
|
2016-02-12 20:36:59 -05:00
|
|
|
this.setHash("home");
|
|
|
|
},
|
|
|
|
render: function() {
|
|
|
|
var mainContent;
|
|
|
|
if (this.state.hash == "new_user") {
|
|
|
|
mainContent = <NewUserForm onNewUser={this.handleGoHome} onCancel={this.handleGoHome}/>
|
|
|
|
} else {
|
2016-10-05 13:36:47 -04:00
|
|
|
if (this.props.user.isUser())
|
2016-02-12 20:36:59 -05:00
|
|
|
mainContent = (
|
2016-09-27 19:19:45 -04:00
|
|
|
<Tabs defaultActiveKey={1} id='mainNavigationTabs'>
|
2016-02-13 10:26:48 -05:00
|
|
|
<Tab title="Accounts" eventKey={1} >
|
2016-10-05 13:36:47 -04:00
|
|
|
<AccountsTabContainer
|
|
|
|
className="fullheight" />
|
2016-02-12 20:36:59 -05:00
|
|
|
</Tab>
|
2016-10-26 06:58:14 -04:00
|
|
|
<Tab title="Securities" eventKey={2} >
|
|
|
|
<SecuritiesTabContainer
|
|
|
|
className="fullheight" />
|
|
|
|
</Tab>
|
|
|
|
<Tab title="Scheduled Transactions" eventKey={3} >Scheduled transactions go here...</Tab>
|
|
|
|
<Tab title="Budgets" eventKey={4} >Budgets go here...</Tab>
|
|
|
|
<Tab title="Reports" eventKey={5} >Reports go here...</Tab>
|
2016-02-12 20:36:59 -05:00
|
|
|
</Tabs>);
|
|
|
|
else
|
|
|
|
mainContent = (
|
|
|
|
<Jumbotron>
|
|
|
|
<center>
|
|
|
|
<h1>Money<i>Go</i></h1>
|
|
|
|
<p><i>Go</i> manage your money.</p>
|
|
|
|
</center>
|
|
|
|
</Jumbotron>);
|
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
|
|
|
<div className="fullheight ui">
|
2016-10-05 13:36:47 -04:00
|
|
|
<TopBarContainer
|
2016-02-12 20:36:59 -05:00
|
|
|
onCreateNewUser={this.handleCreateNewUser}
|
2016-10-05 13:36:47 -04:00
|
|
|
onAccountSettings={this.handleAccountSettings} />
|
2016-02-12 20:36:59 -05:00
|
|
|
{mainContent}
|
2016-10-05 13:36:47 -04:00
|
|
|
<AccountSettingsModalContainer
|
2016-02-12 20:36:59 -05:00
|
|
|
show={this.state.showAccountSettingsModal}
|
|
|
|
onSubmit={this.handleSettingsSubmitted}
|
|
|
|
onCancel={this.handleSettingsCanceled}/>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
});
|