Update index.html

index.html

@@ -805,6 +805,132 @@
                     calculateTrancheOffer(tranche);
                 });
             });
+          // Submit offer buttons
+            const submitOfferBtns = document.querySelectorAll('.submit-offer');
+            
+            submitOfferBtns.forEach(btn => {
+                btn.addEventListener('click', function() {
+                    const tranche = this.dataset.tranche;
+                    const trancheName = {
+                        'a': 'Tranche A (Senior)',
+                        'b': 'Tranche B (Mezzanine)',
+                        'c': 'Tranche C (B-Piece)'
+                    }[tranche];
+                    
+                    const liabilities = parseFloat(document.getElementById(`liabilities-${tranche}`).value) || 0;
+                    const contribution = parseFloat(document.getElementById(`contribution-${tranche}`).value) || 0;
+                    
+                    if (liabilities <= 0 || contribution <= 0) {
+                        alert('Please enter valid values for liabilities and contribution');
+                        return;
+                    }
+                    
+                    // Update tranche data with new investment
+                    trancheData[tranche].assets += contribution;
+                    trancheData[tranche].liquidity += contribution * 0.9; // Assuming 90% goes to liquidity
+                    
+                    // Update the pool information display
+                    updateTranchePoolInfo();
+                    
+                    // Show success message
+                    successMessage.classList.remove('hidden');
+                    setTimeout(() => {
+                        successMessage.classList.add('hidden');
+                    }, 3000);
+                    
+                    // Reset form
+                    document.getElementById(`liabilities-${tranche}`).value = '';
+                    document.getElementById(`contribution-${tranche}`).value = '';
+                    
+                    // Recalculate
+                    calculateTrancheOffer(tranche);
+                });
+            });
+          // Submit offer buttons
+            const submitOfferBtns = document.querySelectorAll('.submit-offer');
+            
+            submitOfferBtns.forEach(btn => {
+                // CHANGE THIS LINE: Make the function async
+                btn.addEventListener('click', async function() { 
+                    const tranche = this.dataset.tranche;
+                    const trancheName = {
+                        'a': 'Tranche A (Senior)',
+                        'b': 'Tranche B (Mezzanine)',
+                        'c': 'Tranche C (B-Piece)'
+                    }[tranche];
+                    
+                    const liabilities = parseFloat(document.getElementById(`liabilities-${tranche}`).value) || 0;
+                    const contribution = parseFloat(document.getElementById(`contribution-${tranche}`).value) || 0;
+                    
+                    if (liabilities <= 0 || contribution <= 0) {
+                        alert('Please enter valid values for liabilities and contribution');
+                        return;
+                    }
+
+                    // *** ADD THESE LINES FOR THE WORKER URL AND DATA PREPARATION ***
+                    // Replace 'YOUR_CLOUDFLARE_WORKER_URL' with the actual URL of your deployed Cloudflare Worker
+                    // e.g., 'https://century-city-remic-api.your-subdomain.workers.dev/submit-offer'
+                    const workerUrl = 'YOUR_CLOUDFLARE_WORKER_URL/submit-offer'; 
+                    
+                    const offerData = {
+                        tranche: tranche,
+                        trancheName: trancheName,
+                        liabilities: liabilities,
+                        contribution: contribution,
+                        // Include other calculated values if needed, for example:
+                        tokenPrice: parseFloat(document.getElementById(`token-price-${tranche}`).textContent.replace('$', '')),
+                        tokenAllocation: parseInt(document.getElementById(`token-allocation-${tranche}`).textContent.replace(/,/g, '')),
+                        poolPercentage: parseFloat(document.getElementById(`pool-percentage-${tranche}`).textContent.replace('%', '')),
+                        remicPercentage: parseFloat(document.getElementById(`remic-percentage-${tranche}`).textContent.replace('%', '')),
+                    };
+
+                    try {
+                        const response = await fetch(workerUrl, {
+                            method: 'POST',
+                            headers: {
+                                'Content-Type': 'application/json',
+                            },
+                            body: JSON.stringify(offerData),
+                        });
+
+                        if (response.ok) {
+                            const result = await response.json();
+                            console.log('Backend response:', result);
+
+                            // The client-side updates (like updating trancheData and UI) 
+                            // should ideally only happen AFTER a successful backend submission.
+                            // So, move them here:
+                            // Update tranche data with new investment (if successful)
+                            trancheData[tranche].assets += contribution;
+                            trancheData[tranche].liquidity += contribution * 0.9; 
+                            updateTranchePoolInfo(); // Update frontend display
+
+                            // Show success message
+                            successMessage.classList.remove('hidden');
+                            setTimeout(() => {
+                                successMessage.classList.add('hidden');
+                            }, 3000);
+                            
+                            // Reset form
+                            document.getElementById(`liabilities-${tranche}`).value = '';
+                            document.getElementById(`contribution-${tranche}`).value = '';
+                            
+                            // Recalculate (this will use the updated trancheData for display)
+                            calculateTrancheOffer(tranche);
+
+                        } else {
+                            const errorData = await response.json();
+                            console.error('Backend submission failed:', errorData);
+                            alert(`Submission failed: ${errorData.message || 'Unknown error'}`);
+                        }
+                    } catch (error) {
+                        console.error('Network or unexpected error:', error);
+                        alert('An error occurred while submitting your offer. Please try again.');
+                    }
+                    // *** END OF ADDED LINES ***
+
+                });
+            });
             
             // Function to update tranche pool information
             function updateTranchePoolInfo() {