Processing your donation...

`; document.body.appendChild(loader); function showLoader() { loader.style.display = 'flex'; // document.body.style.overflow = 'hidden'; } // Function to hide the loader function hideLoader() { loader.style.display = 'none'; // document.body.style.overflow = ''; } // Calculate the total donation amount function calculateTotal() { let productTotal = 0; selectedProducts = 0; // Iterate through all donation products document.querySelectorAll('.donationButtonWrapper').forEach(wrapper => { const quantityInput = wrapper.querySelector('.quantityValue'); const buttonValue = parseFloat(wrapper.querySelector('.donationProduct').getAttribute('data-value')) || 0; const currentQuantity = parseInt(quantityInput?.value) || 0; if (currentQuantity > 0) { productTotal += buttonValue * currentQuantity; selectedProducts += currentQuantity; } }); // Add custom donation amount const customAmount = parseFloat(customDonationAmountInput?.value) || 0; // Calculate final total totalAmount = productTotal + cashButtonTotal + customAmount; return totalAmount; } // Update the donation button label with dynamic info function updateFooterButtonLabel() { const dynamicInfo = document.getElementById('dynamic-info'); if (totalAmount > 0) { if (selectedProducts > 0) { dynamicInfo.textContent = `| ${selectedProducts} item(s) | ₹${totalAmount}`; } else { dynamicInfo.textContent = `| ₹${totalAmount}`; } } else { dynamicInfo.textContent = ''; } } // Update displayed values function updateDisplays() { totalAmount = calculateTotal(); if (totalSpan) { totalSpan.textContent = '₹' + totalAmount; totalSpan.setAttribute('data-total', totalAmount); } if (amountInput) { amountInput.value = totalAmount; } updateFooterButtonLabel(); } // Handle cash button clicks function handleCashButtonClick(event) { const cashValue = parseFloat(event.target.getAttribute('data-value')) || 0; if (event.target.classList.contains('active')) { event.target.classList.remove('active'); cashButtonTotal -= cashValue; } else { event.target.classList.add('active'); cashButtonTotal += cashValue; } updateDisplays(); } // Event listeners for quantity adjustment buttons document.querySelectorAll('.qtyButton').forEach(button => { button.addEventListener('click', function (event) { const wrapper = event.target.closest('.donationButtonWrapper'); const quantityInput = wrapper.querySelector('.quantityValue'); let currentQuantity = parseInt(quantityInput.value) || 0; if (event.target.classList.contains('addQuantity')) { currentQuantity = Math.min(999, currentQuantity + 1); } else if (event.target.classList.contains('subtractQuantity')) { currentQuantity = Math.max(0, currentQuantity - 1); } quantityInput.value = currentQuantity; updateDisplays(); }); }); // Event listeners for cash buttons document.querySelectorAll('.CashButton').forEach(button => { button.addEventListener('click', handleCashButtonClick); }); // Function to validate the form and trigger custom scroll behavior const donationForm = document.getElementById('give-form-11276-1'); function validateWithCustomScroll(offset = 200) { const firstInvalidElement = donationForm.querySelector(':invalid'); if (firstInvalidElement) { const isValid = donationForm.reportValidity(); if (!isValid) { setTimeout(() => { const elementTop = firstInvalidElement.getBoundingClientRect().top; window.scrollTo({ top: window.pageYOffset + elementTop - offset, behavior: 'smooth', }); }, 50); } return false; } return true; } // Donate button functionality (combining Razorpay and scrolling/validation logic) if (desktopDonateButton) { desktopDonateButton.addEventListener('click', function (event) { event.preventDefault(); const buttonValue = desktopDonateButton.textContent.trim(); // Get the full text content const match = buttonValue.match(/₹(\d+)/); // Use regex to find the amount (₹ followed by digits) if (match && match[1]) { console.log('Donation Amount:', match[1]); // Log only the numerical part (1000) } else { console.log('Donation Amount: Not found'); const donationOptions = document.getElementById('donationOptions'); if (donationOptions) { // Calculate the target scroll position const elementPosition = donationOptions.getBoundingClientRect().top; // Get the top position relative to the viewport const offset = 200; // Offset of 200px down // Perform the scrolling with smooth behavior window.scrollTo({ top: window.pageYOffset + elementPosition - offset, // Calculate absolute position, adding offset behavior: 'smooth', // Smooth scrolling effect }); } else { console.error('Element with id "donationOptions" not found!'); } return; // Exit the function } // Scroll to form and validate it if (!validateWithCustomScroll(200)) { console.log('Validation failed. Please correct the errors.'); return; } // Show loader before triggering Razorpay showLoader(); if (givePurchaseButton) { setTimeout(() => { givePurchaseButton.click(); // Hide the loader after a delay setTimeout(() => { hideLoader(); }, 5000); }, 5); } else { console.error('Give purchase button not found!'); hideLoader(); // Ensure loader is hidden if there's an error } }); } // Initial update updateDisplays(); });