kbe/aperonight
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

feat: Checkout worflow using Stripe working.

Browse Source
This commit is contained in:
kbe
2025-08-30 21:28:22 +02:00
parent b493027c86
commit 48c648e2ca
7 changed files with 300 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
app/views/tickets/checkout.html.erb
View File

@@ -110,20 +110,63 @@
<script src="https://js.stripe.com/v3/"></script>
<script>
const stripe = Stripe('<%= Rails.application.config.stripe[:publishable_key] %>');
let stripeInstance = null;
function redirectToCheckout() {
stripe.redirectToCheckout({
// Initialize Stripe when the script is loaded
function initializeStripe() {
if (typeof Stripe !== 'undefined' && !stripeInstance) {
stripeInstance = Stripe('<%= Rails.application.config.stripe[:publishable_key] %>');
console.log('Stripe initialized successfully');
}
}
// Function to redirect to checkout
function redirectToCheckout(buttonElement) {
// Ensure Stripe is initialized
if (!stripeInstance) {
initializeStripe();
}
if (!stripeInstance) {
alert('Erreur: Le système de paiement n\'est pas disponible. Veuillez rafraîchir la page.');
return;
}
// Show loading state
const originalText = buttonElement.innerHTML;
buttonElement.disabled = true;
buttonElement.innerHTML = '<span class="flex items-center justify-center"><svg class="animate-spin -ml-1 mr-3 h-5 w-5 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg>Redirection...</span>';
stripeInstance.redirectToCheckout({
sessionId: '<%= @checkout_session.id %>'
}).then(function (result) {
if (result.error) {
alert(result.error.message);
alert('Erreur de paiement: ' + result.error.message);
// Restore button state
buttonElement.disabled = false;
buttonElement.innerHTML = originalText;
}
}).catch(function(error) {
console.error('Stripe error:', error);
alert('Une erreur est survenue. Veuillez réessayer.');
// Restore button state
buttonElement.disabled = false;
buttonElement.innerHTML = originalText;
});
}
// Initialize Stripe when the page is loaded
document.addEventListener('DOMContentLoaded', function() {
initializeStripe();
});
// Fallback: Try to initialize after a short delay
setTimeout(function() {
initializeStripe();
}, 500);
</script>
<button onclick="redirectToCheckout()"
<button onclick="redirectToCheckout(this)"
class="w-full bg-gradient-to-r from-purple-600 to-indigo-600 hover:from-purple-700 hover:to-indigo-700 text-white font-medium py-4 px-6 rounded-xl shadow-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-purple-500 focus:ring-offset-2 transform hover:-translate-y-0.5">
<span class="flex items-center justify-center">
<svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">