cart now functional without bugs (at least the ones we know about)

fixed a small issue with ItemGroup REST call

front-ui/app/actions/cartActions.js

@@ -49,6 +49,13 @@ var CartActions = {
           actionType: CartConstants.TAKE_ITEM_OUT,
           itemId: id
       });
+    },
+    setItemCount: function(itemId, count) {
+      AppDispatcher.handleAction({
+          actionType: CartConstants.SET_ITEM_COUNT,
+          itemId: itemId,
+          count: count
+      });
     }
 };
 

front-ui/app/components/account/login.js

@@ -101,7 +101,7 @@ var Login = React.createClass({
                         {this.getValidationMessages('password').map(this.renderErrorMessage)}
 
                     </div>
-                    <input style={{color: 'white', fontWeight: 'bold', height: 44}} type="submit" onClick={this.onLoginClick} className=" mybutton center-block col-md-8 col-sm-8 col-xs-8 col-sm-push-2 col-xs-push-2 col-md-push-2" defaultValue="Prijava" />
+                    <input style={{color: 'white', fontWeight: 'bold', height: 44}} type="submit" onClick={this.onLoginClick} className=" mybutton center-block col-md-8 col-sm-8 col-xs-8 col-sm-push-2 col-xs-push-2 col-md-push-2" defaultValue="PRIJAVA" />
                   </form>
                   <div className="text-center col-lg-12">
                     <h4>Niste registrovani?  <Link to="registracija"><span>Registrujte se</span></Link></h4>

front-ui/app/components/cart/cartIcon.js

@@ -31,7 +31,7 @@ var CartIcon = React.createClass({
          <ul className="nav navbar-nav navbar-right hidden-md hidden-sm hidden-xs">
             <li><LoginStatus /></li>
             <li onClick={this._onClick} style={{borderTop: 'solid lightgray 1px', borderBottom: 'solid lightgray 1px', borderLeft: 'solid lightgray 1px', paddingBottom: 22}}><a ><div className="mycart"><span>{normalizeCount(this.state.count)}</span></div></a></li>
-            <li onClick={this._onClick} style={{borderTop: 'solid lightgray 1px', borderBottom: 'solid lightgray 1px', paddingBottom: 2}}><a href="#" style={{ paddingRight: '5px'}}><CartTotal items={this.state.items} itemCounts={this.state.itemCounts} deliveryCosts={this.state.deliveryCosts} justMerchandise={true}/> </a></li>
+            <li onClick={this._onClick} style={{borderTop: 'solid lightgray 1px', borderBottom: 'solid lightgray 1px', paddingBottom: 2}}><a href="#" style={{ paddingRight: '5px', backgroundColor: 'transparent' }}><CartTotal items={this.state.items} itemCounts={this.state.itemCounts} deliveryCosts={this.state.deliveryCosts} justMerchandise={true}/> </a></li>
             <li onClick={this._onClick} style={{borderTop: 'solid lightgray 1px', borderBottom: 'solid lightgray 1px', borderRight: 'solid lightgray 1px'}}>
               <a style={{marginBottom: 10, marginRight: 10}} className="mybutton" href="#">Završi narudžbu</a></li>
 
@@ -40,7 +40,7 @@ var CartIcon = React.createClass({
           <ul className="nav navbar-nav navbar-right hidden-lg">
              <li><LoginStatus /></li>
              <li onClick={this._onClick} style={{borderTop: 'solid lightgray 1px', borderBottom: 'solid lightgray 1px', borderLeft: 'solid lightgray 1px', paddingBottom: 22}}><a ><div className="mycart"><span>{normalizeCount(this.state.count)}</span></div></a></li>
-             <li onClick={this._onClick} style={{borderTop: 'solid lightgray 1px', borderBottom: 'solid lightgray 1px',borderRight: 'solid lightgray 1px', paddingBottom: 2}}><a href="#" style={{ paddingRight: '5px'}}><CartTotal items={this.state.items} itemCounts={this.state.itemCounts} deliveryCosts={this.state.deliveryCosts} justMerchandise={true}/> </a></li>
+             <li onClick={this._onClick} style={{borderTop: 'solid lightgray 1px', borderBottom: 'solid lightgray 1px',borderRight: 'solid lightgray 1px', paddingBottom: 2}}><a href="#" style={{ paddingRight: '5px', backgroundColor: 'transparent'}}><CartTotal items={this.state.items} itemCounts={this.state.itemCounts} deliveryCosts={this.state.deliveryCosts} justMerchandise={true}/> </a></li>
            </ul>
           </div>
         );

front-ui/app/components/cart/cartPage.js

@@ -21,7 +21,7 @@ var CartPage = React.createClass({
       var displayedItems = this.state.items.filter(function(i) {
         if(!counts) return false;
          var count = counts[i.get('id')].get('count');
-         return count > 0;
+         return count > 0 || count === "";
         }).map(function (i) {
         var count = counts[i.get('id')].get('count');
         var price = i.get('list_price');
@@ -40,7 +40,21 @@ var CartPage = React.createClass({
                </td>
             <td>{ Globals.FormatCurrency(price) }</td>
             <td>
-              <input style={{textAlign: 'center'}} className="form-control qty-box" type='text' value={count}></input>
+              <select style={{textAlign: 'center'}} value={count}
+                onChange={self._onQuantityChange.bind(self, i.get('id'))}
+                >
+
+                <option value="1">1</option>
+                <option value="2">2</option>
+                <option value="3">3</option>
+                <option value="4">4</option>
+                <option value="5">5</option>
+                <option value="6">6</option>
+                <option value="7">7</option>
+                <option value="8">8</option>
+                <option value="9">9</option>
+                <option value="10">10</option>
+              </select>
             </td>
             <td>
                 { Globals.FormatCurrency(count * price) }
@@ -61,8 +75,6 @@ var CartPage = React.createClass({
           )
       }
 
-
-
       var cartTotal = (
         <div>
         <div className="row cart-total">
@@ -109,8 +121,6 @@ var CartPage = React.createClass({
         </div>)
       }
 
-
-
       return (
         <div className="col-lg-12">
           <LinkBanner locationName="thankYouPage" />
@@ -141,7 +151,9 @@ var CartPage = React.createClass({
     _onOrderClick: function () {
       NavigationActions.goToCheckout();
     },
-
+    _onQuantityChange(itemId, e) {
+      CartActions.setItemCount(itemId, e.target.value);
+    },
     getInitialState: function () {
       return CartStore.getWholeCartState();
     }

front-ui/app/stores/cartStore.js

@@ -45,7 +45,7 @@ var loadCart = function() {
     });
 
      //_deliveryDestination.fetch({
-            //success: function() {
+          //success: function() {
                 //validateDeliveryDestinationForm();
                 //fetchPlace();
                 //CartActions.dataLoaded();
@@ -94,6 +94,30 @@ var takeItemOut = function(itemId) {
     saveCartStateForItem(itemId);
 };
 
+var setItemCount = function(itemId, count) {
+    var state = states[itemId] || new ItemInCart({
+        item_id: itemId,
+        count: 0
+    });
+
+    if (count === "") {
+      state.set('count', "");
+      CartStore.emitChange();
+      return;
+    }
+
+    var cnt = parseInt(count);
+
+    if(isNaN(cnt) || cnt <= 0) {
+      cnt = 1;
+    }
+
+    state.set('count', cnt);
+
+    states[itemId] = state;
+    saveCartStateForItem(itemId);
+  // CartStore.emitChange();
+};
 
 var addNItems = function(item, count) {
 
@@ -283,6 +307,9 @@ AppDispatcher.register(function(payload) {
         case CartConstants.ADD_N_ITEMS:
             addNItems(action.item, action.count);
             break;
+        case CartConstants.SET_ITEM_COUNT:
+            setItemCount(action.itemId, action.count);
+            break;
         default:
             return true;
     }