diff --git a/front-api/controllers/cart.rb b/front-api/controllers/cart.rb index f2ee8d7..2c44e5b 100644 --- a/front-api/controllers/cart.rb +++ b/front-api/controllers/cart.rb @@ -31,3 +31,15 @@ update_cart_item = ->() { } put '/cart/item', &update_cart_item post '/cart/item', &update_cart_item + + +# gets list of items in cart without count +get '/cart/item/display' do + cart = Cart.find_or_create(anonymous_id, -1) + item_ids = cart.item_in_carts.map do |x| + x.item_id + end + items = [] + items = Item.find(item_ids) if cart.item_in_carts.length > 0 + prepare_items_for_mass_display(items) +end \ No newline at end of file diff --git a/front-api/controllers/item.rb b/front-api/controllers/item.rb index c5b428b..ec3a6d1 100644 --- a/front-api/controllers/item.rb +++ b/front-api/controllers/item.rb @@ -71,9 +71,12 @@ get '/item/sub_category/:sub_category_id/offset/:offset/limit/:limit' do |sub_ca end # gets list of items in cart without count -get '/item/cart' do |cart| - cart = Cart.find_or_create(anonymous_id, -1).to_json - item_ids = cart.item_in_carts.map ->(x) { x.item_id } - items = Item.find(item_ids) +get '/cart/item_details' do + cart = Cart.find_or_create(anonymous_id, -1) + item_ids = cart.item_in_carts.map do |x| + x.item_id + end + items = [] + items = Item.find(item_ids) if cart.item_in_carts.length > 0 prepare_items_for_mass_display(items) end diff --git a/front-api/models/item.rb b/front-api/models/item.rb index e9a3103..dab0a8c 100644 --- a/front-api/models/item.rb +++ b/front-api/models/item.rb @@ -3,10 +3,14 @@ class Item < ActiveRecord::Base has_many :multi_media_descriptions belongs_to :sub_category + attr_accessor :count # used for cart + def attributes + super.merge('count' => self.count) + end + # TODO: change "best selling" algorithm when get some data - currently it's only sorted by earnings scope :best_selling, -> (offset, limit) { where(:on_display => true).order("(list_price - current_input_price) DESC").limit(limit).offset(offset) } scope :best_selling_in_sub_category, -> (sub_category_id, offset, limit) { best_selling(offset, limit).where(sub_category_id: sub_category_id) } scope :best_selling_in_category, -> (category_id, offset, limit) { best_selling(offset, limit).joins( sub_category: [:category] ).where(["category_id = ?", category_id]) } scope :best_selling_in_section, -> (section_id, offset, limit) { best_selling(offset, limit).joins( sub_category: [category: [ :section ]] ).where( ["section_id = ?", section_id] ) } - end diff --git a/front-ui/app/actions/navigationActions.js b/front-ui/app/actions/navigationActions.js index 7f68e0c..fc7325d 100644 --- a/front-ui/app/actions/navigationActions.js +++ b/front-ui/app/actions/navigationActions.js @@ -50,6 +50,13 @@ var NavigationActions = { }); }, + goToCart: function() { + AppDispatcher.handleAction({ + actionType: NavigationConstants.CHANGE_URL, + url: '/korpa' + }); + } + }; diff --git a/front-ui/app/components/cart/cartIcon.js b/front-ui/app/components/cart/cartIcon.js index a4f933c..c9d31fa 100644 --- a/front-ui/app/components/cart/cartIcon.js +++ b/front-ui/app/components/cart/cartIcon.js @@ -1,6 +1,7 @@ var React = require('react'); var CartStore = require('../../stores/cartStore.js'); var CartActions = require('../../actions/cartActions.js'); +var NavigationActions = require('../../actions/navigationActions.js'); @@ -15,7 +16,7 @@ var CartIcon = React.createClass({ var textNotificationStyle = (this.state.count > 0) ? { display: 'inline-block'} : { display: 'none'} ; return ( -
+
{this.state.count}
@@ -42,6 +43,10 @@ var CartIcon = React.createClass({ componentWillUnmount: function () { CartStore.removeChangeListener(this._onChange); + }, + + _onClick: function() { + NavigationActions.goToCart(); } diff --git a/front-ui/app/components/cart/cartPage.js b/front-ui/app/components/cart/cartPage.js index cc2b61d..a144bd8 100644 --- a/front-ui/app/components/cart/cartPage.js +++ b/front-ui/app/components/cart/cartPage.js @@ -1,5 +1,8 @@ var React = require('react'), CartStore = require('../../stores/cartStore'), + AddToCart = require('../cart/addToCart'), + CartActions = require('../../actions/cartActions'), + SingleItem = require('../items/singleItem'), AddToCart = require('../cart/addToCart'); var Router = require('react-router'); @@ -9,11 +12,19 @@ var ItemWithDetailsPage = React.createClass({ render: function() { + var displayedItems = this.state.items.map(function (i) { + return ( +
+
+
+
+ ) + }); + return ( -
- This is the cart page! - +
+ {displayedItems}
); @@ -22,7 +33,7 @@ var ItemWithDetailsPage = React.createClass({ // Add change listeners to stores componentDidMount: function() { CartStore.addChangeListener(this._onChange); - + CartActions.load(); }, componentWillUnmount: function () { @@ -30,15 +41,14 @@ var ItemWithDetailsPage = React.createClass({ }, _onChange: function () { - if (this.isMounted()) { - this.setState(ItemDetailsStore.getState()); + this.setState(CartStore.getWholeCartState()); } }, getInitialState: function () { - return CartStore.getState(); + return CartStore.getWholeCartState(); } }); diff --git a/front-ui/app/css/cart.css b/front-ui/app/css/cart.css index 231cf34..6a054cf 100644 --- a/front-ui/app/css/cart.css +++ b/front-ui/app/css/cart.css @@ -6,6 +6,7 @@ display: inline-block; position: relative; border-radius: 25px; + cursor: pointer; } .shopping-cart-notification-text { diff --git a/front-ui/app/models/itemCollection.js b/front-ui/app/models/itemCollection.js index 914d92b..4d94b70 100644 --- a/front-ui/app/models/itemCollection.js +++ b/front-ui/app/models/itemCollection.js @@ -4,56 +4,75 @@ var Backbone = require('backbone'), var ItemCollection = Backbone.Collection.extend({ - addFilter : function(name, value) { - this.filters = this.filters || {}; - this.filters[name] = value; - }, - clearFilter: function() { - this.filters = []; + initialize: function() { + $.ajaxPrefilter( + function(options, originalOptions, jqXHR) { + options.xhrFields = { + withCredentials: true + } + } + ); }, - setLimit: function(limit) { - this.queryLimit = limit; + + addFilter: function(name, value) { + this.filters = this.filters || {}; + this.filters[name] = value; + }, + clearFilter: function() { + this.filters = []; + }, + setLimit: function(limit) { + this.queryLimit = limit; }, setOffset: function(offset) { - this.offset = offset; + this.offset = offset; }, - classificationTypeUrlParts: ['','section','category','sub_category'], + classificationTypeUrlParts: ['', 'section', 'category', 'sub_category'], setClassificationType: function(type) { - this.classificationType = type; - } , + this.classificationType = type; + }, setClassificationId: function(id) { - this.classificationId = id; - }, + this.classificationId = id; + }, + + setFromCart: function(fromCart) { + this.fromCart = fromCart; + }, model: Item, - url: function() { - var path = '/item' - if(this.classificationType > 0) { - // eg. http://localhost:4567/item/section/1/offset/0/limit/10 - var urlPart = this.classificationTypeUrlParts[this.classificationType]; - path += "/" + urlPart + "/" + this.classificationId; - } // else eg. http://localhost:4567/item/offset/0/limit/10 - path += "/offset/" + this.offset + "/limit/" + this.queryLimit; - - var queryParts = []; - - for(var key in this.filters) { - if (this.filters.hasOwnProperty(key)) { - queryParts.push(key + '=' + this.filters[key]); + url: function() { + if (this.fromCart === true) { + return Globals.ApiUrl + "/cart/item/display"; } - } - var query = ''; - if (queryParts.length > 0) { - query = '?' + queryParts.join('&'); - } + var path = '/item'; - return Globals.ApiUrl + path + query; + if (this.classificationType > 0) { + // eg. http://localhost:4567/item/section/1/offset/0/limit/10 + var urlPart = this.classificationTypeUrlParts[this.classificationType]; + path += "/" + urlPart + "/" + this.classificationId; + } // else eg. http://localhost:4567/item/offset/0/limit/10 + path += "/offset/" + this.offset + "/limit/" + this.queryLimit; + + var queryParts = []; + + for (var key in this.filters) { + if (this.filters.hasOwnProperty(key)) { + queryParts.push(key + '=' + this.filters[key]); + } + } + var query = ''; + + if (queryParts.length > 0) { + query = '?' + queryParts.join('&'); + } + + return Globals.ApiUrl + path + query; } }); -module.exports = ItemCollection; +module.exports = ItemCollection; \ No newline at end of file diff --git a/front-ui/app/router.js b/front-ui/app/router.js index c99c628..596713b 100644 --- a/front-ui/app/router.js +++ b/front-ui/app/router.js @@ -8,6 +8,7 @@ var ItemWithDetailsPage = require('./components/items/itemWithDetailsPage'); var ItemList = require('./components/items/itemList'); var SectionsListComponent = require('./components/shared/sectionsListComponent'); var AllItems = require('./components/items/allItems'); +var CartPage = require('./components/cart/cartPage'); var RootApp = require('./components/rootApp'); var StartPage = require('./components/startPage/startPage'); var ByCategory = require('./components/browsing/byCategory'); @@ -18,6 +19,7 @@ var routes = ( + diff --git a/front-ui/app/stores/cartStore.js b/front-ui/app/stores/cartStore.js index 129dce9..880621f 100644 --- a/front-ui/app/stores/cartStore.js +++ b/front-ui/app/stores/cartStore.js @@ -4,11 +4,15 @@ var CartConstants = require('../constants/cartConstants'); var CartActions = require('../actions/cartActions'); var ItemInCart = require('../models/itemInCart'); var ItemInCartCollection = require('../models/itemInCartCollection'); +var ItemCollection = require('../models/itemCollection'); + var _ = require('underscore'); var states = {} var _itemsInCart = new ItemInCartCollection(); +var _itemsForDisplay = new ItemCollection(); +_itemsForDisplay.setFromCart(true); var loadCart = function() { @@ -21,9 +25,16 @@ var loadCart = function() { } CartActions.dataLoaded(); } + }); + + _itemsForDisplay.fetch({ + success: function() { + CartActions.dataLoaded(); + } }) }; + var addItem = function(itemId) { var state = states[itemId] || new ItemInCart({ @@ -56,6 +67,10 @@ var saveCartStateForItem = function(itemId) { } }); } +/* +var syncCountsWithDetails = function() { + for(i in ) +}*/ @@ -86,7 +101,8 @@ var CartStore = _.extend({}, EventEmitter.prototype, { }; var state = { - count: numberOfItems + count: numberOfItems, + items: _itemsForDisplay }; return state; }, @@ -129,10 +145,10 @@ AppDispatcher.register(function(payload) { takeItemOut(action.itemId); break; case CartConstants.CART_DATA_LOADED: - // just emit change + // do nothing - jsut emmit change break; case CartConstants.SAVE_CART_STATE_FOR_ITEM: - saveCartStateForItem(action.itemId); + // saveCartStateForItem(action.itemId); break; default: return true;