From a1200bf22e2270c9564d46a87d806455c2f2a0bb Mon Sep 17 00:00:00 2001 From: Mateus Picoloto <38541352+mateus-picoloto@users.noreply.github.com> Date: Fri, 11 Aug 2023 10:44:24 -0300 Subject: [PATCH] feat: compatibilization with bundle js (#217) --- view/frontend/web/js/core/checkout/Bin.js | 113 +- .../web/js/core/checkout/CreditCardToken.js | 68 +- .../web/js/core/checkout/FormObject.js | 448 +++++ .../web/js/core/checkout/Installments.js | 18 - .../core/checkout/PaymentMethodController.js | 1442 ++++++++--------- .../core/checkout/PaymentModuleBootstrap.js | 104 +- .../web/js/core/checkout/PlatformConfig.js | 163 ++ .../js/core/checkout/PlatformFormBiding.js | 597 ------- .../js/core/checkout/PlatformFormHandler.js | 399 +++-- .../js/core/checkout/PlatformPlaceOrder.js | 27 +- .../js/core/models/BoletoCreditcardModel.js | 375 ++--- .../web/js/core/models/BoletoModel.js | 120 +- .../web/js/core/models/CreditCardModel.js | 235 ++- .../frontend/web/js/core/models/DebitModel.js | 235 ++- view/frontend/web/js/core/models/PixModel.js | 118 +- .../web/js/core/models/TwoCreditcardsModel.js | 406 ++--- .../web/js/core/models/VoucherModel.js | 278 ++-- .../js/core/validators/CreditCardValidator.js | 279 ++-- .../js/core/validators/CustomerValidator.js | 52 +- .../js/core/validators/MultibuyerValidator.js | 123 +- .../core/validators/VoucherCardValidator.js | 109 +- view/frontend/web/js/view/payment/boleto.js | 5 +- .../web/js/view/payment/boletocreditcard.js | 2 +- .../web/js/view/payment/creditcard.js | 2 +- view/frontend/web/js/view/payment/debit.js | 2 +- view/frontend/web/js/view/payment/default.js | 21 +- view/frontend/web/js/view/payment/pix.js | 5 +- .../web/js/view/payment/twocreditcards.js | 5 +- view/frontend/web/js/view/payment/voucher.js | 2 +- 29 files changed, 2870 insertions(+), 2883 deletions(-) create mode 100644 view/frontend/web/js/core/checkout/FormObject.js delete mode 100644 view/frontend/web/js/core/checkout/Installments.js create mode 100644 view/frontend/web/js/core/checkout/PlatformConfig.js delete mode 100644 view/frontend/web/js/core/checkout/PlatformFormBiding.js diff --git a/view/frontend/web/js/core/checkout/Bin.js b/view/frontend/web/js/core/checkout/Bin.js index 5a36f257..65925f5b 100644 --- a/view/frontend/web/js/core/checkout/Bin.js +++ b/view/frontend/web/js/core/checkout/Bin.js @@ -1,65 +1,64 @@ -var Bin = function () { - binValue = '', - brand = '', - checkedBins = [0] - selectedBrand = '' -}; +define(['jquery'], ($) => { + return class Bin { + constructor() { + this.binValue = ''; + this.brand = ''; + this.checkedBins = [0]; + this.selectedBrand = ''; + } + init(newValue) { -Bin.prototype.init = function (newValue) { + const formattedNewValue = this.formatNumber(newValue); - var newValue = this.formatNumber(newValue); + if ( + typeof this.checkedBins != 'undefined' && + typeof this.checkedBins[formattedNewValue] != 'undefined' + ){ + this.binValue = formattedNewValue; + this.selectedBrand = this.checkedBins[formattedNewValue]; + return; + } - if ( - typeof this.checkedBins != 'undefined' && - typeof this.checkedBins[newValue] != 'undefined' - ){ - this.binValue = newValue; - this.selectedBrand = this.checkedBins[newValue]; - return; - } + if (this.validate(formattedNewValue)) { + this.binValue = formattedNewValue; + this.getBrand().done(function (data) { + this.saveBinInformation(data); + }.bind(this)); - if (this.validate(newValue)) { - this.binValue = newValue; - this.getBrand().done(function (data) { - this.saveBinInformation(data); - }.bind(this)); + return; + } - return; - } + this.selectedBrand = ''; + } + formatNumber(number) { + const newValue = String(number); + return newValue.slice(0, 6); + } + validate(newValue) { + if (newValue.length == 6 && this.binValue != newValue) { + return true; + } - this.selectedBrand = ''; -}; + return false; + } + getBrand() { + const bin = this.binValue.slice(0, 6); -Bin.prototype.formatNumber = function (number) { - var newValue = String(number); - return newValue.slice(0, 6); -}; + return $.ajax({ + type: 'GET', + dataType: 'json', + url: 'https://api.mundipagg.com/bin/v1/' + bin, + async: false, + cache: true, + }); + } + saveBinInformation(data) { + if (typeof this.checkedBins == 'undefined') { + this.checkedBins = []; + } -Bin.prototype.validate = function (newValue) { - if (newValue.length == 6 && this.binValue != newValue) { - return true; - } - - return false; -}; - -Bin.prototype.getBrand = function () { - var bin = this.binValue.slice(0, 6); - - return jQuery.ajax({ - type: 'GET', - dataType: 'json', - url: 'https://api.mundipagg.com/bin/v1/' + bin, - async: false, - cache: true, - }); -}; - -Bin.prototype.saveBinInformation = function (data) { - if (typeof this.checkedBins == 'undefined') { - this.checkedBins = []; - } - - this.checkedBins[this.binValue] = data.brand; - this.selectedBrand = data.brand; -}; \ No newline at end of file + this.checkedBins[this.binValue] = data.brand; + this.selectedBrand = data.brand; + } + }; +}); diff --git a/view/frontend/web/js/core/checkout/CreditCardToken.js b/view/frontend/web/js/core/checkout/CreditCardToken.js index fa6faed7..9169724b 100644 --- a/view/frontend/web/js/core/checkout/CreditCardToken.js +++ b/view/frontend/web/js/core/checkout/CreditCardToken.js @@ -1,36 +1,38 @@ -var CreditCardToken = function (formObject, documentNumber = null) { - this.documentNumber = documentNumber; - if (documentNumber != null) { - this.documentNumber = documentNumber.replace(/(\.|\/|\-)/g,""); - } - this.formObject = formObject; -}; - -CreditCardToken.prototype.getDataToGenerateToken = function () { - return { - type: "card", - card : { - holder_name: this.formObject.creditCardHolderName.val(), - number: this.formObject.creditCardNumber.val(), - exp_month: this.formObject.creditCardExpMonth.val(), - exp_year: this.formObject.creditCardExpYear.val(), - cvv: this.formObject.creditCardCvv.val(), - holder_document: this.documentNumber +define([], () => { + return class CreditCardToken { + constructor(formObject, documentNumber = null) { + this.documentNumber = documentNumber; + if (documentNumber != null) { + this.documentNumber = documentNumber.replace(/(\.|\/|\-)/g,""); + } + this.formObject = formObject; } - }; -} - -CreditCardToken.prototype.getToken = function (pkKey) { - var data = this.getDataToGenerateToken(); + getDataToGenerateToken() { + return { + type: "card", + card : { + holder_name: this.formObject.creditCardHolderName.val(), + number: this.formObject.creditCardNumber.val(), + exp_month: this.formObject.creditCardExpMonth.val(), + exp_year: this.formObject.creditCardExpYear.val(), + cvv: this.formObject.creditCardCvv.val(), + holder_document: this.documentNumber + } + }; + } + getToken(pkKey) { + const data = this.getDataToGenerateToken(); - const url = 'https://api.mundipagg.com/core/v1/tokens?appId='; + const url = 'https://api.mundipagg.com/core/v1/tokens?appId='; - return jQuery.ajax({ - type: 'POST', - dataType: 'json', - url: url + pkKey, - async: false, - cache: true, - data - }); -} + return jQuery.ajax({ + type: 'POST', + dataType: 'json', + url: url + pkKey, + async: false, + cache: true, + data + }); + } + } +}); diff --git a/view/frontend/web/js/core/checkout/FormObject.js b/view/frontend/web/js/core/checkout/FormObject.js new file mode 100644 index 00000000..4666a514 --- /dev/null +++ b/view/frontend/web/js/core/checkout/FormObject.js @@ -0,0 +1,448 @@ +define(['jquery'], ($) => { + const FormObject = { + FormObject: {} + }; + + FormObject.creditCardInit = (isMultibuyerEnabled) => { + + FormObject.FormObject = {}; + + const containerSelector = '#pagarme_creditcard-form'; + + if (typeof $(containerSelector).html() == 'undefined') { + FormObject.FormObject = null; + return; + } + + const creditCardForm = { + 'containerSelector' : containerSelector, + "creditCardNumber" : $(containerSelector + " .cc_number"), + "creditCardHolderName" : $(containerSelector + " .cc_owner"), + "creditCardExpMonth" : $(containerSelector + " .cc_exp_month"), + "creditCardExpYear" : $(containerSelector + " .cc_exp_year"), + "creditCardCvv" : $(containerSelector + " .cc_cid"), + "creditCardInstallments" : $(containerSelector + " .cc_installments"), + "creditCardBrand" : $(containerSelector + " .cc_type"), + "creditCardToken" : $(containerSelector + " .cc_token"), + "inputAmount" : $(containerSelector + " .cc_amount"), + "inputAmountContainer" : $(containerSelector + " .amount-container"), + "savedCreditCardSelect" : $(containerSelector + " .cc_saved_creditcards"), + "saveThisCard" : $(containerSelector + " .save_this_card") + }; + + let multibuyerForm = undefined; + if (isMultibuyerEnabled) { + multibuyerForm = { + "showMultibuyer" : $(containerSelector + " .show_multibuyer"), + "firstname" : $(containerSelector + " .multibuyer_firstname"), + "lastname" : $(containerSelector + " .multibuyer_lastname"), + "email" : $(containerSelector + " .multibuyer_email"), + "zipcode" : $(containerSelector + " .multibuyer_zipcode"), + "document" : $(containerSelector + " .multibuyer_document"), + "street" : $(containerSelector + " .multibuyer_street"), + "number" : $(containerSelector + " .multibuyer_number"), + "complement" : $(containerSelector + " .multibuyer_complement"), + "neighborhood" : $(containerSelector + " .multibuyer_neighborhood"), + "city" : $(containerSelector + " .multibuyer_city"), + "state" : $(containerSelector + " .multibuyer_state"), + "homePhone" : $(containerSelector + " .multibuyer_home_phone"), + "mobilePhone" : $(containerSelector + " .multibuyer_mobile_phone") + } + } + + FormObject.FormObject = creditCardForm; + FormObject.FormObject.numberOfPaymentForms = 1; + FormObject.FormObject.multibuyer = multibuyerForm; + FormObject.FormObject.savedCardSelectUsed = 'pagarme_creditcard'; + + return FormObject.FormObject; + }; + + FormObject.voucherInit = (isMultibuyerEnabled) => { + + FormObject.FormObject = {}; + + const containerSelector = '#pagarme_voucher-form'; + + if (typeof $(containerSelector).html() == 'undefined') { + FormObject.FormObject = null; + return; + } + + const voucherForm = { + 'containerSelector' : containerSelector, + "creditCardNumber" : $(containerSelector + " .cc_number"), + "creditCardHolderName" : $(containerSelector + " .cc_owner"), + "creditCardExpMonth" : $(containerSelector + " .cc_exp_month"), + "creditCardExpYear" : $(containerSelector + " .cc_exp_year"), + "creditCardCvv" : $(containerSelector + " .cc_cid"), + "creditCardInstallments" : $(containerSelector + " .cc_installments"), + "creditCardBrand" : $(containerSelector + " .cc_type"), + "creditCardToken" : $(containerSelector + " .cc_token"), + "inputAmount" : $(containerSelector + " .cc_amount"), + "savedCreditCardSelect" : $(containerSelector + " .cc_saved_creditcards"), + "saveThisCard" : $(containerSelector + " .save_this_card") + }; + + let multibuyerForm = undefined; + if (isMultibuyerEnabled) { + multibuyerForm = { + "showMultibuyer" : $(containerSelector + " .show_multibuyer"), + "firstname" : $(containerSelector + " .multibuyer_firstname"), + "lastname" : $(containerSelector + " .multibuyer_lastname"), + "email" : $(containerSelector + " .multibuyer_email"), + "zipcode" : $(containerSelector + " .multibuyer_zipcode"), + "document" : $(containerSelector + " .multibuyer_document"), + "street" : $(containerSelector + " .multibuyer_street"), + "number" : $(containerSelector + " .multibuyer_number"), + "complement" : $(containerSelector + " .multibuyer_complement"), + "neighborhood" : $(containerSelector + " .multibuyer_neighborhood"), + "city" : $(containerSelector + " .multibuyer_city"), + "state" : $(containerSelector + " .multibuyer_state"), + "homePhone" : $(containerSelector + " .multibuyer_home_phone"), + "mobilePhone" : $(containerSelector + " .multibuyer_mobile_phone") + } + } + + FormObject.FormObject = voucherForm; + FormObject.FormObject.numberOfPaymentForms = 1; + FormObject.FormObject.multibuyer = multibuyerForm; + FormObject.FormObject.savedCardSelectUsed = 'pagarme_voucher'; + + return FormObject.FormObject; + }; + + FormObject.getMultibuyerForm = (containerSelector) => { + return { + "showMultibuyer" : $(containerSelector + " .show_multibuyer"), + "firstname" : $(containerSelector + " .multibuyer_firstname"), + "lastname" : $(containerSelector + " .multibuyer_lastname"), + "email" : $(containerSelector + " .multibuyer_email"), + "zipcode" : $(containerSelector + " .multibuyer_zipcode"), + "document" : $(containerSelector + " .multibuyer_document"), + "street" : $(containerSelector + " .multibuyer_street"), + "number" : $(containerSelector + " .multibuyer_number"), + "complement" : $(containerSelector + " .multibuyer_complement"), + "neighborhood" : $(containerSelector + " .multibuyer_neighborhood"), + "city" : $(containerSelector + " .multibuyer_city"), + "state" : $(containerSelector + " .multibuyer_state"), + "homePhone" : $(containerSelector + " .multibuyer_home_phone"), + "mobilePhone" : $(containerSelector + " .multibuyer_mobile_phone") + } + }; + + FormObject.debitInit = (isMultibuyerEnabled) => { + + FormObject.FormObject = {}; + + const containerSelector = '#pagarme_debit-form'; + + if (typeof $(containerSelector).html() == 'undefined') { + FormObject.FormObject = null; + return; + } + + const debitForm = { + 'containerSelector' : containerSelector, + "creditCardNumber" : $(containerSelector + " .cc_number"), + "creditCardHolderName" : $(containerSelector + " .cc_owner"), + "creditCardExpMonth" : $(containerSelector + " .cc_exp_month"), + "creditCardExpYear" : $(containerSelector + " .cc_exp_year"), + "creditCardCvv" : $(containerSelector + " .cc_cid"), + "creditCardInstallments" : $(containerSelector + " .cc_installments"), + "creditCardBrand" : $(containerSelector + " .cc_type"), + "creditCardToken" : $(containerSelector + " .cc_token"), + "inputAmount" : $(containerSelector + " .cc_amount"), + "savedCreditCardSelect" : $(containerSelector + " .cc_saved_creditcards"), + "saveThisCard" : $(containerSelector + " .save_this_card") + }; + + let multibuyerForm = undefined; + if (isMultibuyerEnabled) { + multibuyerForm = FormObject.getMultibuyerForm(containerSelector) + } + + FormObject.FormObject = debitForm; + FormObject.FormObject.numberOfPaymentForms = 1; + FormObject.FormObject.multibuyer = multibuyerForm; + FormObject.FormObject.savedCardSelectUsed = 'pagarme_debit'; + + return FormObject.FormObject; + }; + + FormObject.renameTwoCreditCardsElements = (elements, elementId) => { + const twoCreditCardForm = {}; + + for (let key in elements) { + + const name = elements[key].attr('name'); + + if (name === undefined) { + continue; + } + + let newName = name + '[' + elementId + ']'; + + if (name.match(/\[\d\]/g)) { + newName = name; + } + + elements[key].attr('name', newName); + let elementType = 'input'; + + if (elements[key].is('select')) { + elementType = 'select'; + } + + twoCreditCardForm[key] = $( + elementType + + "[name='" + + newName + + "']" + ); + } + + return twoCreditCardForm; + }; + + FormObject.fillTwoCreditCardsElements = (containerSelector, elementId, isMultibuyerEnabled) => { + + if ($(containerSelector).children().length == 0) { + return; + } + + const elements = { + "creditCardNumber" : $(containerSelector + " .cc_number"), + "creditCardHolderName" : $(containerSelector + " .cc_owner"), + "creditCardExpMonth" : $(containerSelector + " .cc_exp_month"), + "creditCardExpYear" : $(containerSelector + " .cc_exp_year"), + "creditCardCvv" : $(containerSelector + " .cc_cid"), + "creditCardInstallments" : $(containerSelector + " .cc_installments"), + "creditCardBrand" : $(containerSelector + " .cc_type"), + "creditCardToken" : $(containerSelector + " .cc_token"), + "inputAmount" : $(containerSelector + " .cc_amount"), + "inputAmountContainer" : $(containerSelector + " .amount-container"), + "savedCreditCardSelect" : $(containerSelector + " .cc_saved_creditcards"), + "saveThisCard" : $(containerSelector + " .save_this_card") + }; + + let multibuyerForm = undefined; + if (isMultibuyerEnabled) { + multibuyerForm = { + "showMultibuyer" : $(containerSelector + " .show_multibuyer"), + "firstname" : $(containerSelector + " .multibuyer_firstname"), + "lastname" : $(containerSelector + " .multibuyer_lastname"), + "email" : $(containerSelector + " .multibuyer_email"), + "zipcode" : $(containerSelector + " .multibuyer_zipcode"), + "document" : $(containerSelector + " .multibuyer_document"), + "street" : $(containerSelector + " .multibuyer_street"), + "number" : $(containerSelector + " .multibuyer_number"), + "complement" : $(containerSelector + " .multibuyer_complement"), + "neighborhood" : $(containerSelector + " .multibuyer_neighborhood"), + "city" : $(containerSelector + " .multibuyer_city"), + "state" : $(containerSelector + " .multibuyer_state"), + "homePhone" : $(containerSelector + " .multibuyer_home_phone"), + "mobilePhone" : $(containerSelector + " .multibuyer_mobile_phone") + } + } + + FormObject.FormObject[elementId] = + FormObject.renameTwoCreditCardsElements( + elements, + elementId + ); + + FormObject.FormObject[elementId].multibuyer = + FormObject.renameTwoCreditCardsElements( + multibuyerForm, + elementId + ); + + FormObject.FormObject[elementId].containerSelector = containerSelector; + FormObject.FormObject[elementId].savedCardSelectUsed = 'pagarme_two_creditcard'; + + return FormObject.FormObject; + }; + + FormObject.twoCreditCardsInit = (isMultibuyerEnabled) => { + + FormObject.FormObject = {}; + + const containerSelector = []; + containerSelector.push("#pagarme_two_creditcard-form #two-credit-cards-form-0"); + containerSelector.push("#pagarme_two_creditcard-form #two-credit-cards-form-1"); + + + if (typeof $(containerSelector[0]).html() == 'undefined') { + FormObject.FormObject = null; + return; + } + + //Using for for IE compatibility + for (let i = 0, len = containerSelector.length; i < len; i++) { + FormObject.fillTwoCreditCardsElements(containerSelector[i], i, isMultibuyerEnabled); + } + + FormObject.FormObject.numberOfPaymentForms = 2; + + return FormObject.FormObject; + }; + + FormObject.pixInit = (isMultibuyerEnabled) => { + + FormObject.FormObject = {}; + + const containerSelector = '#pagarme_pix-form'; + + if (typeof $(containerSelector).html() == 'undefined') { + FormObject.FormObject = null; + return; + } + + const pixElements = { + 'containerSelector' : containerSelector, + "inputAmount" : $(containerSelector + " .cc_amount"), + "inputAmountContainer" : $(containerSelector + " .amount-container") + }; + + let multibuyerForm = undefined; + if (isMultibuyerEnabled) { + multibuyerForm = { + "showMultibuyer": $(containerSelector + " .show_multibuyer"), + "firstname": $(containerSelector + " .multibuyer_firstname"), + "lastname": $(containerSelector + " .multibuyer_lastname"), + "email": $(containerSelector + " .multibuyer_email"), + "zipcode": $(containerSelector + " .multibuyer_zipcode"), + "document": $(containerSelector + " .multibuyer_document"), + "street": $(containerSelector + " .multibuyer_street"), + "number": $(containerSelector + " .multibuyer_number"), + "complement": $(containerSelector + " .multibuyer_complement"), + "neighborhood": $(containerSelector + " .multibuyer_neighborhood"), + "city": $(containerSelector + " .multibuyer_city"), + "state": $(containerSelector + " .multibuyer_state"), + "homePhone": $(containerSelector + " .multibuyer_home_phone"), + "mobilePhone": $(containerSelector + " .multibuyer_mobile_phone") + } + } + + FormObject.FormObject = pixElements; + FormObject.FormObject.numberOfPaymentForms = 1; + FormObject.FormObject.multibuyer = multibuyerForm; + return FormObject.FormObject; + }; + + FormObject.boletoInit = (isMultibuyerEnabled) => { + + FormObject.FormObject = {}; + + const containerSelector = '#pagarme_billet-form'; + + if (typeof $(containerSelector).html() == 'undefined') { + FormObject.FormObject = null; + return; + } + + const boletoElements = { + 'containerSelector' : containerSelector, + "inputAmount" : $(containerSelector + " .cc_amount"), + "inputAmountContainer" : $(containerSelector + " .amount-container") + }; + + let multibuyerForm = undefined; + if (isMultibuyerEnabled) { + multibuyerForm = { + "showMultibuyer": $(containerSelector + " .show_multibuyer"), + "firstname": $(containerSelector + " .multibuyer_firstname"), + "lastname": $(containerSelector + " .multibuyer_lastname"), + "email": $(containerSelector + " .multibuyer_email"), + "zipcode": $(containerSelector + " .multibuyer_zipcode"), + "document": $(containerSelector + " .multibuyer_document"), + "street": $(containerSelector + " .multibuyer_street"), + "number": $(containerSelector + " .multibuyer_number"), + "complement": $(containerSelector + " .multibuyer_complement"), + "neighborhood": $(containerSelector + " .multibuyer_neighborhood"), + "city": $(containerSelector + " .multibuyer_city"), + "state": $(containerSelector + " .multibuyer_state"), + "homePhone": $(containerSelector + " .multibuyer_home_phone"), + "mobilePhone": $(containerSelector + " .multibuyer_mobile_phone") + } + } + + FormObject.FormObject = boletoElements; + FormObject.FormObject.numberOfPaymentForms = 1; + FormObject.FormObject.multibuyer = multibuyerForm; + return FormObject.FormObject; + }; + + FormObject.fillBoletoCreditCardElements = (containerSelector, elementId, isMultibuyerEnabled) => { + if (isMultibuyerEnabled) { + const multibuyerForm = { + "showMultibuyer" : $(containerSelector + " .show_multibuyer"), + "firstname" : $(containerSelector + " .multibuyer_firstname"), + "lastname" : $(containerSelector + " .multibuyer_lastname"), + "email" : $(containerSelector + " .multibuyer_email"), + "zipcode" : $(containerSelector + " .multibuyer_zipcode"), + "document" : $(containerSelector + " .multibuyer_document"), + "street" : $(containerSelector + " .multibuyer_street"), + "number" : $(containerSelector + " .multibuyer_number"), + "complement" : $(containerSelector + " .multibuyer_complement"), + "neighborhood" : $(containerSelector + " .multibuyer_neighborhood"), + "city" : $(containerSelector + " .multibuyer_city"), + "state" : $(containerSelector + " .multibuyer_state"), + "homePhone" : $(containerSelector + " .multibuyer_home_phone"), + "mobilePhone" : $(containerSelector + " .multibuyer_mobile_phone") + } + + FormObject.FormObject[elementId].multibuyer = multibuyerForm; + } + return FormObject.FormObject; + } + + FormObject.boletoCreditCardInit = (isMultibuyerEnabled) => { + const containerBoletoSelector = "#pagarme_billet_creditcard-form #billet-form"; + const containerCreditCardSelector = "#pagarme_billet_creditcard-form #credit-card-form"; + + FormObject.FormObject = {}; + + if (typeof $(containerCreditCardSelector + " .cc_installments").html() == 'undefined') { + FormObject.FormObject = null; + return; + } + + const boletoElements = { + 'containerSelector' : containerBoletoSelector, + "inputAmount" : $(containerBoletoSelector + " .cc_amount"), + "inputAmountContainer" : $(containerBoletoSelector + " .amount-container"), + }; + + const cardsElements = { + 'containerSelector' : containerCreditCardSelector, + "creditCardNumber" : $(containerCreditCardSelector + " .cc_number"), + "creditCardHolderName" : $(containerCreditCardSelector + " .cc_owner"), + "creditCardExpMonth" : $(containerCreditCardSelector + " .cc_exp_month"), + "creditCardExpYear" : $(containerCreditCardSelector + " .cc_exp_year"), + "creditCardCvv" : $(containerCreditCardSelector + " .cc_cid"), + "creditCardInstallments" : $(containerCreditCardSelector + " .cc_installments"), + "creditCardBrand" : $(containerCreditCardSelector + " .cc_type"), + "creditCardToken" : $(containerCreditCardSelector + " .cc_token"), + "inputAmount" : $(containerCreditCardSelector + " .cc_amount"), + "inputAmountContainer" : $(containerCreditCardSelector + " .amount-container"), + "savedCreditCardSelect" : $(containerCreditCardSelector + " .cc_saved_creditcards"), + "saveThisCard" : $(containerCreditCardSelector + " .save_this_card") + }; + + FormObject.FormObject[0] = boletoElements; + FormObject.FormObject[1] = cardsElements; + + for (let i = 0, len = 2; i < len; i++) { + FormObject.fillBoletoCreditCardElements(FormObject.FormObject[i].containerSelector, i, isMultibuyerEnabled); + } + + FormObject.FormObject.numberOfPaymentForms = 2; + FormObject.FormObject[1].savedCardSelectUsed = 'pagarme_billet_creditcard'; + + return FormObject.FormObject; + }; + + return FormObject; +}) diff --git a/view/frontend/web/js/core/checkout/Installments.js b/view/frontend/web/js/core/checkout/Installments.js deleted file mode 100644 index 4743945d..00000000 --- a/view/frontend/web/js/core/checkout/Installments.js +++ /dev/null @@ -1,18 +0,0 @@ -var Installments = function () { -} - -Installments.prototype.init = function () { -}; - -Installments.prototype.addOptions = function (element, installments) { - - if (installments != undefined) { - jQuery(element).find('option').remove(); - - installments.forEach(function (value) { - opt = new Option(value.label, value.id); - jQuery(opt).attr("interest", value.interest); - jQuery(element).append(opt); - }); - } -} diff --git a/view/frontend/web/js/core/checkout/PaymentMethodController.js b/view/frontend/web/js/core/checkout/PaymentMethodController.js index de75cb2d..1b302c7d 100644 --- a/view/frontend/web/js/core/checkout/PaymentMethodController.js +++ b/view/frontend/web/js/core/checkout/PaymentMethodController.js @@ -1,928 +1,920 @@ -var PaymentMethodController = function (methodCode, platformConfig) { - this.methodCode = methodCode; - this.platformConfig = platformConfig; -}; - -PaymentMethodController.prototype.init = function () { - var paymentMethodInit = this.methodCode + 'Init'; - this[paymentMethodInit](); -}; - -PaymentMethodController.prototype.formObject = function (formObject) { - this.formObject = formObject -}; - -PaymentMethodController.prototype.formValidation = function () { - formValidation = this.methodCode + 'Validation'; - - return this[formValidation](); -}; - -PaymentMethodController.prototype.creditcardInit = function () { - this.platformConfig = PlatformConfig.bind(this.platformConfig); - this.formObject = FormObject.creditCardInit(this.platformConfig.isMultibuyerEnabled); - - if (!this.formObject) { - return; - } - - this.model = new CreditCardModel( - this.formObject, - this.platformConfig.publicKey - ); - - this.fillCardAmount(this.formObject, 1); - this.hideCardAmount(this.formObject); - this.fillFormText(this.formObject, 'pagarme_creditcard'); - this.fillSavedCreditCardsSelect(this.formObject); - this.fillBrandList(this.formObject, 'pagarme_creditcard'); - this.fillInstallments(this.formObject); +define([ + 'jquery', + 'Pagarme_Pagarme/js/core/checkout/PlatformConfig', + 'Pagarme_Pagarme/js/core/checkout/FormObject', + 'Pagarme_Pagarme/js/core/checkout/PlatformFormHandler', + 'Pagarme_Pagarme/js/core/checkout/Bin', + 'Pagarme_Pagarme/js/core/models/CreditCardModel', + 'Pagarme_Pagarme/js/core/checkout/CreditCardToken', + 'Pagarme_Pagarme/js/core/models/VoucherModel', + 'Pagarme_Pagarme/js/core/models/DebitModel', + 'Pagarme_Pagarme/js/core/models/TwoCreditcardsModel', + 'Pagarme_Pagarme/js/core/models/PixModel', + 'Pagarme_Pagarme/js/core/models/BoletoModel', + 'Pagarme_Pagarme/js/core/models/BoletoCreditcardModel', + 'Pagarme_Pagarme/js/core/validators/CustomerValidator', +], ( + $, + PlatformConfig, + FormObject, + FormHandler, + Bin, + CreditCardModel, + CreditCardToken, + VoucherModel, + DebitModel, + TwoCreditcardsModel, + PixModel, + BoletoModel, + BoletoCreditcardModel, + CustomerValidator, +) => { + + const fieldError = '.field-error'; + const errorClass = '_error'; + return class PaymentMethodController { + constructor(methodCode, platformConfig) { + this.methodCode = methodCode; + this.platformConfig = platformConfig; + } - if (!this.platformConfig.isMultibuyerEnabled) { - this.removeMultibuyerForm(this.formObject); - } + init() { + const paymentMethodInit = this.methodCode + 'Init'; + this[paymentMethodInit](); + } - if (this.platformConfig.isMultibuyerEnabled) { - this.fillMultibuyerStateSelect(this.formObject); - this.addShowMultibuyerListener(this.formObject); - } + formObject(formObject) { + this.formObject = formObject + } - this.addCreditCardListeners(this.formObject); - this.modelToken = new CreditCardToken(this.formObject); -}; + formValidation() { + const formValidation = this.methodCode + 'Validation'; -PaymentMethodController.prototype.voucherInit = function () { - this.platformConfig = PlatformConfig.bind(this.platformConfig); - this.formObject = FormObject.voucherInit(this.platformConfig.isMultibuyerEnabled); + return this[formValidation](); + } - if (!this.formObject) { - return; - } + creditcardInit() { + this.platformConfig = PlatformConfig.bind(this.platformConfig); + this.formObject = FormObject.creditCardInit(this.platformConfig.isMultibuyerEnabled); - this.model = new VoucherModel( - this.formObject, - this.platformConfig.publicKey - ); - - this.fillCardAmount(this.formObject, 1); - this.hideCardAmount(this.formObject); - this.fillFormText(this.formObject, 'pagarme_voucher'); - this.fillBrandList(this.formObject, "pagarme_voucher"); - this.removeInstallmentsSelect(this.formObject); - this.fillSavedCreditCardsSelect(this.formObject); - this.showCvvCard(this.formObject); - - if (!this.platformConfig.isMultibuyerEnabled) { - this.removeMultibuyerForm(this.formObject); - } + if (!this.formObject) { + return; + } - if (this.platformConfig.isMultibuyerEnabled) { - this.fillMultibuyerStateSelect(this.formObject); - this.addShowMultibuyerListener(this.formObject); - } + this.model = new CreditCardModel( + this.formObject, + this.platformConfig.publicKey + ); - this.addCreditCardListeners(this.formObject); - this.modelToken = new CreditCardToken(this.formObject); -}; + this.fillCardAmount(this.formObject, 1); + this.hideCardAmount(this.formObject); + this.fillFormText(this.formObject, 'pagarme_creditcard'); + this.fillSavedCreditCardsSelect(this.formObject); + this.fillBrandList(this.formObject, 'pagarme_creditcard'); + this.fillInstallments(this.formObject); -PaymentMethodController.prototype.debitInit = function () { - this.platformConfig = PlatformConfig.bind(this.platformConfig); - this.formObject = FormObject.debitInit(this.platformConfig.isMultibuyerEnabled); + if (!this.platformConfig.isMultibuyerEnabled) { + this.removeMultibuyerForm(this.formObject); + } - if (!this.formObject) { - return; - } + if (this.platformConfig.isMultibuyerEnabled) { + this.fillMultibuyerStateSelect(this.formObject); + this.addShowMultibuyerListener(this.formObject); + } - this.model = new DebitModel( - this.formObject, - this.platformConfig.publicKey - ); + this.addCreditCardListeners(this.formObject); + this.modelToken = new CreditCardToken(this.formObject); + } - this.fillCardAmount(this.formObject, 1); - this.hideCardAmount(this.formObject); - this.fillFormText(this.formObject, 'pagarme_debit'); - this.fillBrandList(this.formObject, "pagarme_debit"); - this.removeInstallmentsSelect(this.formObject); - this.fillSavedCreditCardsSelect(this.formObject); + voucherInit() { + this.platformConfig = PlatformConfig.bind(this.platformConfig); + this.formObject = FormObject.voucherInit(this.platformConfig.isMultibuyerEnabled); - if (!this.platformConfig.isMultibuyerEnabled) { - this.removeMultibuyerForm(this.formObject); - } + if (!this.formObject) { + return; + } - if (this.platformConfig.isMultibuyerEnabled) { - this.fillMultibuyerStateSelect(this.formObject); - this.addShowMultibuyerListener(this.formObject); - } + this.model = new VoucherModel( + this.formObject, + this.platformConfig.publicKey + ); - this.addCreditCardListeners(this.formObject); - this.modelToken = new CreditCardToken(this.formObject); -} + this.fillCardAmount(this.formObject, 1); + this.hideCardAmount(this.formObject); + this.fillFormText(this.formObject, 'pagarme_voucher'); + this.fillBrandList(this.formObject, "pagarme_voucher"); + this.removeInstallmentsSelect(this.formObject); + this.fillSavedCreditCardsSelect(this.formObject); + this.showCvvCard(this.formObject); -PaymentMethodController.prototype.twocreditcardsInit = function () { - this.platformConfig = PlatformConfig.bind(this.platformConfig); - this.formObject = FormObject.twoCreditCardsInit(this.platformConfig.isMultibuyerEnabled); + if (!this.platformConfig.isMultibuyerEnabled) { + this.removeMultibuyerForm(this.formObject); + } - if (!this.formObject) { - return; - } - this.model = new TwoCreditcardsModel( - this.formObject, - this.platformConfig.publicKey - ); + if (this.platformConfig.isMultibuyerEnabled) { + this.fillMultibuyerStateSelect(this.formObject); + this.addShowMultibuyerListener(this.formObject); + } - var isTotalOnAmountInputs = this.isTotalOnAmountInputs(this.formObject, this.platformConfig); + this.addCreditCardListeners(this.formObject); + this.modelToken = new CreditCardToken(this.formObject); + } - if (typeof this.formObject[1] !== "undefined") { - for (var i = 0, len = this.formObject.numberOfPaymentForms; i < len; i++) { - this.fillFormText(this.formObject[i], 'pagarme_two_creditcard'); + debitInit() { + this.platformConfig = PlatformConfig.bind(this.platformConfig); + this.formObject = FormObject.debitInit(this.platformConfig.isMultibuyerEnabled); - if (this.formObject[i].inputAmount.val() === "" || !isTotalOnAmountInputs) { - this.fillCardAmount(this.formObject[i], 2, i); + if (!this.formObject) { + return; } - this.fillBrandList(this.formObject[i], 'pagarme_two_creditcard'); - this.fillSavedCreditCardsSelect(this.formObject[i]); - this.fillInstallments(this.formObject[i]); + this.model = new DebitModel( + this.formObject, + this.platformConfig.publicKey + ); + + this.fillCardAmount(this.formObject, 1); + this.hideCardAmount(this.formObject); + this.fillFormText(this.formObject, 'pagarme_debit'); + this.fillBrandList(this.formObject, "pagarme_debit"); + this.removeInstallmentsSelect(this.formObject); + this.fillSavedCreditCardsSelect(this.formObject); if (!this.platformConfig.isMultibuyerEnabled) { - this.removeMultibuyerForm(this.formObject[i]); + this.removeMultibuyerForm(this.formObject); } if (this.platformConfig.isMultibuyerEnabled) { - this.fillMultibuyerStateSelect(this.formObject[i]); - this.addShowMultibuyerListener(this.formObject[i]); + this.fillMultibuyerStateSelect(this.formObject); + this.addShowMultibuyerListener(this.formObject); } - this.addCreditCardListeners(this.formObject[i]); - this.addInputAmountBalanceListener(this.formObject[i], i); - + this.addCreditCardListeners(this.formObject); + this.modelToken = new CreditCardToken(this.formObject); } - } - this.modelToken = new CreditCardToken(this.formObject); -}; + twocreditcardsInit() { + this.platformConfig = PlatformConfig.bind(this.platformConfig); + this.formObject = FormObject.twoCreditCardsInit(this.platformConfig.isMultibuyerEnabled); + if (!this.formObject) { + return; + } + this.model = new TwoCreditcardsModel( + this.formObject, + this.platformConfig.publicKey + ); -PaymentMethodController.prototype.pixInit = function () { - this.platformConfig = PlatformConfig.bind(this.platformConfig); - this.formObject = FormObject.pixInit(this.platformConfig.isMultibuyerEnabled); - - if (!this.formObject) { - return; - } - - this.model = new PixModel(this.formObject); - this.hideCardAmount(this.formObject); + const isTotalOnAmountInputs = this.isTotalOnAmountInputs(this.formObject, this.platformConfig); - if (!this.platformConfig.isMultibuyerEnabled) { - this.removeMultibuyerForm(this.formObject); - } + if (typeof this.formObject[1] !== "undefined") { + for (let i = 0, len = this.formObject.numberOfPaymentForms; i < len; i++) { + this.fillFormText(this.formObject[i], 'pagarme_two_creditcard'); - if (this.platformConfig.isMultibuyerEnabled) { - this.fillMultibuyerStateSelect(this.formObject); - this.addShowMultibuyerListener(this.formObject); - this.addValidatorListener(this.formObject); - } -}; + if (this.formObject[i].inputAmount.val() === "" || !isTotalOnAmountInputs) { + this.fillCardAmount(this.formObject[i], 2, i); + } -PaymentMethodController.prototype.boletoInit = function () { - this.platformConfig = PlatformConfig.bind(this.platformConfig); - this.formObject = FormObject.boletoInit(this.platformConfig.isMultibuyerEnabled); + this.fillBrandList(this.formObject[i], 'pagarme_two_creditcard'); + this.fillSavedCreditCardsSelect(this.formObject[i]); + this.fillInstallments(this.formObject[i]); - if (!this.formObject) { - return; - } + if (!this.platformConfig.isMultibuyerEnabled) { + this.removeMultibuyerForm(this.formObject[i]); + } - this.model = new BoletoModel(this.formObject); - this.hideCardAmount(this.formObject); + if (this.platformConfig.isMultibuyerEnabled) { + this.fillMultibuyerStateSelect(this.formObject[i]); + this.addShowMultibuyerListener(this.formObject[i]); + } - if (!this.platformConfig.isMultibuyerEnabled) { - this.removeMultibuyerForm(this.formObject); - } + this.addCreditCardListeners(this.formObject[i]); + this.addInputAmountBalanceListener(this.formObject[i], i); - if (this.platformConfig.isMultibuyerEnabled) { - this.fillMultibuyerStateSelect(this.formObject); - this.addShowMultibuyerListener(this.formObject); - this.addValidatorListener(this.formObject); - } -}; + } + } -PaymentMethodController.prototype.removeSavedCardsSelect = function (formObject) { - var formHandler = new FormHandler(); - formHandler.init(formObject); - formHandler.removeSavedCardsSelect(formObject); -} + this.modelToken = new CreditCardToken(this.formObject); + } + pixInit() { + this.platformConfig = PlatformConfig.bind(this.platformConfig); + this.formObject = FormObject.pixInit(this.platformConfig.isMultibuyerEnabled); -PaymentMethodController.prototype.boletoCreditcardInit = function () { - this.platformConfig = PlatformConfig.bind(this.platformConfig); - this.formObject = FormObject.boletoCreditCardInit(this.platformConfig.isMultibuyerEnabled); + if (!this.formObject) { + return; + } - if (!this.formObject) { - return; - } + this.model = new PixModel(this.formObject); + this.hideCardAmount(this.formObject); - var isTotalOnAmountInputs = this.isTotalOnAmountInputs(this.formObject, this.platformConfig); + if (!this.platformConfig.isMultibuyerEnabled) { + this.removeMultibuyerForm(this.formObject); + } - if (typeof this.formObject[1] !== "undefined") { + if (this.platformConfig.isMultibuyerEnabled) { + this.fillMultibuyerStateSelect(this.formObject); + this.addShowMultibuyerListener(this.formObject); + this.addValidatorListener(this.formObject); + } + } - for (var i = 0, len = this.formObject.numberOfPaymentForms; i < len; i++) { + boletoInit() { + this.platformConfig = PlatformConfig.bind(this.platformConfig); + this.formObject = FormObject.boletoInit(this.platformConfig.isMultibuyerEnabled); - if (this.formObject[i].inputAmount.val() === "" || !isTotalOnAmountInputs) { - this.fillCardAmount(this.formObject[i], 2, i); + if (!this.formObject) { + return; } + this.model = new BoletoModel(this.formObject); + this.hideCardAmount(this.formObject); + if (!this.platformConfig.isMultibuyerEnabled) { - this.removeMultibuyerForm(this.formObject[i]); + this.removeMultibuyerForm(this.formObject); } if (this.platformConfig.isMultibuyerEnabled) { - this.fillMultibuyerStateSelect(this.formObject[i]); - this.addShowMultibuyerListener(this.formObject[i]); + this.fillMultibuyerStateSelect(this.formObject); + this.addShowMultibuyerListener(this.formObject); + this.addValidatorListener(this.formObject); } - - this.formObject[i].inputAmountContainer.show(); - this.addInputAmountBalanceListener(this.formObject[i], i); } - this.fillBrandList(this.formObject[1], 'pagarme_billet_creditcard'); - this.fillFormText(this.formObject[1], 'pagarme_billet_creditcard'); - this.fillSavedCreditCardsSelect(this.formObject[1]); - this.fillInstallments(this.formObject[1]); - this.addCreditCardListeners(this.formObject[1]); - this.modelToken = new CreditCardToken(this.formObject[1]); - } + removeSavedCardsSelect(formObject) { + const formHandler = new FormHandler(); + formHandler.init(formObject); + formHandler.removeSavedCardsSelect(formObject); + } - this.model = new BoletoCreditcardModel( - this.formObject, - this.platformConfig.publicKey - ); -} + boletoCreditcardInit() { + this.platformConfig = PlatformConfig.bind(this.platformConfig); + this.formObject = FormObject.boletoCreditCardInit(this.platformConfig.isMultibuyerEnabled); -var timesRunObserver = 1; -PaymentMethodController.prototype.addCreditCardListeners = function (formObject) { - if (!formObject) { - return; - } + if (!this.formObject) { + return; + } - this.addValidatorListener(formObject); - this.addCreditCardNumberListener(formObject); - this.addCreditCardInstallmentsListener(formObject); - this.addCreditCardHolderNameListener(formObject); - this.addSavedCreditCardsListener(formObject); - this.removeSavedCards(formObject); + const isTotalOnAmountInputs = this.isTotalOnAmountInputs(this.formObject, this.platformConfig); - if (timesRunObserver <= 1) { - timesRunObserver++; - this.addListenerUpdateAmount(); - } -}; + if (typeof this.formObject[1] !== "undefined") { -PaymentMethodController.prototype.removeSavedCards = function (formObject) { - if (checkoutConfig.payment[formObject.savedCardSelectUsed].enabled_saved_cards) { - return; - } + for (let i = 0, len = this.formObject.numberOfPaymentForms; i < len; i++) { - var selectCard = document.querySelector(formObject.containerSelector) - .querySelector('.saved-card'); + if (this.formObject[i].inputAmount.val() === "" || !isTotalOnAmountInputs) { + this.fillCardAmount(this.formObject[i], 2, i); + } - if (selectCard == null) { - return; - } + if (!this.platformConfig.isMultibuyerEnabled) { + this.removeMultibuyerForm(this.formObject[i]); + } - selectCard.remove(); -}; + if (this.platformConfig.isMultibuyerEnabled) { + this.fillMultibuyerStateSelect(this.formObject[i]); + this.addShowMultibuyerListener(this.formObject[i]); + } -PaymentMethodController.prototype.addListenerUpdateAmount = function () { - var observerMutation = new MutationObserver(function (mutationsList, observer) { + this.formObject[i].inputAmountContainer.show(); + this.addInputAmountBalanceListener(this.formObject[i], i); + } - var paymentMethodName = ['twocreditcards', 'boletoCreditcard', 'voucher']; - setTimeout(function () { - for (var i = 0; i < paymentMethodName.length; i++) { - var initPaymentMethod = new PaymentMethodController(paymentMethodName[i], platFormConfig); - initPaymentMethod.init(); + this.fillBrandList(this.formObject[1], 'pagarme_billet_creditcard'); + this.fillFormText(this.formObject[1], 'pagarme_billet_creditcard'); + this.fillSavedCreditCardsSelect(this.formObject[1]); + this.fillInstallments(this.formObject[1]); + this.addCreditCardListeners(this.formObject[1]); + this.modelToken = new CreditCardToken(this.formObject[1]); } - }, 800); - var initCreditCard = new PaymentMethodController('creditcard', platFormConfig); - initCreditCard.init(); - }); + this.model = new BoletoCreditcardModel( + this.formObject, + this.platformConfig.publicKey + ); + } + + addCreditCardListeners(formObject) { + if (!formObject) { + return; + } - observerMutation.observe( - document.getElementById('opc-sidebar'), - { - attributes: false, - childList: true, - subtree: true + this.addValidatorListener(formObject); + this.addCreditCardNumberListener(formObject); + this.addCreditCardInstallmentsListener(formObject); + this.addCreditCardHolderNameListener(formObject); + this.addSavedCreditCardsListener(formObject); + this.removeSavedCards(formObject); } - ); -} -PaymentMethodController.prototype.addInputAmountBalanceListener = function(formObject, id) { - var paymentMethodController = this; - var id = id; + removeSavedCards(formObject) { + if (checkoutConfig.payment[formObject.savedCardSelectUsed].enabled_saved_cards) { + return; + } - formObject.inputAmount.on('change', function () { - paymentMethodController.fillInstallments(formObject); - var formId = paymentMethodController.model.getFormIdInverted(id); - var form = paymentMethodController.formObject[formId]; - paymentMethodController.fillInstallments(form); + const selectCard = document.querySelector(formObject.containerSelector) + .querySelector('.saved-card'); - setTimeout(function () { - paymentMethodController.updateTotalByPaymentMethod(paymentMethodController, form.creditCardInstallments); - }, 3000); + if (selectCard == null) { + return; + } - }); + selectCard.remove(); + } - formObject.inputAmount.on('keyup', function(){ - element = jQuery(this); + addInputAmountBalanceListener(formObject, id) { + const paymentMethodController = this; - var orginalValue = platFormConfig.updateTotals.getTotals()().grand_total - var orderAmount = (orginalValue).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,'); - orderAmount = orderAmount.replace(/[^0-9]/g, ''); - orderAmount = Number(orderAmount); + formObject.inputAmount.on('change', function () { + paymentMethodController.fillInstallments(formObject); + const formId = paymentMethodController.model.getFormIdInverted(id); + const form = paymentMethodController.formObject[formId]; + paymentMethodController.fillInstallments(form); - var value = element.val(); - value = value.replace(/[^0-9]/g, ''); - value = Number(value); + setTimeout(function () { + paymentMethodController.updateTotalByPaymentMethod(paymentMethodController, form.creditCardInstallments); + }, 3000); - if (value >= orderAmount) { - value = orderAmount - 1; - } + }); - if (isNaN(value) || value == 0) { - value = 1; - } + formObject.inputAmount.on('keyup', function(){ + const element = $(this); - var remaining = orderAmount - value; + const originalValue = paymentMethodController.platformConfig.updateTotals.getTotals()().grand_total + let orderAmount = (originalValue).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,'); + orderAmount = orderAmount.replace(/[^0-9]/g, ''); + orderAmount = Number(orderAmount); - remaining = (remaining / 100).toFixed(2); - value = (value / 100).toFixed(2); + let value = element.val(); + value = value.replace(/[^0-9]/g, ''); + value = Number(value); - var formId = paymentMethodController.model.getFormIdInverted(id); - var form = paymentMethodController.formObject[formId]; + if (value >= orderAmount) { + value = orderAmount - 1; + } - form.inputAmount.val(remaining.toString().replace('.', paymentMethodController.platformConfig.currency.decimalSeparator)); - element.val(value.toString().replace('.', paymentMethodController.platformConfig.currency.decimalSeparator)); - }); -} + if (isNaN(value) || value == 0) { + value = 1; + } -PaymentMethodController.prototype.addCreditCardHolderNameListener = function(formObject) { - var paymentMethodController = this; - formObject.creditCardHolderName.on('keyup', function () { - var element = jQuery(this); - paymentMethodController.clearNumbers(element); - }); -} + let remaining = orderAmount - value; -PaymentMethodController.prototype.addValidatorListener = function(formObject) { - const paymentMethodController = this; + remaining = (remaining / 100).toFixed(2); + value = (value / 100).toFixed(2); - jQuery(formObject.containerSelector).on('change', function (event) { - const element = jQuery(event.target); - if ( - element.attr('name').startsWith('payment[cc_type]') - && element.val() !== 'default' - ) { - paymentMethodController.validateBrandField(formObject); - return; - } - if (element.attr('name').startsWith('payment[cc_number]')) { - paymentMethodController.validateCcNumberField(element, formObject); - return; + const formId = paymentMethodController.model.getFormIdInverted(id); + const form = paymentMethodController.formObject[formId]; + + form.inputAmount.val(remaining.toString().replace('.', paymentMethodController.platformConfig.currency.decimalSeparator)); + element.val(value.toString().replace('.', paymentMethodController.platformConfig.currency.decimalSeparator)); + }); } - if ( - element.attr('name').startsWith('payment[cc_exp_month]') - || element.attr('name').startsWith('payment[cc_exp_year]') - ) { - paymentMethodController.validateCcExpDateField(formObject); - return; + + addCreditCardHolderNameListener(formObject) { + const paymentMethodController = this; + formObject.creditCardHolderName.on('keyup', function () { + const element = $(this); + paymentMethodController.clearNumbers(element); + }); } - paymentMethodController.validateDefaultField(element); - }); -}; -PaymentMethodController.prototype.addCreditCardNumberListener = function(formObject) { + addValidatorListener(formObject) { + const paymentMethodController = this; + + $(formObject.containerSelector).on('change', function (event) { + const element = $(event.target); + if ( + element.attr('name').startsWith('payment[cc_type]') + && element.val() !== 'default' + ) { + paymentMethodController.validateBrandField(formObject); + return; + } + if (element.attr('name').startsWith('payment[cc_number]')) { + paymentMethodController.validateCcNumberField(element, formObject); + return; + } + if ( + element.attr('name').startsWith('payment[cc_exp_month]') + || element.attr('name').startsWith('payment[cc_exp_year]') + ) { + paymentMethodController.validateCcExpDateField(formObject); + return; + } + paymentMethodController.validateDefaultField(element); + }); + } + addCreditCardNumberListener(formObject) { - var paymentMethodController = this; + const paymentMethodController = this; - formObject.creditCardNumber.unbind(); - formObject.creditCardNumber.on('keydown', function () { - element = jQuery(this); - paymentMethodController.limitCharacters(element, 19); - }); + formObject.creditCardNumber.unbind(); + formObject.creditCardNumber.on('keydown', function () { + const element = $(this); + paymentMethodController.limitCharacters(element, 19); + }); - var binObj = new Bin(); + const binObj = new Bin(); - formObject.creditCardNumber.on('keyup', function () { - var element = jQuery(this); - paymentMethodController.clearLetters(element); - }); + formObject.creditCardNumber.on('keyup', function () { + const element = $(this); + paymentMethodController.clearLetters(element); + }); - formObject.creditCardNumber.on('change', function () { - var element = jQuery(this); + formObject.creditCardNumber.on('change', function () { + const element = $(this); - setTimeout(function() { - paymentMethodController.setBin(binObj, element, formObject); - }, 300); - }); -}; + setTimeout(function() { + paymentMethodController.setBin(binObj, element, formObject); + }, 300); + }); + } -PaymentMethodController.prototype.twoCardsTotal = function (paymentMethod) { - var card1 = paymentMethod.formObject[0].creditCardInstallments; - var card2 = paymentMethod.formObject[1].creditCardInstallments; + twoCardsTotal(paymentMethod) { + const card1 = paymentMethod.formObject[0].creditCardInstallments; + const card2 = paymentMethod.formObject[1].creditCardInstallments; - var totalCard1 = paymentMethod.formObject[0].inputAmount.val().replace(platformConfig.currency.decimalSeparator, "."); - var totalCard2 = paymentMethod.formObject[1].inputAmount.val().replace(platformConfig.currency.decimalSeparator, "."); + const totalCard1 = paymentMethod.formObject[0].inputAmount.val().replace(this.platformConfig.currency.decimalSeparator, "."); + const totalCard2 = paymentMethod.formObject[1].inputAmount.val().replace(this.platformConfig.currency.decimalSeparator, "."); - var interestTotalCard1 = jQuery(card1).find(":selected").attr("interest"); - var interestTotalCard2 = jQuery(card2).find(":selected").attr("interest"); + const interestTotalCard1 = $(card1).find(":selected").attr("interest"); + const interestTotalCard2 = $(card2).find(":selected").attr("interest"); - var sumTotal = (parseFloat(totalCard1) + parseFloat(totalCard2)); - var sumInterestTotal = (parseFloat(interestTotalCard1) + parseFloat(interestTotalCard2)); + let sumTotal = (parseFloat(totalCard1) + parseFloat(totalCard2)); + let sumInterestTotal = (parseFloat(interestTotalCard1) + parseFloat(interestTotalCard2)); - sumTotal = (sumTotal + sumInterestTotal).toString(); - sumInterestTotal = sumInterestTotal.toString(); + sumTotal = (sumTotal + sumInterestTotal).toString(); + sumInterestTotal = sumInterestTotal.toString(); - return { sumTotal, sumInterestTotal }; -} + return { sumTotal, sumInterestTotal }; + } -PaymentMethodController.prototype.boletoCreditCardTotal = function (paymentMethod) { - var cardElement = paymentMethod.formObject[1].creditCardInstallments; + boletoCreditCardTotal(paymentMethod) { + const cardElement = paymentMethod.formObject[1].creditCardInstallments; - var sumInterestTotal = jQuery(cardElement).find(":selected").attr("interest"); + let sumInterestTotal = $(cardElement).find(":selected").attr("interest"); - var valueCard = paymentMethod.formObject[1].inputAmount.val().replace(platformConfig.currency.decimalSeparator, "."); - var valueBoleto = paymentMethod.formObject[0].inputAmount.val().replace(platformConfig.currency.decimalSeparator, "."); + const valueCard = paymentMethod.formObject[1].inputAmount.val().replace(this.platformConfig.currency.decimalSeparator, "."); + const valueBoleto = paymentMethod.formObject[0].inputAmount.val().replace(this.platformConfig.currency.decimalSeparator, "."); - var sumTotal = (parseFloat(valueCard) + parseFloat(valueBoleto)); + let sumTotal = (parseFloat(valueCard) + parseFloat(valueBoleto)); - sumTotal = (sumTotal + parseFloat(sumInterestTotal)).toString(); - sumInterestTotal = sumInterestTotal.toString(); + sumTotal = (sumTotal + parseFloat(sumInterestTotal)).toString(); + sumInterestTotal = sumInterestTotal.toString(); - return { sumTotal, sumInterestTotal }; -} + return { sumTotal, sumInterestTotal }; + } -PaymentMethodController.prototype.updateTotalByPaymentMethod = function (paymentMethod, event) { - var interest = jQuery(event).find(':selected').attr("interest"); - var grandTotal = jQuery(event).find(':selected').attr("total_with_tax"); + updateTotalByPaymentMethod(paymentMethod, event) { + let interest = $(event).find(':selected').attr("interest"); + let grandTotal = $(event).find(':selected').attr("total_with_tax"); - if (paymentMethod.methodCode === "twocreditcards") { - var twoCardsTotalObject = paymentMethod.twoCardsTotal(paymentMethod); + if (paymentMethod.methodCode === "twocreditcards") { + const twoCardsTotalObject = paymentMethod.twoCardsTotal(paymentMethod); - grandTotal = twoCardsTotalObject.sumTotal; - interest = twoCardsTotalObject.sumInterestTotal; - } + grandTotal = twoCardsTotalObject.sumTotal; + interest = twoCardsTotalObject.sumInterestTotal; + } - if (paymentMethod.methodCode === "boletoCreditcard") { - var boletoCreditCardTotalObject = paymentMethod.boletoCreditCardTotal(paymentMethod); + if (paymentMethod.methodCode === "boletoCreditcard") { + const boletoCreditCardTotalObject = paymentMethod.boletoCreditCardTotal(paymentMethod); - grandTotal = boletoCreditCardTotalObject.sumTotal; - interest = boletoCreditCardTotalObject.sumInterestTotal; - } + grandTotal = boletoCreditCardTotalObject.sumTotal; + interest = boletoCreditCardTotalObject.sumInterestTotal; + } - paymentMethod.updateTotal( - interest, - grandTotal, - jQuery(event).attr('name') - ); -} + paymentMethod.updateTotal( + interest, + grandTotal, + $(event).attr('name') + ); + } -PaymentMethodController.prototype.addCreditCardInstallmentsListener = function (formObject) { - var paymentMethodController = this; + addCreditCardInstallmentsListener(formObject) { + const paymentMethodController = this; - formObject.creditCardInstallments.on('change', function () { - var value = jQuery(this).val(); + formObject.creditCardInstallments.on('change', function () { + const value = $(this).val(); - if (value != "" && value != 'undefined') { - paymentMethodController.updateTotalByPaymentMethod(paymentMethodController, this); + if (value != "" && value != 'undefined') { + paymentMethodController.updateTotalByPaymentMethod(paymentMethodController, this); + } + }); } - }); -}; -PaymentMethodController.prototype.addSavedCreditCardsListener = function(formObject) { + addSavedCreditCardsListener(formObject) { - var paymentMethodController = this; - var brand = jQuery('option:selected').attr('brand'); + const paymentMethodController = this; + let brand = $('option:selected').attr('brand'); - if (brand == undefined) { - brand = formObject.creditCardBrand.val(); - } + if (brand == undefined) { + brand = formObject.creditCardBrand.val(); + } - var formObject = formObject; - formObject.creditCardBrand.val(brand); - formObject.savedCreditCardSelect.on('change', function() { - var value = jQuery(this).val(); - var brand = jQuery('option:selected').attr('brand'); + formObject.creditCardBrand.val(brand); - formObject.creditCardBrand.val(brand); - if (value === 'new') { - jQuery(formObject.containerSelector + ' .new').show(); + formObject.savedCreditCardSelect.on('change', function() { + const value = $(this).val(); + const brand = $('option:selected').attr('brand'); - if ( - typeof formObject.multibuyer != 'undefined' && - typeof formObject.multibuyer.showMultibuyer != 'undefined' - ) { - formObject.multibuyer.showMultibuyer.parent().show(); - } - return; - } + formObject.creditCardBrand.val(brand); + if (value === 'new') { + $(formObject.containerSelector + ' .new').show(); - paymentMethodController.fillInstallments(formObject); - jQuery(formObject.containerSelector + ' .new').hide(); + if ( + typeof formObject.multibuyer != 'undefined' && + typeof formObject.multibuyer.showMultibuyer != 'undefined' + ) { + formObject.multibuyer.showMultibuyer.parent().show(); + } + return; + } - if ( - typeof formObject.multibuyer != 'undefined' && - typeof formObject.multibuyer.showMultibuyer != 'undefined' - ) { - formObject.multibuyer.showMultibuyer.parent().hide(); - } + paymentMethodController.fillInstallments(formObject); + $(formObject.containerSelector + ' .new').hide(); - if (formObject.containerSelector == "#pagarme_voucher-form") { - paymentMethodController.showCvvCard(formObject); + if ( + typeof formObject.multibuyer != 'undefined' && + typeof formObject.multibuyer.showMultibuyer != 'undefined' + ) { + formObject.multibuyer.showMultibuyer.parent().hide(); + } + + if (formObject.containerSelector == "#pagarme_voucher-form") { + paymentMethodController.showCvvCard(formObject); + } + }); } - }); -}; -PaymentMethodController.prototype.placeOrder = function (placeOrderObject) { - var customerValidator = new CustomerValidator( - this.platformConfig.addresses.billingAddress - ); - customerValidator.validate(); - var errors = customerValidator.getErrors(); + placeOrder(placeOrderObject) { + const customerValidator = new CustomerValidator( + this.platformConfig.addresses.billingAddress + ); + customerValidator.validate(); + const errors = customerValidator.getErrors(); + + if (errors.length > 0) { + for (let id in errors) { + this.model.addErrors(errors[id]); + } + return; + } - if (errors.length > 0) { - for (id in errors) { - this.model.addErrors(errors[id]); - } - return; - } + const isPublicKeyValid = this.validatePublicKey( + this.platformConfig.publicKey + ); - var isPublickKeyValid = this.validatePublicKey( - this.platformConfig.publicKey - ); + if (!isPublicKeyValid) { + return; + } - if (!isPublickKeyValid) { - return; - } + this.model.placeOrder(placeOrderObject); + } - this.model.placeOrder(placeOrderObject); -}; + updateTotal(interest, grandTotal, selectName) { + const paymentMethodController = this; -PaymentMethodController.prototype.updateTotal = function(interest, grandTotal, selectName) { - var paymentMethodController = this; + /**@fixme Move gettotals() to PlatformFormBiding */ + const total = paymentMethodController.platformConfig.updateTotals.getTotals()(); + interest = (parseInt((interest * 100).toFixed(2))) / 100; - /**@fixme Move gettotals() to PlatformFormBiding */ - var total = paymentMethodController.platformConfig.updateTotals.getTotals()(); - interest = (parseInt((interest * 100).toFixed(2))) / 100; + if (interest < 0) { + interest = 0; + } - if (interest < 0) { - interest = 0; - } + total.tax_amount = interest; + total.base_tax_amount = interest; - total.tax_amount = interest; - total.base_tax_amount = interest; + for (let i = 0, len = total.total_segments.length; i < len; i++) { + if (total.total_segments[i].code === "grand_total") { + grandTotal = parseInt((grandTotal * 100).toFixed(2)); + total.total_segments[i].value = grandTotal / 100; + continue; + } + if (total.total_segments[i].code === "tax") { - for (var i = 0, len = total.total_segments.length; i < len; i++) { - if (total.total_segments[i].code === "grand_total") { - grandTotal = parseInt((grandTotal * 100).toFixed(2)); - total.total_segments[i].value = grandTotal / 100; - continue; - } - if (total.total_segments[i].code === "tax") { + total.total_segments[i].value = interest; + } + } - total.total_segments[i].value = interest; + paymentMethodController.platformConfig.updateTotals.setTotals(total); } - } - paymentMethodController.platformConfig.updateTotals.setTotals(total); -}; + sumInterests(interest, selectName) { + const paymentMethodController = this; + + const formObject = paymentMethodController.formObject; -PaymentMethodController.prototype.sumInterests = function(interest, selectName) { - var interest = interest; - var paymentMethodController = this; + for (let id in formObject) { - var formObject = paymentMethodController.formObject; + if (id.length > 1 || formObject[id].creditCardInstallments == undefined) { + continue; + } - for (id in formObject) { + const name = formObject[id].creditCardInstallments.attr('name'); + if (name == selectName) { + continue; + } + + const otherInterest = formObject[id].creditCardInstallments.find(':selected').attr('interest'); + if (isNaN(otherInterest)) { + continue; + } + + interest = parseFloat(otherInterest) + parseFloat(interest); + } - if (id.length > 1 || formObject[id].creditCardInstallments == undefined) { - continue; + return interest; } - var name = formObject[id].creditCardInstallments.attr('name'); - if (name == selectName) { - continue; + removeInstallmentsSelect(formObject) { + const formHandler = new FormHandler(); + formHandler.init(formObject); + formHandler.removeInstallmentsSelect(formObject); } - var otherInterest = formObject[id].creditCardInstallments.find(':selected').attr('interest'); - if (isNaN(otherInterest)) { - continue; + showCvvCard(formObject) { + const cvvElement = document.querySelector(formObject.containerSelector + " .cvv"); + + if (cvvElement != undefined) { + cvvElement.style.display = ""; + } } - interest = parseFloat(otherInterest) + parseFloat(interest); - } + fillInstallments(form) { + const _self = this; - return interest; -} + if (form.creditCardBrand == undefined) { + return; + } -PaymentMethodController.prototype.removeInstallmentsSelect = function (formObject) { - var formHandler = new FormHandler(); - formHandler.init(formObject); - formHandler.removeInstallmentsSelect(formObject); -} + const installmentSelected = form.creditCardInstallments.val(); -PaymentMethodController.prototype.showCvvCard = function (formObject) { - var cvvElement = document.querySelector(formObject.containerSelector + " .cvv"); + let formHandler = new FormHandler(); - if (cvvElement != undefined) { - cvvElement.style.display = ""; - } -} + let selectedBrand = form.creditCardBrand.val(); -PaymentMethodController.prototype.fillInstallments = function (form) { - var _self = this; + let amount = form.inputAmount.val(); + if (typeof selectedBrand == "undefined") { + selectedBrand = 'default'; + } - if (form.creditCardBrand == undefined) { - return; - } + if (typeof amount == "undefined") { + amount = 0; + } - var installmentSelected = form.creditCardInstallments.val(); + const installmentsUrl = + this.platformConfig.urls.installments + '/' + + selectedBrand + '/' + + amount; - formHandler = new FormHandler(); + $.ajax({ + url: installmentsUrl, + method: 'GET', + cache: true, + }).done(function(data) { + formHandler = new FormHandler(); - var selectedBrand = form.creditCardBrand.val(); + if (!data.length) return; - var amount = form.inputAmount.val(); - if (typeof selectedBrand == "undefined") { - selectedBrand = 'default'; - } + form.creditCardInstallments.prop('disabled', true); + formHandler.updateInstallmentSelect(data, form.creditCardInstallments, installmentSelected); + form.creditCardInstallments.prop('disabled', false); - if (typeof amount == "undefined") { - amount = 0; - } + formHandler.init(form); + formHandler.switchBrand(selectedBrand); + }); + } + fillBrandList(formObject, method) { + if (method == undefined) { + method = 'pagarme_creditcard'; + } + const formHandler = new FormHandler(); + formHandler.fillBrandList( + this.platformConfig.avaliableBrands[method], + formObject + ); + } - var installmentsUrl = - this.platformConfig.urls.installments + '/' + - selectedBrand + '/' + - amount; + fillCardAmount(formObject, count, card = null) { + const orderAmount = this.platformConfig.updateTotals.getTotals()().grand_total / count; - jQuery.ajax({ - url: installmentsUrl, - method: 'GET', - cache: true, - }).done(function(data) { - formHandler = new FormHandler(); + let amount = orderAmount.toFixed(this.platformConfig.currency.precision); + const separator = "."; - if (!data.length) return; + amount = amount.replace(separator, this.platformConfig.currency.decimalSeparator); - form.creditCardInstallments.prop('disabled', true); - formHandler.updateInstallmentSelect(data, form.creditCardInstallments, installmentSelected); - form.creditCardInstallments.prop('disabled', false); + if (card === 1) { + const orderAmountOriginal = amount.replace(this.platformConfig.currency.decimalSeparator, "."); + const amountBalance = (this.platformConfig.updateTotals.getTotals()().grand_total - orderAmountOriginal).toFixed(2); + formObject.inputAmount.val(amountBalance.replace(".", this.platformConfig.currency.decimalSeparator)); + return; + } - formHandler.init(form); - formHandler.switchBrand(selectedBrand); - }); -}; + formObject.inputAmount.val(amount); + } + validateCcNumberField(element, formObject) { + if (element.val() === '') { + formObject.creditCardBrand.val(''); -PaymentMethodController.prototype.fillBrandList = function (formObject, method) { - if (method == undefined) { - method = 'pagarme_creditcard'; - } - var formHandler = new FormHandler(); - formHandler.fillBrandList( - this.platformConfig.avaliableBrands[method], - formObject - ); -}; - -PaymentMethodController.prototype.fillCardAmount = function (formObject, count, card = null) { - var orderAmount = platFormConfig.updateTotals.getTotals()().grand_total / count; - - var amount = orderAmount.toFixed(this.platformConfig.currency.precision); - var separator = "."; - - amount = amount.replace(separator, this.platformConfig.currency.decimalSeparator); - - if (card === 1) { - var orderAmountOriginal = amount.replace(this.platformConfig.currency.decimalSeparator, "."); - var amountBalance = (platFormConfig.updateTotals.getTotals()().grand_total - orderAmountOriginal).toFixed(2); - formObject.inputAmount.val(amountBalance.replace(".", this.platformConfig.currency.decimalSeparator)); - return; - } + const formHandler = new FormHandler(); + formHandler.init(formObject); + formHandler.switchBrand(''); + } + this.validateDefaultField(element); + this.validateBrandField(formObject); + } + validateCcExpDateField(formObject) { + const cardExpirationMonth = formObject.creditCardExpMonth; + const cardExpirationYear = formObject.creditCardExpYear; + + const cardDate = new Date(cardExpirationYear.val(), cardExpirationMonth.val() -1); + const dateNow = new Date(); + + const monthParentsElements = cardExpirationMonth.parent().parent(); + const yearParentsElements = cardExpirationYear.parent().parent(); + const parentsElements = yearParentsElements.parents('.field'); + const parentsElementsError = parentsElements.find(fieldError); + + if (cardDate < dateNow) { + monthParentsElements.addClass(errorClass); + yearParentsElements.addClass(errorClass); + parentsElementsError.show(); + return true; + } - formObject.inputAmount.val(amount); -}; + monthParentsElements.removeClass(errorClass); + yearParentsElements.removeClass(errorClass); + parentsElementsError.hide(); + return false; + } + validateDefaultField(element) { + const requiredElement = element.parent().parent(); + const requiredElementError = requiredElement.children(fieldError); + + if (element.val() === '') { + requiredElement.addClass(errorClass); + requiredElementError.show(); + return true; + } -PaymentMethodController.prototype.validateCcNumberField = function (element, formObject) { - if (element.val() === '') { - formObject.creditCardBrand.val(''); + requiredElement.removeClass(errorClass); + requiredElementError.hide(); + return false; + } + validateBrandField(formObject) { + const element = formObject.creditCardBrand; + const requiredElement = element.parent().parent(); + const requiredElementError = requiredElement.find(fieldError); - formHandler = new FormHandler(); - formHandler.init(formObject); - formHandler.switchBrand(''); - } - this.validateDefaultField(element); - this.validateBrandField(formObject); -}; - -const fieldError = '.field-error'; -const errorClass = '_error'; - -PaymentMethodController.prototype.validateCcExpDateField = function (formObject) { - const cardExpirationMonth = formObject.creditCardExpMonth; - const cardExpirationYear = formObject.creditCardExpYear; - - const cardDate = new Date (cardExpirationYear.val(), cardExpirationMonth.val() -1); - const dateNow = new Date(); - - const monthParentsElements = cardExpirationMonth.parent().parent(); - const yearParentsElements = cardExpirationYear.parent().parent(); - const parentsElements = yearParentsElements.parents('.field'); - const parentsElementsError = parentsElements.find(fieldError); - - if (cardDate < dateNow) { - monthParentsElements.addClass(errorClass); - yearParentsElements.addClass(errorClass); - parentsElementsError.show(); - return true; - } + const brands = []; + PlatformConfig.PlatformConfig.avaliableBrands[formObject.savedCardSelectUsed].forEach(function (item) { + brands.push(item.title.toUpperCase()); + }); - monthParentsElements.removeClass(errorClass); - yearParentsElements.removeClass(errorClass); - parentsElementsError.hide(); - return false; -}; + if ( + !brands.includes(element.val().toUpperCase()) + || element.val === '' + ) { + requiredElement.addClass(errorClass); + requiredElementError.show(); + requiredElement.find('.nobrand').hide(); + return true; + } -PaymentMethodController.prototype.validateDefaultField = function (element) { - const requiredElement = element.parent().parent(); - const requiredElementError = requiredElement.children(fieldError); + requiredElement.removeClass(errorClass); + requiredElementError.hide(); - if (element.val() === '') { - requiredElement.addClass(errorClass); - requiredElementError.show(); - return true; - } + return false; + } + setBin(binObj, creditCardNumberElement, formObject) { - requiredElement.removeClass(errorClass); - requiredElementError.hide(); - return false; -}; - -PaymentMethodController.prototype.validateBrandField = function (formObject) { - const element = formObject.creditCardBrand; - const requiredElement = element.parent().parent(); - const requiredElementError = requiredElement.find(fieldError); - - const brands = []; - PlatformConfig.PlatformConfig.avaliableBrands[formObject.savedCardSelectUsed].forEach(function (item) { - brands.push(item.title.toUpperCase()); - }); - - if ( - !brands.includes(element.val().toUpperCase()) - || element.val === '' - ) { - requiredElement.addClass(errorClass); - requiredElementError.show(); - requiredElement.find('.nobrand').hide(); - return true; - } + const bin = binObj; + const cardNumber = bin.formatNumber(creditCardNumberElement.val()); - requiredElement.removeClass(errorClass); - requiredElementError.hide(); + if (cardNumber.length < 4) { + return; + } - return false; -}; + const isNewBrand = bin.validate(cardNumber); -PaymentMethodController.prototype.setBin = function (binObj, creditCardNumberElement, formObject) { + bin.init(cardNumber); - var bin = binObj; - var cardNumber = bin.formatNumber(creditCardNumberElement.val()); + const formHandler = new FormHandler(); + formHandler.init(formObject); + formHandler.switchBrand(bin.selectedBrand); + if (isNewBrand) { + this.fillInstallments(formObject); + } - if (cardNumber.length < 4) { - return; - } + return; + } - var isNewBrand = bin.validate(cardNumber); + limitCharacters(element, limit) { + const val = element.val(); - bin.init(cardNumber); + if(val != "" && val.length > limit) { + element.val(val.substring(0, limit)); + } + } - formHandler = new FormHandler(); - formHandler.init(formObject); - formHandler.switchBrand(bin.selectedBrand); - if (isNewBrand) { - this.fillInstallments(formObject); - } + clearLetters(element) { + const val = element.val(); + const newVal = val.replace(/[^0-9]+/g, ''); + element.val(newVal); + } + + clearNumbers(element) { + const val = element.val(); + const newVal = val.replace(/[0-9.-]+/g, ''); + element.val(newVal); + } - return; -}; + hideCardAmount(formObject) { + const formHandler = new FormHandler(); + formHandler.init(formObject); + formHandler.hideInputAmount(formObject); + } -PaymentMethodController.prototype.limitCharacters = function (element, limit) { - var val = element.val(); + fillFormText(formObject, method = null) { + const formText = this.platformConfig.text; - if(val != "" && val.length > limit) { - element.val(val.substring(0, limit)); - } -}; + const creditCardExpYear = formObject.creditCardExpYear.val(); + const creditCardExpMonth = formObject.creditCardExpMonth.val() + + const formHandler = new FormHandler(); + formHandler.init(formObject); + formHandler.fillExpirationYearSelect(formText, method, creditCardExpYear); + formHandler.fillExpirationMonthSelect(formText, method, creditCardExpMonth); + //@Todo add other texts + } -PaymentMethodController.prototype.clearLetters = function (element) { - var val = element.val(); - var newVal = val.replace(/[^0-9]+/g, ''); - element.val(newVal); -}; + fillSavedCreditCardsSelect(formObject) { + const platformConfig = this.platformConfig; -PaymentMethodController.prototype.clearNumbers = function (element) { - var val = element.val(); - var newVal = val.replace(/[0-9.-]+/g, ''); - element.val(newVal); -}; + const formHandler = new FormHandler(); + formHandler.init(formObject); + formHandler.fillSavedCreditCardsSelect(platformConfig, formObject); -PaymentMethodController.prototype.hideCardAmount = function (formObject) { - formHandler = new FormHandler(); - formHandler.init(formObject); - formHandler.hideInputAmount(formObject); -}; + if (typeof formObject.savedCreditCardSelect[0] != 'undefined') { -PaymentMethodController.prototype.fillFormText = function (formObject, method = null) { - formText = this.platformConfig.text; + let brand = $('option:selected').attr('brand'); - var creditCardExpYear = formObject.creditCardExpYear.val(); - var creditCardExpMonth = formObject.creditCardExpMonth.val() + if (brand == undefined) { + brand = formObject.creditCardBrand.val(); + } - formHandler = new FormHandler(); - formHandler.init(formObject); - formHandler.fillExpirationYearSelect(formText, method, creditCardExpYear); - formHandler.fillExpirationMonthSelect(formText, method, creditCardExpMonth); - //@Todo add other texts -}; + formObject.creditCardBrand.val(brand); -PaymentMethodController.prototype.fillSavedCreditCardsSelect = function (formObject) { - platformConfig = this.platformConfig; + if ( + typeof formObject.multibuyer != 'undefined' && + typeof formObject.multibuyer.showMultibuyer != 'undefined' && + formObject.savedCreditCardSelect[0].length > 0 + ) { + formObject.multibuyer.showMultibuyer.parent().hide(); + } + } + } - formHandler = new FormHandler(); - formHandler.init(formObject); - formHandler.fillSavedCreditCardsSelect(platformConfig, formObject); + fillMultibuyerStateSelect(formObject) { + const platformConfig = this.platformConfig; - if (typeof formObject.savedCreditCardSelect[0] != 'undefined') { + const formHandler = new FormHandler(); + formHandler.init(formObject); + formHandler.fillMultibuyerStateSelect(platformConfig, formObject); + } - var brand = jQuery('option:selected').attr('brand'); + removeMultibuyerForm(formObject) { + const formHandler = new FormHandler(); + formHandler.init(formObject); + formHandler.removeMultibuyerForm(formObject); + } - if (brand == undefined) { - brand = formObject.creditCardBrand.val(); + addShowMultibuyerListener(formObject) { + $(formObject.multibuyer.showMultibuyer).on('click', function () { + formHandler.init(formObject); + formHandler.toggleMultibuyer(formObject); + }); } - formObject.creditCardBrand.val(brand); + isTotalOnAmountInputs(formObject, platformConfig) { + const orderTotal = platformConfig.updateTotals.getTotals()().grand_total; + const card1 = formObject[0].inputAmount.val()?.replace(platformConfig.currency.decimalSeparator, "."); + const card2 = formObject[1].inputAmount.val()?.replace(platformConfig.currency.decimalSeparator, "."); + const totalInputs = (parseFloat(card1) + parseFloat(card2)); - if ( - typeof formObject.multibuyer != 'undefined' && - typeof formObject.multibuyer.showMultibuyer != 'undefined' && - formObject.savedCreditCardSelect[0].length > 0 - ) { - formObject.multibuyer.showMultibuyer.parent().hide(); + return orderTotal == totalInputs; } - } -}; - -PaymentMethodController.prototype.fillMultibuyerStateSelect = function (formObject) { - platformConfig = this.platformConfig; - - formHandler = new FormHandler(); - formHandler.init(formObject); - formHandler.fillMultibuyerStateSelect(platformConfig, formObject); -}; - -PaymentMethodController.prototype.removeMultibuyerForm = function (formObject) { - formHandler = new FormHandler(); - formHandler.init(formObject); - formHandler.removeMultibuyerForm(formObject); -}; - -PaymentMethodController.prototype.addShowMultibuyerListener = function(formObject) { - jQuery(formObject.multibuyer.showMultibuyer).on('click', function () { - formHandler.init(formObject); - formHandler.toggleMultibuyer(formObject); - }); -}; - -PaymentMethodController.prototype.isTotalOnAmountInputs = function(formObject, platformConfig) { - var orderTotal = platformConfig.updateTotals.getTotals()().grand_total; - var card1 = formObject[0].inputAmount.val().replace(platformConfig.currency.decimalSeparator, "."); - var card2 = formObject[1].inputAmount.val().replace(platformConfig.currency.decimalSeparator, "."); - var totalInputs = (parseFloat(card1) + parseFloat(card2)); - - return orderTotal == totalInputs; -}; - -PaymentMethodController.prototype.validatePublicKey = function (publicKey) { - if (!publicKey) { - var error = - "Não foi possivel conectar com o serviço de pagamento. " + - "Por favor contate o administrador da loja."; - this.model.addErrors(error); - return false; - } - return true; -}; + validatePublicKey(publicKey) { + if (!publicKey) { + const error = + "Não foi possivel conectar com o serviço de pagamento. " + + "Por favor contate o administrador da loja."; + this.model.addErrors(error); + return false; + } + + return true; + } + } +}); diff --git a/view/frontend/web/js/core/checkout/PaymentModuleBootstrap.js b/view/frontend/web/js/core/checkout/PaymentModuleBootstrap.js index 0882118d..65e8bae1 100644 --- a/view/frontend/web/js/core/checkout/PaymentModuleBootstrap.js +++ b/view/frontend/web/js/core/checkout/PaymentModuleBootstrap.js @@ -2,56 +2,60 @@ * This code should be migrated to core_module */ -var PagarmeCore = { - paymentMethod : [] -}; - -PagarmeCore.initPaymentMethod = function (methodCode, platformConfig) { - var _self = this; - setTimeout(function() { - _self.init(methodCode, platformConfig); - }, 1000); -}; - -PagarmeCore.init = function (methodCode, platformConfig) { - this.paymentMethod[methodCode] = new PaymentMethodController(methodCode, platformConfig); - this.paymentMethod[methodCode].init(); -} -PagarmeCore.initBin = function (methodCode, obj) { - this.paymentMethod[methodCode].initBin(obj); -}; - -PagarmeCore.validatePaymentMethod = function (methodCode) { - this.paymentMethod = - new PaymentMethodController(methodCode); - - this.paymentMethod.init(); - return this.paymentMethod.formValidation(); -}; - -PagarmeCore.placeOrder = function(platformObject, model) { - - if (this.paymentMethod[model].model.validate()) { - try { - //This object should be injected on this method, not instantiated here - var platformOrderPlace = new PlatformPlaceOrder( - platformObject.obj, - platformObject.data, - platformObject.event - ); - - this.paymentMethod[model].placeOrder(platformOrderPlace); - } catch (e) { - console.log(e) +define([ + 'Pagarme_Pagarme/js/core/checkout/PaymentMethodController', + 'Pagarme_Pagarme/js/core/checkout/PlatformPlaceOrder' +], (PaymentMethodController, PlatformPlaceOrder) => { + const PagarmeCore = { + paymentMethod : [] + }; + + PagarmeCore.init = (methodCode, platformConfig) => { + PagarmeCore.paymentMethod[methodCode] = new PaymentMethodController(methodCode, platformConfig); + PagarmeCore.paymentMethod[methodCode].init(); + }; + + PagarmeCore.initPaymentMethod = (methodCode, platformConfig) => { + setTimeout(function() { + PagarmeCore.init(methodCode, platformConfig); + }, 1000); + }; + + PagarmeCore.initBin = (methodCode, obj) => { + PagarmeCore.paymentMethod[methodCode].initBin(obj); + }; + + PagarmeCore.validatePaymentMethod = (methodCode) => { + PagarmeCore.paymentMethod = + new PaymentMethodController(methodCode); + + PagarmeCore.paymentMethod.init(); + return PagarmeCore.paymentMethod.formValidation(); + }; + + PagarmeCore.placeOrder = (platformObject, model) => { + if (PagarmeCore.paymentMethod[model].model.validate()) { + try { + const platformOrderPlace = new PlatformPlaceOrder( + platformObject.obj, + platformObject.data, + platformObject.event + ); + PagarmeCore.paymentMethod[model].placeOrder(platformOrderPlace); + } catch (e) { + console.log(e) + } } - } - var errors = this.paymentMethod[model].model.errors; - if (errors.length > 0) { - for (index in errors) { - this.messageList.addErrorMessage(errors[index]); + const errors = PagarmeCore.paymentMethod[model].model.errors; + if (errors.length > 0) { + for (let index in errors) { + this.messageList.addErrorMessage(errors[index]); + } + jQuery("html, body").animate({scrollTop: 0}, 600); + console.log(errors); } - jQuery("html, body").animate({scrollTop: 0}, 600); - console.log(errors); - } -} \ No newline at end of file + }; + + return PagarmeCore; +}); diff --git a/view/frontend/web/js/core/checkout/PlatformConfig.js b/view/frontend/web/js/core/checkout/PlatformConfig.js new file mode 100644 index 00000000..9fcf6999 --- /dev/null +++ b/view/frontend/web/js/core/checkout/PlatformConfig.js @@ -0,0 +1,163 @@ +define([], () => { + const PlatformConfig = { + PlatformConfig: {} + }; + + PlatformConfig.getBrands = (data, paymentMethodBrands) => { + const availableBrands = []; + + if (paymentMethodBrands !== undefined) { + const brands = Object.keys(paymentMethodBrands); + + for (let i = 0, len = brands.length; i < len; i++) { + const brand = data.payment.ccform.icons[brands[i]]; + if (!brand) continue; + const url = brand.url; + + availableBrands[i] = { + 'title': brands[i], + 'image': url + + }; + } + } + return availableBrands; + }; + + PlatformConfig.getAvaliableBrands = (data) => { + const creditCardBrands = PlatformConfig.getBrands( + data, + data.payment.ccform.availableTypes.pagarme_creditcard + ); + + const voucherBrands = PlatformConfig.getBrands( + data, + data.payment.ccform.availableTypes.pagarme_voucher + ); + + const debitBrands = PlatformConfig.getBrands( + data, + data.payment.ccform.availableTypes.pagarme_debit + ); + + const twoCreditcardBrands = PlatformConfig.getBrands( + data, + data.payment.ccform.availableTypes.pagarme_two_creditcard + ); + + const billetCreditcardBrands = PlatformConfig.getBrands( + data, + data.payment.ccform.availableTypes.pagarme_billet_creditcard + ); + + return { + 'pagarme_creditcard': creditCardBrands, + 'pagarme_voucher': voucherBrands, + 'pagarme_debit': debitBrands, + 'pagarme_two_creditcard': twoCreditcardBrands, + 'pagarme_billet_creditcard': billetCreditcardBrands + }; + }; + + PlatformConfig.getSavedCreditCards = (platFormConfig) => { + let creditCard = null; + let twoCreditCard = null; + let billetCreditCard = null; + let voucherCard = null; + let debitCard = null; + + if ( + platFormConfig.payment.pagarme_creditcard.enabled_saved_cards && + typeof(platFormConfig.payment.pagarme_creditcard.cards != "undefined") + ) { + creditCard = platFormConfig.payment.pagarme_creditcard.cards; + } + + if ( + platFormConfig.payment.pagarme_voucher.enabled_saved_cards && + typeof(platFormConfig.payment.pagarme_voucher.cards != "undefined") + ) { + voucherCard = platFormConfig.payment.pagarme_voucher.cards; + } + + if ( + platFormConfig.payment.pagarme_two_creditcard.enabled_saved_cards && + typeof(platFormConfig.payment.pagarme_two_creditcard.cards != "undefined") + ) { + twoCreditCard = platFormConfig.payment.pagarme_two_creditcard.cards; + } + + if ( + platFormConfig.payment.pagarme_billet_creditcard.enabled_saved_cards && + typeof(platFormConfig.payment.pagarme_billet_creditcard.cards != "undefined") + ) { + billetCreditCard = platFormConfig.payment.pagarme_billet_creditcard.cards; + } + + if ( + platFormConfig.payment.pagarme_debit.enabled_saved_cards && + typeof(platFormConfig.payment.pagarme_debit.cards != "undefined") + ) { + debitCard = platFormConfig.payment.pagarme_debit.cards; + } + + return { + "pagarme_creditcard": creditCard, + "pagarme_two_creditcard": twoCreditCard, + "pagarme_billet_creditcard": billetCreditCard, + "pagarme_voucher": voucherCard, + "pagarme_debit": debitCard + }; + }; + + PlatformConfig.bind = (platformConfig) => { + const grandTotal = parseFloat(platformConfig.grand_total); + + const publicKey = platformConfig.payment.ccform.pk_token; + + const urls = { + base: platformConfig.base_url, + installments : platformConfig.moduleUrls.installments + }; + + const currency = { + code : platformConfig.quoteData.base_currency_code, + decimalSeparator : platformConfig.basePriceFormat.decimalSymbol, + precision : platformConfig.basePriceFormat.precision + }; + + const text = { + months: platformConfig.payment.ccform.months, + years: platformConfig.payment.ccform.years + } + + const avaliableBrands = PlatformConfig.getAvaliableBrands(platformConfig); + const savedAllCards = PlatformConfig.getSavedCreditCards(platformConfig); + + const loader = { + start: platformConfig.loader.startLoader, + stop: platformConfig.loader.stopLoader + }; + const totals = platformConfig.totalsData; + + PlatformConfig.PlatformConfig = { + avaliableBrands: avaliableBrands, + orderAmount : grandTotal.toFixed(platformConfig.basePriceFormat.precision), + urls: urls, + currency : currency, + text: text, + publicKey: publicKey, + totals: totals, + loader: loader, + addresses: platformConfig.addresses, + updateTotals: platformConfig.updateTotals, + savedAllCards: savedAllCards, + region_states: platformConfig.region_states, + isMultibuyerEnabled: platformConfig.is_multi_buyer_enabled + }; + + return PlatformConfig.PlatformConfig; + } + + return PlatformConfig; +}); diff --git a/view/frontend/web/js/core/checkout/PlatformFormBiding.js b/view/frontend/web/js/core/checkout/PlatformFormBiding.js deleted file mode 100644 index 02393242..00000000 --- a/view/frontend/web/js/core/checkout/PlatformFormBiding.js +++ /dev/null @@ -1,597 +0,0 @@ -var FormObject = {}; -var PlatformConfig = {}; - -PlatformConfig.bind = function (platformConfig) { - grandTotal = parseFloat(platformConfig.grand_total); - - publicKey = platformConfig.payment.ccform.pk_token; - - urls = { - base: platformConfig.base_url, - installments : platformConfig.moduleUrls.installments - }; - - currency = { - code : platformConfig.quoteData.base_currency_code, - decimalSeparator : platformConfig.basePriceFormat.decimalSymbol, - precision : platformConfig.basePriceFormat.precision - }; - - text = { - months: platformConfig.payment.ccform.months, - years: platformConfig.payment.ccform.years - } - - avaliableBrands = this.getAvaliableBrands(platformConfig); - savedAllCards = this.getSavedCreditCards(platformConfig); - - loader = { - start: platformConfig.loader.startLoader, - stop: platformConfig.loader.stopLoader - }; - totals = platformConfig.totalsData; - - var config = { - avaliableBrands: avaliableBrands, - orderAmount : grandTotal.toFixed(platformConfig.basePriceFormat.precision), - urls: urls, - currency : currency, - text: text, - publicKey: publicKey, - totals: totals, - loader: loader, - addresses: platformConfig.addresses, - updateTotals: platformConfig.updateTotals, - savedAllCards: savedAllCards, - region_states: platformConfig.region_states, - isMultibuyerEnabled: platformConfig.is_multi_buyer_enabled - }; - - this.PlatformConfig = config; - - return this.PlatformConfig; -}; - -PlatformConfig.getAvaliableBrands = function (data) { - creditCardBrands = this.getBrands( - data, - data.payment.ccform.availableTypes.pagarme_creditcard - ); - - voucherBrands = this.getBrands( - data, - data.payment.ccform.availableTypes.pagarme_voucher - ); - - debitBrands = this.getBrands( - data, - data.payment.ccform.availableTypes.pagarme_debit - ); - - twoCreditcardBrands = this.getBrands( - data, - data.payment.ccform.availableTypes.pagarme_two_creditcard - ); - - billetCreditcardBrands = this.getBrands( - data, - data.payment.ccform.availableTypes.pagarme_billet_creditcard - ); - - return { - 'pagarme_creditcard': creditCardBrands, - 'pagarme_voucher': voucherBrands, - 'pagarme_debit': debitBrands, - 'pagarme_two_creditcard': twoCreditcardBrands, - 'pagarme_billet_creditcard': billetCreditcardBrands - }; -} - -PlatformConfig.getBrands = function (data, paymentMethodBrands) { - var availableBrands = []; - - if (paymentMethodBrands !== undefined) { - var brands = Object.keys(paymentMethodBrands); - - for (var i = 0, len = brands.length; i < len; i++) { - brand = data.payment.ccform.icons[brands[i]]; - if (!brand) continue; - url = brand.url; - fixArray = []; - imageUrl = fixArray.concat(url); - - availableBrands[i] = { - 'title': brands[i], - 'image': imageUrl[0] - - }; - } - } - return availableBrands; -} - -FormObject.creditCardInit = function (isMultibuyerEnabled) { - - this.FormObject = {}; - - var containerSelector = '#pagarme_creditcard-form'; - - if (typeof jQuery(containerSelector).html() == 'undefined') { - this.FormObject = null; - return; - } - - var creditCardForm = { - 'containerSelector' : containerSelector, - "creditCardNumber" : jQuery(containerSelector + " .cc_number"), - "creditCardHolderName" : jQuery(containerSelector + " .cc_owner"), - "creditCardExpMonth" : jQuery(containerSelector + " .cc_exp_month"), - "creditCardExpYear" : jQuery(containerSelector + " .cc_exp_year"), - "creditCardCvv" : jQuery(containerSelector + " .cc_cid"), - "creditCardInstallments" : jQuery(containerSelector + " .cc_installments"), - "creditCardBrand" : jQuery(containerSelector + " .cc_type"), - "creditCardToken" : jQuery(containerSelector + " .cc_token"), - "inputAmount" : jQuery(containerSelector + " .cc_amount"), - "inputAmountContainer" : jQuery(containerSelector + " .amount-container"), - "savedCreditCardSelect" : jQuery(containerSelector + " .cc_saved_creditcards"), - "saveThisCard" : jQuery(containerSelector + " .save_this_card") - }; - - if (isMultibuyerEnabled) { - var multibuyerForm = { - "showMultibuyer" : jQuery(containerSelector + " .show_multibuyer"), - "firstname" : jQuery(containerSelector + " .multibuyer_firstname"), - "lastname" : jQuery(containerSelector + " .multibuyer_lastname"), - "email" : jQuery(containerSelector + " .multibuyer_email"), - "zipcode" : jQuery(containerSelector + " .multibuyer_zipcode"), - "document" : jQuery(containerSelector + " .multibuyer_document"), - "street" : jQuery(containerSelector + " .multibuyer_street"), - "number" : jQuery(containerSelector + " .multibuyer_number"), - "complement" : jQuery(containerSelector + " .multibuyer_complement"), - "neighborhood" : jQuery(containerSelector + " .multibuyer_neighborhood"), - "city" : jQuery(containerSelector + " .multibuyer_city"), - "state" : jQuery(containerSelector + " .multibuyer_state"), - "homePhone" : jQuery(containerSelector + " .multibuyer_home_phone"), - "mobilePhone" : jQuery(containerSelector + " .multibuyer_mobile_phone") - } - } - - this.FormObject = creditCardForm; - this.FormObject.numberOfPaymentForms = 1; - this.FormObject.multibuyer = multibuyerForm; - this.FormObject.savedCardSelectUsed = 'pagarme_creditcard'; - - return this.FormObject; -}; - -FormObject.voucherInit = function (isMultibuyerEnabled) { - - this.FormObject = {}; - - var containerSelector = '#pagarme_voucher-form'; - - if (typeof jQuery(containerSelector).html() == 'undefined') { - this.FormObject = null; - return; - } - - var voucherForm = { - 'containerSelector' : containerSelector, - "creditCardNumber" : jQuery(containerSelector + " .cc_number"), - "creditCardHolderName" : jQuery(containerSelector + " .cc_owner"), - "creditCardExpMonth" : jQuery(containerSelector + " .cc_exp_month"), - "creditCardExpYear" : jQuery(containerSelector + " .cc_exp_year"), - "creditCardCvv" : jQuery(containerSelector + " .cc_cid"), - "creditCardInstallments" : jQuery(containerSelector + " .cc_installments"), - "creditCardBrand" : jQuery(containerSelector + " .cc_type"), - "creditCardToken" : jQuery(containerSelector + " .cc_token"), - "inputAmount" : jQuery(containerSelector + " .cc_amount"), - "savedCreditCardSelect" : jQuery(containerSelector + " .cc_saved_creditcards"), - "saveThisCard" : jQuery(containerSelector + " .save_this_card") - }; - - if (isMultibuyerEnabled) { - var multibuyerForm = { - "showMultibuyer" : jQuery(containerSelector + " .show_multibuyer"), - "firstname" : jQuery(containerSelector + " .multibuyer_firstname"), - "lastname" : jQuery(containerSelector + " .multibuyer_lastname"), - "email" : jQuery(containerSelector + " .multibuyer_email"), - "zipcode" : jQuery(containerSelector + " .multibuyer_zipcode"), - "document" : jQuery(containerSelector + " .multibuyer_document"), - "street" : jQuery(containerSelector + " .multibuyer_street"), - "number" : jQuery(containerSelector + " .multibuyer_number"), - "complement" : jQuery(containerSelector + " .multibuyer_complement"), - "neighborhood" : jQuery(containerSelector + " .multibuyer_neighborhood"), - "city" : jQuery(containerSelector + " .multibuyer_city"), - "state" : jQuery(containerSelector + " .multibuyer_state"), - "homePhone" : jQuery(containerSelector + " .multibuyer_home_phone"), - "mobilePhone" : jQuery(containerSelector + " .multibuyer_mobile_phone") - } - } - - this.FormObject = voucherForm; - this.FormObject.numberOfPaymentForms = 1; - this.FormObject.multibuyer = multibuyerForm; - this.FormObject.savedCardSelectUsed = 'pagarme_voucher'; - - return this.FormObject; -}; - -FormObject.debitInit = function (isMultibuyerEnabled) { - - this.FormObject = {}; - - var containerSelector = '#pagarme_debit-form'; - - if (typeof jQuery(containerSelector).html() == 'undefined') { - this.FormObject = null; - return; - } - - var debitForm = { - 'containerSelector' : containerSelector, - "creditCardNumber" : jQuery(containerSelector + " .cc_number"), - "creditCardHolderName" : jQuery(containerSelector + " .cc_owner"), - "creditCardExpMonth" : jQuery(containerSelector + " .cc_exp_month"), - "creditCardExpYear" : jQuery(containerSelector + " .cc_exp_year"), - "creditCardCvv" : jQuery(containerSelector + " .cc_cid"), - "creditCardInstallments" : jQuery(containerSelector + " .cc_installments"), - "creditCardBrand" : jQuery(containerSelector + " .cc_type"), - "creditCardToken" : jQuery(containerSelector + " .cc_token"), - "inputAmount" : jQuery(containerSelector + " .cc_amount"), - "savedCreditCardSelect" : jQuery(containerSelector + " .cc_saved_creditcards"), - "saveThisCard" : jQuery(containerSelector + " .save_this_card") - }; - - if (isMultibuyerEnabled) { - var multibuyerForm = this.getMultibuyerForm(containerSelector) - } - - this.FormObject = debitForm; - this.FormObject.numberOfPaymentForms = 1; - this.FormObject.multibuyer = multibuyerForm; - this.FormObject.savedCardSelectUsed = 'pagarme_debit'; - - return this.FormObject; -}; - -FormObject.getMultibuyerForm = function (containerSelector) { - return { - "showMultibuyer" : jQuery(containerSelector + " .show_multibuyer"), - "firstname" : jQuery(containerSelector + " .multibuyer_firstname"), - "lastname" : jQuery(containerSelector + " .multibuyer_lastname"), - "email" : jQuery(containerSelector + " .multibuyer_email"), - "zipcode" : jQuery(containerSelector + " .multibuyer_zipcode"), - "document" : jQuery(containerSelector + " .multibuyer_document"), - "street" : jQuery(containerSelector + " .multibuyer_street"), - "number" : jQuery(containerSelector + " .multibuyer_number"), - "complement" : jQuery(containerSelector + " .multibuyer_complement"), - "neighborhood" : jQuery(containerSelector + " .multibuyer_neighborhood"), - "city" : jQuery(containerSelector + " .multibuyer_city"), - "state" : jQuery(containerSelector + " .multibuyer_state"), - "homePhone" : jQuery(containerSelector + " .multibuyer_home_phone"), - "mobilePhone" : jQuery(containerSelector + " .multibuyer_mobile_phone") - } -} - -FormObject.twoCreditCardsInit = function (isMultibuyerEnabled) { - - this.FormObject = {}; - - containerSelector = []; - containerSelector.push("#pagarme_two_creditcard-form #two-credit-cards-form-0"); - containerSelector.push("#pagarme_two_creditcard-form #two-credit-cards-form-1"); - - - if (typeof jQuery(containerSelector[0]).html() == 'undefined') { - this.FormObject = null; - return; - } - - //Using for for IE compatibility - for (var i = 0, len = containerSelector.length; i < len; i++) { - FormObject.fillTwoCreditCardsElements(containerSelector[i], i, isMultibuyerEnabled); - } - - this.FormObject.numberOfPaymentForms = 2; - - return this.FormObject; -}; - - -FormObject.pixInit = function (isMultibuyerEnabled) { - - this.FormObject = {}; - - var containerSelector = '#pagarme_pix-form'; - - if (typeof jQuery(containerSelector).html() == 'undefined') { - this.FormObject = null; - return; - } - - var pixElements = { - 'containerSelector' : containerSelector, - "inputAmount" : jQuery(containerSelector + " .cc_amount"), - "inputAmountContainer" : jQuery(containerSelector + " .amount-container") - }; - - if (isMultibuyerEnabled) { - var multibuyerForm = { - "showMultibuyer": jQuery(containerSelector + " .show_multibuyer"), - "firstname": jQuery(containerSelector + " .multibuyer_firstname"), - "lastname": jQuery(containerSelector + " .multibuyer_lastname"), - "email": jQuery(containerSelector + " .multibuyer_email"), - "zipcode": jQuery(containerSelector + " .multibuyer_zipcode"), - "document": jQuery(containerSelector + " .multibuyer_document"), - "street": jQuery(containerSelector + " .multibuyer_street"), - "number": jQuery(containerSelector + " .multibuyer_number"), - "complement": jQuery(containerSelector + " .multibuyer_complement"), - "neighborhood": jQuery(containerSelector + " .multibuyer_neighborhood"), - "city": jQuery(containerSelector + " .multibuyer_city"), - "state": jQuery(containerSelector + " .multibuyer_state"), - "homePhone": jQuery(containerSelector + " .multibuyer_home_phone"), - "mobilePhone": jQuery(containerSelector + " .multibuyer_mobile_phone") - } - } - - this.FormObject = pixElements; - this.FormObject.numberOfPaymentForms = 1; - this.FormObject.multibuyer = multibuyerForm; - return this.FormObject; -} - -FormObject.boletoInit = function (isMultibuyerEnabled) { - - this.FormObject = {}; - - var containerSelector = '#pagarme_billet-form'; - - if (typeof jQuery(containerSelector).html() == 'undefined') { - this.FormObject = null; - return; - } - - var boletoElements = { - 'containerSelector' : containerSelector, - "inputAmount" : jQuery(containerSelector + " .cc_amount"), - "inputAmountContainer" : jQuery(containerSelector + " .amount-container") - }; - - if (isMultibuyerEnabled) { - var multibuyerForm = { - "showMultibuyer": jQuery(containerSelector + " .show_multibuyer"), - "firstname": jQuery(containerSelector + " .multibuyer_firstname"), - "lastname": jQuery(containerSelector + " .multibuyer_lastname"), - "email": jQuery(containerSelector + " .multibuyer_email"), - "zipcode": jQuery(containerSelector + " .multibuyer_zipcode"), - "document": jQuery(containerSelector + " .multibuyer_document"), - "street": jQuery(containerSelector + " .multibuyer_street"), - "number": jQuery(containerSelector + " .multibuyer_number"), - "complement": jQuery(containerSelector + " .multibuyer_complement"), - "neighborhood": jQuery(containerSelector + " .multibuyer_neighborhood"), - "city": jQuery(containerSelector + " .multibuyer_city"), - "state": jQuery(containerSelector + " .multibuyer_state"), - "homePhone": jQuery(containerSelector + " .multibuyer_home_phone"), - "mobilePhone": jQuery(containerSelector + " .multibuyer_mobile_phone") - } - } - - this.FormObject = boletoElements; - this.FormObject.numberOfPaymentForms = 1; - this.FormObject.multibuyer = multibuyerForm; - return this.FormObject; -} - -FormObject.boletoCreditCardInit = function (isMultibuyerEnabled) { - - var containerBoletoSelector = "#pagarme_billet_creditcard-form #billet-form"; - var containerCreditCardSelector = "#pagarme_billet_creditcard-form #credit-card-form"; - - this.FormObject = {}; - - if (typeof jQuery(containerCreditCardSelector + " .cc_installments").html() == 'undefined') { - this.FormObject = null; - return; - } - - var boletoElements = { - 'containerSelector' : containerBoletoSelector, - "inputAmount" : jQuery(containerBoletoSelector + " .cc_amount"), - "inputAmountContainer" : jQuery(containerBoletoSelector + " .amount-container"), - }; - - var cardsElements = { - 'containerSelector' : containerCreditCardSelector, - "creditCardNumber" : jQuery(containerCreditCardSelector + " .cc_number"), - "creditCardHolderName" : jQuery(containerCreditCardSelector + " .cc_owner"), - "creditCardExpMonth" : jQuery(containerCreditCardSelector + " .cc_exp_month"), - "creditCardExpYear" : jQuery(containerCreditCardSelector + " .cc_exp_year"), - "creditCardCvv" : jQuery(containerCreditCardSelector + " .cc_cid"), - "creditCardInstallments" : jQuery(containerCreditCardSelector + " .cc_installments"), - "creditCardBrand" : jQuery(containerCreditCardSelector + " .cc_type"), - "creditCardToken" : jQuery(containerCreditCardSelector + " .cc_token"), - "inputAmount" : jQuery(containerCreditCardSelector + " .cc_amount"), - "inputAmountContainer" : jQuery(containerCreditCardSelector + " .amount-container"), - "savedCreditCardSelect" : jQuery(containerCreditCardSelector + " .cc_saved_creditcards"), - "saveThisCard" : jQuery(containerCreditCardSelector + " .save_this_card") - }; - - this.FormObject[0] = boletoElements; - this.FormObject[1] = cardsElements; - - for (var i = 0, len = 2; i < len; i++) { - FormObject.fillBoletoCreditCardElements(this.FormObject[i].containerSelector, i, isMultibuyerEnabled); - } - - this.FormObject.numberOfPaymentForms = 2; - this.FormObject[1].savedCardSelectUsed = 'pagarme_billet_creditcard'; - - return this.FormObject; -} - -FormObject.fillBoletoCreditCardElements = function (containerSelector, elementId, isMultibuyerEnabled) { - if (isMultibuyerEnabled) { - var multibuyerForm = { - "showMultibuyer" : jQuery(containerSelector + " .show_multibuyer"), - "firstname" : jQuery(containerSelector + " .multibuyer_firstname"), - "lastname" : jQuery(containerSelector + " .multibuyer_lastname"), - "email" : jQuery(containerSelector + " .multibuyer_email"), - "zipcode" : jQuery(containerSelector + " .multibuyer_zipcode"), - "document" : jQuery(containerSelector + " .multibuyer_document"), - "street" : jQuery(containerSelector + " .multibuyer_street"), - "number" : jQuery(containerSelector + " .multibuyer_number"), - "complement" : jQuery(containerSelector + " .multibuyer_complement"), - "neighborhood" : jQuery(containerSelector + " .multibuyer_neighborhood"), - "city" : jQuery(containerSelector + " .multibuyer_city"), - "state" : jQuery(containerSelector + " .multibuyer_state"), - "homePhone" : jQuery(containerSelector + " .multibuyer_home_phone"), - "mobilePhone" : jQuery(containerSelector + " .multibuyer_mobile_phone") - } - - this.FormObject[elementId].multibuyer = multibuyerForm; - } - return this.FormObject; -} - -FormObject.fillTwoCreditCardsElements = function (containerSelector, elementId, isMultibuyerEnabled) { - - if (jQuery(containerSelector).children().length == 0) { - return; - } - - var elements = { - "creditCardNumber" : jQuery(containerSelector + " .cc_number"), - "creditCardHolderName" : jQuery(containerSelector + " .cc_owner"), - "creditCardExpMonth" : jQuery(containerSelector + " .cc_exp_month"), - "creditCardExpYear" : jQuery(containerSelector + " .cc_exp_year"), - "creditCardCvv" : jQuery(containerSelector + " .cc_cid"), - "creditCardInstallments" : jQuery(containerSelector + " .cc_installments"), - "creditCardBrand" : jQuery(containerSelector + " .cc_type"), - "creditCardToken" : jQuery(containerSelector + " .cc_token"), - "inputAmount" : jQuery(containerSelector + " .cc_amount"), - "inputAmountContainer" : jQuery(containerSelector + " .amount-container"), - "savedCreditCardSelect" : jQuery(containerSelector + " .cc_saved_creditcards"), - "saveThisCard" : jQuery(containerSelector + " .save_this_card") - }; - - if (isMultibuyerEnabled) { - var multibuyerForm = { - "showMultibuyer" : jQuery(containerSelector + " .show_multibuyer"), - "firstname" : jQuery(containerSelector + " .multibuyer_firstname"), - "lastname" : jQuery(containerSelector + " .multibuyer_lastname"), - "email" : jQuery(containerSelector + " .multibuyer_email"), - "zipcode" : jQuery(containerSelector + " .multibuyer_zipcode"), - "document" : jQuery(containerSelector + " .multibuyer_document"), - "street" : jQuery(containerSelector + " .multibuyer_street"), - "number" : jQuery(containerSelector + " .multibuyer_number"), - "complement" : jQuery(containerSelector + " .multibuyer_complement"), - "neighborhood" : jQuery(containerSelector + " .multibuyer_neighborhood"), - "city" : jQuery(containerSelector + " .multibuyer_city"), - "state" : jQuery(containerSelector + " .multibuyer_state"), - "homePhone" : jQuery(containerSelector + " .multibuyer_home_phone"), - "mobilePhone" : jQuery(containerSelector + " .multibuyer_mobile_phone") - } - } - - this.FormObject[elementId] = - this.renameTwoCreditCardsElements( - elements, - elementId - ); - - this.FormObject[elementId].multibuyer = - this.renameTwoCreditCardsElements( - multibuyerForm, - elementId - ); - - this.FormObject[elementId].containerSelector = containerSelector; - this.FormObject[elementId].savedCardSelectUsed = 'pagarme_two_creditcard'; - - return this.FormObject; -}; - -FormObject.renameTwoCreditCardsElements = function (elements, elementId) { - var twoCreditCardForm = {}; - - for (var key in elements) { - - name = elements[key].attr('name'); - - newName = name + '[' + elementId + ']'; - - if (name.match(/\[\d\]/g)) { - newName = name; - } - - elements[key].attr('name', newName); - elementType = 'input'; - - if (elements[key].is('select')) { - elementType = 'select'; - } - - newElement = - jQuery( - elementType + - "[name='" + - newName + - "']" - ); - twoCreditCardForm[key] = newElement; - } - - return twoCreditCardForm; -}; - -PlatformConfig.getSavedCreditCards = function (platFormConfig) { - var creditCard = null; - var twoCreditCard = null; - var billetCreditCard = null; - var voucherCard = null; - var debitCard = null; - - if ( - platFormConfig.payment.pagarme_creditcard.enabled_saved_cards && - typeof(platFormConfig.payment.pagarme_creditcard.cards != "undefined") - ) { - creditCard = platFormConfig.payment.pagarme_creditcard.cards; - } - - if ( - platFormConfig.payment.pagarme_voucher.enabled_saved_cards && - typeof(platFormConfig.payment.pagarme_voucher.cards != "undefined") - ) { - voucherCard = platFormConfig.payment.pagarme_voucher.cards; - } - - if ( - platFormConfig.payment.pagarme_two_creditcard.enabled_saved_cards && - typeof(platFormConfig.payment.pagarme_two_creditcard.cards != "undefined") - ) { - twoCreditCard = platFormConfig.payment.pagarme_two_creditcard.cards; - } - - if ( - platFormConfig.payment.pagarme_billet_creditcard.enabled_saved_cards && - typeof(platFormConfig.payment.pagarme_billet_creditcard.cards != "undefined") - ) { - billetCreditCard = platFormConfig.payment.pagarme_billet_creditcard.cards; - } - - if ( - platFormConfig.payment.pagarme_debit.enabled_saved_cards && - typeof(platFormConfig.payment.pagarme_debit.cards != "undefined") - ) { - debitCard = platFormConfig.payment.pagarme_debit.cards; - } - - return { - "pagarme_creditcard": creditCard, - "pagarme_two_creditcard": twoCreditCard, - "pagarme_billet_creditcard": billetCreditCard, - "pagarme_voucher": voucherCard, - "pagarme_debit": debitCard - }; -}; diff --git a/view/frontend/web/js/core/checkout/PlatformFormHandler.js b/view/frontend/web/js/core/checkout/PlatformFormHandler.js index 620216ed..91273cfa 100644 --- a/view/frontend/web/js/core/checkout/PlatformFormHandler.js +++ b/view/frontend/web/js/core/checkout/PlatformFormHandler.js @@ -1,234 +1,225 @@ -var FormHandler = function () { - formObject = {} -}; - -FormHandler.prototype.init = function (formObject) { - this.formObject = formObject; -}; - -FormHandler.prototype.switchBrand = function (brand) { - const brandsSelector = this.formObject.containerSelector + ' .brands'; - const brandElement = this.formObject.creditCardBrand; - - jQuery(brandsSelector).css('filter', 'grayscale(100%) opacity(60%)'); - - if(typeof brand != 'undefined' && brand.length > 0){ - const brandSelector = - this.formObject.containerSelector + ' .' + - brand.toLowerCase(); - - jQuery(brandSelector).css('filter', 'none'); - brandElement.val(brand); - - if (brandElement.val() !== 'default' && brandElement.val() !== '') { - brandElement.change(); +define(['jquery'], ($) => { + return class FormHandler { + constructor() { + this.formObject = {} } - - return; - } - - brandElement.val(''); -}; - -FormHandler.prototype.updateInstallmentSelect = function (installmentsObj, element, installmentSelected = null) { - var content = ""; - for (var i = 0, len = installmentsObj.length; i < len; i++) { - content += - ""; - } - - element.html(content); - - for (var i = 0; i < element[0].length; i++) { - var option = element[0].options[i]; - if (option.value == installmentSelected) { - element.val(installmentSelected); + init(formObject) { + this.formObject = formObject; } - } -}; - -FormHandler.prototype.fillBrandList = function (brandsObject, formObject) { - var html = ''; - - for (var i = 0, len = brandsObject.length; i < len; i++) { - if (!brandsObject[i]) continue; - html += - "
  • " + - "" + - "
    • "; - } + switchBrand(brand) { + const brandsSelector = this.formObject.containerSelector + ' .brands'; + const brandElement = this.formObject.creditCardBrand; - if (html == '') { - jQuery(formObject.containerSelector).find(".nobrand").show(); - } - - jQuery(formObject.containerSelector + ' .credit-card-types').html(html); -}; - -FormHandler.prototype.hideInputAmount = function () { - jQuery(this.formObject.containerSelector).find('.amount').hide(); -}; - -FormHandler.prototype.removeInstallmentsSelect = function () { - jQuery(this.formObject.containerSelector).find('.installments').remove(); -} + $(brandsSelector).css('filter', 'grayscale(100%) opacity(60%)'); -FormHandler.prototype.removeSavedCardsSelect = function (form) { - jQuery(this.formObject.containerSelector).find('.choice').remove(); -} + if(typeof brand != 'undefined' && brand.length > 0){ + const brandSelector = + this.formObject.containerSelector + ' .' + + brand.toLowerCase(); -FormHandler.prototype.fillExpirationYearSelect = function (formText, method, value = null) { + $(brandSelector).css('filter', 'none'); + brandElement.val(brand); - var html = ''; - var years = Object.keys(formText.years[method]); - var len = years.length; + if (brandElement.val() !== 'default' && brandElement.val() !== '') { + brandElement.change(); + } - for (var i = 0; i < len; i++) { - html += - "" - ; - } - - jQuery(this.formObject.creditCardExpYear).html(html); + return; + } - if (value != null) { - this.formObject.creditCardExpYear.val(value); - } -}; - -FormHandler.prototype.fillExpirationMonthSelect = function (formText, method, value = null) { - - var html = ''; - var months = formText.months[method]; - var monthKeys = Object.keys(months); - var len = monthKeys.length; - - for (var i = 0; i < len; i++) { - html += - "" - ; - } + brandElement.val(''); + } + updateInstallmentSelect(installmentsObj, element, installmentSelected = null) { + let content = ""; + for (let i = 0, len = installmentsObj.length; i < len; i++) { + content += + ""; + } - jQuery(this.formObject.creditCardExpMonth).html(html); + element.html(content); - if (value != null) { - this.formObject.creditCardExpMonth.val(value); - } -}; + for (let i = 0; i < element[0].length; i++) { + const option = element[0].options[i]; + if (option.value == installmentSelected) { + element.val(installmentSelected); + } + } + } + fillBrandList(brandsObject, formObject) { + let html = ''; + + for (let i = 0, len = brandsObject.length; i < len; i++) { + if (!brandsObject[i]) continue; + html += + "
  • " + + "" + + "
    • "; + } -FormHandler.prototype.fillSavedCreditCardsSelect = function (platformConfig, formObject) { - var html = ''; - var cards = platformConfig.savedAllCards[formObject.savedCardSelectUsed] + if (html == '') { + $(formObject.containerSelector).find(".nobrand").show(); + } - var brands = []; - platformConfig.avaliableBrands[formObject.savedCardSelectUsed].forEach(function (item) { - brands.push(item.title); - }) + $(formObject.containerSelector + ' .credit-card-types').html(html); + } + hideInputAmount() { + $(this.formObject.containerSelector).find('.amount').hide(); + } + removeInstallmentsSelect = function () { + $(this.formObject.containerSelector).find('.installments').remove(); + } + removeSavedCardsSelect = function () { + $(this.formObject.containerSelector).find('.choice').remove(); + } + fillExpirationYearSelect(formText, method, value = null) { + + let html = ''; + const years = Object.keys(formText.years[method]); + const len = years.length; + + for (let i = 0; i < len; i++) { + html += + "" + ; + } - if (cards) { - var cardKeys = Object.keys(cards); - var len = cardKeys.length; + $(this.formObject.creditCardExpYear).html(html); - for (var i = 0; i < len; i++) { + if (value != null) { + this.formObject.creditCardExpYear.val(value); + } + } + fillExpirationMonthSelect(formText, method, value = null) { + + let html = ''; + const months = formText.months[method]; + const monthKeys = Object.keys(months); + const len = monthKeys.length; + + for (let i = 0; i < len; i++) { + html += + "" + ; + } - var hasBrand = brands.includes(cards[i].brand); + $(this.formObject.creditCardExpMonth).html(html); - if (!hasBrand) { - continue; + if (value != null) { + this.formObject.creditCardExpMonth.val(value); } - - html += - "" - ; } - } + fillSavedCreditCardsSelect = function (platformConfig, formObject) { + let html = ''; + const cards = platformConfig.savedAllCards[formObject.savedCardSelectUsed] + + const brands = []; + platformConfig.avaliableBrands[formObject.savedCardSelectUsed].forEach(function (item) { + brands.push(item.title); + }) + + if (cards) { + const cardKeys = Object.keys(cards); + const len = cardKeys.length; + + for (let i = 0; i < len; i++) { + + const hasBrand = brands.includes(cards[i].brand); + + if (!hasBrand) { + continue; + } + + html += + "" + ; + } + } - if (html.length > 0 && formObject.savedCreditCardSelect.val() != "new") { - jQuery(formObject.containerSelector + ' .new').hide(); - jQuery(formObject.containerSelector).find('.saved').show(); + if (html.length > 0 && formObject.savedCreditCardSelect.val() != "new") { + $(formObject.containerSelector + ' .new').hide(); + $(formObject.containerSelector).find('.saved').show(); - html += ""; - jQuery(formObject.savedCreditCardSelect).html(html); - } -}; + html += ""; + $(formObject.savedCreditCardSelect).html(html); + } + } + fillMultibuyerStateSelect(platformConfig, formObject) { + let html = ""; + const states = platformConfig.region_states; -FormHandler.prototype.fillMultibuyerStateSelect = function (platformConfig, formObject) { - var html = ""; - var states = platformConfig.region_states; + if (states) { + const stateKeys = Object.keys(states); + const len = stateKeys.length; - if (states) { - var stateKeys = Object.keys(states); - var len = stateKeys.length; + for (let i = 0; i < len; i++) { - for (var i = 0; i < len; i++) { + const name = states[i].name || states[i].default_name; - var name = states[i].name || states[i].default_name; + html += + "" + ; + } + } - "'>" + - name + - "" - ; + if (html.length > 0) { + $(formObject.multibuyer.state).html(html); + } } - } - - if (html.length > 0) { - jQuery(formObject.multibuyer.state).html(html); - } -}; - -FormHandler.prototype.removeMultibuyerForm = function (formObject) { - jQuery(formObject.containerSelector + ' .multibuyer').remove(); - jQuery(formObject.containerSelector + ' .show_multibuyer_box').remove(); -} - -FormHandler.prototype.toggleMultibuyer = function (formObject) { - if (formObject.multibuyer.showMultibuyer.prop('checked')) { - - if (formObject.saveThisCard !== undefined) { - formObject.saveThisCard.parent().hide(); + removeMultibuyerForm(formObject) { + $(formObject.containerSelector + ' .multibuyer').remove(); + $(formObject.containerSelector + ' .show_multibuyer_box').remove(); } - jQuery(formObject.containerSelector + ' .multibuyer').show(); - return; - } + toggleMultibuyer(formObject) { + if (formObject.multibuyer.showMultibuyer.prop('checked')) { + + if (formObject.saveThisCard !== undefined) { + formObject.saveThisCard.parent().hide(); + } + $(formObject.containerSelector + ' .multibuyer').show(); + return; + } - if (formObject.saveThisCard !== undefined) { - formObject.saveThisCard.parent().show(); + if (formObject.saveThisCard !== undefined) { + formObject.saveThisCard.parent().show(); + } + $(formObject.containerSelector + ' .multibuyer').hide(); + return; + } } - jQuery(formObject.containerSelector + ' .multibuyer').hide(); - return; -} +}); diff --git a/view/frontend/web/js/core/checkout/PlatformPlaceOrder.js b/view/frontend/web/js/core/checkout/PlatformPlaceOrder.js index 8ce5a379..9e44d4b8 100644 --- a/view/frontend/web/js/core/checkout/PlatformPlaceOrder.js +++ b/view/frontend/web/js/core/checkout/PlatformPlaceOrder.js @@ -1,12 +1,15 @@ -const PlatformPlaceOrder = function (platformObject, data, event) { - this.platformObject = platformObject; - this.data = data; - this.event = event; -} - -PlatformPlaceOrder.prototype.placeOrder = function() { - return this.platformObject.placeOrder( - this.data, - this.event - ); -} \ No newline at end of file +define([], () => { + return class PlatformPlaceOrder { + constructor(platformObject, data, event) { + this.platformObject = platformObject; + this.data = data; + this.event = event; + } + placeOrder = function() { + return this.platformObject.placeOrder( + this.data, + this.event + ); + } + } +}); diff --git a/view/frontend/web/js/core/models/BoletoCreditcardModel.js b/view/frontend/web/js/core/models/BoletoCreditcardModel.js index 7ae76b89..a5ad6101 100644 --- a/view/frontend/web/js/core/models/BoletoCreditcardModel.js +++ b/view/frontend/web/js/core/models/BoletoCreditcardModel.js @@ -1,187 +1,188 @@ -var BoletoCreditcardModel= function (formObject, publicKey) { - this.formObject = formObject; - this.publicKey = publicKey; - this.modelToken = new CreditCardToken(this.formObject); - this.errors = []; - this.formIds = [0, 1]; -}; - -BoletoCreditcardModel.prototype.placeOrder = function (placeOrderObject) { - this.placeOrderObject = placeOrderObject; - var _self = this; - var errors = false; - - for (id in this.formObject) { - - if (id != 1) { - continue; - } - - if ( - typeof this.formObject[id].savedCreditCardSelect.val() != 'undefined' && - this.formObject[id].savedCreditCardSelect.val() != 'new' && - this.formObject[id].savedCreditCardSelect.val() != '' && - this.formObject[id].savedCreditCardSelect.html().length > 1 - ) { - continue; - } - - this.getCreditCardToken( - this.formObject[id], - function (data) { - _self.formObject[id].creditCardToken.val(data.id); - }, - function (error) { - errors = true; - _self.addErrors("Cartão inválido. Por favor, verifique os dados digitados e tente novamente"); - } - ); - } - - if (!errors) { - _self.placeOrderObject.placeOrder(); - } -}; - -BoletoCreditcardModel.prototype.getFormIdInverted = function (id) { - var ids = this.formIds.slice(0); - var index = ids.indexOf(id); - ids.splice(index, 1); - - return ids[0]; -} - -BoletoCreditcardModel.prototype.addErrors = function (error) { - this.errors.push({ - message: error - }) -} - -BoletoCreditcardModel.prototype.getCreditCardToken = function (formObject, success, error) { - var modelToken = new CreditCardToken(formObject); - modelToken.getToken(this.publicKey) - .done(success) - .fail(error); -}; - -BoletoCreditcardModel.prototype.validate = function () { - - var formsInvalid = []; - - for (id in this.formObject) { - - if (id.length > 1) { - continue; - } - var multibuyerValidator = new MultibuyerValidator(this.formObject[id]); - var isMultibuyerValid = multibuyerValidator.validate(); - - if (isMultibuyerValid) { - continue; - } - - formsInvalid.push(true); - } - - var creditCardValidator = new CreditCardValidator(this.formObject[1]); - var isCreditCardValid = creditCardValidator.validate(); - - formsInvalid.push(!isCreditCardValid); - - var hasFormInvalid = formsInvalid.filter(function (item) { - return item; - }); - - if (hasFormInvalid.length > 0) { - return false; - } - - return true; -}; - -BoletoCreditcardModel.prototype.getData = function () { - - saveThiscard = 0; - - if (this.formObject[1].saveThisCard.prop('checked') === 'on') { - saveThiscard = 1; - } - - var data = { - 'method': "pagarme_billet_creditcard", - 'additional_data': { - //boleto - 'cc_billet_amount': this.formObject[0].inputAmount.val(), - //credit_card - 'cc_cc_amount': this.formObject[1].inputAmount.val(), - 'cc_cc_tax_amount': this.formObject[1].creditCardInstallments.find(':selected').attr('interest'), - 'cc_type': this.formObject[1].creditCardBrand.val(), - 'cc_last_4': this.getLastFourNumbers(1), - 'cc_cid': this.formObject[1].creditCardCvv.val(), - 'cc_ss_start_year': this.formObject[1].creditCardExpYear.val(), - 'cc_ss_start_month': this.formObject[1].creditCardExpMonth.val(), - 'cc_number': this.formObject[1].creditCardNumber.val(), - 'cc_owner': this.formObject[1].creditCardHolderName.val(), - 'cc_savecard': saveThiscard, - 'cc_saved_card': this.formObject[1].savedCreditCardSelect.val(), - 'cc_installments': this.formObject[1].creditCardInstallments.val(), - 'cc_token_credit_card': this.formObject[1].creditCardToken.val(), - } - } - - if ( - typeof this.formObject[0].multibuyer != 'undefined' && - typeof this.formObject[0].multibuyer.showMultibuyer != 'undefined' && - this.formObject[0].multibuyer.showMultibuyer.prop( "checked" ) == true - ) { - multibuyer = this.formObject[0].multibuyer; - fullName = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); - - data.additional_data.billet_buyer_checkbox = 1; - data.additional_data.billet_buyer_name = fullName; - data.additional_data.billet_buyer_email = multibuyer.email.val(); - data.additional_data.billet_buyer_document = multibuyer.document.val(); - data.additional_data.billet_buyer_street_title = multibuyer.street.val(); - data.additional_data.billet_buyer_street_number = multibuyer.number.val(); - data.additional_data.billet_buyer_street_complement = multibuyer.complement.val(); - data.additional_data.billet_buyer_zipcode = multibuyer.zipcode.val(); - data.additional_data.billet_buyer_neighborhood = multibuyer.neighborhood.val(); - data.additional_data.billet_buyer_city = multibuyer.city.val(); - data.additional_data.billet_buyer_state = multibuyer.state.val(); - data.additional_data.billet_buyer_home_phone = multibuyer.homePhone.val(); - data.additional_data.billet_buyer_mobile_phone = multibuyer.mobilePhone.val(); - } - - if ( - typeof this.formObject[1].multibuyer != 'undefined' && - typeof this.formObject[1].multibuyer.showMultibuyer != 'undefined' && - this.formObject[1].multibuyer.showMultibuyer.prop( "checked" ) == true - ) { - multibuyer = this.formObject[1].multibuyer; - fullName = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); - - data.additional_data.cc_buyer_checkbox = 1; - data.additional_data.cc_buyer_name = fullName; - data.additional_data.cc_buyer_email = multibuyer.email.val(); - data.additional_data.cc_buyer_document = multibuyer.document.val(); - data.additional_data.cc_buyer_street_title = multibuyer.street.val(); - data.additional_data.cc_buyer_street_number = multibuyer.number.val(); - data.additional_data.cc_buyer_street_complement = multibuyer.complement.val(); - data.additional_data.cc_buyer_zipcode = multibuyer.zipcode.val(); - data.additional_data.cc_buyer_neighborhood = multibuyer.neighborhood.val(); - data.additional_data.cc_buyer_city = multibuyer.city.val(); - data.additional_data.cc_buyer_state = multibuyer.state.val(); - data.additional_data.cc_buyer_home_phone = multibuyer.homePhone.val(); - data.additional_data.cc_buyer_mobile_phone = multibuyer.mobilePhone.val(); - } - - return data; -}; - -BoletoCreditcardModel.prototype.getLastFourNumbers = function(id) { - var number = this.formObject[id].creditCardNumber.val(); - if (number !== undefined) { - return number.slice(-4); - } - return ""; -} +define([ + 'Pagarme_Pagarme/js/core/validators/CreditCardValidator', + 'Pagarme_Pagarme/js/core/validators/MultibuyerValidator', + 'Pagarme_Pagarme/js/core/checkout/CreditCardToken', +], (CreditCardValidator, MultibuyerValidator, CreditCardToken) => { + return class BoletoCreditcardModel { + constructor(formObject, publicKey) { + this.formObject = formObject; + this.publicKey = publicKey; + this.modelToken = new CreditCardToken(this.formObject); + this.errors = []; + this.formIds = [0, 1]; + } + placeOrder(placeOrderObject) { + this.placeOrderObject = placeOrderObject; + const _self = this; + let errors = false; + + for (const id in this.formObject) { + + if (id != 1) { + continue; + } + + if ( + typeof this.formObject[id].savedCreditCardSelect.val() != 'undefined' && + this.formObject[id].savedCreditCardSelect.val() != 'new' && + this.formObject[id].savedCreditCardSelect.val() != '' && + this.formObject[id].savedCreditCardSelect.html().length > 1 + ) { + continue; + } + + this.getCreditCardToken( + this.formObject[id], + function (data) { + _self.formObject[id].creditCardToken.val(data.id); + }, + function (error) { + errors = true; + _self.addErrors("Cartão inválido. Por favor, verifique os dados digitados e tente novamente"); + } + ); + } + + if (!errors) { + _self.placeOrderObject.placeOrder(); + } + } + getFormIdInverted(id) { + const ids = this.formIds.slice(0); + const index = ids.indexOf(id); + ids.splice(index, 1); + + return ids[0]; + } + addErrors(error) { + this.errors.push({ + message: error + }) + } + getCreditCardToken(formObject, success, error) { + const modelToken = new CreditCardToken(formObject); + modelToken.getToken(this.publicKey) + .done(success) + .fail(error); + } + validate() { + + const formsInvalid = []; + + for (const id in this.formObject) { + + if (id.length > 1) { + continue; + } + const multibuyerValidator = new MultibuyerValidator(this.formObject[id]); + const isMultibuyerValid = multibuyerValidator.validate(); + + if (isMultibuyerValid) { + continue; + } + + formsInvalid.push(true); + } + + const creditCardValidator = new CreditCardValidator(this.formObject[1]); + const isCreditCardValid = creditCardValidator.validate(); + + formsInvalid.push(!isCreditCardValid); + + const hasFormInvalid = formsInvalid.filter(function (item) { + return item; + }); + + if (hasFormInvalid.length > 0) { + return false; + } + + return true; + } + getData() { + + let saveThiscard = 0; + + if (this.formObject[1].saveThisCard.prop('checked') === 'on') { + saveThiscard = 1; + } + + const data = { + 'method': "pagarme_billet_creditcard", + 'additional_data': { + //boleto + 'cc_billet_amount': this.formObject[0].inputAmount.val(), + //credit_card + 'cc_cc_amount': this.formObject[1].inputAmount.val(), + 'cc_cc_tax_amount': this.formObject[1].creditCardInstallments.find(':selected').attr('interest'), + 'cc_type': this.formObject[1].creditCardBrand.val(), + 'cc_last_4': this.getLastFourNumbers(1), + 'cc_cid': this.formObject[1].creditCardCvv.val(), + 'cc_ss_start_year': this.formObject[1].creditCardExpYear.val(), + 'cc_ss_start_month': this.formObject[1].creditCardExpMonth.val(), + 'cc_number': this.formObject[1].creditCardNumber.val(), + 'cc_owner': this.formObject[1].creditCardHolderName.val(), + 'cc_savecard': saveThiscard, + 'cc_saved_card': this.formObject[1].savedCreditCardSelect.val(), + 'cc_installments': this.formObject[1].creditCardInstallments.val(), + 'cc_token_credit_card': this.formObject[1].creditCardToken.val(), + } + } + + if ( + typeof this.formObject[0].multibuyer != 'undefined' && + typeof this.formObject[0].multibuyer.showMultibuyer != 'undefined' && + this.formObject[0].multibuyer.showMultibuyer.prop( "checked" ) == true + ) { + const multibuyer = this.formObject[0].multibuyer; + const fullName = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); + + data.additional_data.billet_buyer_checkbox = 1; + data.additional_data.billet_buyer_name = fullName; + data.additional_data.billet_buyer_email = multibuyer.email.val(); + data.additional_data.billet_buyer_document = multibuyer.document.val(); + data.additional_data.billet_buyer_street_title = multibuyer.street.val(); + data.additional_data.billet_buyer_street_number = multibuyer.number.val(); + data.additional_data.billet_buyer_street_complement = multibuyer.complement.val(); + data.additional_data.billet_buyer_zipcode = multibuyer.zipcode.val(); + data.additional_data.billet_buyer_neighborhood = multibuyer.neighborhood.val(); + data.additional_data.billet_buyer_city = multibuyer.city.val(); + data.additional_data.billet_buyer_state = multibuyer.state.val(); + data.additional_data.billet_buyer_home_phone = multibuyer.homePhone.val(); + data.additional_data.billet_buyer_mobile_phone = multibuyer.mobilePhone.val(); + } + + if ( + typeof this.formObject[1].multibuyer != 'undefined' && + typeof this.formObject[1].multibuyer.showMultibuyer != 'undefined' && + this.formObject[1].multibuyer.showMultibuyer.prop( "checked" ) == true + ) { + const multibuyer = this.formObject[1].multibuyer; + const fullName = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); + + data.additional_data.cc_buyer_checkbox = 1; + data.additional_data.cc_buyer_name = fullName; + data.additional_data.cc_buyer_email = multibuyer.email.val(); + data.additional_data.cc_buyer_document = multibuyer.document.val(); + data.additional_data.cc_buyer_street_title = multibuyer.street.val(); + data.additional_data.cc_buyer_street_number = multibuyer.number.val(); + data.additional_data.cc_buyer_street_complement = multibuyer.complement.val(); + data.additional_data.cc_buyer_zipcode = multibuyer.zipcode.val(); + data.additional_data.cc_buyer_neighborhood = multibuyer.neighborhood.val(); + data.additional_data.cc_buyer_city = multibuyer.city.val(); + data.additional_data.cc_buyer_state = multibuyer.state.val(); + data.additional_data.cc_buyer_home_phone = multibuyer.homePhone.val(); + data.additional_data.cc_buyer_mobile_phone = multibuyer.mobilePhone.val(); + } + + return data; + } + getLastFourNumbers(id) { + const number = this.formObject[id].creditCardNumber.val(); + if (number !== undefined) { + return number.slice(-4); + } + return ""; + } + } +}); diff --git a/view/frontend/web/js/core/models/BoletoModel.js b/view/frontend/web/js/core/models/BoletoModel.js index 79e8dc7e..11b3841a 100644 --- a/view/frontend/web/js/core/models/BoletoModel.js +++ b/view/frontend/web/js/core/models/BoletoModel.js @@ -1,61 +1,61 @@ -var BoletoModel = function (formObject) { - this.formObject = formObject; - this.errors = []; -}; - -BoletoModel.prototype.placeOrder = function (placeOrderObject) { - this.placeOrderObject = placeOrderObject; - this.placeOrderObject.placeOrder(); -} - -BoletoModel.prototype.validate = function () { - - var multibuyerValidator = new MultibuyerValidator(this.formObject); - var isMultibuyerValid = multibuyerValidator.validate(); - - if (isMultibuyerValid) { - return true; +define(['Pagarme_Pagarme/js/core/validators/MultibuyerValidator'], (MultibuyerValidator) => { + return class BoletoModel { + constructor(formObject) { + this.formObject = formObject; + this.errors = []; + } + placeOrder = function (placeOrderObject) { + this.placeOrderObject = placeOrderObject; + this.placeOrderObject.placeOrder(); + } + validate() { + + const multibuyerValidator = new MultibuyerValidator(this.formObject); + const isMultibuyerValid = multibuyerValidator.validate(); + + if (isMultibuyerValid) { + return true; + } + + return false; + } + addErrors(error) { + this.errors.push({ + message: error + }) + } + getData() { + + const data = { + 'method': "pagarme_billet", + 'additional_data': {} + }; + + if ( + typeof this.formObject.multibuyer != 'undefined' && + typeof this.formObject.multibuyer.showMultibuyer != 'undefined' && + this.formObject.multibuyer.showMultibuyer.prop( "checked" ) == true + ) { + + const multibuyer = this.formObject.multibuyer; + const fullName = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); + + data.additional_data.billet_buyer_checkbox = 1; + data.additional_data.billet_buyer_name = fullName; + data.additional_data.billet_buyer_email = multibuyer.email.val(); + data.additional_data.billet_buyer_document = multibuyer.document.val(); + data.additional_data.billet_buyer_street_title = multibuyer.street.val(); + data.additional_data.billet_buyer_street_number = multibuyer.number.val(); + data.additional_data.billet_buyer_street_complement = multibuyer.complement.val(); + data.additional_data.billet_buyer_zipcode = multibuyer.zipcode.val(); + data.additional_data.billet_buyer_neighborhood = multibuyer.neighborhood.val(); + data.additional_data.billet_buyer_city = multibuyer.city.val(); + data.additional_data.billet_buyer_state = multibuyer.state.val(); + data.additional_data.billet_buyer_home_phone = multibuyer.homePhone.val(); + data.additional_data.billet_buyer_mobile_phone = multibuyer.mobilePhone.val(); + } + + return data; + } } - - return false; -}; - -BoletoModel.prototype.addErrors = function (error) { - this.errors.push({ - message: error - }) -} - -BoletoModel.prototype.getData = function () { - - data = { - 'method': "pagarme_billet", - 'additional_data': {} - }; - - if ( - typeof this.formObject.multibuyer != 'undefined' && - typeof this.formObject.multibuyer.showMultibuyer != 'undefined' && - this.formObject.multibuyer.showMultibuyer.prop( "checked" ) == true - ) { - - multibuyer = this.formObject.multibuyer; - fullName = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); - - data.additional_data.billet_buyer_checkbox = 1; - data.additional_data.billet_buyer_name = fullName; - data.additional_data.billet_buyer_email = multibuyer.email.val(); - data.additional_data.billet_buyer_document = multibuyer.document.val(); - data.additional_data.billet_buyer_street_title = multibuyer.street.val(); - data.additional_data.billet_buyer_street_number = multibuyer.number.val(); - data.additional_data.billet_buyer_street_complement = multibuyer.complement.val(); - data.additional_data.billet_buyer_zipcode = multibuyer.zipcode.val(); - data.additional_data.billet_buyer_neighborhood = multibuyer.neighborhood.val(); - data.additional_data.billet_buyer_city = multibuyer.city.val(); - data.additional_data.billet_buyer_state = multibuyer.state.val(); - data.additional_data.billet_buyer_home_phone = multibuyer.homePhone.val(); - data.additional_data.billet_buyer_mobile_phone = multibuyer.mobilePhone.val(); - } - - return data; -} +}); diff --git a/view/frontend/web/js/core/models/CreditCardModel.js b/view/frontend/web/js/core/models/CreditCardModel.js index 33290eb1..6de6d852 100644 --- a/view/frontend/web/js/core/models/CreditCardModel.js +++ b/view/frontend/web/js/core/models/CreditCardModel.js @@ -1,129 +1,128 @@ -var CreditCardModel = function (formObject, publicKey) { - this.formObject = formObject; - this.publicKey = publicKey; - this.errors = []; -}; - -CreditCardModel.prototype.placeOrder = function (placeOrderObject) { - this.placeOrderObject = placeOrderObject; - var _self = this; - - if ( - typeof _self.formObject.savedCreditCardSelect.val() != 'undefined' && - _self.formObject.savedCreditCardSelect.html().length > 1 && - _self.formObject.savedCreditCardSelect.val() != 'new' && - _self.formObject.savedCreditCardSelect.val() != '' - ) { - _self.placeOrderObject.placeOrder(); - return; - } - - this.getCreditCardToken( - function (data) { - _self.formObject.creditCardToken.val(data.id); - _self.placeOrderObject.placeOrder(); - }, - function (error) { - var errors = error.responseJSON; - _self.addErrors("Cartão inválido. Por favor, verifique os dados digitados e tente novamente"); +define([ + 'Pagarme_Pagarme/js/core/validators/CreditCardValidator', + 'Pagarme_Pagarme/js/core/validators/MultibuyerValidator', + 'Pagarme_Pagarme/js/core/checkout/CreditCardToken', +], (CreditCardValidator, MultibuyerValidator, CreditCardToken) => { + return class CreditCardModel { + constructor(formObject, publicKey) { + this.formObject = formObject; + this.publicKey = publicKey; + this.errors = []; } - ); -}; - -CreditCardModel.prototype.addErrors = function (error) { - this.errors.push({ - message: error - }) -} - -CreditCardModel.prototype.validate = function () { - - var creditCardValidator = new CreditCardValidator(this.formObject); - var isCreditCardValid = creditCardValidator.validate(); - - var multibuyerValidator = new MultibuyerValidator(this.formObject); - var isMultibuyerValid = multibuyerValidator.validate(); - - if (isCreditCardValid && isMultibuyerValid) { - return true; - } - - return false; -}; - -CreditCardModel.prototype.getCreditCardToken = function (success, error) { - var modelToken = new CreditCardToken(this.formObject); - modelToken.getToken(this.publicKey) - .done(success) - .fail(error); -}; - -CreditCardModel.prototype.getData = function () { - saveThiscard = 0; - var formObject = this.formObject; - - if (formObject.saveThisCard.prop( "checked" )) { - saveThiscard = 1; - } - - data = this.fillData(); - data.additional_data.cc_buyer_checkbox = false; + placeOrder(placeOrderObject) { + this.placeOrderObject = placeOrderObject; + const _self = this; + + if ( + typeof _self.formObject.savedCreditCardSelect.val() != 'undefined' && + _self.formObject.savedCreditCardSelect.html().length > 1 && + _self.formObject.savedCreditCardSelect.val() != 'new' && + _self.formObject.savedCreditCardSelect.val() != '' + ) { + _self.placeOrderObject.placeOrder(); + return; + } + + this.getCreditCardToken( + function (data) { + _self.formObject.creditCardToken.val(data.id); + _self.placeOrderObject.placeOrder(); + }, + function (error) { + _self.addErrors("Cartão inválido. Por favor, verifique os dados digitados e tente novamente"); + } + ); + } + addErrors(error) { + this.errors.push({ + message: error + }) + } + validate() { - if ( - typeof formObject.multibuyer != 'undefined' && - formObject.multibuyer.showMultibuyer.prop( "checked" ) == true - ) { - data = this.fillMultibuyerData(data); - } + const creditCardValidator = new CreditCardValidator(this.formObject); + const isCreditCardValid = creditCardValidator.validate(); - return data; -}; + const multibuyerValidator = new MultibuyerValidator(this.formObject); + const isMultibuyerValid = multibuyerValidator.validate(); -CreditCardModel.prototype.fillData = function() { - var formObject = this.formObject; + if (isCreditCardValid && isMultibuyerValid) { + return true; + } - return { - 'method': "pagarme_creditcard", - 'additional_data': { - 'cc_type': formObject.creditCardBrand.val(), - 'cc_last_4': this.getLastFourNumbers(), - 'cc_exp_year': formObject.creditCardExpYear.val(), - 'cc_exp_month': formObject.creditCardExpMonth.val(), - 'cc_owner': formObject.creditCardHolderName.val(), - 'cc_savecard': saveThiscard, - 'cc_saved_card': formObject.savedCreditCardSelect.val(), - 'cc_installments': formObject.creditCardInstallments.val(), - 'cc_token_credit_card': formObject.creditCardToken.val(), - 'cc_card_tax_amount' : formObject.creditCardInstallments.find(':selected').attr('interest') + return false; + } + getCreditCardToken(success, error) { + const modelToken = new CreditCardToken(this.formObject); + modelToken.getToken(this.publicKey) + .done(success) + .fail(error); } - }; -}; + getData() { + this.saveThiscard = 0; + const formObject = this.formObject; -CreditCardModel.prototype.fillMultibuyerData = function(data) { - multibuyer = this.formObject.multibuyer; - fullname = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); + if (formObject.saveThisCard.prop( "checked" )) { + this.saveThiscard = 1; + } - data.additional_data.cc_buyer_checkbox = 1, - data.additional_data.cc_buyer_name = fullname, - data.additional_data.cc_buyer_email = multibuyer.email.val(), - data.additional_data.cc_buyer_document = multibuyer.document.val(), - data.additional_data.cc_buyer_street_title = multibuyer.street.val(), - data.additional_data.cc_buyer_street_number = multibuyer.number.val(), - data.additional_data.cc_buyer_street_complement = multibuyer.complement.val(), - data.additional_data.cc_buyer_zipcode = multibuyer.zipcode.val(), - data.additional_data.cc_buyer_neighborhood = multibuyer.neighborhood.val(), - data.additional_data.cc_buyer_city = multibuyer.city.val(), - data.additional_data.cc_buyer_state = multibuyer.state.val(), - data.additional_data.cc_buyer_home_phone = multibuyer.homePhone.val(), - data.additional_data.cc_buyer_mobile_phone = multibuyer.mobilePhone.val() + let data = this.fillData(); + data.additional_data.cc_buyer_checkbox = false; - return data; -}; + if ( + typeof formObject.multibuyer != 'undefined' && + formObject.multibuyer.showMultibuyer.prop( "checked" ) == true + ) { + data = this.fillMultibuyerData(data); + } -CreditCardModel.prototype.getLastFourNumbers = function() { - var number = this.formObject.creditCardNumber.val(); - if (number !== undefined) { - return number.slice(-4); + return data; + } + fillData() { + const formObject = this.formObject; + + return { + 'method': "pagarme_creditcard", + 'additional_data': { + 'cc_type': formObject.creditCardBrand.val(), + 'cc_last_4': this.getLastFourNumbers(), + 'cc_exp_year': formObject.creditCardExpYear.val(), + 'cc_exp_month': formObject.creditCardExpMonth.val(), + 'cc_owner': formObject.creditCardHolderName.val(), + 'cc_savecard': this.saveThiscard, + 'cc_saved_card': formObject.savedCreditCardSelect.val(), + 'cc_installments': formObject.creditCardInstallments.val(), + 'cc_token_credit_card': formObject.creditCardToken.val(), + 'cc_card_tax_amount' : formObject.creditCardInstallments.find(':selected').attr('interest') + } + }; + } + fillMultibuyerData(data) { + const multibuyer = this.formObject.multibuyer; + const fullname = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); + + data.additional_data.cc_buyer_checkbox = 1, + data.additional_data.cc_buyer_name = fullname, + data.additional_data.cc_buyer_email = multibuyer.email.val(), + data.additional_data.cc_buyer_document = multibuyer.document.val(), + data.additional_data.cc_buyer_street_title = multibuyer.street.val(), + data.additional_data.cc_buyer_street_number = multibuyer.number.val(), + data.additional_data.cc_buyer_street_complement = multibuyer.complement.val(), + data.additional_data.cc_buyer_zipcode = multibuyer.zipcode.val(), + data.additional_data.cc_buyer_neighborhood = multibuyer.neighborhood.val(), + data.additional_data.cc_buyer_city = multibuyer.city.val(), + data.additional_data.cc_buyer_state = multibuyer.state.val(), + data.additional_data.cc_buyer_home_phone = multibuyer.homePhone.val(), + data.additional_data.cc_buyer_mobile_phone = multibuyer.mobilePhone.val() + + return data; + } + getLastFourNumbers() { + const number = this.formObject.creditCardNumber.val(); + if (number !== undefined) { + return number.slice(-4); + } + return ""; + } } - return ""; -}; +}); diff --git a/view/frontend/web/js/core/models/DebitModel.js b/view/frontend/web/js/core/models/DebitModel.js index a11548af..e0456ac2 100644 --- a/view/frontend/web/js/core/models/DebitModel.js +++ b/view/frontend/web/js/core/models/DebitModel.js @@ -1,129 +1,128 @@ -var DebitModel = function (formObject, publicKey) { - this.formObject = formObject; - this.publicKey = publicKey; - this.errors = []; -}; - -DebitModel.prototype.placeOrder = function (placeOrderObject) { - this.placeOrderObject = placeOrderObject; - var _self = this; - - if ( - typeof _self.formObject.savedCreditCardSelect.val() != 'undefined' && - _self.formObject.savedCreditCardSelect.html().length > 1 && - _self.formObject.savedCreditCardSelect.val() != 'new' && - _self.formObject.savedCreditCardSelect.val() != '' - ) { - _self.placeOrderObject.placeOrder(); - return; - } - - this.getCreditCardToken( - function (data) { - _self.formObject.creditCardToken.val(data.id); - _self.placeOrderObject.placeOrder(); - }, - function (error) { - var errors = error.responseJSON; - _self.addErrors("Cartão inválido. Por favor, verifique os dados digitados e tente novamente"); +define([ + 'Pagarme_Pagarme/js/core/validators/CreditCardValidator', + 'Pagarme_Pagarme/js/core/validators/MultibuyerValidator', + 'Pagarme_Pagarme/js/core/checkout/CreditCardToken', +], (CreditCardValidator, MultibuyerValidator, CreditCardToken) => { + return class DebitModel { + constructor(formObject, publicKey) { + this.formObject = formObject; + this.publicKey = publicKey; + this.errors = []; } - ); -}; - -DebitModel.prototype.addErrors = function (error) { - this.errors.push({ - message: error - }) -} - -DebitModel.prototype.validate = function () { - - var creditCardValidator = new CreditCardValidator(this.formObject); - var isCreditCardValid = creditCardValidator.validate(); - - var multibuyerValidator = new MultibuyerValidator(this.formObject); - var isMultibuyerValid = multibuyerValidator.validate(); - - if (isCreditCardValid && isMultibuyerValid) { - return true; - } - - return false; -}; + placeOrder(placeOrderObject) { + this.placeOrderObject = placeOrderObject; + const _self = this; + + if ( + typeof _self.formObject.savedCreditCardSelect.val() != 'undefined' && + _self.formObject.savedCreditCardSelect.html().length > 1 && + _self.formObject.savedCreditCardSelect.val() != 'new' && + _self.formObject.savedCreditCardSelect.val() != '' + ) { + _self.placeOrderObject.placeOrder(); + return; + } + + this.getCreditCardToken( + function (data) { + _self.formObject.creditCardToken.val(data.id); + _self.placeOrderObject.placeOrder(); + }, + function (error) { + _self.addErrors("Cartão inválido. Por favor, verifique os dados digitados e tente novamente"); + } + ); + } + addErrors(error) { + this.errors.push({ + message: error + }) + } + validate() { -DebitModel.prototype.getCreditCardToken = function (success, error) { - var modelToken = new CreditCardToken(this.formObject); - modelToken.getToken(this.publicKey) - .done(success) - .fail(error); -}; + const creditCardValidator = new CreditCardValidator(this.formObject); + const isCreditCardValid = creditCardValidator.validate(); -DebitModel.prototype.getData = function () { - saveThiscard = 0; - var formObject = this.formObject; + const multibuyerValidator = new MultibuyerValidator(this.formObject); + const isMultibuyerValid = multibuyerValidator.validate(); - if (formObject.saveThisCard.prop( "checked" )) { - saveThiscard = 1; - } + if (isCreditCardValid && isMultibuyerValid) { + return true; + } - data = this.fillData(); - data.additional_data.cc_buyer_checkbox = false; + return false; + } + getCreditCardToken(success, error) { + const modelToken = new CreditCardToken(this.formObject); + modelToken.getToken(this.publicKey) + .done(success) + .fail(error); + } + getData() { + this.saveThiscard = 0; + const formObject = this.formObject; - if ( - typeof formObject.multibuyer != 'undefined' && - formObject.multibuyer.showMultibuyer.prop( "checked" ) == true - ) { - data = this.fillMultibuyerData(data); - } + if (formObject.saveThisCard.prop( "checked" )) { + this.saveThiscard = 1; + } - return data; -}; + let data = this.fillData(); + data.additional_data.cc_buyer_checkbox = false; -DebitModel.prototype.fillData = function() { - var formObject = this.formObject; + if ( + typeof formObject.multibuyer != 'undefined' && + formObject.multibuyer.showMultibuyer.prop( "checked" ) == true + ) { + data = this.fillMultibuyerData(data); + } - return { - 'method': "pagarme_debit", - 'additional_data': { - 'cc_type': formObject.creditCardBrand.val(), - 'cc_last_4': this.getLastFourNumbers(), - 'cc_exp_year': formObject.creditCardExpYear.val(), - 'cc_exp_month': formObject.creditCardExpMonth.val(), - 'cc_owner': formObject.creditCardHolderName.val(), - 'cc_savecard': saveThiscard, - 'cc_saved_card': formObject.savedCreditCardSelect.val(), - 'cc_installments': formObject.creditCardInstallments.val(), - 'cc_token_credit_card': formObject.creditCardToken.val(), - 'cc_card_tax_amount' : formObject.creditCardInstallments.find(':selected').attr('interest') + return data; + } + fillData() { + const formObject = this.formObject; + + return { + 'method': "pagarme_debit", + 'additional_data': { + 'cc_type': formObject.creditCardBrand.val(), + 'cc_last_4': this.getLastFourNumbers(), + 'cc_exp_year': formObject.creditCardExpYear.val(), + 'cc_exp_month': formObject.creditCardExpMonth.val(), + 'cc_owner': formObject.creditCardHolderName.val(), + 'cc_savecard': this.saveThiscard, + 'cc_saved_card': formObject.savedCreditCardSelect.val(), + 'cc_installments': formObject.creditCardInstallments.val(), + 'cc_token_credit_card': formObject.creditCardToken.val(), + 'cc_card_tax_amount' : formObject.creditCardInstallments.find(':selected').attr('interest') + } + }; + } + fillMultibuyerData(data) { + const multibuyer = this.formObject.multibuyer; + const fullname = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); + + data.additional_data.cc_buyer_checkbox = 1, + data.additional_data.cc_buyer_name = fullname, + data.additional_data.cc_buyer_email = multibuyer.email.val(), + data.additional_data.cc_buyer_document = multibuyer.document.val(), + data.additional_data.cc_buyer_street_title = multibuyer.street.val(), + data.additional_data.cc_buyer_street_number = multibuyer.number.val(), + data.additional_data.cc_buyer_street_complement = multibuyer.complement.val(), + data.additional_data.cc_buyer_zipcode = multibuyer.zipcode.val(), + data.additional_data.cc_buyer_neighborhood = multibuyer.neighborhood.val(), + data.additional_data.cc_buyer_city = multibuyer.city.val(), + data.additional_data.cc_buyer_state = multibuyer.state.val(), + data.additional_data.cc_buyer_home_phone = multibuyer.homePhone.val(), + data.additional_data.cc_buyer_mobile_phone = multibuyer.mobilePhone.val() + + return data; + } + getLastFourNumbers() { + const number = this.formObject.creditCardNumber.val(); + if (number !== undefined) { + return number.slice(-4); + } + return ""; } }; -}; - -DebitModel.prototype.fillMultibuyerData = function(data) { - multibuyer = this.formObject.multibuyer; - fullname = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); - - data.additional_data.cc_buyer_checkbox = 1, - data.additional_data.cc_buyer_name = fullname, - data.additional_data.cc_buyer_email = multibuyer.email.val(), - data.additional_data.cc_buyer_document = multibuyer.document.val(), - data.additional_data.cc_buyer_street_title = multibuyer.street.val(), - data.additional_data.cc_buyer_street_number = multibuyer.number.val(), - data.additional_data.cc_buyer_street_complement = multibuyer.complement.val(), - data.additional_data.cc_buyer_zipcode = multibuyer.zipcode.val(), - data.additional_data.cc_buyer_neighborhood = multibuyer.neighborhood.val(), - data.additional_data.cc_buyer_city = multibuyer.city.val(), - data.additional_data.cc_buyer_state = multibuyer.state.val(), - data.additional_data.cc_buyer_home_phone = multibuyer.homePhone.val(), - data.additional_data.cc_buyer_mobile_phone = multibuyer.mobilePhone.val() - - return data; -}; - -DebitModel.prototype.getLastFourNumbers = function() { - var number = this.formObject.creditCardNumber.val(); - if (number !== undefined) { - return number.slice(-4); - } - return ""; -}; +}); diff --git a/view/frontend/web/js/core/models/PixModel.js b/view/frontend/web/js/core/models/PixModel.js index 88922163..28db5d83 100644 --- a/view/frontend/web/js/core/models/PixModel.js +++ b/view/frontend/web/js/core/models/PixModel.js @@ -1,60 +1,60 @@ -PixModel = function (formObject) { - this.formObject = formObject; - this.errors = []; -}; - -PixModel.prototype.placeOrder = function (placeOrderObject) { - this.placeOrderObject = placeOrderObject; - this.placeOrderObject.placeOrder(); -} - -PixModel.prototype.validate = function () { - var multibuyerValidator = new MultibuyerValidator(this.formObject); - var isMultibuyerValid = multibuyerValidator.validate(); - - if (isMultibuyerValid) { - return true; - } - - return false; -}; - -PixModel.prototype.addErrors = function (error) { - this.errors.push({ - message: error - }) -} - -PixModel.prototype.getData = function () { - - var data = { - 'method': "pagarme_pix", - 'additional_data': {} +define(['Pagarme_Pagarme/js/core/validators/MultibuyerValidator'], (MultibuyerValidator) => { + return class PixModel { + constructor(formObject) { + this.formObject = formObject; + this.errors = []; + } + placeOrder(placeOrderObject) { + this.placeOrderObject = placeOrderObject; + this.placeOrderObject.placeOrder(); + } + validate() { + const multibuyerValidator = new MultibuyerValidator(this.formObject); + const isMultibuyerValid = multibuyerValidator.validate(); + + if (isMultibuyerValid) { + return true; + } + + return false; + } + addErrors(error) { + this.errors.push({ + message: error + }) + } + getData() { + + const data = { + 'method': "pagarme_pix", + 'additional_data': {} + }; + + if ( + typeof this.formObject.multibuyer != 'undefined' && + typeof this.formObject.multibuyer.showMultibuyer != 'undefined' && + this.formObject.multibuyer.showMultibuyer.prop( "checked" ) == true + ) { + + const multibuyer = this.formObject.multibuyer; + const fullName = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); + + data.additional_data.pix_buyer_checkbox = 1; + data.additional_data.pix_buyer_name = fullName; + data.additional_data.pix_buyer_email = multibuyer.email.val(); + data.additional_data.pix_buyer_document = multibuyer.document.val(); + data.additional_data.pix_buyer_street_title = multibuyer.street.val(); + data.additional_data.pix_buyer_street_number = multibuyer.number.val(); + data.additional_data.pix_buyer_street_complement = multibuyer.complement.val(); + data.additional_data.pix_buyer_zipcode = multibuyer.zipcode.val(); + data.additional_data.pix_buyer_neighborhood = multibuyer.neighborhood.val(); + data.additional_data.pix_buyer_city = multibuyer.city.val(); + data.additional_data.pix_buyer_state = multibuyer.state.val(); + data.additional_data.pix_buyer_home_phone = multibuyer.homePhone.val(); + data.additional_data.pix_buyer_mobile_phone = multibuyer.mobilePhone.val(); + } + + return data; + } }; - - if ( - typeof this.formObject.multibuyer != 'undefined' && - typeof this.formObject.multibuyer.showMultibuyer != 'undefined' && - this.formObject.multibuyer.showMultibuyer.prop( "checked" ) == true - ) { - - multibuyer = this.formObject.multibuyer; - fullName = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); - - data.additional_data.pix_buyer_checkbox = 1; - data.additional_data.pix_buyer_name = fullName; - data.additional_data.pix_buyer_email = multibuyer.email.val(); - data.additional_data.pix_buyer_document = multibuyer.document.val(); - data.additional_data.pix_buyer_street_title = multibuyer.street.val(); - data.additional_data.pix_buyer_street_number = multibuyer.number.val(); - data.additional_data.pix_buyer_street_complement = multibuyer.complement.val(); - data.additional_data.pix_buyer_zipcode = multibuyer.zipcode.val(); - data.additional_data.pix_buyer_neighborhood = multibuyer.neighborhood.val(); - data.additional_data.pix_buyer_city = multibuyer.city.val(); - data.additional_data.pix_buyer_state = multibuyer.state.val(); - data.additional_data.pix_buyer_home_phone = multibuyer.homePhone.val(); - data.additional_data.pix_buyer_mobile_phone = multibuyer.mobilePhone.val(); - } - - return data; -} +}); diff --git a/view/frontend/web/js/core/models/TwoCreditcardsModel.js b/view/frontend/web/js/core/models/TwoCreditcardsModel.js index 067ae9cd..459dbdb3 100644 --- a/view/frontend/web/js/core/models/TwoCreditcardsModel.js +++ b/view/frontend/web/js/core/models/TwoCreditcardsModel.js @@ -1,204 +1,204 @@ -var TwoCreditcardsModel= function (formObject, publicKey) { - this.formObject = formObject; - this.publicKey = publicKey; - this.modelToken = new CreditCardToken(this.formObject); - this.errors = []; - this.formIds = [0, 1]; -}; - -TwoCreditcardsModel.prototype.validate = function () { - - var formsInvalid = []; - - for (id in this.formObject) { - - if (id.length > 1) { - continue; - } - var creditCardValidator = new CreditCardValidator(this.formObject[id]); - var isCreditCardValid = creditCardValidator.validate(); - - var multibuyerValidator = new MultibuyerValidator(this.formObject[id]); - var isMultibuyerValid = multibuyerValidator.validate(); - - if (isCreditCardValid && isMultibuyerValid) { - continue; - } - - formsInvalid.push(true); - } - - var hasFormInvalid = formsInvalid.filter(function (item) { - return item; - }); - - if (hasFormInvalid.length > 0) { - return false; - } - - return true; -}; - -TwoCreditcardsModel.prototype.placeOrder = function (placeOrderObject) { - this.placeOrderObject = placeOrderObject; - var _self = this; - var errors = false; - - for (id in this.formObject) { - - if (id.length > 1) { - continue; - } - - if ( - typeof this.formObject[id].savedCreditCardSelect.val() != 'undefined' && - this.formObject[id].savedCreditCardSelect.val() != 'new' && - this.formObject[id].savedCreditCardSelect.val() != '' && - this.formObject[id].savedCreditCardSelect.html().length > 1 - ) { - continue; - } - - this.getCreditCardToken( - this.formObject[id], - function (data) { - _self.formObject[id].creditCardToken.val(data.id); - }, - function (error) { - errors = true; - _self.addErrors("Cartão inválido. Por favor, verifique os dados digitados e tente novamente"); - } - ); - } - - if (!errors) { - _self.placeOrderObject.placeOrder(); - } -}; - -TwoCreditcardsModel.prototype.getFormIdInverted = function (id) { - var ids = this.formIds.slice(0); - var index = ids.indexOf(id); - ids.splice(index, 1); - - return ids[0]; -} - -TwoCreditcardsModel.prototype.addErrors = function (error) { - this.errors.push({ - message: error - }) -} - -TwoCreditcardsModel.prototype.getCreditCardToken = function (formObject, success, error) { - var modelToken = new CreditCardToken(formObject); - modelToken.getToken(this.publicKey) - .done(success) - .fail(error); -}; - -TwoCreditcardsModel.prototype.getData = function () { - var data = this.fillData(); - - if ( - typeof this.formObject[0].multibuyer.showMultibuyer != 'undefined' && - this.formObject[0].multibuyer.showMultibuyer.prop( "checked" ) == true - ) { - multibuyer = this.formObject[0].multibuyer; - fullName = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); - - data.additional_data.cc_buyer_checkbox_first = 1; - data.additional_data.cc_buyer_name_first = fullName; - data.additional_data.cc_buyer_email_first = multibuyer.email.val(); - data.additional_data.cc_buyer_document_first = multibuyer.document.val(); - data.additional_data.cc_buyer_street_title_first = multibuyer.street.val(); - data.additional_data.cc_buyer_street_number_first = multibuyer.number.val(); - data.additional_data.cc_buyer_street_complement_first = multibuyer.complement.val(); - data.additional_data.cc_buyer_zipcode_first = multibuyer.zipcode.val(); - data.additional_data.cc_buyer_neighborhood_first = multibuyer.neighborhood.val(); - data.additional_data.cc_buyer_city_first = multibuyer.city.val(); - data.additional_data.cc_buyer_state_first = multibuyer.state.val(); - data.additional_data.cc_buyer_home_phone_first = multibuyer.homePhone.val(); - data.additional_data.cc_buyer_mobile_phone_first = multibuyer.mobilePhone.val(); - } - - if ( - typeof this.formObject[1].multibuyer.showMultibuyer != 'undefined' && - this.formObject[1].multibuyer.showMultibuyer.prop( "checked" ) == true - ) { - multibuyer = this.formObject[1].multibuyer; - fullName = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); - - data.additional_data.cc_buyer_checkbox_second = 1; - data.additional_data.cc_buyer_name_second = fullName; - data.additional_data.cc_buyer_email_second = multibuyer.email.val(); - data.additional_data.cc_buyer_document_second = multibuyer.document.val(); - data.additional_data.cc_buyer_street_title_second = multibuyer.street.val(); - data.additional_data.cc_buyer_street_number_second = multibuyer.number.val(); - data.additional_data.cc_buyer_street_complement_second = multibuyer.complement.val(); - data.additional_data.cc_buyer_zipcode_second = multibuyer.zipcode.val(); - data.additional_data.cc_buyer_neighborhood_second = multibuyer.neighborhood.val(); - data.additional_data.cc_buyer_city_second = multibuyer.city.val(); - data.additional_data.cc_buyer_state_second = multibuyer.state.val(); - data.additional_data.cc_buyer_home_phone_second = multibuyer.homePhone.val(); - data.additional_data.cc_buyer_mobile_phone_second = multibuyer.mobilePhone.val(); - } - - return data; -}; - -TwoCreditcardsModel.prototype.fillData = function () { - - var saveFirstCard = 0; - var saveSecondCard = 0; - - if (this.formObject[0].saveThisCard.prop('checked') == true) { - saveFirstCard = 1; - } - - if (this.formObject[1].saveThisCard.prop('checked') == true) { - saveSecondCard = 1; - } - - return { - 'method': "pagarme_two_creditcard", - 'additional_data': { - //first - 'cc_first_card_amount': this.formObject[0].inputAmount.val(), - 'cc_first_card_tax_amount': this.formObject[0].creditCardInstallments.find(':selected').attr('interest'), - 'cc_type_first': this.formObject[0].creditCardBrand.val(), - 'cc_last_4_first': this.getLastFourNumbers(0), - 'cc_cid_first': this.formObject[0].creditCardCvv.val(), - 'cc_exp_year_first': this.formObject[0].creditCardExpYear.val(), - 'cc_exp_month_first': this.formObject[0].creditCardExpMonth.val(), - 'cc_number_first': this.formObject[0].creditCardNumber.val(), - 'cc_owner_first': this.formObject[0].creditCardHolderName.val(), - 'cc_savecard_first' : saveFirstCard, - 'cc_saved_card_first' : this.formObject[0].savedCreditCardSelect.val(), - 'cc_installments_first': this.formObject[0].creditCardInstallments.val(), - 'cc_token_credit_card_first' : this.formObject[0].creditCardToken.val(), - //second - 'cc_second_card_amount': this.formObject[1].inputAmount.val(), - 'cc_second_card_tax_amount': this.formObject[1].creditCardInstallments.find(':selected').attr('interest'), - 'cc_type_second': this.formObject[1].creditCardBrand.val(), - 'cc_last_4_second': this.getLastFourNumbers(1), - 'cc_cid_second': this.formObject[1].creditCardCvv.val(), - 'cc_exp_year_second': this.formObject[1].creditCardExpYear.val(), - 'cc_exp_month_second': this.formObject[1].creditCardExpMonth.val(), - 'cc_number_second': this.formObject[1].creditCardNumber.val(), - 'cc_owner_second': this.formObject[1].creditCardHolderName.val(), - 'cc_savecard_second' : saveSecondCard, - 'cc_saved_card_second' : this.formObject[1].savedCreditCardSelect.val(), - 'cc_installments_second': this.formObject[1].creditCardInstallments.val(), - 'cc_token_credit_card_second' : this.formObject[1].creditCardToken.val() +define([ + 'Pagarme_Pagarme/js/core/checkout/CreditCardToken', + 'Pagarme_Pagarme/js/core/validators/CreditCardValidator', + 'Pagarme_Pagarme/js/core/validators/MultibuyerValidator', +], (CreditCardToken, CreditCardValidator, MultibuyerValidator) => { + return class TwoCreditcardsModel { + constructor(formObject, publicKey) { + this.formObject = formObject; + this.publicKey = publicKey; + this.modelToken = new CreditCardToken(this.formObject); + this.errors = []; + this.formIds = [0, 1]; } - }; -}; - -TwoCreditcardsModel.prototype.getLastFourNumbers = function(id) { - var number = this.formObject[id].creditCardNumber.val(); - if (number !== undefined) { - return number.slice(-4); - } - return ""; -}; + validate() { + + const formsInvalid = []; + + for (const id in this.formObject) { + + if (id.length > 1) { + continue; + } + const creditCardValidator = new CreditCardValidator(this.formObject[id]); + const isCreditCardValid = creditCardValidator.validate(); + + const multibuyerValidator = new MultibuyerValidator(this.formObject[id]); + const isMultibuyerValid = multibuyerValidator.validate(); + + if (isCreditCardValid && isMultibuyerValid) { + continue; + } + + formsInvalid.push(true); + } + + const hasFormInvalid = formsInvalid.filter(function (item) { + return item; + }); + + if (hasFormInvalid.length > 0) { + return false; + } + + return true; + } + placeOrder(placeOrderObject) { + this.placeOrderObject = placeOrderObject; + const _self = this; + let errors = false; + + for (const id in this.formObject) { + + if (id.length > 1) { + continue; + } + + if ( + typeof this.formObject[id].savedCreditCardSelect.val() != 'undefined' && + this.formObject[id].savedCreditCardSelect.val() != 'new' && + this.formObject[id].savedCreditCardSelect.val() != '' && + this.formObject[id].savedCreditCardSelect.html().length > 1 + ) { + continue; + } + + this.getCreditCardToken( + this.formObject[id], + function (data) { + _self.formObject[id].creditCardToken.val(data.id); + }, + function (error) { + errors = true; + _self.addErrors("Cartão inválido. Por favor, verifique os dados digitados e tente novamente"); + } + ); + } + + if (!errors) { + _self.placeOrderObject.placeOrder(); + } + } + getFormIdInverted(id) { + const ids = this.formIds.slice(0); + const index = ids.indexOf(id); + ids.splice(index, 1); + + return ids[0]; + } + addErrors(error) { + this.errors.push({ + message: error + }) + } + getCreditCardToken(formObject, success, error) { + const modelToken = new CreditCardToken(formObject); + modelToken.getToken(this.publicKey) + .done(success) + .fail(error); + } + getData() { + const data = this.fillData(); + + if ( + typeof this.formObject[0].multibuyer.showMultibuyer != 'undefined' && + this.formObject[0].multibuyer.showMultibuyer.prop( "checked" ) == true + ) { + const multibuyer = this.formObject[0].multibuyer; + const fullName = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); + + data.additional_data.cc_buyer_checkbox_first = 1; + data.additional_data.cc_buyer_name_first = fullName; + data.additional_data.cc_buyer_email_first = multibuyer.email.val(); + data.additional_data.cc_buyer_document_first = multibuyer.document.val(); + data.additional_data.cc_buyer_street_title_first = multibuyer.street.val(); + data.additional_data.cc_buyer_street_number_first = multibuyer.number.val(); + data.additional_data.cc_buyer_street_complement_first = multibuyer.complement.val(); + data.additional_data.cc_buyer_zipcode_first = multibuyer.zipcode.val(); + data.additional_data.cc_buyer_neighborhood_first = multibuyer.neighborhood.val(); + data.additional_data.cc_buyer_city_first = multibuyer.city.val(); + data.additional_data.cc_buyer_state_first = multibuyer.state.val(); + data.additional_data.cc_buyer_home_phone_first = multibuyer.homePhone.val(); + data.additional_data.cc_buyer_mobile_phone_first = multibuyer.mobilePhone.val(); + } + + if ( + typeof this.formObject[1].multibuyer.showMultibuyer != 'undefined' && + this.formObject[1].multibuyer.showMultibuyer.prop( "checked" ) == true + ) { + const multibuyer = this.formObject[1].multibuyer; + const fullName = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); + + data.additional_data.cc_buyer_checkbox_second = 1; + data.additional_data.cc_buyer_name_second = fullName; + data.additional_data.cc_buyer_email_second = multibuyer.email.val(); + data.additional_data.cc_buyer_document_second = multibuyer.document.val(); + data.additional_data.cc_buyer_street_title_second = multibuyer.street.val(); + data.additional_data.cc_buyer_street_number_second = multibuyer.number.val(); + data.additional_data.cc_buyer_street_complement_second = multibuyer.complement.val(); + data.additional_data.cc_buyer_zipcode_second = multibuyer.zipcode.val(); + data.additional_data.cc_buyer_neighborhood_second = multibuyer.neighborhood.val(); + data.additional_data.cc_buyer_city_second = multibuyer.city.val(); + data.additional_data.cc_buyer_state_second = multibuyer.state.val(); + data.additional_data.cc_buyer_home_phone_second = multibuyer.homePhone.val(); + data.additional_data.cc_buyer_mobile_phone_second = multibuyer.mobilePhone.val(); + } + + return data; + } + fillData() { + + let saveFirstCard = 0; + let saveSecondCard = 0; + + if (this.formObject[0].saveThisCard.prop('checked') == true) { + saveFirstCard = 1; + } + + if (this.formObject[1].saveThisCard.prop('checked') == true) { + saveSecondCard = 1; + } + + return { + 'method': "pagarme_two_creditcard", + 'additional_data': { + //first + 'cc_first_card_amount': this.formObject[0].inputAmount.val(), + 'cc_first_card_tax_amount': this.formObject[0].creditCardInstallments.find(':selected').attr('interest'), + 'cc_type_first': this.formObject[0].creditCardBrand.val(), + 'cc_last_4_first': this.getLastFourNumbers(0), + 'cc_cid_first': this.formObject[0].creditCardCvv.val(), + 'cc_exp_year_first': this.formObject[0].creditCardExpYear.val(), + 'cc_exp_month_first': this.formObject[0].creditCardExpMonth.val(), + 'cc_number_first': this.formObject[0].creditCardNumber.val(), + 'cc_owner_first': this.formObject[0].creditCardHolderName.val(), + 'cc_savecard_first' : saveFirstCard, + 'cc_saved_card_first' : this.formObject[0].savedCreditCardSelect.val(), + 'cc_installments_first': this.formObject[0].creditCardInstallments.val(), + 'cc_token_credit_card_first' : this.formObject[0].creditCardToken.val(), + //second + 'cc_second_card_amount': this.formObject[1].inputAmount.val(), + 'cc_second_card_tax_amount': this.formObject[1].creditCardInstallments.find(':selected').attr('interest'), + 'cc_type_second': this.formObject[1].creditCardBrand.val(), + 'cc_last_4_second': this.getLastFourNumbers(1), + 'cc_cid_second': this.formObject[1].creditCardCvv.val(), + 'cc_exp_year_second': this.formObject[1].creditCardExpYear.val(), + 'cc_exp_month_second': this.formObject[1].creditCardExpMonth.val(), + 'cc_number_second': this.formObject[1].creditCardNumber.val(), + 'cc_owner_second': this.formObject[1].creditCardHolderName.val(), + 'cc_savecard_second' : saveSecondCard, + 'cc_saved_card_second' : this.formObject[1].savedCreditCardSelect.val(), + 'cc_installments_second': this.formObject[1].creditCardInstallments.val(), + 'cc_token_credit_card_second' : this.formObject[1].creditCardToken.val() + } + }; + } + getLastFourNumbers(id) { + const number = this.formObject[id].creditCardNumber.val(); + if (number !== undefined) { + return number.slice(-4); + } + return ""; + } + }; +}); diff --git a/view/frontend/web/js/core/models/VoucherModel.js b/view/frontend/web/js/core/models/VoucherModel.js index 3dd596ae..1be8784a 100644 --- a/view/frontend/web/js/core/models/VoucherModel.js +++ b/view/frontend/web/js/core/models/VoucherModel.js @@ -1,139 +1,139 @@ -var VoucherModel = function (formObject, publicKey) { - this.formObject = formObject; - this.publicKey = publicKey; - this.errors = []; -}; - -VoucherModel.prototype.placeOrder = function (placeOrderObject) { - this.placeOrderObject = placeOrderObject; - var _self = this; - - if ( - typeof _self.formObject.savedCreditCardSelect.val() != 'undefined' && - _self.formObject.savedCreditCardSelect.html().length > 1 && - _self.formObject.savedCreditCardSelect.val() != 'new' && - _self.formObject.savedCreditCardSelect.val() != '' - ) { - _self.placeOrderObject.placeOrder(); - return; - } - - this.getCreditCardToken( - function (data) { - _self.formObject.creditCardToken.val(data.id); - _self.placeOrderObject.placeOrder(); - }, - function (error) { - var errors = error.responseJSON; - _self.addErrors("Cartão inválido. Por favor, verifique os dados digitados e tente novamente"); - } - ); -}; - -VoucherModel.prototype.addErrors = function (error) { - this.errors.push({ - message: error - }) -} - -VoucherModel.prototype.validate = function () { - - var creditCardValidator = new CreditCardValidator(this.formObject); - var isCreditCardValid = creditCardValidator.validate(); - - var multibuyerValidator = new MultibuyerValidator(this.formObject); - var isMultibuyerValid = multibuyerValidator.validate(); - - var voucherCardValidator = new VoucherCardValidator(this.formObject); - var isVoucherCardValid = voucherCardValidator.validate(); - - if (isCreditCardValid && isMultibuyerValid && isVoucherCardValid) { - return true; - } - - return false; -}; - -VoucherModel.prototype.getCreditCardToken = function (success, error) { - - var documentNumber = platFormConfig.addresses.billingAddress.vatId; - if (typeof documentNumber === "undefined") { - documentNumber = platFormConfig.customerData.taxvat; - } - - var modelToken = new CreditCardToken(this.formObject, documentNumber); - modelToken.getToken(this.publicKey) - .done(success) - .fail(error); -}; - -VoucherModel.prototype.getData = function () { - saveThiscard = 0; - var formObject = this.formObject; - - if (formObject.saveThisCard.prop( "checked" )) { - saveThiscard = 1; - } - - data = this.fillData(); - data.additional_data.cc_buyer_checkbox = false; - - if ( - typeof formObject.multibuyer != 'undefined' && - formObject.multibuyer.showMultibuyer.prop( "checked" ) == true - ) { - data = this.fillMultibuyerData(data); - } - - return data; -}; - -VoucherModel.prototype.fillData = function() { - var formObject = this.formObject; - - return { - 'method': "pagarme_voucher", - 'additional_data': { - 'cc_type': formObject.creditCardBrand.val(), - 'cc_last_4': this.getLastFourNumbers(), - 'cc_exp_year': formObject.creditCardExpYear.val(), - 'cc_exp_month': formObject.creditCardExpMonth.val(), - 'cc_owner': formObject.creditCardHolderName.val(), - 'cc_savecard': saveThiscard, - 'cc_saved_card': formObject.savedCreditCardSelect.val(), - 'cc_installments': formObject.creditCardInstallments.val(), - 'cc_token_credit_card': formObject.creditCardToken.val(), - 'cc_card_tax_amount' : formObject.creditCardInstallments.find(':selected').attr('interest'), - 'cc_cvv_card': formObject.creditCardCvv.val() - } - }; -}; - -VoucherModel.prototype.fillMultibuyerData = function(data) { - multibuyer = this.formObject.multibuyer; - fullname = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); - - data.additional_data.cc_buyer_checkbox = 1, - data.additional_data.cc_buyer_name = fullname, - data.additional_data.cc_buyer_email = multibuyer.email.val(), - data.additional_data.cc_buyer_document = multibuyer.document.val(), - data.additional_data.cc_buyer_street_title = multibuyer.street.val(), - data.additional_data.cc_buyer_street_number = multibuyer.number.val(), - data.additional_data.cc_buyer_street_complement = multibuyer.complement.val(), - data.additional_data.cc_buyer_zipcode = multibuyer.zipcode.val(), - data.additional_data.cc_buyer_neighborhood = multibuyer.neighborhood.val(), - data.additional_data.cc_buyer_city = multibuyer.city.val(), - data.additional_data.cc_buyer_state = multibuyer.state.val(), - data.additional_data.cc_buyer_home_phone = multibuyer.homePhone.val(), - data.additional_data.cc_buyer_mobile_phone = multibuyer.mobilePhone.val() - - return data; -}; - -VoucherModel.prototype.getLastFourNumbers = function() { - var number = this.formObject.creditCardNumber.val(); - if (number !== undefined) { - return number.slice(-4); - } - return ""; -}; +define([ + 'Pagarme_Pagarme/js/core/validators/CreditCardValidator', + 'Pagarme_Pagarme/js/core/validators/MultibuyerValidator', + 'Pagarme_Pagarme/js/core/validators/VoucherCardValidator', + 'Pagarme_Pagarme/js/core/checkout/CreditCardToken', +], (CreditCardValidator, MultibuyerValidator, VoucherCardValidator, CreditCardToken) => { + return class VoucherModel { + constructor(formObject, publicKey) { + this.formObject = formObject; + this.publicKey = publicKey; + this.errors = []; + } + placeOrder(placeOrderObject) { + this.placeOrderObject = placeOrderObject; + const _self = this; + + if ( + typeof _self.formObject.savedCreditCardSelect.val() != 'undefined' && + _self.formObject.savedCreditCardSelect.html().length > 1 && + _self.formObject.savedCreditCardSelect.val() != 'new' && + _self.formObject.savedCreditCardSelect.val() != '' + ) { + _self.placeOrderObject.placeOrder(); + return; + } + + this.getCreditCardToken( + function (data) { + _self.formObject.creditCardToken.val(data.id); + _self.placeOrderObject.placeOrder(); + }, + function (error) { + _self.addErrors("Cartão inválido. Por favor, verifique os dados digitados e tente novamente"); + } + ); + } + addErrors(error) { + this.errors.push({ + message: error + }) + } + validate() { + + const creditCardValidator = new CreditCardValidator(this.formObject); + const isCreditCardValid = creditCardValidator.validate(); + + const multibuyerValidator = new MultibuyerValidator(this.formObject); + const isMultibuyerValid = multibuyerValidator.validate(); + + const voucherCardValidator = new VoucherCardValidator(this.formObject); + const isVoucherCardValid = voucherCardValidator.validate(); + + if (isCreditCardValid && isMultibuyerValid && isVoucherCardValid) { + return true; + } + + return false; + } + getCreditCardToken(success, error) { + + let documentNumber = platFormConfig.addresses.billingAddress.vatId; + if (typeof documentNumber === "undefined") { + documentNumber = platFormConfig.customerData.taxvat; + } + + const modelToken = new CreditCardToken(this.formObject, documentNumber); + modelToken.getToken(this.publicKey) + .done(success) + .fail(error); + } + getData() { + this.saveThiscard = 0; + const formObject = this.formObject; + + if (formObject.saveThisCard.prop( "checked" )) { + this.saveThiscard = 1; + } + + let data = this.fillData(); + data.additional_data.cc_buyer_checkbox = false; + + if ( + typeof formObject.multibuyer != 'undefined' && + formObject.multibuyer.showMultibuyer.prop( "checked" ) == true + ) { + data = this.fillMultibuyerData(data); + } + + return data; + } + fillData() { + const formObject = this.formObject; + + return { + 'method': "pagarme_voucher", + 'additional_data': { + 'cc_type': formObject.creditCardBrand.val(), + 'cc_last_4': this.getLastFourNumbers(), + 'cc_exp_year': formObject.creditCardExpYear.val(), + 'cc_exp_month': formObject.creditCardExpMonth.val(), + 'cc_owner': formObject.creditCardHolderName.val(), + 'cc_savecard': this.saveThiscard, + 'cc_saved_card': formObject.savedCreditCardSelect.val(), + 'cc_installments': formObject.creditCardInstallments.val(), + 'cc_token_credit_card': formObject.creditCardToken.val(), + 'cc_card_tax_amount' : formObject.creditCardInstallments.find(':selected').attr('interest'), + 'cc_cvv_card': formObject.creditCardCvv.val() + } + }; + } + fillMultibuyerData(data) { + const multibuyer = this.formObject.multibuyer; + const fullname = multibuyer.firstname.val() + ' ' + multibuyer.lastname.val(); + + data.additional_data.cc_buyer_checkbox = 1, + data.additional_data.cc_buyer_name = fullname, + data.additional_data.cc_buyer_email = multibuyer.email.val(), + data.additional_data.cc_buyer_document = multibuyer.document.val(), + data.additional_data.cc_buyer_street_title = multibuyer.street.val(), + data.additional_data.cc_buyer_street_number = multibuyer.number.val(), + data.additional_data.cc_buyer_street_complement = multibuyer.complement.val(), + data.additional_data.cc_buyer_zipcode = multibuyer.zipcode.val(), + data.additional_data.cc_buyer_neighborhood = multibuyer.neighborhood.val(), + data.additional_data.cc_buyer_city = multibuyer.city.val(), + data.additional_data.cc_buyer_state = multibuyer.state.val(), + data.additional_data.cc_buyer_home_phone = multibuyer.homePhone.val(), + data.additional_data.cc_buyer_mobile_phone = multibuyer.mobilePhone.val() + + return data; + } + getLastFourNumbers() { + const number = this.formObject.creditCardNumber.val(); + if (number !== undefined) { + return number.slice(-4); + } + return ""; + } + }; +}); diff --git a/view/frontend/web/js/core/validators/CreditCardValidator.js b/view/frontend/web/js/core/validators/CreditCardValidator.js index 704cb161..710bacea 100644 --- a/view/frontend/web/js/core/validators/CreditCardValidator.js +++ b/view/frontend/web/js/core/validators/CreditCardValidator.js @@ -1,141 +1,138 @@ -var CreditCardValidator = function (formObject) { - this.formObject = formObject; -}; - -CreditCardValidator.prototype.validate = function () { - if ( - typeof this.formObject.savedCreditCardSelect != 'undefined' && - this.formObject.savedCreditCardSelect.html().length > 1 && - this.formObject.savedCreditCardSelect.val() !== 'new' - ) { - return this.validateSavedCard(); - } - return this.validateNewCard(); -} - -CreditCardValidator.prototype.validateSavedCard = function () { - - var inputsInvalid = []; - var formObject = this.formObject; - - - if (formObject.savedCreditCardSelect.val() == "") { - inputsInvalid.push( - this.isInputInvalid(formObject.savedCreditCardSelect) - ); - } - - inputsInvalid.push( - this.isInputInstallmentInvalid(formObject.creditCardInstallments) - ); - - var hasInputInvalid = inputsInvalid.filter(function (item) { - return item; - }); - - if (hasInputInvalid.length > 0) { - return false; - } - - return true; -} - -CreditCardValidator.prototype.validateNewCard = function () { - - var inputsInvalid = []; - var formObject = this.formObject; - - inputsInvalid.push( - this.isInputInvalid(formObject.creditCardBrand), - this.isInputInvalid(formObject.creditCardNumber), - this.isInputInvalid(formObject.creditCardHolderName), - this.isInputInvalid(formObject.creditCardCvv), - this.isInputExpirationInvalid(formObject), - this.isInputInstallmentInvalid(formObject.creditCardInstallments), - this.isInputInvalidBrandAvailable(formObject.creditCardBrand) - ); - - var hasInputInvalid = inputsInvalid.filter(function (item) { - return item; - }); - - if (hasInputInvalid.length > 0) { - return false; - } - - return true; -} - -CreditCardValidator.prototype.isInputInvalidBrandAvailable = function (element) { - var parentsElements = element.parent().parent(); - - var brands = []; - PlatformConfig.PlatformConfig.avaliableBrands[this.formObject.savedCardSelectUsed].forEach(function (item) { - brands.push(item.title.toUpperCase()); - }); - - if (!brands.includes(this.formObject.creditCardBrand.val().toUpperCase())) { - parentsElements.addClass("_error"); - parentsElements.find(".field-error").show(); - parentsElements.find(".nobrand").hide(); - return true; - } - - parentsElements.removeClass("_error"); - parentsElements.find(".field-error").hide(); - return false; -} - -CreditCardValidator.prototype.isInputInvalid = function (element, message = "") { - - var parentsElements = element.parent().parent(); - - if (element.val() == "") { - parentsElements.addClass("_error"); - parentsElements.find('.field-error').show(); - return true; - } - - parentsElements.removeClass('_error'); - parentsElements.find('.field-error').hide(); - return false; -} - -CreditCardValidator.prototype.isInputExpirationInvalid = function (formObject) { - var cardExpirationMonth = formObject.creditCardExpMonth; - var cardExpirationYear = formObject.creditCardExpYear; - - var cardDate = new Date (cardExpirationYear.val(), cardExpirationMonth.val() -1); - var dateNow = new Date(); - - var monthParentsElements = cardExpirationMonth.parent().parent(); - var yearParentsElements = cardExpirationYear.parent().parent(); - var parentsElements = yearParentsElements.parents(".field"); - - if (cardDate < dateNow) { - monthParentsElements.addClass("_error"); - yearParentsElements.addClass("_error"); - parentsElements.find('.field-error').show(); - return true; - } - - monthParentsElements.removeClass("_error"); - yearParentsElements.removeClass("_error"); - parentsElements.find('.field-error').hide(); - return false; -} - -CreditCardValidator.prototype.isInputInstallmentInvalid = function (element) { - - var parentsElements = element.parents(".field"); - - if (element.val() == "") { - - element.parent().parent().addClass("_error"); - parentsElements.find('.field-error').show(); - return true; - } - element.parent().parent().removeClass("_error"); - parentsElements.find('.field-error').hide(); - return false; -} +define(['Pagarme_Pagarme/js/core/checkout/PlatformConfig',], (PlatformConfig) => { + return class CreditCardValidator { + constructor(formObject) { + this.formObject = formObject; + } + validate() { + if ( + typeof this.formObject.savedCreditCardSelect != 'undefined' && + this.formObject.savedCreditCardSelect.html().length > 1 && + this.formObject.savedCreditCardSelect.val() !== 'new' + ) { + return this.validateSavedCard(); + } + return this.validateNewCard(); + } + validateSavedCard() { + + const inputsInvalid = []; + const formObject = this.formObject; + + + if (formObject.savedCreditCardSelect.val() == "") { + inputsInvalid.push( + this.isInputInvalid(formObject.savedCreditCardSelect) + ); + } + + inputsInvalid.push( + this.isInputInstallmentInvalid(formObject.creditCardInstallments) + ); + + const hasInputInvalid = inputsInvalid.filter(function (item) { + return item; + }); + + if (hasInputInvalid.length > 0) { + return false; + } + + return true; + } + validateNewCard() { + + const inputsInvalid = []; + const formObject = this.formObject; + + inputsInvalid.push( + this.isInputInvalid(formObject.creditCardBrand), + this.isInputInvalid(formObject.creditCardNumber), + this.isInputInvalid(formObject.creditCardHolderName), + this.isInputInvalid(formObject.creditCardCvv), + this.isInputExpirationInvalid(formObject), + this.isInputInstallmentInvalid(formObject.creditCardInstallments), + this.isInputInvalidBrandAvailable(formObject.creditCardBrand) + ); + + const hasInputInvalid = inputsInvalid.filter(function (item) { + return item; + }); + + if (hasInputInvalid.length > 0) { + return false; + } + + return true; + } + isInputInvalidBrandAvailable(element) { + const parentsElements = element.parent().parent(); + + const brands = []; + PlatformConfig.PlatformConfig.avaliableBrands[this.formObject.savedCardSelectUsed].forEach(function (item) { + brands.push(item.title.toUpperCase()); + }); + + if (!brands.includes(this.formObject.creditCardBrand.val().toUpperCase())) { + parentsElements.addClass("_error"); + parentsElements.find(".field-error").show(); + parentsElements.find(".nobrand").hide(); + return true; + } + + parentsElements.removeClass("_error"); + parentsElements.find(".field-error").hide(); + return false; + } + isInputInvalid(element, message = "") { + + const parentsElements = element.parent().parent(); + + if (element.val() == "") { + parentsElements.addClass("_error"); + parentsElements.find('.field-error').show(); + return true; + } + + parentsElements.removeClass('_error'); + parentsElements.find('.field-error').hide(); + return false; + } + isInputExpirationInvalid(formObject) { + const cardExpirationMonth = formObject.creditCardExpMonth; + const cardExpirationYear = formObject.creditCardExpYear; + + const cardDate = new Date (cardExpirationYear.val(), cardExpirationMonth.val() -1); + const dateNow = new Date(); + + const monthParentsElements = cardExpirationMonth.parent().parent(); + const yearParentsElements = cardExpirationYear.parent().parent(); + const parentsElements = yearParentsElements.parents(".field"); + + if (cardDate < dateNow) { + monthParentsElements.addClass("_error"); + yearParentsElements.addClass("_error"); + parentsElements.find('.field-error').show(); + return true; + } + + monthParentsElements.removeClass("_error"); + yearParentsElements.removeClass("_error"); + parentsElements.find('.field-error').hide(); + return false; + } + isInputInstallmentInvalid(element) { + + const parentsElements = element.parents(".field"); + + if (element.val() == "") { + + element.parent().parent().addClass("_error"); + parentsElements.find('.field-error').show(); + return true; + } + element.parent().parent().removeClass("_error"); + parentsElements.find('.field-error').hide(); + return false; + } + } +}); diff --git a/view/frontend/web/js/core/validators/CustomerValidator.js b/view/frontend/web/js/core/validators/CustomerValidator.js index 0a05136f..39fdc402 100644 --- a/view/frontend/web/js/core/validators/CustomerValidator.js +++ b/view/frontend/web/js/core/validators/CustomerValidator.js @@ -1,29 +1,31 @@ -var CustomerValidator = function (addressObject) { - this.addressObject = addressObject; - this.errors = []; -}; +define([], () => { + return class CustomerValidator { + constructor(addressObject) { + this.addressObject = addressObject; + this.errors = []; + } + validate() { + const address = this.addressObject; -CustomerValidator.prototype.validate = function () { - var address = this.addressObject; + if (address == null) { + this.errors.push("Customer address is required"); + return; + } - if (address == null) { - this.errors.push("Customer address is required"); - return; - } - - if (address.vatId <= 0 && address.vatId != null) { - this.errors.push("O campo CPF/CNPJ é obrigatório."); - } + if (address.vatId <= 0 && address.vatId != null) { + this.errors.push("O campo CPF/CNPJ é obrigatório."); + } - if (address.street.length < 3) { - this.errors.push( - "O endereço fornecido está diferente do esperado. " + - "Verifique se você preencheu os campos " + - "rua, número e bairro e tente novamente." - ); + if (address.street.length < 3) { + this.errors.push( + "O endereço fornecido está diferente do esperado. " + + "Verifique se você preencheu os campos " + + "rua, número e bairro e tente novamente." + ); + } + } + getErrors() { + return this.errors; + } } -} - -CustomerValidator.prototype.getErrors = function () { - return this.errors; -} +}); diff --git a/view/frontend/web/js/core/validators/MultibuyerValidator.js b/view/frontend/web/js/core/validators/MultibuyerValidator.js index b8fea2ff..d36ea55a 100644 --- a/view/frontend/web/js/core/validators/MultibuyerValidator.js +++ b/view/frontend/web/js/core/validators/MultibuyerValidator.js @@ -1,74 +1,75 @@ -var MultibuyerValidator = function (formObject) { - this.formObject = formObject; -}; +define([], () => { + return class MultibuyerValidator { + constructor(formObject) { + this.formObject = formObject; + } + validate() { + const formObject = this.formObject; + const inputsInvalid = []; -MultibuyerValidator.prototype.validate = function () { - var formObject = this.formObject; - var inputsInvalid = []; - - if ( - typeof formObject.multibuyer != 'undefined' && - typeof formObject.multibuyer.showMultibuyer != 'undefined' && - formObject.multibuyer.showMultibuyer.prop( "checked" ) == true - ) { + if ( + typeof formObject.multibuyer != 'undefined' && + typeof formObject.multibuyer.showMultibuyer != 'undefined' && + formObject.multibuyer.showMultibuyer.prop( "checked" ) == true + ) { - inputsInvalid.push( - this.isInputInvalid(formObject.multibuyer.firstname), - this.isInputInvalid(formObject.multibuyer.lastname), - this.isEmailInvalid(formObject.multibuyer.email), - this.isInputInvalid(formObject.multibuyer.zipcode), - this.isInputInvalid(formObject.multibuyer.document), - this.isInputInvalid(formObject.multibuyer.street), - this.isInputInvalid(formObject.multibuyer.number), - this.isInputInvalid(formObject.multibuyer.neighborhood), - this.isInputInvalid(formObject.multibuyer.city), - this.isInputInvalid(formObject.multibuyer.state), - this.isInputInvalid(formObject.multibuyer.mobilePhone) - ); - } - - var hasInputInvalid = inputsInvalid.filter(function (item) { - return item; - }); + inputsInvalid.push( + this.isInputInvalid(formObject.multibuyer.firstname), + this.isInputInvalid(formObject.multibuyer.lastname), + this.isEmailInvalid(formObject.multibuyer.email), + this.isInputInvalid(formObject.multibuyer.zipcode), + this.isInputInvalid(formObject.multibuyer.document), + this.isInputInvalid(formObject.multibuyer.street), + this.isInputInvalid(formObject.multibuyer.number), + this.isInputInvalid(formObject.multibuyer.neighborhood), + this.isInputInvalid(formObject.multibuyer.city), + this.isInputInvalid(formObject.multibuyer.state), + this.isInputInvalid(formObject.multibuyer.mobilePhone) + ); + } - if (hasInputInvalid.length > 0) { - return false; - } + const hasInputInvalid = inputsInvalid.filter(function (item) { + return item; + }); - return true; -} + if (hasInputInvalid.length > 0) { + return false; + } -MultibuyerValidator.prototype.isInputInvalid = function (element, message = "") { - var parentsElements = element.parent().parent(); + return true; + } + isInputInvalid(element, message = "") { + const parentsElements = element.parent().parent(); - if (element.val() == "") { - parentsElements.addClass("_error"); - parentsElements.find('.field-error').show(); - return true; - } + if (element.val() == "") { + parentsElements.addClass("_error"); + parentsElements.find('.field-error').show(); + return true; + } - parentsElements.removeClass('_error'); - parentsElements.find('.field-error').hide(); - return false; -} + parentsElements.removeClass('_error'); + parentsElements.find('.field-error').hide(); + return false; + } + isEmailInvalid(element, message = "") { + if (this.isInputInvalid(element)) { + return true; + } -MultibuyerValidator.prototype.isEmailInvalid = function (element, message = "") { - if (this.isInputInvalid(element)) { - return true; - } + const parentsElements = element.parent().parent(); - var parentsElements = element.parent().parent(); + const isValid = /\S+@\S+\.\S+/.test(element.val()); - var isValid = /\S+@\S+\.\S+/.test(element.val()); + if (!isValid) { + parentsElements.addClass("_error"); + parentsElements.find('.field-error').show(); + return true; + } - if (!isValid) { - parentsElements.addClass("_error"); - parentsElements.find('.field-error').show(); - return true; + parentsElements.removeClass('_error'); + parentsElements.find('.field-error').hide(); + return false; + } } - - parentsElements.removeClass('_error'); - parentsElements.find('.field-error').hide(); - return false; -} \ No newline at end of file +}); diff --git a/view/frontend/web/js/core/validators/VoucherCardValidator.js b/view/frontend/web/js/core/validators/VoucherCardValidator.js index 1c104f40..f325dcf8 100644 --- a/view/frontend/web/js/core/validators/VoucherCardValidator.js +++ b/view/frontend/web/js/core/validators/VoucherCardValidator.js @@ -1,55 +1,56 @@ -var VoucherCardValidator = function (formObject) { - this.formObject = formObject; -}; - -VoucherCardValidator.prototype.validate = function () { - if ( - typeof this.formObject.savedCreditCardSelect != 'undefined' && - this.formObject.savedCreditCardSelect.html().length > 1 && - this.formObject.savedCreditCardSelect.val() !== 'new' - ) { - return this.validateSavedCard(); +define([], () => { + return class VoucherCardValidator { + constructor(formObject) { + this.formObject = formObject; + } + validate() { + if ( + typeof this.formObject.savedCreditCardSelect != 'undefined' && + this.formObject.savedCreditCardSelect.html().length > 1 && + this.formObject.savedCreditCardSelect.val() !== 'new' + ) { + return this.validateSavedCard(); + } + + return true; + } + validateSavedCard() { + const inputsInvalid = []; + const formObject = this.formObject; + + if (formObject.savedCreditCardSelect.val() == "") { + inputsInvalid.push( + this.isInputInvalid(formObject.savedCreditCardSelect) + ); + } + + inputsInvalid.push( + this.isInputInvalid(formObject.creditCardCvv) + ); + + const hasInputInvalid = inputsInvalid.filter(function (item) { + return item; + }); + + if (hasInputInvalid.length > 0) { + return false; + } + + return true; + } + isInputInvalid(element, message = "") { + + const parentsElements = element.parent().parent(); + + if (element.val() == "") { + parentsElements.addClass("_error"); + parentsElements.find('.field-error').show(); + return true; + } + + parentsElements.removeClass('_error'); + parentsElements.find('.field-error').hide(); + return false; + } } - - return true; -} - -VoucherCardValidator.prototype.validateSavedCard = function () { - var inputsInvalid = []; - var formObject = this.formObject; - - if (formObject.savedCreditCardSelect.val() == "") { - inputsInvalid.push( - this.isInputInvalid(formObject.savedCreditCardSelect) - ); - } - - inputsInvalid.push( - this.isInputInvalid(formObject.creditCardCvv) - ); - - var hasInputInvalid = inputsInvalid.filter(function (item) { - return item; - }); - - if (hasInputInvalid.length > 0) { - return false; - } - - return true; -} - -VoucherCardValidator.prototype.isInputInvalid = function (element, message = "") { - - var parentsElements = element.parent().parent(); - - if (element.val() == "") { - parentsElements.addClass("_error"); - parentsElements.find('.field-error').show(); - return true; - } - - parentsElements.removeClass('_error'); - parentsElements.find('.field-error').hide(); - return false; -} \ No newline at end of file +}); diff --git a/view/frontend/web/js/view/payment/boleto.js b/view/frontend/web/js/view/payment/boleto.js index 7f809c59..fb672570 100644 --- a/view/frontend/web/js/view/payment/boleto.js +++ b/view/frontend/web/js/view/payment/boleto.js @@ -3,9 +3,10 @@ define( [ "Pagarme_Pagarme/js/view/payment/default", + "Pagarme_Pagarme/js/core/checkout/PaymentModuleBootstrap", "Pagarme_Pagarme/js/core/models/BoletoModel" ], - function (Component, $t) { + function (Component, PagarmeCore, $t) { return Component.extend({ defaults: { @@ -37,7 +38,7 @@ define( }, getData: function () { - var paymentMethod = window.PagarmeCore.paymentMethod[this.getModel()]; + var paymentMethod = PagarmeCore.paymentMethod[this.getModel()]; if (paymentMethod == undefined) { return paymentMethod; } diff --git a/view/frontend/web/js/view/payment/boletocreditcard.js b/view/frontend/web/js/view/payment/boletocreditcard.js index ff4935d4..e57e7305 100644 --- a/view/frontend/web/js/view/payment/boletocreditcard.js +++ b/view/frontend/web/js/view/payment/boletocreditcard.js @@ -66,7 +66,7 @@ define( }, getData: function () { - var paymentMethod = window.PagarmeCore.paymentMethod[this.getModel()]; + var paymentMethod = PagarmeCore.paymentMethod[this.getModel()]; if (paymentMethod == undefined) { return paymentMethod; } diff --git a/view/frontend/web/js/view/payment/creditcard.js b/view/frontend/web/js/view/payment/creditcard.js index 9a31a65e..f6c26bc3 100644 --- a/view/frontend/web/js/view/payment/creditcard.js +++ b/view/frontend/web/js/view/payment/creditcard.js @@ -67,7 +67,7 @@ define( }, getData: function () { - var paymentMethod = window.PagarmeCore.paymentMethod[this.getModel()]; + var paymentMethod = PagarmeCore.paymentMethod[this.getModel()]; if (paymentMethod == undefined) { return paymentMethod; } diff --git a/view/frontend/web/js/view/payment/debit.js b/view/frontend/web/js/view/payment/debit.js index 8321fd87..1bc80b52 100644 --- a/view/frontend/web/js/view/payment/debit.js +++ b/view/frontend/web/js/view/payment/debit.js @@ -63,7 +63,7 @@ define( }, getData: function () { - var paymentMethod = window.PagarmeCore.paymentMethod[this.getModel()]; + var paymentMethod = PagarmeCore.paymentMethod[this.getModel()]; if (paymentMethod == undefined) { return paymentMethod; } diff --git a/view/frontend/web/js/view/payment/default.js b/view/frontend/web/js/view/payment/default.js index 3dd943fc..0b9498d1 100644 --- a/view/frontend/web/js/view/payment/default.js +++ b/view/frontend/web/js/view/payment/default.js @@ -28,10 +28,8 @@ define( "Pagarme_Pagarme/js/core/checkout/PaymentMethodController", "Pagarme_Pagarme/js/core/checkout/PlatformPlaceOrder", "Pagarme_Pagarme/js/core/checkout/Bin", - "Pagarme_Pagarme/js/core/checkout/PlatformFormBiding", "Pagarme_Pagarme/js/core/checkout/PlatformFormHandler", "Pagarme_Pagarme/js/core/checkout/CreditCardToken", - "Pagarme_Pagarme/js/core/checkout/Installments", "Pagarme_Pagarme/js/core/validators/CreditCardValidator", "Pagarme_Pagarme/js/core/validators/CustomerValidator", "Pagarme_Pagarme/js/core/validators/MultibuyerValidator", @@ -58,17 +56,16 @@ define( PlatformPlaceOrder ) { - window.PagarmeCore.messageList = globalMessageList; return Component.extend({ initPaymentMethod: function() { var _self = this; - platFormConfig = window.checkoutConfig; + const platFormConfig = window.checkoutConfig; platFormConfig.moduleUrls = {}; - installmentsUrl = installmentsAction(); + const installmentsUrl = installmentsAction(); platFormConfig.grand_total = quote.getTotals()().grand_total; - var baseUrl = platFormConfig.payment.ccform.base_url; + const baseUrl = platFormConfig.payment.ccform.base_url; if ( quote.billingAddress() && @@ -91,8 +88,8 @@ define( /** @fixme Update total should be moved to platformFormBinging **/ platFormConfig.updateTotals = quote; - window.PagarmeCore.platFormConfig = platFormConfig; - window.PagarmeCore.initPaymentMethod( + PagarmeCore.platFormConfig = platFormConfig; + PagarmeCore.initPaymentMethod( this.getModel(), platFormConfig ); @@ -130,7 +127,7 @@ define( var _self = this; - window.PagarmeCore.platFormConfig.addresses.billingAddress = quote.billingAddress(); + PagarmeCore.platFormConfig.addresses.billingAddress = quote.billingAddress(); var PlatformPlaceOrder = { obj : _self, @@ -138,7 +135,7 @@ define( event: event }; - window.PagarmeCore.placeOrder( + PagarmeCore.placeOrder( PlatformPlaceOrder, this.getModel() ); @@ -150,8 +147,8 @@ define( selectPaymentMethod: function() { var data = this.getData(); if (data == undefined) { - var platFormConfig = window.PagarmeCore.platFormConfig; - window.PagarmeCore.init(this.getModel(), platFormConfig); + var platFormConfig = PagarmeCore.platFormConfig; + PagarmeCore.init(this.getModel(), platFormConfig); } selectPaymentMethodAction(this.getData()); checkoutData.setSelectedPaymentMethod(this.item.method); diff --git a/view/frontend/web/js/view/payment/pix.js b/view/frontend/web/js/view/payment/pix.js index 1ad62254..4229a85a 100644 --- a/view/frontend/web/js/view/payment/pix.js +++ b/view/frontend/web/js/view/payment/pix.js @@ -3,9 +3,10 @@ define( [ "Pagarme_Pagarme/js/view/payment/default", + "Pagarme_Pagarme/js/core/checkout/PaymentModuleBootstrap", "Pagarme_Pagarme/js/core/models/PixModel" ], - function (Component, $t) { + function (Component, PagarmeCore, $t) { return Component.extend({ defaults: { @@ -38,7 +39,7 @@ define( }, getData: function () { - var paymentMethod = window.PagarmeCore.paymentMethod[this.getModel()]; + var paymentMethod = PagarmeCore.paymentMethod[this.getModel()]; if (paymentMethod == undefined) { return paymentMethod; } diff --git a/view/frontend/web/js/view/payment/twocreditcards.js b/view/frontend/web/js/view/payment/twocreditcards.js index af0b13ef..7d0821ee 100644 --- a/view/frontend/web/js/view/payment/twocreditcards.js +++ b/view/frontend/web/js/view/payment/twocreditcards.js @@ -3,9 +3,10 @@ define( [ "Pagarme_Pagarme/js/view/payment/default", + "Pagarme_Pagarme/js/core/checkout/PaymentModuleBootstrap", "Pagarme_Pagarme/js/core/models/TwoCreditcardsModel" ], - function (Component, $t) { + function (Component, PagarmeCore, $t) { return Component.extend({ defaults: { @@ -39,7 +40,7 @@ define( }, getData: function () { - var paymentMethod = window.PagarmeCore.paymentMethod[this.getModel()]; + var paymentMethod = PagarmeCore.paymentMethod[this.getModel()]; if (paymentMethod == undefined) { return paymentMethod; } diff --git a/view/frontend/web/js/view/payment/voucher.js b/view/frontend/web/js/view/payment/voucher.js index 0c493a8e..aba82d74 100644 --- a/view/frontend/web/js/view/payment/voucher.js +++ b/view/frontend/web/js/view/payment/voucher.js @@ -63,7 +63,7 @@ define( }, getData: function () { - var paymentMethod = window.PagarmeCore.paymentMethod[this.getModel()]; + var paymentMethod = PagarmeCore.paymentMethod[this.getModel()]; if (paymentMethod == undefined) { return paymentMethod; }