script.js

// Main JavaScript file for Cata Commerce Explorer

document.addEventListener('DOMContentLoaded', function() {
    // Initialize any global functionality here
    
    // Example: Add to cart functionality
    const addToCartButtons = document.querySelectorAll('[data-add-to-cart]');
    
    addToCartButtons.forEach(button => {
        button.addEventListener('click', function() {
            const productId = this.getAttribute('data-product-id');
            // In a real app, you would add the product to cart here
            console.log(`Added product ${productId} to cart`);
            
            // Show a temporary notification
            showToast('Product added to cart!');
        });
    });
    
    // Newsletter form submission
    const newsletterForm = document.querySelector('#newsletter-form');
    if (newsletterForm) {
        newsletterForm.addEventListener('submit', function(e) {
            e.preventDefault();
            const email = this.querySelector('input[type="email"]').value;
            // In a real app, you would send this to your backend
            console.log(`Subscribed email: ${email}`);
            
            // Show a temporary notification
            showToast('Thanks for subscribing! Check your email for the discount code.');
            this.reset();
        });
    }
});

// Helper function to show toast notifications
function showToast(message) {
    const toast = document.createElement('div');
    toast.className = 'fixed bottom-4 right-4 bg-gray-800 text-white px-4 py-2 rounded-lg shadow-lg animate-fade-in';
    toast.textContent = message;
    document.body.appendChild(toast);
    
    // Remove toast after 3 seconds
    setTimeout(() => {
        toast.classList.add('opacity-0', 'transition-opacity', 'duration-300');
        setTimeout(() => toast.remove(), 300);
    }, 3000);
}