89 lines
3.6 KiB
JavaScript
Executable File
89 lines
3.6 KiB
JavaScript
Executable File
document.addEventListener('DOMContentLoaded', function() {
|
|
const form = document.getElementById('contactForm');
|
|
const formLoadedAtInput = document.getElementById('form_loaded_at');
|
|
const formStatusDiv = document.getElementById('formStatus');
|
|
|
|
// Set form_loaded_at to current timestamp in milliseconds
|
|
if (formLoadedAtInput) {
|
|
formLoadedAtInput.value = Date.now().toString();
|
|
}
|
|
|
|
// Form submit handler
|
|
if (form) {
|
|
form.addEventListener('submit', async function(e) {
|
|
e.preventDefault();
|
|
|
|
formStatusDiv.innerHTML = '';
|
|
formStatusDiv.className = '';
|
|
|
|
const name = form.elements['name']?.value.trim();
|
|
const email = form.elements['email']?.value.trim();
|
|
const address = form.elements['address']?.value.trim();
|
|
|
|
if (!name || !email || !address) {
|
|
formStatusDiv.className = 'form-status form-status--error';
|
|
formStatusDiv.innerHTML = '<p>Please fill in all required fields.</p>';
|
|
return;
|
|
}
|
|
|
|
if (!email.includes('@')) {
|
|
formStatusDiv.className = 'form-status form-status--error';
|
|
formStatusDiv.innerHTML = '<p>Please enter a valid email address.</p>';
|
|
return;
|
|
}
|
|
|
|
if (form.elements['website']?.value) return;
|
|
|
|
// Get altcha value from the web component
|
|
const altchaWidget = document.getElementById('altcha-widget');
|
|
const altchaPayload = altchaWidget ? (altchaWidget.value || '') : '';
|
|
|
|
const payload = {
|
|
name: name,
|
|
email: email,
|
|
phone: form.elements['phone']?.value.trim() || '',
|
|
address: address,
|
|
sqft: form.elements['sqft']?.value.trim() || '',
|
|
message: form.elements['message']?.value.trim() || '',
|
|
website: form.elements['website']?.value || '',
|
|
form_loaded_at: form.elements['form_loaded_at']?.value || '',
|
|
altcha: altchaPayload
|
|
};
|
|
|
|
// POST to /contact/
|
|
try {
|
|
const response = await fetch('/contact/', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify(payload)
|
|
});
|
|
|
|
const data = await response.json();
|
|
|
|
if (data.ok) {
|
|
formStatusDiv.className = 'form-status form-status--success';
|
|
formStatusDiv.innerHTML = '<p>Thank you! Your message has been sent. We\'ll be in touch soon.</p>';
|
|
form.reset();
|
|
if (formLoadedAtInput) {
|
|
formLoadedAtInput.value = Date.now().toString();
|
|
}
|
|
if (window.altcha) {
|
|
window.altcha = new Altcha({
|
|
challengeUrl: '/altcha-challenge/',
|
|
element: document.getElementById('altcha-widget')
|
|
});
|
|
}
|
|
} else {
|
|
formStatusDiv.className = 'form-status form-status--error';
|
|
formStatusDiv.innerHTML = '<p>' + (data.error || 'An error occurred. Please try again.') + '</p>';
|
|
}
|
|
} catch (err) {
|
|
formStatusDiv.className = 'form-status form-status--error';
|
|
formStatusDiv.innerHTML = '<p>Network error. Please try again.</p>';
|
|
}
|
|
});
|
|
}
|
|
});
|