symposion_app/pinaxcon/templates/registrasion/stripe/js/form_handler.js
James Polley 50145c03fe Copy stripe js template into pinaxcon
Shouldnt be neccessary, template loader should be finding the template provided by the installed app.

but it's not, and I want rego to go live today, so here we go.

One day when things are nice this commit can be reverted and I will be crying a little less on the inside.
2017-09-30 10:51:43 +10:00

68 lines
2.1 KiB
JavaScript

var stripe = Stripe('{{ PINAX_STRIPE_PUBLIC_KEY }}');
var elements = stripe.elements();
function stripeify(elementId) {
var element = elements.create(elementId);
element.mount('#' + elementId);
var htmlElement = document.getElementById(elementId);
var errors = elementId + "-errors";
htmlElement.insertAdjacentHTML("afterend", "<div id='" + errors + "' role='alert' class='help-block'></div>");
var displayError = document.getElementById(errors);
//Handle real-time validation errors from the card Element.
element.addEventListener('change', function(event) {
toggleErrorMessage(displayError, event.error);
});
// Create a token or display an error when the form is submitted.
var paymentForm = document.getElementById('payment-form');
paymentForm.addEventListener('submit', function(event) {
event.preventDefault();
stripe.createToken(element).then(function(result) {
if (result.error) {
// Inform the user if there was an error
toggleErrorMessage(displayError, result.error);
} else {
// Send the token to your server
stripeTokenHandler(result.token);
}
});
});
}
function toggleErrorMessage(errorElement, maybeError) {
errorClass = inputErrorClassName();
if (maybeError) {
errorElement.textContent = maybeError.message;
errorElement.parentNode.classList.add(errorClass);
} else {
errorElement.textContent = '';
errorElement.parentNode.classList.remove(errorClass);
}
}
function inputErrorClassName() {
return {% block form_control_error_class %}"has-error"{% endblock %};
}
function stripeTokenHandler(token) {
// Insert the token ID into the form so it gets submitted to the server
var form = document.getElementById('payment-form');
tokenHolder = form.getElementsByClassName('registrasion-stripe-token')[0];
inputId = tokenHolder.dataset.inputId;
var hiddenInput = document.createElement('input');
hiddenInput.setAttribute('type', 'hidden');
hiddenInput.setAttribute('name', inputId);
hiddenInput.setAttribute('value', token.id);
tokenHolder.appendChild(hiddenInput);
// Submit the form
form.submit();
}