address is now collapsable

This commit is contained in:
Senad Uka
2015-06-14 06:18:10 +02:00
parent 6c5a21789a
commit ce733c8cd8
6 changed files with 35130 additions and 6 deletions

View File

@@ -477,7 +477,7 @@ One shop to rule them all!
<option value="88247">Vir Kod Posusja</option> <option value="88247">Vir Kod Posusja</option>
<option value="73240">Visegrad</option> <option value="73240">Visegrad</option>
<option value="88307">Visici</option> <option value="88307">Visici</option>
<option value="71300">Visoko</option>
<option value="72250">Vitez</option> <option value="72250">Vitez</option>
<option value="88326">Vitina</option> <option value="88326">Vitina</option>
<option value="74265">Vitkovci Donji</option> <option value="74265">Vitkovci Donji</option>

View File

@@ -65,6 +65,13 @@ var CartActions = {
itemId: itemId, itemId: itemId,
count: count count: count
}); });
},
setAddressColapsed: function(isColapsed) {
AppDispatcher.handleAction({
actionType: CartConstants.SET_ADDRESS_COLAPSED,
isColapsed: isColapsed
});
} }
}; };

View File

@@ -17,9 +17,9 @@ var CheckoutPage = React.createClass({
render: function() { render: function() {
var supportedPlaceOptions = CartStore.getSupportedPlaces().map ( function (p) { return (<option value={p.code}>{p.placeLabel}</option>)}) var supportedPlaceOptions = CartStore.getSupportedPlaces().map ( function (p) { return (<option value={p.code}>{p.placeLabel}</option>)});
return ( var content = (
<div className="checkout-page center"> <div className="checkout-page center">
<div className="form-horizontal"> <div className="form-horizontal">
<fieldset> <fieldset>
@@ -88,7 +88,35 @@ var CheckoutPage = React.createClass({
</fieldset> </fieldset>
</div> </div>
</div> </div>
); );
if(CartStore.isAddressColapsed()) {
var address = CartStore.getHumanReadableAddress().map(function (a) { return (<span>{a}<br /></span>)});
content = (
<div className="checkout-page center text-center" >
<h2> Roba će biti dostavljena na adresu: </h2>
<p className="lead">
{address}
<br />
Ukupno: <CartTotal items={this.state.items} itemCounts={this.state.itemCounts} deliveryCosts={this.state.deliveryCosts} />
</p>
<p>
<button id="order" name="order" className="mybutton" disabled={!this.state.isDeliveryDestinationValid} onClick={this._onOrderClick}>Završi narudžbu</button> ili <button className="btn btn-default" onClick={this._onUncolapseClick}>Promijeni adresu</button>
</p>
<div className="form-group">
<label className="col-md-4 control-label" htmlFor="order"></label>
<div className="col-md-8">
<div> </div>
<div></div>
</div>
</div>
</div>);
}
return content;
}, },
@@ -116,6 +144,10 @@ var CheckoutPage = React.createClass({
CartActions.confirmDelivery(); CartActions.confirmDelivery();
}, },
_onUncolapseClick: function (event) {
CartActions.setAddressColapsed(false);
},
getInitialState: function () { getInitialState: function () {
return CartStore.getWholeCartState(); return CartStore.getWholeCartState();
} }

View File

@@ -9,5 +9,6 @@ module.exports = keyMirror({
CONFIRM_DELIVERY: null, CONFIRM_DELIVERY: null,
SET_ITEM_COUNT: null, SET_ITEM_COUNT: null,
ADD_N_ITEMS: null, ADD_N_ITEMS: null,
REMOVE_ITEM: null REMOVE_ITEM: null,
SET_ADDRESS_COLAPSED: null
}); });

View File

@@ -25,6 +25,8 @@ var _deliveryCosts = new Place({
postalCode: _deliveryDestination.get('place') postalCode: _deliveryDestination.get('place')
}) })
var _addressColapsed = false;
var supportedPlaces = [ var supportedPlaces = [
{ {
@@ -82,6 +84,16 @@ var supportedPlaces = [
var _cartDataLoadCalled = false; var _cartDataLoadCalled = false;
var nameOfThePlace = function(code) {
for(var i=0; i<supportedPlaces.length; i++ ) {
var place = supportedPlaces[i];
if (place.code === code) {
return place.placeLabel;
}
}
return "";
}
var loadCart = function() { var loadCart = function() {
_itemsInCart.fetch({ _itemsInCart.fetch({
@@ -98,6 +110,7 @@ var loadCart = function() {
_deliveryDestination.fetch({ _deliveryDestination.fetch({
success: function() { success: function() {
validateDeliveryDestinationForm(); validateDeliveryDestinationForm();
collapseAddressIfNeeded();
fetchPlace(); fetchPlace();
CartActions.dataLoaded(); CartActions.dataLoaded();
} }
@@ -110,6 +123,13 @@ var loadCart = function() {
_cartDataLoadCalled = true; _cartDataLoadCalled = true;
}; };
var collapseAddressIfNeeded = function () {
if(isDeliveryDestinationValid()) {
_addressColapsed = true;
} else {
_addressColapsed = false;
}
}
var fetchPlace = function() { var fetchPlace = function() {
_deliveryCosts = new Place({ _deliveryCosts = new Place({
@@ -339,9 +359,24 @@ var CartStore = _.extend({}, EventEmitter.prototype, {
this.removeListener('change', callback); this.removeListener('change', callback);
}, },
isDeliveryDestinationValid: isDeliveryDestinationValid isDeliveryDestinationValid: isDeliveryDestinationValid,
isAddressColapsed: function() {
return _addressColapsed;
},
getHumanReadableAddress: function() {
var address = [];
address.push(_deliveryDestination.get('name'));
address.push(_deliveryDestination.get('address'));
address.push(_deliveryDestination.get('place') + " " + nameOfThePlace(_deliveryDestination.get('place')));
address.push("Bosna i Hercegovina");
address.push("+387" + _deliveryDestination.get('phone'))
address.push(_deliveryDestination.get('email'))
return address;
}
}); });
@@ -378,6 +413,9 @@ AppDispatcher.register(function(payload) {
case CartConstants.SET_ITEM_COUNT: case CartConstants.SET_ITEM_COUNT:
setItemCount(action.itemId, action.count); setItemCount(action.itemId, action.count);
break; break;
case CartConstants.SET_ADDRESS_COLAPSED:
_addressColapsed = action.isColapsed
break;
default: default:
return true; return true;
} }

File diff suppressed because one or more lines are too long