import { gsap } from 'gsap'
import { ScrollTrigger } from 'gsap/ScrollTrigger'

if (typeof window !== 'undefined') {
  gsap.registerPlugin(ScrollTrigger)
}

export const EASES = {
  cinematic: 'cubic-bezier(0.16, 1, 0.3, 1)',
  expo: 'expo.out',
  spring: 'elastic.out(1, 0.5)',
  smooth: 'power3.inOut',
}

export const textRevealConfig = {
  duration: 1.1,
  ease: 'expo.out',
  y: '110%',
  stagger: 0.04,
}

export const fadeUpConfig = {
  duration: 0.9,
  ease: 'expo.out',
  y: 60,
  opacity: 0,
}

export function setupScrollTriggerDefaults() {
  ScrollTrigger.defaults({
    markers: false,
    toggleActions: 'play none none reverse',
  })
}

export function createCounterAnimation(
  element: HTMLElement,
  targetValue: number,
  suffix = '',
  duration = 2,
  scrollTrigger?: ScrollTrigger.Vars
) {
  const obj = { value: 0 }
  return gsap.to(obj, {
    value: targetValue,
    duration,
    ease: 'power2.out',
    onUpdate() {
      element.textContent = Math.round(obj.value) + suffix
    },
    scrollTrigger,
  })
}