UPDATE
I have found the Checkout.js add on code and I have this there
(function (_, $) {
var stripeInstance;
var stripeElementsApi;
var stripeElements;
var self = {
init: function init(publishableKey, langCode, elements) {
if (_.stripe.view.isInitialized(elements)) {
return;
}
stripeElements = stripeElements || {};
stripeInstance = stripeInstance || Stripe(publishableKey);
stripeElementsApi = stripeElementsApi || stripeInstance.elements({
locale: langCode
}); // remove previously rendered form
_.stripe.view.teardown(stripeElements); // render payment form
_.stripe.view.render(stripeInstance, stripeElementsApi, stripeElements, elements); // add submit logic
_.stripe.view.addSubmitHandler(stripeInstance, stripeElementsApi, stripeElements, elements);
}
};
$.extend({
ceStripeCheckout: function ceStripeCheckout(method) {
if (self[method]) {
return self[method].apply(this, Array.prototype.slice.call(arguments, 1));
} else {
$.error('ty.stripeCheckout: method ' + method + ' does not exist');
}
}
});
$.ceEvent('on', 'ce.commoninit', function (context) {
var $form = $('[data-ca-stripe-element="form"]', context);
if (!$form.length) {
return;
}
var publishableKey = $form.data('caStripePublishableKey');
var elements = _.stripe.view.getElements($form);
elements.form = $form.closest('form');
if (publishableKey) {
if (typeof Stripe === "undefined") {
$.ceStripeCheckout('init', publishableKey, _.cart_language, elements);
});
} else {
$.ceStripeCheckout('init', publishableKey, _.cart_language, elements);
}
}
});
})(Tygh, Tygh.$);
:shock: :shock: :shock: :shock: :shock: :shock: :shock:
And the code Stripe is recommending to use is this one.
// This is your test publishable API key.
const stripe = Stripe("pk_test_J5us4auh9r1fdh4Z2QsG1wue00EPQdUPgE");
// The items the customer wants to buy
const items = [{ id: "xl-tshirt" }];
let elements;
initialize();
checkStatus();
document
.querySelector("#payment-form")
.addEventListener("submit", handleSubmit);
// Fetches a payment intent and captures the client secret
async function initialize() {
const response = await fetch("/create-payment-intent", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ items }),
});
const { clientSecret } = await response.json();
const appearance = {
theme: 'stripe',
};
elements = stripe.elements({ appearance, clientSecret });
const paymentElement = elements.create("payment");
paymentElement.mount("#payment-element");
}
async function handleSubmit(e) {
e.preventDefault();
setLoading(true);
const { error } = await stripe.confirmPayment({
elements,
confirmParams: {
// Make sure to change this to your payment completion page
},
});
// This point will only be reached if there is an immediate error when
// confirming the payment. Otherwise, your customer will be redirected to
// your `return_url`. For some payment methods like iDEAL, your customer will
// be redirected to an intermediate site first to authorize the payment, then
// redirected to the `return_url`.
if (error.type === "card_error" || error.type === "validation_error") {
showMessage(error.message);
} else {
showMessage("An unexpected error occurred.");
}
setLoading(false);
}
// Fetches the payment intent status after payment submission
async function checkStatus() {
const clientSecret = new URLSearchParams(window.location.search).get(
"payment_intent_client_secret"
);
if (!clientSecret) {
return;
}
const { paymentIntent } = await stripe.retrievePaymentIntent(clientSecret);
switch (paymentIntent.status) {
case "succeeded":
showMessage("Payment succeeded!");
break;
case "processing":
showMessage("Your payment is processing.");
break;
case "requires_payment_method":
showMessage("Your payment was not successful, please try again.");
break;
default:
showMessage("Something went wrong.");
break;
}
}
// ------- UI helpers -------
function showMessage(messageText) {
const messageContainer = document.querySelector("#payment-message");
messageContainer.classList.remove("hidden");
messageContainer.textContent = messageText;
setTimeout(function () {
messageContainer.classList.add("hidden");
messageText.textContent = "";
}, 4000);
}
// Show a spinner on payment submission
function setLoading(isLoading) {
if (isLoading) {
// Disable the button and show a spinner
document.querySelector("#submit").disabled = true;
document.querySelector("#spinner").classList.remove("hidden");
document.querySelector("#button-text").classList.add("hidden");
} else {
document.querySelector("#submit").disabled = false;
document.querySelector("#spinner").classList.add("hidden");
document.querySelector("#button-text").classList.remove("hidden");
}
}
I have made different quotes to replace the Checkout.js code for the new Stripe it's asking to use, and they are asking me to pay $900 and $900 to do a 20 minutes or less task. The Stripe Checkout.js codes are not even wrote from Scratch, they provide the basic code and from their needs to be modified only some parts. This is crazy, really. Can someone help me please.