84 lines
2.8 KiB
JavaScript
84 lines
2.8 KiB
JavaScript
// Global Tea Emporium - JavaScript Functionality
|
|
|
|
// Contact Form Handling
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const contactForm = document.querySelector('.contact-form');
|
|
|
|
if (contactForm) {
|
|
contactForm.addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
|
|
// Get form data
|
|
const formData = new FormData(contactForm);
|
|
const data = Object.fromEntries(formData);
|
|
|
|
// Simple form validation
|
|
if (!data.name || !data.email || !data.subject || !data.message) {
|
|
alert('Please fill in all required fields.');
|
|
return;
|
|
}
|
|
|
|
// Email validation
|
|
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
if (!emailRegex.test(data.email)) {
|
|
alert('Please enter a valid email address.');
|
|
return;
|
|
}
|
|
|
|
// Simulate form submission
|
|
alert(`Thank you for your message, ${data.name}! We'll get back to you soon at ${data.email}.`);
|
|
|
|
// Reset form
|
|
contactForm.reset();
|
|
});
|
|
}
|
|
});
|
|
|
|
// Smooth scrolling for navigation links
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const navLinks = document.querySelectorAll('.main-nav a');
|
|
|
|
navLinks.forEach(link => {
|
|
link.addEventListener('click', function(e) {
|
|
// Check if it's an internal link
|
|
if (this.hostname === window.location.hostname) {
|
|
// Add a subtle animation effect
|
|
this.style.transform = 'scale(0.95)';
|
|
setTimeout(() => {
|
|
this.style.transform = 'scale(1)';
|
|
}, 150);
|
|
}
|
|
});
|
|
});
|
|
});
|
|
|
|
// Add hover effects to service items
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const serviceItems = document.querySelectorAll('.services-list li, .value-item, .timeline-item');
|
|
|
|
serviceItems.forEach(item => {
|
|
item.addEventListener('mouseenter', function() {
|
|
this.style.transform = 'translateY(-2px)';
|
|
this.style.transition = 'transform 0.3s ease';
|
|
});
|
|
|
|
item.addEventListener('mouseleave', function() {
|
|
this.style.transform = 'translateY(0)';
|
|
});
|
|
});
|
|
});
|
|
|
|
// Active navigation highlighting
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const currentPage = window.location.pathname.split('/').pop();
|
|
const navLinks = document.querySelectorAll('.main-nav a');
|
|
|
|
navLinks.forEach(link => {
|
|
const linkPage = link.getAttribute('href');
|
|
if (linkPage === currentPage || (currentPage === '' && linkPage === 'index.html')) {
|
|
link.style.backgroundColor = '#daa520';
|
|
link.style.color = '#5d4037';
|
|
}
|
|
});
|
|
});
|