82 lines
3.2 KiB
JavaScript
82 lines
3.2 KiB
JavaScript
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
// Smooth scrolling for anchor links
|
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
|
anchor.addEventListener('click', function (e) {
|
|
e.preventDefault();
|
|
document.querySelector(this.getAttribute('href')).scrollIntoView({
|
|
behavior: 'smooth'
|
|
});
|
|
});
|
|
});
|
|
|
|
// Contact form submission
|
|
const contactForm = document.getElementById('contactForm');
|
|
if (contactForm) {
|
|
contactForm.addEventListener('submit', function (e) {
|
|
e.preventDefault();
|
|
const formData = new FormData(contactForm);
|
|
const formButton = contactForm.querySelector('button[type="submit"]');
|
|
const initialButtonText = formButton.innerHTML;
|
|
formButton.disabled = true;
|
|
formButton.innerHTML = 'Sending...';
|
|
|
|
fetch('contact_handler.php', {
|
|
method: 'POST',
|
|
body: formData
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
const alertPlaceholder = document.getElementById('form-feedback');
|
|
let alertClass = '';
|
|
let alertMessage = '';
|
|
|
|
if (data.success) {
|
|
alertClass = 'alert-success';
|
|
alertMessage = 'Thank you! Your message has been sent.';
|
|
contactForm.reset();
|
|
} else {
|
|
alertClass = 'alert-danger';
|
|
alertMessage = data.error || 'An unknown error occurred.';
|
|
}
|
|
|
|
const wrapper = document.createElement('div');
|
|
wrapper.innerHTML = [
|
|
`<div class="alert ${alertClass} alert-dismissible" role="alert">`,
|
|
` <div>${alertMessage}</div>`,
|
|
' <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>',
|
|
'</div>'
|
|
].join('');
|
|
|
|
alertPlaceholder.append(wrapper);
|
|
|
|
// Reset button
|
|
formButton.disabled = false;
|
|
formButton.innerHTML = initialButtonText;
|
|
|
|
// Auto-dismiss alert
|
|
setTimeout(() => {
|
|
wrapper.remove();
|
|
}, 5000);
|
|
})
|
|
.catch(error => {
|
|
console.error('Error:', error);
|
|
// Handle network errors
|
|
const alertPlaceholder = document.getElementById('form-feedback');
|
|
const wrapper = document.createElement('div');
|
|
wrapper.innerHTML = [
|
|
`<div class="alert alert-danger alert-dismissible" role="alert">`,
|
|
` <div>A network error occurred. Please try again.</div>`,
|
|
' <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>',
|
|
'</div>'
|
|
].join('');
|
|
alertPlaceholder.append(wrapper);
|
|
|
|
// Reset button
|
|
formButton.disabled = false;
|
|
formButton.innerHTML = initialButtonText;
|
|
});
|
|
});
|
|
}
|
|
});
|