The Dream Stream

<style>
#engage-container .modal-footer,
#engage-container .modal-footer .terms,
#engage-container .modal-footer .terms a {
    font-size: 1em;
    text-align: center;
}
#engage-button {
    display: none !important;
}
</style>

<script>
// Global callback for hCaptcha to ensure it's accessible
function submitEngageSignupModal(token) {
    console.log("Captcha token received:", token);

    // Get the form element
    var form = document.getElementById('new_email_contact');
    if (!form) {
        console.error('Form not found.');
        return;
    }

    // Create a FormData object and log its contents for debugging
    var formData = new FormData(form);
    formData.append('h-captcha-response', token); // Append the token
    
    // Log the formData fields for debugging purposes
    formData.forEach((value, key) => {
        console.log(`${key}: ${value}`);
    });

    // Perform the AJAX request for form submission
    fetch(form.action, {
        method: 'POST',
        body: formData,
        headers: {
            'Accept': 'application/json'
        }
    })
    .then(response => {
        console.log('Response status:', response.status); // Log response status for debugging
        if (!response.ok) {
            throw new Error('Network response was not ok');
        }
        return response.text(); // or response.json() if your server responds with JSON
    })
    .then(data => {
        // Handle the response data from your server
        console.log('Response data:', data);
        document.querySelector('.alert.alert-success').classList.remove('hidden'); // Show success message
    })
    .catch(error => {
        console.error('Error during form submission:', error);
        document.querySelector('.alert.alert-danger').classList.remove('hidden'); // Show error message
    });
}

document.addEventListener("DOMContentLoaded", function() {
    // Logic to inject or manipulate the form if necessary
    var engageModal = document.getElementById('engage-modal');
    if (engageModal) {
        var targetDiv = document.querySelector('.body');
        if (targetDiv) {
            var engageContainerHTML = engageModal.innerHTML;

            // Remove the close button
            engageContainerHTML = engageContainerHTML.replace(/<button type="button" class="close"[^>]*><span aria-hidden="true">×<\/span><\/button>/, '');

            // Change the modal-title from h4 to h3
            engageContainerHTML = engageContainerHTML.replace(/<h4 class="modal-title">/, '<h3 class="modal-title">').replace(/<\/h4>/, '</h3>');

            var engageContainer = document.createElement('div');
            engageContainer.id = 'engage-container';
            engageContainer.innerHTML = engageContainerHTML;
            targetDiv.prepend(engageContainer);
            engageModal.remove();
        }
    }

    // Remove 'required' attribute from checkboxes on page load
    var checkboxes = document.querySelectorAll('input[type="checkbox"]');
    checkboxes.forEach(function(checkbox) {
        checkbox.removeAttribute('required');
    });

    // Attach event listener for form submission
    var form = document.getElementById('new_email_contact');
    if (form) {
        form.addEventListener('submit', function(event) {
            event.preventDefault(); // Prevent the default form submission

            // Perform a manual validation check for checkboxes
            var isChecked = Array.from(checkboxes).some(checkbox => checkbox.checked);
            
            if (!isChecked) {
                console.error('At least one checkbox must be checked.');
                alert('Please check at least one box to proceed.');
                return;
            }

            // Trigger hCaptcha (this should call submitEngageSignupModal once captcha is completed)
            hcaptcha.execute();
        });
    } else {
        console.error('Form not found on the page.');
    }
});
</script>