Fee: $0.00
body { font-family: Arial, sans-serif; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; } .calculator-container { text-align: center; } label { margin-right: 10px; } input { padding: 5px; } button { padding: 8px 16px; margin-top: 10px; cursor: pointer; } #result { margin-top: 20px; font-weight: bold; } document.addEventListener('DOMContentLoaded', function () { // Initialize Stripe const stripe = Stripe('your_stripe_publishable_key_here'); // Function to calculate fee window.calculateFee = async function () { const amountInput = document.getElementById('amount'); const resultElement = document.getElementById('result'); // Get the amount from the input field const amount = parseFloat(amountInput.value); if (isNaN(amount) || amount <= 0) { alert('Please enter a valid amount.'); return; } // Calculate the fee using the Stripe API const fee = await calculateStripeFee(amount); // Display the result resultElement.textContent = `Fee: $${fee.toFixed(2)}`; }; // Function to calculate Stripe fee async function calculateStripeFee(amount) { const response = await fetch('/calculate-fee', { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ amount: amount * 100, // Stripe uses cents, not dollars }), }); const data = await response.json(); return data.fee / 100; // Convert cents back to dollars } });
No comments: