// Toggle order forms
function toggleOrderForm(productId) {
  const form = document.getElementById(productId + '-form');
  if (form.classList.contains('hidden')) {
    // Hide all other forms first
    const allForms = document.querySelectorAll('[id$="-form"]');
    allForms.forEach(f => f.classList.add('hidden'));
    
    // Show the requested form
    form.classList.remove('hidden');
  } else {
    form.classList.add('hidden');
  }
}

// Initialize page functionality
export function init() {
  // Make toggleOrderForm available globally
  window.toggleOrderForm = toggleOrderForm;
  
  // Add form submission handlers
  const forms = document.querySelectorAll('[data-landingsite-contact-form]');
  forms.forEach(form => {
    form.addEventListener('submit', handleFormSubmit);
  });
  
  // Add click outside to close forms
  document.addEventListener('click', handleOutsideClick);
}

function handleFormSubmit(event) {
  // Allow the form to submit naturally to the landingsite system
  const form = event.target;
  const product = form.querySelector('[name="product"]').value;
  
  // Show success message after a brief delay (to let landingsite process)
  setTimeout(() => {
    const submitBtn = form.querySelector('[type="submit"]');
    const originalText = submitBtn.innerHTML;
    submitBtn.innerHTML = '<i class="fas fa-check mr-1"></i> Purchase Complete!';
    submitBtn.disabled = true;
    submitBtn.classList.remove('bg-green-600', 'hover:bg-green-700');
    submitBtn.classList.add('bg-green-500');
    
    // Reset after 3 seconds
    setTimeout(() => {
      form.reset();
      form.parentElement.classList.add('hidden');
      submitBtn.innerHTML = originalText;
      submitBtn.disabled = false;
      submitBtn.classList.remove('bg-green-500');
      submitBtn.classList.add('bg-green-600', 'hover:bg-green-700');
    }, 3000);
  }, 100);
}

function handleOutsideClick(event) {
  // Close forms when clicking outside
  if (!event.target.closest('.bg-white') && !event.target.closest('button[onclick*="toggleOrderForm"]')) {
    const visibleForms = document.querySelectorAll('[id$="-form"]:not(.hidden)');
    visibleForms.forEach(form => form.classList.add('hidden'));
  }
}

// Teardown function
export function teardown() {
  // Remove event listeners
  const forms = document.querySelectorAll('[data-landingsite-contact-form]');
  forms.forEach(form => {
    form.removeEventListener('submit', handleFormSubmit);
  });
  
  document.removeEventListener('click', handleOutsideClick);
  
  // Remove global function
  delete window.toggleOrderForm;
}