dev

<script src="https://js.paystack.co/v1/inline.js"></script>

<script>
$(function () {
var invalid_email=true;
var invalid_firstname=true;
var invalid_lastname=true;
var invalid_deliveryaddress=true;
var invalid_phone=true;
var paystackHandler;

function validateEmail(email) {
var re = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
return re.test(email);
}
function validateNotBlank(str){
return !(!str || !str.length || !str.trim().length);
}

var typingTimer;
$('#payment-email').on('keyup', function () {
clearTimeout(typingTimer);
var email = $(this).val().trim();
var parent = $(this).parent();
var email_helper = $(this).siblings('.help-block');
typingTimer = setTimeout(function () {
if (validateEmail(email)) {
if (invalid_email) {
parent.removeClass('has-error');
email_helper.addClass('hidden');
invalid_email = false;
}
} else {
if (!invalid_email) {
parent.addClass('has-error');
email_helper.removeClass('hidden')
invalid_email = true;
}
}
}, 500);
});

$('#payment-firstname').on('keyup', function () {
clearTimeout(typingTimer);
var firstname = $(this).val().trim();
var parent = $(this).parent();
var firstname_helper = $(this).siblings('.help-block');
typingTimer = setTimeout(function () {
if (validateNotBlank(firstname)) {
if (invalid_firstname) {
parent.removeClass('has-error');
firstname_helper.addClass('hidden');
invalid_firstname = false;
}
} else {
if (!invalid_firstname) {
parent.addClass('has-error');
firstname_helper.removeClass('hidden')
invalid_firstname = true;
}
}
}, 500);
});

$('#payment-phone').on('keyup', function () {
clearTimeout(typingTimer);
var phone = $(this).val().trim();
var parent = $(this).parent();
var phone_helper = $(this).siblings('.help-block');
typingTimer = setTimeout(function () {
if (validateNotBlank(phone)) {
if (invalid_phone) {
parent.removeClass('has-error');
phone_helper.addClass('hidden');
invalid_phone = false;
}
} else {
if (!invalid_phone) {
parent.addClass('has-error');
phone_helper.removeClass('hidden')
invalid_phone = true;
}
}
}, 500);
});

$('#payment-deliveryaddress').on('keyup', function () {
clearTimeout(typingTimer);
var deliveryaddress = $(this).val().trim();
var parent = $(this).parent();
var deliveryaddress_helper = $(this).siblings('.help-block');
typingTimer = setTimeout(function () {
if (validateNotBlank(deliveryaddress)) {
if (invalid_deliveryaddress) {
parent.removeClass('has-error');
deliveryaddress_helper.addClass('hidden');
invalid_deliveryaddress = false;
}
} else {
if (!invalid_deliveryaddress) {
parent.addClass('has-error');
deliveryaddress_helper.removeClass('hidden')
invalid_deliveryaddress = true;
}
}
}, 500);
});

$('#payment-lastname').on('keyup', function () {
clearTimeout(typingTimer);
var lastname = $(this).val().trim();
var parent = $(this).parent();
var lastname_helper = $(this).siblings('.help-block');
typingTimer = setTimeout(function () {
if (validateNotBlank(lastname)) {
if (invalid_lastname) {
parent.removeClass('has-error');
lastname_helper.addClass('hidden');
invalid_lastname = false;
}
} else {
if (!invalid_lastname) {
parent.addClass('has-error');
lastname_helper.removeClass('hidden')
invalid_lastname = true;
}
}
}, 500);
});

$('#payment-btn').click(function (e) {
e.preventDefault();

var payment_btn = $(this);
var subscriber = {};
subscriber.email = $('#payment-email').val().trim();
subscriber.firstname = $('#payment-firstname').val().trim();
subscriber.lastname = $('#payment-lastname').val().trim();
subscriber.phone = $('#payment-phone').val().trim();
subscriber.deliveryaddress = $('#payment-deliveryaddress').val().trim();

if (!validateEmail(subscriber.email)) {
$('.payment-form.email').addClass('has-error');
$('.email .help-block').removeClass('hidden');
return;
}

if (!validateNotBlank(subscriber.firstname)) {
$('.payment-form.firstname').addClass('has-error');
$('.firstname .help-block').removeClass('hidden');
return;
}

if (!validateNotBlank(subscriber.lastname)) {
$('.payment-form.lastname').addClass('has-error');
$('.lastname .help-block').removeClass('hidden');
return;
}

if (!validateNotBlank(subscriber.deliveryaddress)) {
$('.payment-form.deliveryaddress').addClass('has-error');
$('.deliveryaddress .help-block').removeClass('hidden');
return;
}

if (!validateNotBlank(subscriber.phone)) {
$('.payment-form.phone').addClass('has-error');
$('.phone .help-block').removeClass('hidden');
return;
}
serialize = function(obj, prefix) {
var str = [];
for(var p in obj) {
if (obj.hasOwnProperty(p)) {
var k = prefix ? prefix + "[" + p + "]" : p, v = obj[p];
str.push(typeof v == "object" ?
serialize(v, k) :
encodeURIComponent(k) + "=" + encodeURIComponent(v));
}
}
return str.join("&");
}

var sendthis = {
subscriber: subscriber,
target: '',
message: '<b>Thanks for supporting the gospel. God bless you</b>'
};
paystackHandler = PaystackPop.setup({
key: 'pk_live_9804a3f71e6f87cee1d82e851dc4f006839fcb6c',
email: subscriber.email,
first_name: subscriber.firstname,
last_name: subscriber.lastname,
plan: 'PLN_hfyt9nbjsbuerv6',
metadata: serialize(sendthis),
onClose: function () {
payment_btn.attr('disabled', false).html('Subscribe');
},
callback: function (response) {
// use AJAX to verify payment and add subscriber
// ignore result
// can ignore because event will also fire from Paystack
sendthis.trxref = response.trxref;
var callbackurl = 'https://hccc.org.ng/wp-content/plugins/paystack-recurrent-billing/links/callback.php?' + serialize(sendthis);
$.get( callbackurl ).fail(function() {
// redirect if AJAX fails
$("#success-message").removeClass('hidden').
find('#trans-ref').text(response.trxref+ '. Please wait while you are redirected... ');
window.location = callbackurl;
});
$("#payment-form, .demo-talk").addClass('hidden');
$("#success-message").removeClass('hidden').find('#trans-ref').text(response.trxref);
}
})
paystackHandler.openIframe();
payment_btn.attr('disabled', true).html('<i class="fa fa-spinner fa-spin"></i>');
})

})
</script>