We will be off from 27/1 (Monday) to 31/1 (Friday) (GMT +7) for our Tet Holiday (Lunar New Year) in our country

Commit d250d98a authored by Rik ter Beek's avatar Rik ter Beek

Use adyen card name instead of magento. fix issues with oneclick and card...

Use adyen card name instead of magento. fix issues with oneclick and card payments. Use onValid and onError instead of onChange event and hide submit button fixes for oneclick and cc
parent 5ad42460
...@@ -67,8 +67,8 @@ class CcAuthorizationDataBuilder implements BuilderInterface ...@@ -67,8 +67,8 @@ class CcAuthorizationDataBuilder implements BuilderInterface
// If ccType is set use this. For bcmc you need bcmc otherwise it will fail // If ccType is set use this. For bcmc you need bcmc otherwise it will fail
$request['paymentMethod']['type'] = "scheme"; $request['paymentMethod']['type'] = "scheme";
if ($payment->getAdditionalInformation(AdyenCcDataAssignObserver::CC_TYPE)) { if ($payment->getAdditionalInformation(AdyenCcDataAssignObserver::VARIANT)) {
$request['paymentMethod']['type'] = $payment->getAdditionalInformation(AdyenCcDataAssignObserver::CC_TYPE); $request['paymentMethod']['type'] = $payment->getAdditionalInformation(AdyenCcDataAssignObserver::VARIANT);
} }
if ($cardNumber = $payment->getAdditionalInformation(AdyenCcDataAssignObserver::CREDIT_CARD_NUMBER)) { if ($cardNumber = $payment->getAdditionalInformation(AdyenCcDataAssignObserver::CREDIT_CARD_NUMBER)) {
......
...@@ -39,6 +39,7 @@ class AdyenCcDataAssignObserver extends AbstractDataAssignObserver ...@@ -39,6 +39,7 @@ class AdyenCcDataAssignObserver extends AbstractDataAssignObserver
const EXPIRY_MONTH = 'expiryMonth'; const EXPIRY_MONTH = 'expiryMonth';
const EXPIRY_YEAR = 'expiryYear'; const EXPIRY_YEAR = 'expiryYear';
const HOLDER_NAME = 'holderName'; const HOLDER_NAME = 'holderName';
const VARIANT = 'variant';
/** /**
* @var array * @var array
...@@ -51,7 +52,8 @@ class AdyenCcDataAssignObserver extends AbstractDataAssignObserver ...@@ -51,7 +52,8 @@ class AdyenCcDataAssignObserver extends AbstractDataAssignObserver
self::SECURITY_CODE, self::SECURITY_CODE,
self::EXPIRY_MONTH, self::EXPIRY_MONTH,
self::EXPIRY_YEAR, self::EXPIRY_YEAR,
self::HOLDER_NAME self::HOLDER_NAME,
self::VARIANT
]; ];
/** /**
......
...@@ -34,6 +34,7 @@ class AdyenOneclickDataAssignObserver extends AbstractDataAssignObserver ...@@ -34,6 +34,7 @@ class AdyenOneclickDataAssignObserver extends AbstractDataAssignObserver
const RECURRING_DETAIL_REFERENCE = 'recurring_detail_reference'; const RECURRING_DETAIL_REFERENCE = 'recurring_detail_reference';
const SECURITY_CODE = 'cvc'; const SECURITY_CODE = 'cvc';
const NUMBER_OF_INSTALLMENTS = 'number_of_installments'; const NUMBER_OF_INSTALLMENTS = 'number_of_installments';
const VARIANT = 'variant';
/** /**
* @var array * @var array
...@@ -41,7 +42,8 @@ class AdyenOneclickDataAssignObserver extends AbstractDataAssignObserver ...@@ -41,7 +42,8 @@ class AdyenOneclickDataAssignObserver extends AbstractDataAssignObserver
protected $additionalInformationList = [ protected $additionalInformationList = [
self::RECURRING_DETAIL_REFERENCE, self::RECURRING_DETAIL_REFERENCE,
self::SECURITY_CODE, self::SECURITY_CODE,
self::NUMBER_OF_INSTALLMENTS self::NUMBER_OF_INSTALLMENTS,
self::VARIANT
]; ];
/** /**
......
...@@ -54,7 +54,9 @@ define( ...@@ -54,7 +54,9 @@ define(
'expiryYear', 'expiryYear',
'setStoreCc', 'setStoreCc',
'installment', 'installment',
'creditCardDetailsValid' 'creditCardDetailsValid',
'variant',
'placeOrderAllowed'
]); ]);
return this; return this;
...@@ -68,10 +70,8 @@ define( ...@@ -68,10 +70,8 @@ define(
*/ */
renderSecureFields: function() { renderSecureFields: function() {
var self = this; var self = this;
self.placeOrderAllowed(false);
self.creditCardOwner.subscribe(function () {
self.updateButton();
});
installments.setInstallments(0); installments.setInstallments(0);
...@@ -134,26 +134,23 @@ define( ...@@ -134,26 +134,23 @@ define(
}else{ }else{
self.creditCardType("") self.creditCardType("")
} }
if (state.isValid) {
// Here we enable the button if the component is now valid
self.creditCardNumber(state.data.encryptedCardNumber);
self.expiryMonth(state.data.encryptedExpiryMonth);
self.expiryYear(state.data.encryptedExpiryYear);
self.securityCode(state.data.encryptedSecurityCode);
self.creditCardDetailsValid(true);
}else{
self.creditCardDetailsValid(false);
}
self.updateButton();
}, },
onError: function() {} onValid: function(state) {
self.variant(state.brand);
self.creditCardNumber(state.data.encryptedCardNumber);
self.expiryMonth(state.data.encryptedExpiryMonth);
self.expiryYear(state.data.encryptedExpiryYear);
self.securityCode(state.data.encryptedSecurityCode);
self.creditCardDetailsValid(true);
self.placeOrderAllowed(true);
},
onError: function(state) {
self.creditCardDetailsValid(false);
self.placeOrderAllowed(false);
}
}); });
card.mount(cardNode); card.mount(cardNode);
self.isPlaceOrderActionAllowed(false);
}, },
/** /**
* Builds the payment details part of the payment information reqeust * Builds the payment details part of the payment information reqeust
...@@ -164,6 +161,7 @@ define( ...@@ -164,6 +161,7 @@ define(
return { return {
'method': this.item.method, 'method': this.item.method,
additional_data: { additional_data: {
'card_brand': this.variant(),
'cc_type': this.creditCardType(), 'cc_type': this.creditCardType(),
'number': this.creditCardNumber(), 'number': this.creditCardNumber(),
'cvc': this.securityCode(), 'cvc': this.securityCode(),
...@@ -180,19 +178,7 @@ define( ...@@ -180,19 +178,7 @@ define(
* @returns {boolean} * @returns {boolean}
*/ */
isButtonActive: function() { isButtonActive: function() {
return this.isActive() && this.getCode() == this.isChecked() && this.isPlaceOrderActionAllowed(); return this.isActive() && this.getCode() == this.isChecked() && this.isPlaceOrderActionAllowed() && this.placeOrderAllowed();
},
/**
* Checks if the pay button can be enabled and enables if can
*/
updateButton: function() {
var self = this;
if (self.isCardOwnerValid() && self.isCreditCardDetailsValid()) {
self.isPlaceOrderActionAllowed(true);
} else {
self.isPlaceOrderActionAllowed(false);
}
}, },
/** /**
* Custom place order function * Custom place order function
......
...@@ -142,8 +142,12 @@ define( ...@@ -142,8 +142,12 @@ define(
'creditCardExpMonth': ko.observable(creditCardExpMonth), 'creditCardExpMonth': ko.observable(creditCardExpMonth),
'creditCardExpYear': ko.observable(creditCardExpYear), 'creditCardExpYear': ko.observable(creditCardExpYear),
'getInstallments': ko.observableArray(installments), 'getInstallments': ko.observableArray(installments),
'placeOrderAllowed': ko.observable(false),
isButtonActive: function() {
return self.isActive() && this.getCode() == self.isChecked() && self.isBillingAgreementChecked() && this.placeOrderAllowed();
},
/** /**
* @override * @override
*/ */
...@@ -203,6 +207,10 @@ define( ...@@ -203,6 +207,10 @@ define(
var hideCVC = false; var hideCVC = false;
if (self.agreement_data.variant == "bcmc") { if (self.agreement_data.variant == "bcmc") {
hideCVC = true; hideCVC = true;
self.placeOrderAllowed(true);
} else if(self.agreement_data.variant == "maestro") {
// for maestro cvc is optional
self.placeOrderAllowed(true);
} }
var oneClickCard = checkout var oneClickCard = checkout
...@@ -236,8 +244,9 @@ define( ...@@ -236,8 +244,9 @@ define(
self.encryptedCreditCardVerificationNumber = ''; self.encryptedCreditCardVerificationNumber = '';
} }
}, },
onValid: function (data) { onValid: function (state) {
if (data.isValid) { if (state.isValid) {
self.placeOrderAllowed(true);
isValid(true); isValid(true);
} else { } else {
isValid(false); isValid(false);
...@@ -245,9 +254,8 @@ define( ...@@ -245,9 +254,8 @@ define(
return; return;
}, },
onError: function(data) { onError: function(data) {
if(data.fieldType == "encryptedSecurityCode" && data.error != "") { self.placeOrderAllowed(false);
isValid(false); isValid(false);
}
return; return;
} }
}) })
...@@ -287,7 +295,7 @@ define( ...@@ -287,7 +295,7 @@ define(
var validate = $(form).validation() && $(form).validation('isValid'); var validate = $(form).validation() && $(form).validation('isValid');
// bcmc does not have any cvc // bcmc does not have any cvc
if (!validate || (isValid() == false && variant() != "bcmc")) { if (!validate || (isValid() == false && variant() != "bcmc" && variant() != "maestro")) {
return false; return false;
} }
......
...@@ -87,7 +87,9 @@ ...@@ -87,7 +87,9 @@
</li> </li>
<!--/ko--> <!--/ko-->
</ul> </ul>
<p class="helper-text" data-bind="css: {hidden: creditCardType() !== ''} "><!-- ko text: $t('(Please provide a card with the type from the list above)')--><!-- /ko --></p> <p class="helper-text" data-bind="css: {hidden: creditCardType() !== ''} ">
<!-- ko text: $t('(Please provide a card with the type from the list above)')-->
<!-- /ko --></p>
<input type="hidden" <input type="hidden"
name="payment[cc_type]" name="payment[cc_type]"
class="input-text" class="input-text"
...@@ -122,12 +124,10 @@ ...@@ -122,12 +124,10 @@
</div> </div>
<div class="field number cardContainerField"> <div class="field number cardContainerField">
<div afterRender="renderSecureFields()" data-bind="attr: { id: 'cardContainer'}" ></div> <div afterRender="renderSecureFields()" data-bind="attr: { id: 'cardContainer'}"></div>
</div> </div>
<!-- ko if: (hasInstallments())--> <!-- ko if: (hasInstallments())-->
<div class="field required" <div class="field required"
...@@ -137,9 +137,9 @@ ...@@ -137,9 +137,9 @@
</label> </label>
<div class="control"> <div class="control">
<select class="select" <select class="select"
name="payment[number_of_installments]" name="payment[number_of_installments]"
data-bind="attr: {id: getCode() + '_installments', 'data-container': getCode() + '-installments', 'data-validate': JSON.stringify({required:false})}, data-bind="attr: {id: getCode() + '_installments', 'data-container': getCode() + '-installments', 'data-validate': JSON.stringify({required:false})},
enable: isActive($parents), enable: isActive($parents),
options: getInstallments, options: getInstallments,
......
...@@ -23,7 +23,6 @@ ...@@ -23,7 +23,6 @@
--> -->
<!-- ko foreach: getAdyenBillingAgreements() --> <!-- ko foreach: getAdyenBillingAgreements() -->
<div class="payment-method" data-bind="css: {'_active': (value == $parent.isBillingAgreementChecked())}"> <div class="payment-method" data-bind="css: {'_active': (value == $parent.isBillingAgreementChecked())}">
...@@ -63,7 +62,6 @@ ...@@ -63,7 +62,6 @@
</div> </div>
<form class="form" action="#" method="post" data-bind=" <form class="form" action="#" method="post" data-bind="
attr: {'id': 'adyen_oneclick_' + value, 'data-role': 'adyen_oneclick_' + value }, attr: {'id': 'adyen_oneclick_' + value, 'data-role': 'adyen_oneclick_' + value },
mageInit: { mageInit: {
...@@ -73,7 +71,8 @@ ...@@ -73,7 +71,8 @@
'orderSaveUrl':$parent.getPlaceOrderUrl(), 'orderSaveUrl':$parent.getPlaceOrderUrl(),
}, 'validation':[]}"> }, 'validation':[]}">
<fieldset data-bind="attr: {class: 'fieldset payment items ccard ' + getCode(), id: 'payment_form_' + $parent.getCode() + '_' + value}"> <fieldset
data-bind="attr: {class: 'fieldset payment items ccard ' + getCode(), id: 'payment_form_' + $parent.getCode() + '_' + value}">
<!-- ko if: agreement_data.card --> <!-- ko if: agreement_data.card -->
...@@ -87,7 +86,7 @@ ...@@ -87,7 +86,7 @@
</div> </div>
<!-- ko if: hasVerification()--> <!-- ko if: hasVerification()-->
<div afterRender="renderSecureCVC()" data-bind="attr: { id: 'cvcContainer-' + value}" ></div> <div afterRender="renderSecureCVC()" data-bind="attr: { id: 'cvcContainer-' + value}"></div>
<!-- /ko --> <!-- /ko -->
<!--/ko--> <!--/ko-->
...@@ -124,21 +123,22 @@ ...@@ -124,21 +123,22 @@
<!-- ko if: number_of_installments.length > 0 --> <!-- ko if: number_of_installments.length > 0 -->
<div class="field required" data-bind="attr: {id: getCode() + '_installments_div'}, visible: getInstallments().length > 0"> <div class="field required"
data-bind="attr: {id: getCode() + '_installments_div'}, visible: getInstallments().length > 0">
<label data-bind="attr: {for: getCode() + '_installments'}" class="label"> <label data-bind="attr: {for: getCode() + '_installments'}" class="label">
<span><!-- ko text: $t('Installments')--><!-- /ko --></span> <span><!-- ko text: $t('Installments')--><!-- /ko --></span>
</label> </label>
<div class="control"> <div class="control">
<select class="select" <select class="select"
name="payment[number_of_installments]" name="payment[number_of_installments]"
data-bind="attr: {id: getCode() + '_installments', 'data-container': getCode() + '-installments', 'data-validate': JSON.stringify({required:false})}, data-bind="attr: {id: getCode() + '_installments', 'data-container': getCode() + '-installments', 'data-validate': JSON.stringify({required:false})},
enable: $parent.isActive($parents), enable: $parent.isActive($parents),
options: getInstallments, options: getInstallments,
optionsValue: 'value', optionsValue: 'value',
optionsText: 'key', optionsText: 'key',
optionsCaption: $t('Do not use Installments'), optionsCaption: $t('Do not use Installments'),
value: installment" value: installment"
data-validate="{required:true}"> data-validate="{required:true}">
</select> </select>
</div> </div>
</div> </div>
...@@ -160,8 +160,7 @@ ...@@ -160,8 +160,7 @@
data-bind=" data-bind="
click: placeOrder, click: placeOrder,
attr: {title: $t('Place Order')}, attr: {title: $t('Place Order')},
enable: (value == $parent.isBillingAgreementChecked()) enable: isButtonActive()"
"
disabled> disabled>
<span data-bind="text: $t('Place Order')"></span> <span data-bind="text: $t('Place Order')"></span>
</button> </button>
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment