Checkout

Customer Information

First Name *

Last Name *

Email *

Phone

Shipping Address

Address Line 1 *

Address Line 2

City *

State *

ZIP Code *

Country *

Select Shipping Method

Order Notes (Optional)

Order Summary

Subtotal: $0.00

Shipping: Calculated

Tax: $0.00

Total: $0.00

Secure payment via PayPal

// For now, show a placeholder document.getElementById('paypal-button-container').innerHTML = ` `; }); async function calculateShipping() { const form = document.getElementById('checkout-form'); const address = { address1: form.address1.value, address2: form.address2.value, city: form.city.value, state: form.state.value, zip: form.zip.value, country: form.country.value }; // Validate address fields if (!address.address1 || !address.city || !address.state || !address.zip) { alert('Please fill in all required shipping address fields'); return; } const cart = window.cart.cart; const items = cart.map(item => ({ name: item.name, sku: item.sku, price: item.price, quantity: item.quantity, weight: 1.5 // Default weight, should come from product data })); const btn = document.getElementById('calculate-shipping-btn'); btn.disabled = true; btn.innerHTML = 'Calculating...'; try { const response = await fetch('/api/shipping-rates.php', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ items, address }) }); const data = await response.json(); if (data.success && data.rates) { displayShippingOptions(data.rates); } else { alert('Error: ' + (data.error || 'Failed to calculate shipping')); } } catch (error) { console.error('Shipping calculation error:', error); alert('Failed to calculate shipping rates. Please try again.'); } finally { btn.disabled = false; btn.innerHTML = ' Calculate Shipping'; } } function displayShippingOptions(rates) { const container = document.getElementById('shipping-options-container'); const card = document.getElementById('shipping-options-card'); let html = ''; rates.forEach((rate, index) => { html += `

${rate.courier_name} - ${rate.service_name}
${rate.delivery_time_text}

$${rate.total_charge.toFixed(2)}

`; }); container.innerHTML = html; card.style.display = 'block'; // Auto-select cheapest option if (rates.length > 0) { document.getElementById('shipping_0').checked = true; selectShippingMethod(0, rates[0].total_charge); } } function selectShippingMethod(index, cost) { selectedShippingRate = { index, cost }; updateCheckoutSummary(); }> Pay with PayPal `; }); function displayCheckoutItems() { const container = document.getElementById('checkout-items'); const cart = window.cart.cart; if (cart.length === 0) { window.location.href = 'cart.php'; return; } let html = ''; cart.forEach(item => { html += `

${item.image ? `

` : ''}

${item.name}

Qty: ${item.quantity}

$${(item.price * item.quantity).toFixed(2)}

`; }); container.innerHTML = html; updateCheckoutSummary(); } function updateCheckoutSummary() { const subtotal = window.cart.getTotal(); const tax = subtotal * 0.08; // 8% tax (should be calculated based on location) const shipping = selectedShippingRate ? selectedShippingRate.cost : 0; const total = subtotal + tax + shipping; document.getElementById('checkout-subtotal').textContent = `$${subtotal.toFixed(2)}`; document.getElementById('checkout-tax').textContent = `$${tax.toFixed(2)}`; if (selectedShippingRate) { document.getElementById('checkout-shipping').textContent = `$${shipping.toFixed(2)}`; document.getElementById('checkout-shipping').classList.remove('text-muted'); } else { document.getElementById('checkout-shipping').textContent = 'Calculate shipping'; document.getElementById('checkout-shipping').classList.add('text-muted'); } document.getElementById('checkout-total').textContent = `$${total.toFixed(2)}`; }