59 lines
1.3 KiB
JavaScript
59 lines
1.3 KiB
JavaScript
var React = require('react');
|
|
var CartStore = require('../../stores/cartStore.js');
|
|
var CartActions = require('../../actions/cartActions.js');
|
|
var NavigationActions = require('../../actions/navigationActions.js');
|
|
|
|
|
|
|
|
var cartStyle = {
|
|
fontSize: '50px'
|
|
};
|
|
|
|
var CartIcon = React.createClass({
|
|
|
|
render: function() {
|
|
|
|
var textNotificationStyle = (this.state.count > 0) ? { display: 'inline-block'} : { display: 'none'} ;
|
|
|
|
return (
|
|
<div className="shopping-cart-icon" onClick={this._onClick}>
|
|
<i style={cartStyle} className="fa fa-shopping-cart"></i>
|
|
<div style={textNotificationStyle} className="shopping-cart-notification-text">{this.state.count}</div>
|
|
</div>
|
|
);
|
|
},
|
|
|
|
// Add change listeners to stores
|
|
componentDidMount: function() {
|
|
CartStore.addChangeListener(this._onChange);
|
|
CartActions.load();
|
|
},
|
|
|
|
|
|
getInitialState: function() {
|
|
var cartState = CartStore.getWholeCartState();
|
|
return cartState;
|
|
},
|
|
|
|
_onChange: function () {
|
|
if (this.isMounted()) {
|
|
this.setState(CartStore.getWholeCartState());
|
|
}
|
|
},
|
|
|
|
componentWillUnmount: function () {
|
|
CartStore.removeChangeListener(this._onChange);
|
|
},
|
|
|
|
_onClick: function() {
|
|
NavigationActions.goToCart();
|
|
}
|
|
|
|
|
|
});
|
|
|
|
module.exports = CartIcon;
|
|
|
|
|
|
|