// Counter animation functionality
let observerCounter = null;
let animatedCounters = new Set();

function animateCounter(element, targetValue, suffix = '', duration = 2000) {
  const startValue = 0;
  const startTime = performance.now();
  
  function updateCounter(currentTime) {
    const elapsed = currentTime - startTime;
    const progress = Math.min(elapsed / duration, 1);
    
    // Use easeOutExpo for smooth deceleration
    const easedProgress = progress === 1 ? 1 : 1 - Math.pow(2, -10 * progress);
    const currentValue = Math.floor(startValue + (targetValue - startValue) * easedProgress);
    
    element.textContent = currentValue + suffix;
    
    if (progress < 1) {
      requestAnimationFrame(updateCounter);
    } else {
      element.textContent = targetValue + suffix;
    }
  }
  
  requestAnimationFrame(updateCounter);
}

function handleCounterIntersection(entries) {
  entries.forEach(entry => {
    if (entry.isIntersecting && !animatedCounters.has(entry.target)) {
      animatedCounters.add(entry.target);
      
      const elementId = entry.target.id;
      if (elementId === 'sectors-counter') {
        animateCounter(entry.target, 10, '+', 2500);
      } else if (elementId === 'exchanges-counter') {
        animateCounter(entry.target, 6, '+', 2000);
      }
    }
  });
}

function initCounterAnimations() {
  // Find the specific counter elements by ID
  const sectorsCounter = document.getElementById('sectors-counter');
  const exchangesCounter = document.getElementById('exchanges-counter');
  
  if (sectorsCounter) {
    sectorsCounter.textContent = '0+';
    observerCounter.observe(sectorsCounter);
  }
  
  if (exchangesCounter) {
    exchangesCounter.textContent = '0+';
    observerCounter.observe(exchangesCounter);
  }
}

function init() {
  // Create intersection observer for counter animations
  observerCounter = new IntersectionObserver(handleCounterIntersection, {
    threshold: 0.3,
    rootMargin: '0px 0px -50px 0px'
  });
  
  // Initialize counter animations after a short delay to ensure DOM is ready
  setTimeout(() => {
    initCounterAnimations();
  }, 100);
}

function teardown() {
  if (observerCounter) {
    observerCounter.disconnect();
    observerCounter = null;
  }
  animatedCounters.clear();
}

export { init, teardown };