-
-
Save marcos-alexandre82/0651b442db5987cd3db148fe50ee52c4 to your computer and use it in GitHub Desktop.
card.js in woocommerce payment gateway
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/* | |
... omitted all other functions... | |
*/ | |
/** | |
* Add custom credit card form | |
*/ | |
public function payment_fields() { | |
//output main div | |
?> | |
<!-- <div class="payment_box" style="background:white !Important;"> --> | |
<?php | |
// add description if set | |
if ($this->description) { | |
echo wpautop( wp_kses_post( $this->description ) ); | |
} | |
$fieldset_id = 'wc_' . esc_attr( $this->id ) . '_cc_form'; | |
$testmode = 'TEST'; | |
if ( 'no' === $this->test ) { | |
$testmode = 'LIVE'; | |
} | |
// start fieldset | |
?> | |
<div id="wc_checkout_frm" style="padding-top:20px; border-radius:8px; background-color: #fff;"> | |
<div class="card-wrapper"></div> | |
<fieldset id="<?=$fieldset_id;?>" class="wc-credit-card-form wc-payment-form" style="background:transparent;"> | |
<?php | |
// support wc standards | |
do_action( 'woocommerce_credit_card_form_start', $this->id ); | |
// add fields | |
?> | |
<div class="form-row form-row-wide"> | |
<label><?=__('Número de Tarjeta','webifica_pagalo_wc');?></label> | |
<input class="input-text" id="s<?=$this->cc_number_id;?>" type="tel" autocomplete="off"> | |
</div> | |
<div class="form-row form-row-wide"> | |
<label><?=__('Nombre de Tarjeta','webifica_pagalo_wc');?></label> | |
<input class="input-text" id="s<?=$this->cc_name_id;?>" type="text" autocomplete="off"> | |
</div> | |
<div class="form-row form-row-first"> | |
<label><?=__('Fecha expira','webifica_pagalo_wc');?></label> | |
<input class="input-text" id="s<?=$this->cc_exp_id;?>" type="tel" autocomplete="off" placeholder="MM / YY"> | |
</div> | |
<div class="form-row form-row-last"> | |
<label><?=__('CVV','webifica_pagalo_wc');?></label> | |
<input class="input-text" id="s<?=$this->cc_cvv_id;?>" type="tel" autocomplete="off" placeholder="CVC" style="-webkit-text-security: disc;"> | |
</div> | |
<?php | |
// cuotas | |
$cuotas = $this->getCuotas(); | |
if (count($cuotas)) { | |
?> | |
<div class="form-row form-row-first"> | |
<label><?=__('VisaCuotas','webifica_pagalo_wc');?></label> | |
<select class="ctas-select" id="s<?=$this->cc_cuotas_id;?>"> | |
<option <?php if (!isset($_SESSION['wbpgwcuotas']) || $_SESSION['wbpgwcuotas'] < 1) { echo 'selected=""';} ?> value="0"><?=__('Contado','webifica_pagalo_wc');?></option> | |
<?php | |
foreach ($cuotas as $key => $cuota) { | |
?> | |
<option value="<?=$key;?>" <?php if (isset($_SESSION['wbpgwcuotas']) && $_SESSION['wbpgwcuotas'] == $key) { echo 'selected=""';} ?>><?=$key.'('.number_format($cuota,2).'%)';?></option> | |
<?php | |
} | |
?> | |
</select> | |
</div> | |
<?php | |
} | |
// add cardjs | |
?> | |
<div> | |
<small style="bottom: 14px; right: 40px; position: absolute;"> | |
<a href="https://webifica.com" target="_blank"><img src="<?=plugins_url( 'img/powered-by.svg', WBFPGWBASEFILE );?>" alt="powered-by" style="width:12px; height:auto;"/> by Webifica</a> | |
</small> | |
</div> | |
<script type="text/javascript"> | |
function updateCuotas() { | |
wbfajaxurl = '<?=admin_url('admin-ajax.php');?>'; | |
jQuery("#place_order").prop('disabled', true); | |
window.btnval = jQuery("#place_order").text(); | |
jQuery("#place_order").html('<?=__('Cargando...','webifica_pagalo_wc');?>'); | |
jQuery.ajax({ | |
type: "POST", | |
dataType: "json", | |
url: wbfajaxurl, | |
data: { | |
'action': 'wbpgwc_ajax_cuotas', | |
'cuotas': jQuery('#s<?=$this->cc_cuotas_id;?>').val(), | |
'_ajax_nonce': '<?=wp_create_nonce("wbpgwcnonce");?>' | |
}, | |
success: function (data) { | |
jQuery('body').trigger('update_checkout'); | |
console.log('changed to '+data.changedto) | |
}, | |
error: function (jqXHR, textStatus, errorThrown) { | |
alert('<?=__("Error al establecer plazo de cuotas","webifica_pagalo_wc");?>'); | |
console.log(jqXHR + " :: " + textStatus + " :: " + errorThrown); | |
}, | |
complete: function (jqXHR, textStatus) { | |
jQuery("#place_order").prop('disabled', false); | |
jQuery("#place_order").html(window.btnval); | |
} | |
}); | |
} | |
function populateHiddenFields() { | |
jQuery('#<?=$this->cc_number_id;?>').val(jQuery('#s<?=$this->cc_number_id;?>').val()); | |
jQuery('#<?=$this->cc_name_id;?>').val(jQuery('#s<?=$this->cc_name_id;?>').val()); | |
jQuery('#<?=$this->cc_exp_id;?>').val(jQuery('#s<?=$this->cc_exp_id;?>').val()); | |
jQuery('#<?=$this->cc_cvv_id;?>').val(jQuery('#s<?=$this->cc_cvv_id;?>').val()); | |
jQuery('#<?=$this->cc_cuotas_id;?>').val(jQuery('#s<?=$this->cc_cuotas_id;?>').val()); | |
} | |
function refreshCardFields() { | |
var elements = ['#s<?=$this->cc_cvv_id;?>', '#s<?=$this->cc_name_id;?>', '#s<?=$this->cc_exp_id;?>', '#s<?=$this->cc_number_id;?>'], e, l, evt; | |
for(var i = 0; i < elements.length; i++) { | |
e = jQuery(elements[i]); | |
l = e.get(0); | |
//l.focus(); | |
evt = new Event('change'); | |
l.dispatchEvent(evt); | |
} | |
} | |
function wbfinitcard() { | |
//jQuery("form[name='checkout']").attr('id',"wc_checkout_frm"); | |
// check if card is already present | |
if (jQuery(".jp-card-container").length < 1 ) | |
jQuery('#wc_checkout_frm').card({ | |
form: 'form', | |
container: '.card-wrapper', | |
formSelectors: { | |
numberInput: 'input#s<?=$this->cc_number_id;?>', | |
expiryInput: 'input#s<?=$this->cc_exp_id;?>', | |
cvcInput: 'input#s<?=$this->cc_cvv_id;?>', | |
nameInput: 'input#s<?=$this->cc_name_id;?>' | |
}, | |
messages: { | |
validDate: 'expira', | |
monthYear: 'mm/yyyy', | |
}, | |
// Default placeholders for rendered fields - optional | |
placeholders: { | |
number: '•••• •••• •••• ••••', | |
name: '<?=__('Nombre Tarjeta','webifica_pagalo_wc')?>', | |
expiry: '••/••', | |
cvc: '•••' | |
}, | |
formatting: true, | |
debug: true | |
}); | |
jQuery(".jp-card-cvc").css('-webkit-text-security','disc'); | |
} | |
jQuery( document ).ready(function($) { | |
// add change of cuotas | |
jQuery('#s<?=$this->cc_cuotas_id;?>').change(function(){ | |
updateCuotas(); | |
}); | |
// add cybersource fingerprint | |
document.getElementById("cybsfid").value = cybs_dfprofiler("visanetgt_jupiter","<?=$testmode;?>"); | |
jQuery('form.checkout').submit(function(){ | |
populateHiddenFields(); | |
}); | |
jQuery(document.body).on("updated_checkout",function(){ | |
//return; | |
wbfinitcard(); | |
refreshCardFields(); | |
event.preventDefault(); | |
return false; | |
}); | |
// jQuery.when("update_checkout").done(function() { | |
// wbfinitcard(); | |
// }); | |
}); | |
</script> | |
<?php | |
// support wc standards | |
do_action( 'woocommerce_credit_card_form_end', $this->id ); | |
?> | |
<!-- <div class="clear"></div> --> | |
</fieldset> | |
</div> | |
<input type="hidden" name="cybsfid" id="cybsfid"/> | |
<input type="hidden" id="<?=$this->cc_number_id;?>" name="<?=$this->cc_number_id;?>"/> | |
<input type="hidden" id="<?=$this->cc_name_id;?>" name="<?=$this->cc_name_id;?>"/> | |
<input type="hidden" id="<?=$this->cc_exp_id;?>" name="<?=$this->cc_exp_id;?>"/> | |
<input type="hidden" id="<?=$this->cc_cvv_id;?>" name="<?=$this->cc_cvv_id;?>"/> | |
<input type="hidden" id="<?=$this->cc_cuotas_id;?>" name="<?=$this->cc_cuotas_id;?>"/> | |
<!-- </div> --> | |
<?php | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment