64 lines
1.8 KiB
JavaScript
64 lines
1.8 KiB
JavaScript
|
export let card;
|
||
|
|
export let stripe;
|
||
|
|
const cardMessages = document.getElementById("card-messages");
|
||
|
|
const payButton = document.getElementById("pay-button");
|
||
|
|
export const processing = document.getElementById("processing-payment");
|
||
|
|
|
||
|
|
export function hidePayButton() {
|
||
|
|
payButton.classList.add("d-none");
|
||
|
|
processing.classList.remove("d-none");
|
||
|
|
}
|
||
|
|
|
||
|
|
export function showPayButton() {
|
||
|
|
payButton.classList.remove("d-none");
|
||
|
|
processing.classList.add("d-none");
|
||
|
|
}
|
||
|
|
|
||
|
|
export function showCardError(msg) {
|
||
|
|
cardMessages.classList.add("alert-danger");
|
||
|
|
cardMessages.classList.remove("alert-success");
|
||
|
|
cardMessages.classList.remove("d-none");
|
||
|
|
cardMessages.innerText = msg;
|
||
|
|
}
|
||
|
|
|
||
|
|
export function showCardSuccess() {
|
||
|
|
cardMessages.classList.add("alert-success");
|
||
|
|
cardMessages.classList.remove("alert-danger");
|
||
|
|
cardMessages.classList.remove("d-none");
|
||
|
|
cardMessages.innerText = "Trasaction successful";
|
||
|
|
}
|
||
|
|
|
||
|
|
export function stripeInit(pubKey) {
|
||
|
|
stripe = Stripe(pubKey);
|
||
|
|
|
||
|
|
(function () {
|
||
|
|
// create stripe & elements
|
||
|
|
const elements = stripe.elements();
|
||
|
|
const style = {
|
||
|
|
base: {
|
||
|
|
fontSize: '16px',
|
||
|
|
lineHeight: '24px',
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
// create card entry
|
||
|
|
card = elements.create('card', {
|
||
|
|
style: style,
|
||
|
|
hidePostalCode: true,
|
||
|
|
});
|
||
|
|
card.mount("#card-element");
|
||
|
|
|
||
|
|
// check for input errors
|
||
|
|
card.addEventListener('change', function (event) {
|
||
|
|
var displayError = document.getElementById("card-errors");
|
||
|
|
if (event.error) {
|
||
|
|
displayError.classList.remove('d-none');
|
||
|
|
displayError.textContent = event.error.message;
|
||
|
|
} else {
|
||
|
|
displayError.classList.add('d-none');
|
||
|
|
displayError.textContent = "";
|
||
|
|
}
|
||
|
|
});
|
||
|
|
})();
|
||
|
|
}
|