diff --git a/front-ui/app/actions/cartActions.js b/front-ui/app/actions/cartActions.js
new file mode 100644
index 0000000..cfc8b44
--- /dev/null
+++ b/front-ui/app/actions/cartActions.js
@@ -0,0 +1,29 @@
+var AppDispatcher = require('../dispatcher/appDispatcher');
+var CartConstants = require('../constants/cartConstants');
+
+// Define action methods
+var CartActions = {
+
+ load: function() {
+ AppDispatcher.handleAction({
+ actionType: CartConstants.LOAD
+ });
+ },
+
+
+ addItem: function(itemId) {
+ AppDispatcher.handleAction({
+ actionType: CartConstants.ADD_ITEM,
+ itemId: itemId
+ });
+ },
+
+ takeItemOut: function(itemId) {
+ AppDispatcher.handleAction({
+ actionType: CartConstants.TAKE_ITEM_OUT,
+ itemId: itemId
+ });
+ }
+};
+
+module.exports = CartActions;
\ No newline at end of file
diff --git a/front-ui/app/components/cart/addToCart.js b/front-ui/app/components/cart/addToCart.js
index 224e4d7..e3b7fd6 100644
--- a/front-ui/app/components/cart/addToCart.js
+++ b/front-ui/app/components/cart/addToCart.js
@@ -1,40 +1,51 @@
var React = require('react');
+var CartStore = require('../../stores/cartStore.js');
+var CartActions = require('../../actions/cartActions.js');
+
+var countStyle = {
+ width: '100%'
+};
+
var AddToCart = React.createClass({
render: function() {
return (
-
-
-
-
+
+
+
+
);
},
// Add change listeners to stores
componentDidMount: function() {
- /*ItemActions.loadFrontPageItems();
- ItemStore.addChangeListener(this._onChange); */
+ CartActions.load();
+ CartStore.addChangeListener(this._onChange);
},
getInitialState: function() {
- return {
- //items: ItemStore.getItems()
- }
+ return CartStore.getStateFor(this.props.itemId)
},
_onChange: function () {
if (this.isMounted()) {
- /* this.setState({
- items: ItemStore.getItems()
- }); */
+ this.setState(CartStore.getStateFor(this.props.itemId));
}
},
+
+ _onIncreaseClick: function () {
+ CartActions.addItem(this.props.itemId);
+ },
+
+ _onDecreaseClick: function () {
+ CartActions.takeItemOut(this.props.itemId);
+ }
});
module.exports = AddToCart;
diff --git a/front-ui/app/components/items/itemWithDetailsPage.js b/front-ui/app/components/items/itemWithDetailsPage.js
index 3d314c5..2d0098d 100644
--- a/front-ui/app/components/items/itemWithDetailsPage.js
+++ b/front-ui/app/components/items/itemWithDetailsPage.js
@@ -22,7 +22,7 @@ var ItemWithDetailsPage = React.createClass({
onClickLeft={this.onClickLeft}
onClickRight={this.onClickRight}
onSelectImage={this.onSelectImage} />
-
+
diff --git a/front-ui/app/components/items/traits.js b/front-ui/app/components/items/traits.js
index 8d9d899..4f28b48 100644
--- a/front-ui/app/components/items/traits.js
+++ b/front-ui/app/components/items/traits.js
@@ -8,11 +8,11 @@ var Traits = React.createClass({
for(var traitKey in traits ) {
if(traits.hasOwnProperty(traitKey)) {
var traitValue = this.props.traits[traitKey];
- traitsPresentation.push( {traitKey}: {traitValue}
);
+ traitsPresentation.push( {traitKey}: {traitValue}
);
}
}
- console.log(traitsPresentation);
+
return (
diff --git a/front-ui/app/constants/cartConstants.js b/front-ui/app/constants/cartConstants.js
new file mode 100644
index 0000000..c6a50d9
--- /dev/null
+++ b/front-ui/app/constants/cartConstants.js
@@ -0,0 +1,10 @@
+var keyMirror = require('react/lib/keyMirror');
+
+// Define action constants
+module.exports = keyMirror({
+ LOAD: null,
+ ADD_ITEM: null,
+ // because removeItem can be used to completely remove item
+ // and not just decrease count by 1
+ TAKE_ITEM_OUT: null
+});
diff --git a/front-ui/app/css/cart.css b/front-ui/app/css/cart.css
index 5d5d02d..e7c700e 100644
--- a/front-ui/app/css/cart.css
+++ b/front-ui/app/css/cart.css
@@ -1,3 +1,3 @@
.add-to-cart {
- padding-top: 20px;
+ padding-top: 20px;
}
\ No newline at end of file
diff --git a/front-ui/app/stores/cartStore.js b/front-ui/app/stores/cartStore.js
new file mode 100644
index 0000000..bbc0d04
--- /dev/null
+++ b/front-ui/app/stores/cartStore.js
@@ -0,0 +1,90 @@
+var AppDispatcher = require('../dispatcher/appDispatcher');
+var EventEmitter = require('events').EventEmitter;
+var CartConstants = require('../constants/cartConstants');
+var _ = require('underscore');
+
+var states = {
+}
+
+
+var loadCart = function() {
+
+};
+
+var addItem = function(itemId) {
+ // TODO: push state to server side
+ var state = states[itemId] || { count: 0 };
+ state.count++;
+ states[itemId] = state;
+};
+
+var takeItemOut = function(itemId) {
+ // TODO: push state to server side
+ var state = states[itemId] || { count: 0 };
+ if (state.count > 0) {
+ state.count--;
+ }
+ states[itemId] = state;
+};
+
+
+
+
+// Extend CartStore with EventEmitter to add eventing capabilities
+var CartStore = _.extend({}, EventEmitter.prototype, {
+
+ getStateFor: function(itemId) {
+ // TODO: get from server side ?
+ var state = states[itemId] || { count: 0 }
+ return state
+ },
+
+ // Emit Change event
+ emitChange: function() {
+ console.log("Emitting change!");
+ this.emit('change');
+ },
+
+ // Add change listener
+ addChangeListener: function(callback) {
+ this.on('change', callback);
+ },
+
+ // Remove change listener
+ removeChangeListener: function(callback) {
+ this.removeListener('change', callback);
+ }
+
+});
+
+
+// Register callback with AppDispatcher
+AppDispatcher.register(function(payload) {
+ var action = payload.action;
+ var text;
+
+ switch (action.actionType) {
+
+ case CartConstants.LOAD:
+ loadCart();
+ break;
+
+ case CartConstants.ADD_ITEM:
+ addItem(action.itemId);
+ break;
+
+ case CartConstants.TAKE_ITEM_OUT:
+ takeItemOut(action.itemId);
+ break;
+
+ default:
+ return true;
+ }
+
+ // If action was responded to, emit change event
+ CartStore.emitChange();
+ return true;
+
+});
+
+module.exports = CartStore;