Merge branch 'develop'
paypal, pikpay and gift support
This commit is contained in:
Senad Uka
@@ -75,4 +75,4 @@ var CartActions = {
|
||||
}
|
||||
};
|
||||
|
||||
module.exports = CartActions;
|
||||
module.exports = CartActions;
|
||||
|
||||
@@ -5,25 +5,54 @@ var React = require('react'),
|
||||
NavigationActions = require('../../actions/navigationActions'),
|
||||
SingleItem = require('../items/singleItem'),
|
||||
Globals = require('../../globals'),
|
||||
CartTotal = require('./cartTotal'),
|
||||
CartTotal = require('./cartTotal'),
|
||||
LinkBanner = require('../linkBanner/linkBanner'),
|
||||
RibicaFormError = require('../shared/ribicaFormError');
|
||||
|
||||
PaymentSelect = require('../payment/paymentSelect'),
|
||||
RibicaFormError = require('../shared/ribicaFormError'),
|
||||
PaypalButton = require('../payment/paypalButton'),
|
||||
PikpayButton = require('../payment/pikpayButton'),
|
||||
CashOnDeliveryButton = require('../payment/cashOnDeliveryButton');
|
||||
|
||||
var Router = require('react-router');
|
||||
|
||||
|
||||
var CheckoutPage = React.createClass({
|
||||
|
||||
render: function() {
|
||||
var choosePayment = (
|
||||
<div className="payment-btn">
|
||||
<PaymentSelect deliveryDestination={this.state.deliveryDestination}
|
||||
amount={CartStore.getAmount()}
|
||||
deliveryCost={CartStore.getDeliveryCost(false)}
|
||||
disabled={!this.state.isDeliveryDestinationValid}
|
||||
cashOnDeliveryDisabled={!this.state.isDeliveryDestinationValid || this.state.deliveryDestination.get('gift')}
|
||||
onCashClick={this._onOrderClick}
|
||||
cartId={this.state.cart.get('id')}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
var last_used_payment;
|
||||
if(this.state.deliveryDestination.get('payment_method') == 'paypal') {
|
||||
last_used_payment = (
|
||||
<PaypalButton disabled={!this.state.isDeliveryDestinationValid} onSubmitPaypal={this._handleOnSubmitPaypal} deliveryDestination={this.state.deliveryDestination} amount={CartStore.getAmount()} deliveryCost={CartStore.getDeliveryCost(false)} cartId={this.state.cart.get('id')}/>
|
||||
);
|
||||
} else if(this.state.deliveryDestination.get('payment_method') == 'pikpay') {
|
||||
last_used_payment = (
|
||||
<PikpayButton amount={CartStore.getAmount()} deliveryCost={CartStore.getDeliveryCost(false)} disabled={!this.state.isDeliveryDestinationValid} deliveryDestination={this.state.deliveryDestination} cartId={this.state.cart.get('id')}/>
|
||||
);
|
||||
} else {
|
||||
last_used_payment = (
|
||||
<CashOnDeliveryButton onCashClick={this._onOrderClick} disabled={!this.state.isDeliveryDestinationValid || this.state.deliveryDestination.get('gift')} cartId={this.state.cart.get('id')}/>
|
||||
);
|
||||
}
|
||||
|
||||
var supportedPlaceOptions = CartStore.getSupportedPlaces().map ( function (p) { return (<option value={p.code}>{p.placeLabel}</option>)});
|
||||
|
||||
|
||||
var content = (
|
||||
<div className="checkout-page center">
|
||||
<div className="form-horizontal checkout_form_margin">
|
||||
<fieldset>
|
||||
<legend>Dostava</legend>
|
||||
<legend>Podaci o naručiocu</legend>
|
||||
<div className="form-group ">
|
||||
|
||||
<label className="col-md-4 control-label" htmlFor="name">Prezime i Ime</label>
|
||||
@@ -41,15 +70,15 @@ var CheckoutPage = React.createClass({
|
||||
<span className="help-block">adresa na koju će roba biti isporučena</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="form-group ">
|
||||
<label className="col-md-4 control-label" htmlFor="place">Mjesto</label>
|
||||
<div className="col-md-4">
|
||||
<RibicaFormError componentName="place" errorMessagesObject={this.state.deliveryDestinationErrors} />
|
||||
<select id="place" name="place" className="form-control" value={this.state.deliveryDestination.get('place')} onChange={this._onFieldChange} >
|
||||
|
||||
{supportedPlaceOptions}
|
||||
|
||||
|
||||
{supportedPlaceOptions}
|
||||
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
@@ -78,22 +107,88 @@ var CheckoutPage = React.createClass({
|
||||
<textarea className="form-control" id="note" name="note" value={this.state.deliveryDestination.get('note')} onChange={this._onFieldChange} ></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-group ">
|
||||
<label className="col-md-4 control-label" htmlFor="order"></label>
|
||||
<div className="col-md-8">
|
||||
<div> Roba: <CartTotal items={this.state.items} itemCounts={this.state.itemCounts} /><br />
|
||||
<span className={this.state.deliveryDestinationErrors['place'] ? 'hidden' : 'shown'}>
|
||||
Dostava: <CartTotal deliveryCosts={this.state.deliveryCosts} /><br />
|
||||
Ukupno: <CartTotal items={this.state.items} itemCounts={this.state.itemCounts} deliveryCosts={this.state.deliveryCosts} />
|
||||
<div className="form-group">
|
||||
<label className="col-md-4 control-label" htmlFor="order"></label>
|
||||
<div className="col-md-8">
|
||||
<div> Roba: <CartTotal items={this.state.items} itemCounts={this.state.itemCounts} /><br />
|
||||
<span className={this.state.deliveryDestinationErrors[this.state.deliveryCostsTarget] ? 'hidden' : 'shown'}>
|
||||
Dostava: <CartTotal deliveryCosts={this.state.deliveryCosts} /><br />
|
||||
Ukupno: <CartTotal items={this.state.items} itemCounts={this.state.itemCounts} deliveryCosts={this.state.deliveryCosts} />
|
||||
</span>
|
||||
</div>
|
||||
<div><button id="order" name="order" className="mybutton" disabled={!this.state.isDeliveryDestinationValid} onClick={this._onOrderClick}>Završi narudžbu</button></div>
|
||||
</div>
|
||||
</div>
|
||||
<br />
|
||||
<div className="checkbox">
|
||||
<label><input type="checkbox" name="gift" checked={this.state.deliveryDestination.get('gift')} onChange={this._onFieldChange} />Poklon</label>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
</div>
|
||||
|
||||
|
||||
</fieldset>
|
||||
|
||||
<fieldset className={this.state.deliveryDestination.get('gift') ? 'shown' : 'hidden'}>
|
||||
<legend>Podaci o dostavi</legend>
|
||||
|
||||
|
||||
<div className="form-group ">
|
||||
|
||||
<label className="col-md-4 control-label" htmlFor="recipient_name">Prezime i Ime</label>
|
||||
<div className="col-md-4">
|
||||
<RibicaFormError componentName="recipient_name" errorMessagesObject={this.state.deliveryDestinationErrors} />
|
||||
<input id="recipient_name" name="recipient_name" type="text" placeholder="Prezime Ime" className="form-control input-md" required="" value={this.state.deliveryDestination.get('recipient_name')} onChange={this._onFieldChange} />
|
||||
<span className="help-block">ime osobe koja prima pošiljku</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-group ">
|
||||
<label className="col-md-4 control-label" htmlFor="recipient_address">Adresa</label>
|
||||
<div className="col-md-4">
|
||||
<RibicaFormError componentName="recipient_address" errorMessagesObject={this.state.deliveryDestinationErrors} />
|
||||
<input id="recipient_address" name="recipient_address" type="text" placeholder="Ulica i broj" className="form-control input-md" required="" value={this.state.deliveryDestination.get('recipient_address')} onChange={this._onFieldChange} />
|
||||
<span className="help-block">adresa na koju će roba biti isporučena</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="form-group ">
|
||||
<label className="col-md-4 control-label" htmlFor="recipient_place">Mjesto</label>
|
||||
<div className="col-md-4">
|
||||
<RibicaFormError componentName="recipient_place" errorMessagesObject={this.state.deliveryDestinationErrors} />
|
||||
<select id="recipient_place" name="recipient_place" className="form-control" value={this.state.deliveryDestination.get('recipient_place')} onChange={this._onFieldChange} >
|
||||
|
||||
{supportedPlaceOptions}
|
||||
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-group ">
|
||||
<label className="col-md-4 control-label" htmlFor="recipient_phone">Telefon</label>
|
||||
<div className="col-md-4">
|
||||
<RibicaFormError componentName="recipient_phone" errorMessagesObject={this.state.deliveryDestinationErrors} />
|
||||
<div className="input-group">
|
||||
<span className="input-group-addon">+387 </span>
|
||||
<input id="recipient_phone" name="recipient_phone" className="form-control" placeholder="061 222 333" type="text" required="" value={this.state.deliveryDestination.get('recipient_phone')} onChange={this._onFieldChange} />
|
||||
</div>
|
||||
<p className="help-block">broj mobitela - mora biti sa jedne od mreža u BiH</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-group ">
|
||||
<label className="col-md-4 control-label" htmlFor="recipient_email">E - mail</label>
|
||||
<div className="col-md-4">
|
||||
<RibicaFormError componentName="recipient_email" errorMessagesObject={this.state.deliveryDestinationErrors} />
|
||||
<input id="recipient_email" name="recipient_email" type="text" placeholder="ime@nekimail.com" className="form-control input-md" required="" value={this.state.deliveryDestination.get('recipient_email')} onChange={this._onFieldChange} />
|
||||
<span className="help-block">E - mail adresa na koju će vam biti poslano obavještenje o narudžbi</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</fieldset>
|
||||
|
||||
<div className="payment-select-container">
|
||||
{choosePayment}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
if(CartStore.isAddressColapsed()) {
|
||||
|
||||
@@ -109,16 +204,27 @@ var CheckoutPage = React.createClass({
|
||||
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="hidden-xs">
|
||||
<button className="btn btn-default gift-btn" onClick={this._onGiftBtnClicked}>Poklon</button>
|
||||
<br />
|
||||
|
||||
<p className="collapsed-address-container">{last_used_payment} ili <button className="btn btn-default" onClick={this._onUncolapseClick}>Promijeni način plaćanja ili adresu</button></p>
|
||||
</div>
|
||||
|
||||
<div className="collapsed-address-container-mobile btn-group-vertical visible-xs">
|
||||
<button className="btn btn-default" onClick={this._onGiftBtnClicked}>Poklon</button>
|
||||
{last_used_payment}
|
||||
<button className="btn btn-default" onClick={this._onUncolapseClick}>Promijeni način plaćanja ili adresu</button>
|
||||
</div>
|
||||
|
||||
<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>
|
||||
</div>);
|
||||
}
|
||||
|
||||
@@ -144,10 +250,15 @@ var CheckoutPage = React.createClass({
|
||||
|
||||
},
|
||||
_onFieldChange: function (event) {
|
||||
CartActions.changeDeliveryDestinationProperty(event.target.name, event.target.value);
|
||||
if(event.target.name === "gift") {
|
||||
CartActions.changeDeliveryDestinationProperty(event.target.name, $(event.target).is(':checked'));
|
||||
} else {
|
||||
CartActions.changeDeliveryDestinationProperty(event.target.name, event.target.value);
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
_onOrderClick: function (event) {
|
||||
CartActions.changeDeliveryDestinationProperty("payment_method", "cash_on_delivery");
|
||||
CartActions.confirmDelivery();
|
||||
},
|
||||
|
||||
@@ -155,6 +266,16 @@ var CheckoutPage = React.createClass({
|
||||
CartActions.setAddressColapsed(false);
|
||||
},
|
||||
|
||||
_onGiftBtnClicked: function (event) {
|
||||
CartActions.changeDeliveryDestinationProperty('gift', true);
|
||||
CartActions.setAddressColapsed(false);
|
||||
},
|
||||
|
||||
_handleOnSubmitPaypal: function(event) {
|
||||
CartActions.changeDeliveryDestinationProperty('payment_method', 'paypal');
|
||||
return false;
|
||||
},
|
||||
|
||||
getInitialState: function () {
|
||||
return CartStore.getWholeCartState();
|
||||
}
|
||||
@@ -162,4 +283,4 @@ var CheckoutPage = React.createClass({
|
||||
});
|
||||
|
||||
|
||||
module.exports = CheckoutPage;
|
||||
module.exports = CheckoutPage;
|
||||
|
||||
17
front-ui/app/components/payment/cashOnDeliveryButton.js
Normal file
17
front-ui/app/components/payment/cashOnDeliveryButton.js
Normal file
@@ -0,0 +1,17 @@
|
||||
var React = require('react');
|
||||
var ItemActions = require('../../actions/itemActions');
|
||||
var NavigationActions = require('../../actions/navigationActions');
|
||||
var NavigationStore = require('../../stores/navigationStore');
|
||||
|
||||
var Globals = require('../../globals');
|
||||
var Router = require('react-router');
|
||||
|
||||
var CashOnDeliveryButton = React.createClass({
|
||||
render: function() {
|
||||
return (
|
||||
<button type="button" className="btn mybutton payment-btn" disabled={this.props.disabled} onClick={this.props.onCashClick}>Plati prilikom preuzimanja</button>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
module.exports = CashOnDeliveryButton;
|
||||
36
front-ui/app/components/payment/paymentSelect.js
Normal file
36
front-ui/app/components/payment/paymentSelect.js
Normal file
@@ -0,0 +1,36 @@
|
||||
var React = require('react');
|
||||
var ItemActions = require('../../actions/itemActions');
|
||||
var NavigationActions = require('../../actions/navigationActions');
|
||||
var NavigationStore = require('../../stores/navigationStore');
|
||||
|
||||
var Globals = require('../../globals');
|
||||
var Router = require('react-router');
|
||||
var PaypalButton = require('./paypalButton');
|
||||
var PikpaylButton = require('./pikpayButton');
|
||||
var CashOnDeliveryButton = require('./cashOnDeliveryButton');
|
||||
|
||||
var PaymentSelect = React.createClass({
|
||||
render: function() {
|
||||
var cashOnDeliveryBtn = ( <CashOnDeliveryButton onCashClick={this.props.onCashClick} disabled={this.props.cashOnDeliveryDisabled} cartId={this.props.cartId}/> );
|
||||
var pikpayBtn = ( <PikpaylButton amount={this.props.amount} deliveryCost={this.props.deliveryCost} disabled={this.props.disabled} deliveryDestination={this.props.deliveryDestination} cartId={this.props.cartId}/> );
|
||||
var paypalBtn = ( <PaypalButton disabled={this.props.disabled} deliveryDestination={this.props.deliveryDestination} amount={this.props.amount} deliveryCost={this.props.deliveryCost} cartId={this.props.cartId}/> );
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="payment_select btn-group payment-select-desktop hidden-xs">
|
||||
{cashOnDeliveryBtn}
|
||||
{pikpayBtn}
|
||||
{paypalBtn}
|
||||
</div>
|
||||
|
||||
<div className="payment_select btn-group-vertical payment-select-mobile visible-xs">
|
||||
{cashOnDeliveryBtn}
|
||||
{pikpayBtn}
|
||||
{paypalBtn}
|
||||
</div>
|
||||
</div>);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
module.exports = PaymentSelect;
|
||||
62
front-ui/app/components/payment/paypalButton.js
Normal file
62
front-ui/app/components/payment/paypalButton.js
Normal file
@@ -0,0 +1,62 @@
|
||||
var React = require('react');
|
||||
var ItemActions = require('../../actions/itemActions');
|
||||
var NavigationActions = require('../../actions/navigationActions');
|
||||
var NavigationStore = require('../../stores/navigationStore');
|
||||
var CartStore = require('../../stores/cartStore');
|
||||
var CartActions = require('../../actions/cartActions');
|
||||
|
||||
var Globals = require('../../globals');
|
||||
var Router = require('react-router');
|
||||
|
||||
var PaypalButton = React.createClass({
|
||||
render: function() {
|
||||
var deliveryDestination = JSON.stringify(
|
||||
{
|
||||
'anonymous_id_string': this.props.deliveryDestination.get('anonymous_id_string'),
|
||||
'user_id': this.props.deliveryDestination.get('user_id')
|
||||
});
|
||||
var amount = Globals.ConvertToEuro(this.props.amount);
|
||||
var deliveryCost = Globals.ConvertToEuro(this.props.deliveryCost);
|
||||
var root = location.protocol + '//' + location.host;
|
||||
var return_url = root + "/hvala";
|
||||
var cancel_return_url = root + "/dostava";
|
||||
var notifyUrl = Globals.IsUrlAbsolute(Globals.ApiUrl) ? Globals.ApiUrl : root + Globals.ApiUrl;
|
||||
notifyUrl += "/payment/confirmation";
|
||||
|
||||
return (
|
||||
<button onClick={this._onPaypalClick} disabled={this.props.disabled} type="button" className="btn mybutton payment-btn">Paypal
|
||||
<form id="paypal_form" className="hidden" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
|
||||
<input type="hidden" name="cmd" value="_xclick" />
|
||||
<input type="hidden" name="business" value={Globals.PaypalId} />
|
||||
<input type="hidden" name="lc" value="BA" />
|
||||
<input type="hidden" name="item_name" value="Item" />
|
||||
<input type="hidden" name="item_number" value={this.props.cartId} />
|
||||
<input type="hidden" name="amount" value={amount} />
|
||||
<input type="hidden" name="currency_code" value="EUR" />
|
||||
<input type="hidden" name="button_subtype" value="services" />
|
||||
<input type="hidden" name="no_note" value="0" />
|
||||
<input type="hidden" name="cn" value="Napomena:" />
|
||||
<input type="hidden" name="no_shipping" value="1" />
|
||||
<input type="hidden" name="rm" value="1" />
|
||||
<input type="hidden" name="return" value={return_url} />
|
||||
<input type="hidden" name="cancel_return" value={cancel_return_url} />
|
||||
<input type="hidden" name="shipping" value={deliveryCost} />
|
||||
<input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHosted" />
|
||||
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!" />
|
||||
<img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1" />
|
||||
<input name="notify_url" value={notifyUrl} type="hidden" />
|
||||
<input name="custom" value={deliveryDestination} type="hidden" />
|
||||
</form>
|
||||
</button>
|
||||
);
|
||||
},
|
||||
_onPaypalClick: function(e) {
|
||||
CartActions.changeDeliveryDestinationProperty('payment_method', 'paypal');
|
||||
CartStore.saveDeliveryDestinationAnd(function() {
|
||||
$("#paypal_form").submit();
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
module.exports = PaypalButton;
|
||||
64
front-ui/app/components/payment/pikpayButton.js
Normal file
64
front-ui/app/components/payment/pikpayButton.js
Normal file
@@ -0,0 +1,64 @@
|
||||
var React = require('react');
|
||||
var ItemActions = require('../../actions/itemActions');
|
||||
var NavigationActions = require('../../actions/navigationActions');
|
||||
var NavigationStore = require('../../stores/navigationStore');
|
||||
var CartStore = require('../../stores/cartStore');
|
||||
var CartActions = require('../../actions/cartActions');
|
||||
|
||||
var Globals = require('../../globals');
|
||||
var Router = require('react-router');
|
||||
var sha1 = require('sha1');
|
||||
|
||||
var PikpayButton = React.createClass({
|
||||
render: function() {
|
||||
var total = this.props.amount + this.props.deliveryCost;
|
||||
total = total.toFixed(2) * 100;
|
||||
var order_info = "Info";
|
||||
var order_number = this.props.cartId;
|
||||
var key = Globals.PikpayKey;
|
||||
var authenticity_token = Globals.PikpayAuthenticityToken;
|
||||
var digest = sha1(key + order_number + total + "BAM");
|
||||
var rebate_digest = sha1(key + order_number + total + total + "BAM");
|
||||
var deliveryDestination = this.props.deliveryDestination;
|
||||
var city = CartStore.getNameOfThePlace(deliveryDestination.get('place'));
|
||||
var custom = JSON.stringify(
|
||||
{
|
||||
'anonymous_id_string': deliveryDestination.get('anonymous_id_string'),
|
||||
'user_id': deliveryDestination.get('user_id')
|
||||
});
|
||||
|
||||
return (<span></span> /*
|
||||
<button type="button" onClick={this._onPikpayClick} disabled={this.props.disabled} className="btn mybutton payment-btn">Plati karticom
|
||||
<form id="pikpay_form" action={Globals.PikpayFormUrl} method="post" target="_top">
|
||||
<input type="hidden" name="ch_full_name" value={deliveryDestination.get('name')} />
|
||||
<input type="hidden" name="ch_address" value={deliveryDestination.get('address')} />
|
||||
<input type="hidden" name="ch_city" value={city} />
|
||||
<input type="hidden" name="ch_zip" value={deliveryDestination.get('place')} />
|
||||
<input type="hidden" name="ch_country" value="Bosna i Hercegovina" />
|
||||
<input type="hidden" name="ch_phone" value={deliveryDestination.get('phone')} />
|
||||
<input type="hidden" name="ch_email" value={deliveryDestination.get('email')} />
|
||||
|
||||
<input type="hidden" name="order_info" value={order_info} />
|
||||
<input type="hidden" name="order_number" value={order_number} />
|
||||
<input type="hidden" name="amount" value={total} />
|
||||
<input type="hidden" name="currency" value="BAM" />
|
||||
<input type="hidden" name="original_amount" value={total} />
|
||||
<input type="hidden" name="language" value="hr" />
|
||||
<input type="hidden" name="transaction_type" value="authorize" />
|
||||
<input type="hidden" name="authenticity_token" value={authenticity_token} />
|
||||
<input type="hidden" name="digest" value={digest} />
|
||||
<input type="hidden" name="rebate_digest" value={rebate_digest} />
|
||||
<input type="hidden" name="custom_params" value={custom} />
|
||||
</form>
|
||||
</button> */
|
||||
);
|
||||
},
|
||||
_onPikpayClick: function(e) {
|
||||
CartActions.changeDeliveryDestinationProperty('payment_method', 'pikpay');
|
||||
CartStore.saveDeliveryDestinationAnd(function() {
|
||||
$("#pikpay_form").submit();
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
module.exports = PikpayButton;
|
||||
@@ -34,7 +34,8 @@ var SearchBox = React.createClass({
|
||||
},
|
||||
onKeyPress: function(e) {
|
||||
var enterKeyCode = 13;
|
||||
if(e.which == enterKeyCode) {
|
||||
var whichKey = e.key || e.which;
|
||||
if(whichKey == enterKeyCode) {
|
||||
this.doSearch();
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
@@ -1,5 +1,33 @@
|
||||
.checkout_form_margin {
|
||||
margin-right: 10px !important;
|
||||
margin-left: 10px !important;
|
||||
|
||||
}
|
||||
|
||||
.payment-select-container {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.payment-select-desktop .payment-btn {
|
||||
margin-right: 10px !important;;
|
||||
}
|
||||
|
||||
.payment-select-mobile .payment-btn {
|
||||
margin-bottom: 6px !important;
|
||||
}
|
||||
|
||||
.collapsed-address-container .mybutton {
|
||||
margin-top: 0px !important;
|
||||
width: 240px;
|
||||
}
|
||||
|
||||
.collapsed-address-container-mobile button {
|
||||
margin-bottom: 6px !important;
|
||||
margin-left: 10% !important;
|
||||
margin-right: 10% !important;
|
||||
width: 80% !important;
|
||||
}
|
||||
|
||||
.gift-btn {
|
||||
width: 200px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
@@ -1,95 +1,77 @@
|
||||
@import url(http://fonts.googleapis.com/css?family=Roboto:400,300italic,300,100italic,100,400italic,500,500italic,700italic,700,900,900italic);
|
||||
|
||||
/* site */
|
||||
|
||||
html {
|
||||
overflow-y: scroll;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
body{
|
||||
background: url("https://res.cloudinary.com/du5pdibul/image/upload/v1428813560/bg_prp6pz.jpg") fixed 100% 100% ;
|
||||
background-size: cover ;
|
||||
background-position: center ;
|
||||
background-repeat: no-repeat;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
|
||||
background: url("https://res.cloudinary.com/du5pdibul/image/upload/v1428813560/bg_prp6pz.jpg") fixed 100% 100% ;
|
||||
background-size: cover ;
|
||||
background-position: center ;
|
||||
background-repeat: no-repeat;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
}
|
||||
|
||||
#left-nave {
|
||||
|
||||
background: blue;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
height: 100%;
|
||||
width: 250px;
|
||||
|
||||
}
|
||||
.beba{
|
||||
background: url("https://res.cloudinary.com/du5pdibul/image/upload/v1428813559/beba-bg_wip7kj.png");
|
||||
background-size: cover;
|
||||
background: url("https://res.cloudinary.com/du5pdibul/image/upload/v1428813559/beba-bg_wip7kj.png");
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
html, body { height: 100%; width: 100%; margin: 0; }
|
||||
|
||||
h1 h2 h3 h4 h5{
|
||||
font-family: 'Roboto', sans-serif;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
}
|
||||
|
||||
.col-centered{
|
||||
float: none;
|
||||
margin: 5% auto;
|
||||
float: none;
|
||||
margin: 5% auto;
|
||||
}
|
||||
|
||||
|
||||
.mybutton{
|
||||
background-color: #00a8a8;
|
||||
padding: 6px 11px !important;
|
||||
border-radius: 3px;
|
||||
margin-top: 8px;
|
||||
border: solid #06c3c3 1px;
|
||||
color: #ffffff !important;
|
||||
background-color: #00a8a8;
|
||||
padding: 6px 11px !important;
|
||||
border-radius: 3px;
|
||||
margin-top: 8px;
|
||||
border: solid #06c3c3 1px;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
|
||||
.mybutton:hover {
|
||||
background-color: #06c3c3 !important;
|
||||
padding: 6px 11px !important;
|
||||
color: black !important;
|
||||
border-radius: 3px;
|
||||
margin-top: 8px;
|
||||
border: solid #06c3c3 1px;
|
||||
color: #ffffff !important;
|
||||
background-color: #06c3c3 !important;
|
||||
padding: 6px 11px !important;
|
||||
color: black !important;
|
||||
border-radius: 3px;
|
||||
margin-top: 8px;
|
||||
border: solid #06c3c3 1px;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.add-to-cart-button {
|
||||
background-color: #00a8a8;
|
||||
padding: 6px 11px !important;
|
||||
border-radius: 3px;
|
||||
border: solid #06c3c3 1px;
|
||||
color: #ffffff !important;
|
||||
background-color: #00a8a8;
|
||||
padding: 6px 11px !important;
|
||||
border-radius: 3px;
|
||||
border: solid #06c3c3 1px;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.add-to-cart-button:hover {
|
||||
background-color: #06c3c3 !important;
|
||||
padding: 6px 11px !important;
|
||||
color: black !important;
|
||||
border-radius: 3px;
|
||||
border: solid #06c3c3 1px;
|
||||
color: #ffffff !important;
|
||||
background-color: #06c3c3 !important;
|
||||
padding: 6px 11px !important;
|
||||
color: black !important;
|
||||
border-radius: 3px;
|
||||
border: solid #06c3c3 1px;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
a{
|
||||
font-family: 'Roboto', sans-serif;
|
||||
font-weight: bold;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
font-weight: bold;
|
||||
}
|
||||
.mynav li{
|
||||
display: inline-block;
|
||||
display: inline-block;
|
||||
}
|
||||
.mynav {
|
||||
margin-top: 6px;
|
||||
|
||||
text-align: center;
|
||||
text-align: center;
|
||||
}
|
||||
.mynav a{
|
||||
text-decoration: none;
|
||||
@@ -108,27 +90,24 @@ text-decoration: none;
|
||||
color: #06c3c3;
|
||||
background: none;
|
||||
}
|
||||
|
||||
.mynav li .mybutton {
|
||||
background-color: #00a8a8;
|
||||
padding: 4px 10px !important;
|
||||
margin-top: 6px;
|
||||
display: block;
|
||||
border-radius: 3px;
|
||||
border: solid #06c3c3 1px;
|
||||
color: #ffffff;
|
||||
background-color: #00a8a8;
|
||||
padding: 4px 10px !important;
|
||||
margin-top: 6px;
|
||||
display: block;
|
||||
border-radius: 3px;
|
||||
border: solid #06c3c3 1px;
|
||||
color: #ffffff;
|
||||
}
|
||||
.mynav li .mybutton:hover {
|
||||
background-color: #06c3c3;
|
||||
padding: 4px 10px !important;
|
||||
margin-top: 6px;
|
||||
display: block;
|
||||
border-radius: 3px;
|
||||
border: solid #06c3c3 1px;
|
||||
color: #ffffff;
|
||||
background-color: #06c3c3;
|
||||
padding: 4px 10px !important;
|
||||
margin-top: 6px;
|
||||
display: block;
|
||||
border-radius: 3px;
|
||||
border: solid #06c3c3 1px;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
|
||||
.productbox{
|
||||
cursor: pointer;
|
||||
-moz-box-shadow: 1px 2px 2px #cccccc;
|
||||
@@ -143,219 +122,181 @@ margin-bottom: 35px;
|
||||
height: auto;
|
||||
border-bottom: solid gray 1px;
|
||||
width: 100%;
|
||||
|
||||
|
||||
}
|
||||
.productbox div{
|
||||
padding: 4px 10px;
|
||||
|
||||
|
||||
}
|
||||
.productbox a{
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
|
||||
|
||||
text-decoration: none;
|
||||
}
|
||||
.productbox a:hover{
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
text-decoration: none;
|
||||
text-decoration: underline;
|
||||
|
||||
}
|
||||
.productbox div span{
|
||||
color: black;
|
||||
|
||||
|
||||
|
||||
}
|
||||
#beba{
|
||||
padding-left: 45px;
|
||||
padding-right: 45px;
|
||||
margin-left: -23px;
|
||||
margin-right: -23px;
|
||||
|
||||
padding-left: 45px;
|
||||
padding-right: 45px;
|
||||
margin-left: -23px;
|
||||
margin-right: -23px;
|
||||
}
|
||||
#beba:hover{
|
||||
background: url("https://res.cloudinary.com/du5pdibul/image/upload/v1428813559/beba-bg_wip7kj.png");
|
||||
background-position: center ;
|
||||
background-size: 100% 100%;
|
||||
color: white;
|
||||
background-repeat: no-repeat;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#dijete:hover{
|
||||
background: url("https://res.cloudinary.com/du5pdibul/image/upload/v1428813559/dijete-bg_gff80o.png");
|
||||
background-position: center ;
|
||||
background-size: 100% 100%;
|
||||
color: white;
|
||||
background-repeat: no-repeat;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#dijete:hover a{
|
||||
|
||||
color: white;
|
||||
|
||||
}
|
||||
#mama:hover{
|
||||
background: url("https://res.cloudinary.com/du5pdibul/image/upload/v1428813559/mama-bg_rqbnuo.png");
|
||||
background-position: center ;
|
||||
background-size: 100% 100%;
|
||||
color: white;
|
||||
background-repeat: no-repeat;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#mama:hover a{
|
||||
|
||||
color: white;
|
||||
|
||||
}
|
||||
#madeinbih:hover{
|
||||
background: url("https://res.cloudinary.com/du5pdibul/image/upload/v1428813559/made-in-bih-bg_uusqpm.png");
|
||||
background-position: center ;
|
||||
background-size: 100% 100%;
|
||||
color: white;
|
||||
background-repeat: no-repeat;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#madeinbih:hover a{
|
||||
|
||||
color: white;
|
||||
|
||||
}
|
||||
#onama:hover{
|
||||
background: url("https://res.cloudinary.com/du5pdibul/image/upload/v1428813559/made-in-bih-bg_uusqpm.png");
|
||||
background-position: center ;
|
||||
background-size: 100% 100%;
|
||||
color: white;
|
||||
background-repeat: no-repeat;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#onama:hover a{
|
||||
|
||||
color: white;
|
||||
|
||||
}
|
||||
|
||||
|
||||
#marka:hover{
|
||||
background: url("https://res.cloudinary.com/du5pdibul/image/upload/v1428813559/marka-bg_cy8hpe.png");
|
||||
background-position: center ;
|
||||
background-size: 100% 100%;
|
||||
color: white;
|
||||
background-repeat: no-repeat;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#marka:hover a{
|
||||
|
||||
color: white;
|
||||
|
||||
}
|
||||
#akcija:hover{
|
||||
background: url("https://res.cloudinary.com/du5pdibul/image/upload/v1428813559/akcija-bg_xtawus.png");
|
||||
background-position: center ;
|
||||
background-size: 100% 100%;
|
||||
color: white;
|
||||
background-repeat: no-repeat;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#akcija:hover a{
|
||||
|
||||
color: white;
|
||||
|
||||
}
|
||||
|
||||
.mydropdown li:hover .sub-menu {
|
||||
visibility: visible;
|
||||
display: block;
|
||||
visibility: visible;
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
.mydropdown:hover .dropdown-menu {
|
||||
display: block;
|
||||
visibility: visible;
|
||||
display: block;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.navbar-default{
|
||||
color: black;
|
||||
background-color: white;
|
||||
border-color: lightgray;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a{
|
||||
color:black;
|
||||
|
||||
color:black;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav > li{
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.navbar-default .navbar-nav > li > a:focus{
|
||||
background-color: rgba(255, 255, 255, 0.6) !important;
|
||||
-moz-box-shadow: 0px 0px 2px #999;
|
||||
background-color: rgba(255, 255, 255, 0.6) !important;
|
||||
-moz-box-shadow: 0px 0px 2px #999;
|
||||
-webkit-box-shadow: 0px 0px 2px #999;
|
||||
box-shadow: 0px 0px 2px #999;
|
||||
|
||||
border: none !important;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav > .dropdown > a .caret{
|
||||
border-top-color: #fff;
|
||||
border-bottom-color: #fff;
|
||||
border-top-color: #fff;
|
||||
border-bottom-color: #fff;
|
||||
}
|
||||
.navbar-default .navbar-brand{
|
||||
color:#fff;
|
||||
color:#fff;
|
||||
}
|
||||
.menu-large {
|
||||
position: static !important;
|
||||
position: static !important;
|
||||
}
|
||||
.megamenu{
|
||||
padding: 20px 0px;
|
||||
width:94%;
|
||||
margin-left: 3%;
|
||||
border-top: none !important;
|
||||
-moz-box-shadow: 0px 1px 2px #999;
|
||||
padding: 20px 0px;
|
||||
width:94%;
|
||||
margin-left: 3%;
|
||||
border-top: none !important;
|
||||
-moz-box-shadow: 0px 1px 2px #999;
|
||||
-webkit-box-shadow: 0px 1px 2px #999;
|
||||
box-shadow: 0px 1px 2px #999;
|
||||
}
|
||||
.megamenu> li > ul {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.megamenu> li > ul > li {
|
||||
list-style: none;
|
||||
padding-left: 10px;
|
||||
list-style: none;
|
||||
padding-left: 10px;
|
||||
}
|
||||
.megamenu> li > ul > li > a {
|
||||
display: block;
|
||||
padding: 3px 20px;
|
||||
clear: both;
|
||||
font-weight: normal;
|
||||
line-height: 1.428571429;
|
||||
color: black;
|
||||
white-space: normal;
|
||||
display: block;
|
||||
padding: 3px 20px;
|
||||
clear: both;
|
||||
font-weight: normal;
|
||||
line-height: 1.428571429;
|
||||
color: black;
|
||||
white-space: normal;
|
||||
}
|
||||
.megamenu> li ul > li > a:hover,
|
||||
.megamenu> li ul > li > a:focus {
|
||||
text-decoration: none;
|
||||
color: #262626;
|
||||
background-color: #f5f5f5;
|
||||
text-decoration: none;
|
||||
color: #262626;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.megamenu.disabled > a,
|
||||
.megamenu.disabled > a:hover,
|
||||
.megamenu.disabled > a:focus {
|
||||
color: #999999;
|
||||
color: #999999;
|
||||
}
|
||||
.megamenu.disabled > a:hover,
|
||||
.megamenu.disabled > a:focus {
|
||||
text-decoration: none;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
cursor: not-allowed;
|
||||
text-decoration: none;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.megamenu.dropdown-header {
|
||||
color: #428bca;
|
||||
font-size: 18px;
|
||||
|
||||
color: #428bca;
|
||||
font-size: 18px;
|
||||
}
|
||||
.dropdown-header p {
|
||||
border-bottom: solid 1.5px lightgray !important;
|
||||
@@ -363,193 +304,188 @@ margin-bottom: 2px;
|
||||
text-transform: uppercase;
|
||||
color: black;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
}
|
||||
.mycart{
|
||||
position: absolute;
|
||||
position: absolute;
|
||||
background: url("https://res.cloudinary.com/du5pdibul/image/upload/v1428813559/cart-icon_p9u63r.png");
|
||||
background-position: center center;
|
||||
background-size: cover;
|
||||
|
||||
background-repeat: no-repeat;
|
||||
width: 42px;
|
||||
height: 44px;
|
||||
padding-bottom: 0px;
|
||||
right:-14px;
|
||||
bottom: -15px;
|
||||
text-align: right;
|
||||
|
||||
background-repeat: no-repeat;
|
||||
width: 42px;
|
||||
height: 44px;
|
||||
padding-bottom: 0px;
|
||||
right:-14px;
|
||||
bottom: -15px;
|
||||
text-align: right;
|
||||
}
|
||||
.mycart div {
|
||||
text-align: right;
|
||||
text-align: right;
|
||||
}
|
||||
.mycart span{
|
||||
position: absolute;
|
||||
left: 13.4px;
|
||||
top: 4px;
|
||||
color: #ffffff;
|
||||
|
||||
}
|
||||
.mycart span:hover{
|
||||
|
||||
color: white;
|
||||
}
|
||||
#myhome{
|
||||
border-bottom: solid #06c3c3 1px;
|
||||
border-bottom: solid #06c3c3 1px;
|
||||
}
|
||||
#myhome-hover:hover {
|
||||
border-bottom: solid #06c3c3 1px;
|
||||
|
||||
#myhome-hover:hover {
|
||||
border-bottom: solid #06c3c3 1px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.sidebar ul{
|
||||
list-style: none;
|
||||
list-style: none;
|
||||
}
|
||||
.sidebar li{
|
||||
margin-left:10px;
|
||||
margin-bottom: 5px;
|
||||
color:black;
|
||||
padding: 10px;
|
||||
border-bottom: solid 1px lightgray;
|
||||
|
||||
margin-left:10px;
|
||||
margin-bottom: 5px;
|
||||
color:black;
|
||||
padding: 10px;
|
||||
border-bottom: solid 1px lightgray;
|
||||
}
|
||||
.sidebar li a{
|
||||
text-decoration: none;
|
||||
color:black;
|
||||
color:black;
|
||||
}
|
||||
.sidebar li a:hover{
|
||||
|
||||
color:#06c3c3;
|
||||
color:#06c3c3;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.megamenu{
|
||||
margin-left: 0 ;
|
||||
margin-right: 0 ;
|
||||
}
|
||||
.megamenu> li {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.megamenu> li:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.megamenu.dropdown-header {
|
||||
padding: 3px 15px !important;
|
||||
|
||||
}
|
||||
.navbar-nav .open .dropdown-menu .dropdown-header{
|
||||
color:#fff;
|
||||
}
|
||||
.megamenu{
|
||||
margin-left: 0 ;
|
||||
margin-right: 0 ;
|
||||
}
|
||||
.megamenu> li {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.megamenu> li:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.megamenu.dropdown-header {
|
||||
padding: 3px 15px !important;
|
||||
}
|
||||
.navbar-nav .open .dropdown-menu .dropdown-header{
|
||||
color:#fff;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
.navbar-header {
|
||||
float: none;
|
||||
}
|
||||
.navbar-toggle {
|
||||
display: block;
|
||||
|
||||
}
|
||||
.navbar-collapse {
|
||||
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
|
||||
border-top:none !important;
|
||||
}
|
||||
.navbar-collapse.collapse {
|
||||
display: none!important;
|
||||
}
|
||||
|
||||
.navbar-nav>li {
|
||||
float: none;
|
||||
|
||||
}
|
||||
.navbar-nav>ul {
|
||||
margin-bottom: 0px;
|
||||
|
||||
}
|
||||
.navbar-nav>li>a {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
|
||||
}
|
||||
.navbar-text {
|
||||
float: none;
|
||||
margin: 15px 0;
|
||||
}
|
||||
/* since 3.1.0 */
|
||||
.navbar-collapse.collapse.in {
|
||||
display: block!important;
|
||||
}
|
||||
.collapsing {
|
||||
overflow: hidden!important;
|
||||
}
|
||||
.navbar-header {
|
||||
float: none;
|
||||
}
|
||||
.navbar-toggle {
|
||||
display: block;
|
||||
}
|
||||
.navbar-collapse {
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
|
||||
border-top:none !important;
|
||||
}
|
||||
.navbar-collapse.collapse {
|
||||
display: none!important;
|
||||
}
|
||||
.navbar-nav>li {
|
||||
float: none;
|
||||
}
|
||||
.navbar-nav>ul {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.navbar-nav>li>a {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.navbar-text {
|
||||
float: none;
|
||||
margin: 15px 0;
|
||||
}
|
||||
/* since 3.1.0 */
|
||||
.navbar-collapse.collapse.in {
|
||||
display: block!important;
|
||||
}
|
||||
.collapsing {
|
||||
overflow: hidden!important;
|
||||
}
|
||||
}
|
||||
|
||||
.error-message {
|
||||
color: red;
|
||||
color: red;
|
||||
}
|
||||
|
||||
.white_button{
|
||||
background-color: #f9f9f9;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
padding-bottom: 7px;
|
||||
/*display: block;*/
|
||||
border-radius: 1px;
|
||||
margin-top: 8px;
|
||||
border: solid #cccccc 1px;
|
||||
color: #4d4d4d !important;
|
||||
font-size: 16px;
|
||||
background-color: #f9f9f9;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
padding-bottom: 7px;
|
||||
/*display: block;*/
|
||||
border-radius: 1px;
|
||||
margin-top: 8px;
|
||||
border: solid #cccccc 1px;
|
||||
color: #4d4d4d !important;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
background-color: #efefef;
|
||||
border-radius: 0px;
|
||||
border: 1px solid #cccccc;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
background-color: #efefef;
|
||||
border-radius: 0px;
|
||||
border: 1px solid #cccccc;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.search-button {
|
||||
background-color: #f9f9f9;
|
||||
color: #31b8b8;
|
||||
border: 1px solid #cccccc;
|
||||
border-radius: 0px;
|
||||
margin-left: 5px;
|
||||
background-color: #f9f9f9;
|
||||
color: #31b8b8;
|
||||
border: 1px solid #cccccc;
|
||||
border-radius: 0px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.qty-box {
|
||||
background-color: #efefef;
|
||||
border-radius: 0px;
|
||||
border: 1px solid #cccccc;
|
||||
background-color: #efefef;
|
||||
border-radius: 0px;
|
||||
border: 1px solid #cccccc;
|
||||
}
|
||||
|
||||
.left-inner-addon {
|
||||
position: relative;
|
||||
position: relative;
|
||||
}
|
||||
.left-inner-addon input {
|
||||
padding-left: 30px;
|
||||
padding-left: 30px;
|
||||
}
|
||||
.left-inner-addon i {
|
||||
position: absolute;
|
||||
padding: 10px 12px;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
padding: 10px 12px;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.cart-title {
|
||||
font-size: 29px;
|
||||
color: #06c3c3;
|
||||
font-size: 29px;
|
||||
color: #06c3c3;
|
||||
}
|
||||
|
||||
.footer {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
bottom: 20px;
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
bottom: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.message {
|
||||
font-size: 130%;
|
||||
text-align: left;
|
||||
margin-left: 20px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.payment {
|
||||
box-sizing: border-box;
|
||||
color: rgb(102, 102, 102);
|
||||
display: block;
|
||||
font-family: Helvetica, arial, nimbussansl, liberationsans, freesans, clean, sans-serif, 'Segoe UI Emoji', 'Segoe UI Symbol';
|
||||
font-size: 13px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
font-weight: normal;
|
||||
height: 36px;
|
||||
line-height: 18.2px;
|
||||
width: 708px;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.message {
|
||||
@@ -568,3 +504,4 @@ text-decoration: none;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
@@ -1,8 +1,11 @@
|
||||
var conversionRate = 0.51;
|
||||
|
||||
module.exports = {
|
||||
ApiUrl: '@@apiEndpoint',
|
||||
DefaultPageSize: 24,
|
||||
ItemGroupIdOfStartPage: "1",
|
||||
ItemGroupIdOfEmptyCartPage: "1",
|
||||
BamToEuroConversionRate: conversionRate,
|
||||
FormatCurrency: function(amount_s) {
|
||||
var amount = parseFloat(amount_s);
|
||||
return (amount.toFixed(2) + " KM")
|
||||
@@ -11,7 +14,19 @@ module.exports = {
|
||||
var amount = parseFloat(amount_s);
|
||||
return (amount.toFixed(2) + "%")
|
||||
},
|
||||
ConvertToEuro: function(amount_s) {
|
||||
amount = amount_s * conversionRate;
|
||||
return amount.toFixed(2);
|
||||
},
|
||||
IsUrlAbsolute: function(url) {
|
||||
var r = new RegExp('^(?:[a-z]+:)?//', 'i');
|
||||
return r.test(url);
|
||||
},
|
||||
MaxNumberOfItemsToBeAdded: 1000,
|
||||
PaypalId: "W7GKS2Q9ZGLGY",
|
||||
PikpayFormUrl: "https://ipgtest.pikpay.ba/form",
|
||||
PikpayAuthenticityToken: "1bb1eea16bd6492c01262636897c0c2e3291a1ab",
|
||||
PikpayKey: "Ribica",
|
||||
|
||||
Slugify: function(text) {
|
||||
return text.toString().toLowerCase()
|
||||
|
||||
@@ -14,9 +14,9 @@ var DeliveryDestination = Backbone.Model.extend({
|
||||
},
|
||||
|
||||
url: Globals.ApiUrl + '/cart/delivery_destination',
|
||||
defaults: {
|
||||
defaults: {
|
||||
count: 0
|
||||
}
|
||||
});
|
||||
|
||||
module.exports = DeliveryDestination;
|
||||
module.exports = DeliveryDestination;
|
||||
|
||||
@@ -48,8 +48,8 @@ var router = Router.create({
|
||||
location: Router.HistoryLocation
|
||||
});
|
||||
|
||||
router.run(function (Handler, state) {
|
||||
|
||||
router.run(function (Handler, state) {
|
||||
|
||||
|
||||
});
|
||||
|
||||
|
||||
@@ -10,6 +10,7 @@ var DeliveryDestination = require('../models/deliveryDestination');
|
||||
var OrderConfirmation = require('../models/orderConfirmation');
|
||||
var Place = require('../models/place');
|
||||
var Validation = require('../utils/validation');
|
||||
var Cart = require('../models/cart');
|
||||
|
||||
var _ = require('underscore');
|
||||
|
||||
@@ -23,11 +24,12 @@ var _deliveryDestination = new DeliveryDestination();
|
||||
var _deliveryDestinationErrors = {};
|
||||
var _deliveryCosts = new Place({
|
||||
postalCode: _deliveryDestination.get('place')
|
||||
})
|
||||
});
|
||||
|
||||
var _cart = new Cart();
|
||||
|
||||
var _addressColapsed = false;
|
||||
|
||||
|
||||
var supportedPlaces = [{
|
||||
"code": "-12",
|
||||
"placeLabel": "Izaberite mjesto"
|
||||
@@ -37,7 +39,7 @@ var supportedPlaces = [{
|
||||
}, {
|
||||
"code": " 71000",
|
||||
"placeLabel": "Sarajevo"
|
||||
},
|
||||
},
|
||||
{
|
||||
"code": " 78000",
|
||||
"placeLabel": "Banja Luka"
|
||||
@@ -50,7 +52,7 @@ var supportedPlaces = [{
|
||||
{
|
||||
"code": " 88000",
|
||||
"placeLabel": "Mostar"
|
||||
},
|
||||
},
|
||||
|
||||
{
|
||||
"code": " 72000",
|
||||
@@ -2569,30 +2571,31 @@ var nameOfThePlace = function(code) {
|
||||
}
|
||||
|
||||
var loadCart = function() {
|
||||
_cart.fetch({success: function() {
|
||||
_itemsInCart.fetch({
|
||||
success: function() {
|
||||
states = {}
|
||||
for (var i = 0; i < _itemsInCart.models.length; i++) {
|
||||
var itemInCart = _itemsInCart.models[i];
|
||||
states[itemInCart.get('item_id')] = itemInCart;
|
||||
}
|
||||
_itemsForDisplay.fetch({
|
||||
success: function() {
|
||||
CartActions.dataLoaded();
|
||||
|
||||
_itemsInCart.fetch({
|
||||
success: function() {
|
||||
states = {}
|
||||
for (var i = 0; i < _itemsInCart.models.length; i++) {
|
||||
var itemInCart = _itemsInCart.models[i];
|
||||
states[itemInCart.get('item_id')] = itemInCart;
|
||||
}
|
||||
_itemsForDisplay.fetch({
|
||||
success: function() {
|
||||
CartActions.dataLoaded();
|
||||
|
||||
_deliveryDestination.fetch({
|
||||
success: function() {
|
||||
validateDeliveryDestinationForm();
|
||||
collapseAddressIfNeeded();
|
||||
fetchPlace();
|
||||
CartActions.dataLoaded();
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
_deliveryDestination.fetch({
|
||||
success: function() {
|
||||
validateDeliveryDestinationForm();
|
||||
collapseAddressIfNeeded();
|
||||
fetchPlace();
|
||||
CartActions.dataLoaded();
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}});
|
||||
|
||||
_cartDataLoadCalled = true;
|
||||
};
|
||||
@@ -2606,8 +2609,10 @@ var collapseAddressIfNeeded = function() {
|
||||
}
|
||||
|
||||
var fetchPlace = function() {
|
||||
postalCode = _deliveryDestination.get('gift') ? _deliveryDestination.get('recipient_place') : _deliveryDestination.get('place');
|
||||
|
||||
_deliveryCosts = new Place({
|
||||
postalCode: _deliveryDestination.get('place')
|
||||
postalCode: postalCode
|
||||
})
|
||||
_deliveryCosts.fetch({
|
||||
success: function() {
|
||||
@@ -2696,13 +2701,13 @@ var addNItems = function(item, count) {
|
||||
var changeDeliveryDestinationProperty = function(property, value) {
|
||||
_deliveryDestination.set(property, value);
|
||||
|
||||
if (property === 'place') {
|
||||
if (property === 'place' || property === 'recipient_place' || property === 'gift') {
|
||||
fetchPlace();
|
||||
}
|
||||
|
||||
validateDeliveryDestinationForm();
|
||||
};
|
||||
|
||||
|
||||
var confirmOrder = function() {
|
||||
|
||||
var oc = new OrderConfirmation({
|
||||
@@ -2719,14 +2724,20 @@ var confirmOrder = function() {
|
||||
});
|
||||
};
|
||||
|
||||
var saveDeliveryDestinationAnd = function(successCallback) {
|
||||
_deliveryDestination.save(null, {
|
||||
success: function() {
|
||||
successCallback();
|
||||
}
|
||||
})
|
||||
};
|
||||
|
||||
var saveDeliveryDestination = function() {
|
||||
_deliveryDestination.save(null, {
|
||||
success: function() {
|
||||
|
||||
confirmOrder();
|
||||
}
|
||||
})
|
||||
success: function() {
|
||||
confirmOrder();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
var validateDeliveryDestinationForm = function() {
|
||||
@@ -2757,7 +2768,34 @@ var validateDeliveryDestinationForm = function() {
|
||||
_deliveryDestinationErrors['place'] = "Mjesto mora biti izabrano";
|
||||
}
|
||||
|
||||
if(_deliveryDestination.get('gift')) {
|
||||
if (Validation.safeString(_deliveryDestination.get('recipient_name')).search(nameRegex) < 0) {
|
||||
_deliveryDestinationErrors['recipient_name'] = "I prezime i ime su obavezni";
|
||||
}
|
||||
|
||||
if (Validation.safeString(_deliveryDestination.get('recipient_address')).search(addressRegex) < 0) {
|
||||
_deliveryDestinationErrors['recipient_address'] = "Adresa mora biti ispravna";
|
||||
}
|
||||
|
||||
if (_deliveryDestination.get('recipient_email') && Validation.safeString(_deliveryDestination.get('recipient_email')).search(emailRegex) < 0) {
|
||||
_deliveryDestinationErrors['recipient_email'] = "Email mora biti ispravno upisan";
|
||||
}
|
||||
|
||||
if (Validation.safeString(_deliveryDestination.get('recipient_phone')).search(phoneRegex) < 0) {
|
||||
_deliveryDestinationErrors['recipient_phone'] = "Telefon mora biti ispravan";
|
||||
}
|
||||
|
||||
if (Validation.safeString(_deliveryDestination.get('recipient_place')).search(placeRegex) < 0) {
|
||||
_deliveryDestinationErrors['recipient_place'] = "Mjesto mora biti izabrano";
|
||||
}
|
||||
}
|
||||
|
||||
var requiredFields = ["name", "email", "place", 'address', 'phone'];
|
||||
|
||||
if(_deliveryDestination.get('gift')) {
|
||||
requiredFields = requiredFields.concat(["recipient_name", "recipient_place", 'recipient_address', 'recipient_phone']);
|
||||
}
|
||||
|
||||
for (var i in requiredFields) {
|
||||
var value = _deliveryDestination.get(requiredFields[i]);
|
||||
if (value === undefined || value === null || value === "") {
|
||||
@@ -2768,10 +2806,14 @@ var validateDeliveryDestinationForm = function() {
|
||||
|
||||
}
|
||||
|
||||
|
||||
var isDeliveryDestinationValid = function() {
|
||||
return Object.getOwnPropertyNames(_deliveryDestinationErrors).length === 0;
|
||||
}
|
||||
return Object.getOwnPropertyNames(_deliveryDestinationErrors).length === 0;
|
||||
}
|
||||
|
||||
var getDeliveryCostTarget = function() {
|
||||
return _deliveryDestination.get("gift") ? "recipient_place" : "place";
|
||||
}
|
||||
|
||||
// Extend CartStore with EventEmitter to add eventing capabilities
|
||||
var CartStore = _.extend({}, EventEmitter.prototype, {
|
||||
|
||||
@@ -2792,6 +2834,29 @@ var CartStore = _.extend({}, EventEmitter.prototype, {
|
||||
return supportedPlaces;
|
||||
},
|
||||
|
||||
getAmount: function() {
|
||||
var counts = states;
|
||||
|
||||
var total = 0;
|
||||
|
||||
if (counts && _itemsForDisplay) {
|
||||
var items = _itemsForDisplay.models;
|
||||
for (var i = 0; i < items.length; i++) {
|
||||
var item = items[i];
|
||||
var count = counts[item.get('id')].get('count');
|
||||
var price = item.get('list_price');
|
||||
total += (price * count)
|
||||
};
|
||||
}
|
||||
|
||||
return total;
|
||||
},
|
||||
|
||||
getDeliveryCost: function(instantDelivery) {
|
||||
return instantDelivery ? Number(_deliveryCosts.get('instant_delivery_price'))
|
||||
: Number(_deliveryCosts.get('delivery_price'));
|
||||
},
|
||||
|
||||
getWholeCartState: function() {
|
||||
|
||||
var numberOfItems = 0;
|
||||
@@ -2813,7 +2878,10 @@ var CartStore = _.extend({}, EventEmitter.prototype, {
|
||||
deliveryDestinationErrors: _deliveryDestinationErrors,
|
||||
isDeliveryDestinationValid: isDeliveryDestinationValid(),
|
||||
deliveryCosts: _deliveryCosts,
|
||||
destinationValid: isDeliveryDestinationValid()
|
||||
destinationValid: isDeliveryDestinationValid(),
|
||||
address_colapsed: _addressColapsed,
|
||||
deliveryCostsTarget: getDeliveryCostTarget(),
|
||||
cart: _cart
|
||||
};
|
||||
return state;
|
||||
},
|
||||
@@ -2850,6 +2918,14 @@ var CartStore = _.extend({}, EventEmitter.prototype, {
|
||||
address.push(_deliveryDestination.get('email'))
|
||||
|
||||
return address;
|
||||
},
|
||||
|
||||
getNameOfThePlace: function(code) {
|
||||
return nameOfThePlace(code);
|
||||
},
|
||||
|
||||
saveDeliveryDestinationAnd: function(successCallback) {
|
||||
saveDeliveryDestinationAnd(successCallback);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>ribica.ba - ispunjava zelje</title>
|
||||
<title>ribica.ba - prvi online shop sa dostavom u BiH za mame i bebe - kupite igracke, pelene i ostalo</title>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
@@ -31,6 +31,7 @@
|
||||
"react": "~0.12.2",
|
||||
"react-google-analytics": "^0.2.0",
|
||||
"react-router": "~0.11.6",
|
||||
"sha1": "^1.1.1",
|
||||
"superagent": "~0.21.0"
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user