import type { AnimationPreset, AnimationConfig } from '@/types/animate';
import { DEFAULT_TRANSFORM } from './defaults';

function preset(
  id: string,
  name: string,
  category: AnimationPreset['category'],
  config: Omit<AnimationConfig, 'name'>,
): AnimationPreset {
  return { id, name, category, config: { ...config, name: id } };
}

const T = DEFAULT_TRANSFORM;

export const PRESETS: AnimationPreset[] = [
  // ─── Entrance ────────────────────────────────────────────────────────────────

  preset('fadeIn', 'Fade In', 'Entrance', {
    duration: 500, delay: 0, easing: 'ease-out',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0, properties: { opacity: 0 } },
      { id: 'b', offset: 100, properties: { opacity: 1 } },
    ],
  }),

  preset('fadeInUp', 'Fade In Up', 'Entrance', {
    duration: 600, delay: 0, easing: 'ease-out',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0, properties: { opacity: 0, transform: { ...T, translateY: 30 } } },
      { id: 'b', offset: 100, properties: { opacity: 1, transform: { ...T } } },
    ],
  }),

  preset('fadeInDown', 'Fade In Down', 'Entrance', {
    duration: 600, delay: 0, easing: 'ease-out',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0, properties: { opacity: 0, transform: { ...T, translateY: -30 } } },
      { id: 'b', offset: 100, properties: { opacity: 1, transform: { ...T } } },
    ],
  }),

  preset('fadeInLeft', 'Fade In Left', 'Entrance', {
    duration: 600, delay: 0, easing: 'ease-out',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0, properties: { opacity: 0, transform: { ...T, translateX: -40 } } },
      { id: 'b', offset: 100, properties: { opacity: 1, transform: { ...T } } },
    ],
  }),

  preset('fadeInRight', 'Fade In Right', 'Entrance', {
    duration: 600, delay: 0, easing: 'ease-out',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0, properties: { opacity: 0, transform: { ...T, translateX: 40 } } },
      { id: 'b', offset: 100, properties: { opacity: 1, transform: { ...T } } },
    ],
  }),

  preset('zoomIn', 'Zoom In', 'Entrance', {
    duration: 400, delay: 0, easing: 'ease-out',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0, properties: { opacity: 0, transform: { ...T, scaleX: 0.5, scaleY: 0.5 } } },
      { id: 'b', offset: 100, properties: { opacity: 1, transform: { ...T } } },
    ],
  }),

  preset('bounceIn', 'Bounce In', 'Entrance', {
    duration: 750, delay: 0, easing: 'ease-out',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0,   properties: { opacity: 0, transform: { ...T, scaleX: 0.3, scaleY: 0.3 } } },
      { id: 'b', offset: 50,  properties: { opacity: 1, transform: { ...T, scaleX: 1.1, scaleY: 1.1 } } },
      { id: 'c', offset: 75,  properties: { transform: { ...T, scaleX: 0.9, scaleY: 0.9 } } },
      { id: 'd', offset: 100, properties: { opacity: 1, transform: { ...T } } },
    ],
  }),

  preset('slideInLeft', 'Slide In Left', 'Entrance', {
    duration: 500, delay: 0, easing: 'ease-out',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0, properties: { transform: { ...T, translateX: -100 } } },
      { id: 'b', offset: 100, properties: { transform: { ...T } } },
    ],
  }),

  preset('rotateIn', 'Rotate In', 'Entrance', {
    duration: 600, delay: 0, easing: 'ease-out',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0, properties: { opacity: 0, transform: { ...T, rotate: -180, scaleX: 0.6, scaleY: 0.6 } } },
      { id: 'b', offset: 100, properties: { opacity: 1, transform: { ...T } } },
    ],
  }),

  // ─── Exit ─────────────────────────────────────────────────────────────────────

  preset('fadeOut', 'Fade Out', 'Exit', {
    duration: 500, delay: 0, easing: 'ease-in',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0, properties: { opacity: 1 } },
      { id: 'b', offset: 100, properties: { opacity: 0 } },
    ],
  }),

  preset('fadeOutDown', 'Fade Out Down', 'Exit', {
    duration: 600, delay: 0, easing: 'ease-in',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0, properties: { opacity: 1, transform: { ...T } } },
      { id: 'b', offset: 100, properties: { opacity: 0, transform: { ...T, translateY: 30 } } },
    ],
  }),

  preset('zoomOut', 'Zoom Out', 'Exit', {
    duration: 400, delay: 0, easing: 'ease-in',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0, properties: { opacity: 1, transform: { ...T } } },
      { id: 'b', offset: 100, properties: { opacity: 0, transform: { ...T, scaleX: 0.4, scaleY: 0.4 } } },
    ],
  }),

  preset('slideOutRight', 'Slide Out Right', 'Exit', {
    duration: 500, delay: 0, easing: 'ease-in',
    iterationCount: 1, direction: 'normal', fillMode: 'forwards',
    keyframes: [
      { id: 'a', offset: 0, properties: { transform: { ...T } } },
      { id: 'b', offset: 100, properties: { transform: { ...T, translateX: 100 } } },
    ],
  }),

  // ─── Attention ────────────────────────────────────────────────────────────────

  preset('pulse', 'Pulse', 'Attention', {
    duration: 1000, delay: 0, easing: 'ease-in-out',
    iterationCount: 'infinite', direction: 'alternate', fillMode: 'none',
    keyframes: [
      { id: 'a', offset: 0,   properties: { transform: { ...T } } },
      { id: 'b', offset: 100, properties: { transform: { ...T, scaleX: 1.08, scaleY: 1.08 } } },
    ],
  }),

  preset('shake', 'Shake', 'Attention', {
    duration: 600, delay: 0, easing: 'ease-in-out',
    iterationCount: 'infinite', direction: 'normal', fillMode: 'none',
    keyframes: [
      { id: 'a', offset: 0,   properties: { transform: { ...T } } },
      { id: 'b', offset: 20,  properties: { transform: { ...T, translateX: -8 } } },
      { id: 'c', offset: 40,  properties: { transform: { ...T, translateX: 8 } } },
      { id: 'd', offset: 60,  properties: { transform: { ...T, translateX: -6 } } },
      { id: 'e', offset: 80,  properties: { transform: { ...T, translateX: 6 } } },
      { id: 'f', offset: 100, properties: { transform: { ...T } } },
    ],
  }),

  preset('wobble', 'Wobble', 'Attention', {
    duration: 800, delay: 0, easing: 'ease-in-out',
    iterationCount: 'infinite', direction: 'normal', fillMode: 'none',
    keyframes: [
      { id: 'a', offset: 0,   properties: { transform: { ...T } } },
      { id: 'b', offset: 20,  properties: { transform: { ...T, translateX: -10, rotate: -5 } } },
      { id: 'c', offset: 50,  properties: { transform: { ...T, translateX: 8, rotate: 4 } } },
      { id: 'd', offset: 80,  properties: { transform: { ...T, translateX: -5, rotate: -3 } } },
      { id: 'e', offset: 100, properties: { transform: { ...T } } },
    ],
  }),

  preset('swing', 'Swing', 'Attention', {
    duration: 1000, delay: 0, easing: 'ease-in-out',
    iterationCount: 'infinite', direction: 'normal', fillMode: 'none',
    keyframes: [
      { id: 'a', offset: 0,   properties: { transform: { ...T } } },
      { id: 'b', offset: 25,  properties: { transform: { ...T, rotate: 15 } } },
      { id: 'c', offset: 50,  properties: { transform: { ...T, rotate: -12 } } },
      { id: 'd', offset: 75,  properties: { transform: { ...T, rotate: 8 } } },
      { id: 'e', offset: 100, properties: { transform: { ...T } } },
    ],
  }),

  preset('flash', 'Flash', 'Attention', {
    duration: 800, delay: 0, easing: 'ease-in-out',
    iterationCount: 'infinite', direction: 'normal', fillMode: 'none',
    keyframes: [
      { id: 'a', offset: 0,   properties: { opacity: 1 } },
      { id: 'b', offset: 25,  properties: { opacity: 0 } },
      { id: 'c', offset: 50,  properties: { opacity: 1 } },
      { id: 'd', offset: 75,  properties: { opacity: 0 } },
      { id: 'e', offset: 100, properties: { opacity: 1 } },
    ],
  }),

  // ─── Special ──────────────────────────────────────────────────────────────────

  preset('spin', 'Spin', 'Special', {
    duration: 1000, delay: 0, easing: 'linear',
    iterationCount: 'infinite', direction: 'normal', fillMode: 'none',
    keyframes: [
      { id: 'a', offset: 0,   properties: { transform: { ...T, rotate: 0 } } },
      { id: 'b', offset: 100, properties: { transform: { ...T, rotate: 360 } } },
    ],
  }),

  preset('ping', 'Ping', 'Special', {
    duration: 1200, delay: 0, easing: 'cubic-bezier(0, 0, 0.2, 1)',
    iterationCount: 'infinite', direction: 'normal', fillMode: 'none',
    keyframes: [
      { id: 'a', offset: 0,   properties: { transform: { ...T }, opacity: 1 } },
      { id: 'b', offset: 75,  properties: { transform: { ...T, scaleX: 2, scaleY: 2 }, opacity: 0 } },
      { id: 'c', offset: 100, properties: { transform: { ...T, scaleX: 2, scaleY: 2 }, opacity: 0 } },
    ],
  }),

  preset('wave', 'Wave', 'Special', {
    duration: 1500, delay: 0, easing: 'ease-in-out',
    iterationCount: 'infinite', direction: 'normal', fillMode: 'none',
    keyframes: [
      { id: 'a', offset: 0,   properties: { transform: { ...T, rotate: 0 } } },
      { id: 'b', offset: 15,  properties: { transform: { ...T, rotate: 14 } } },
      { id: 'c', offset: 30,  properties: { transform: { ...T, rotate: -8 } } },
      { id: 'd', offset: 40,  properties: { transform: { ...T, rotate: 14 } } },
      { id: 'e', offset: 50,  properties: { transform: { ...T, rotate: -4 } } },
      { id: 'f', offset: 60,  properties: { transform: { ...T, rotate: 10 } } },
      { id: 'g', offset: 100, properties: { transform: { ...T, rotate: 0 } } },
    ],
  }),

  preset('heartbeat', 'Heartbeat', 'Special', {
    duration: 1300, delay: 0, easing: 'ease-in-out',
    iterationCount: 'infinite', direction: 'normal', fillMode: 'none',
    keyframes: [
      { id: 'a', offset: 0,   properties: { transform: { ...T } } },
      { id: 'b', offset: 14,  properties: { transform: { ...T, scaleX: 1.3, scaleY: 1.3 } } },
      { id: 'c', offset: 28,  properties: { transform: { ...T } } },
      { id: 'd', offset: 42,  properties: { transform: { ...T, scaleX: 1.3, scaleY: 1.3 } } },
      { id: 'e', offset: 70,  properties: { transform: { ...T } } },
      { id: 'f', offset: 100, properties: { transform: { ...T } } },
    ],
  }),
];

export const PRESET_CATEGORIES: AnimationPreset['category'][] = [
  'Entrance',
  'Exit',
  'Attention',
  'Special',
];

export function getPresetsByCategory(category: AnimationPreset['category']): AnimationPreset[] {
  return PRESETS.filter((p) => p.category === category);
}