import { getPublishDate } from '@finsweet/ts-utils';
import { gsap } from 'gsap';
import { Flip } from 'gsap/Flip';
import { ScrollTrigger } from 'gsap/ScrollTrigger';

import { magnetAnimation } from '$utils/magnetAnimation';
import { setCursor } from '$utils/cursor';

gsap.registerPlugin(ScrollTrigger, Flip);

window.Webflow ||= [];
window.Webflow.push(() => {
  const can_not_hover = window.matchMedia('(any-hover: none');

  const cursor = document.querySelector('.cursor-wrapper') as HTMLElement;
  const cursor_dot = document.querySelector('.cursor-dot') as HTMLElement;

  if (!can_not_hover.matches) {
    /// Cursor
    if (cursor) {
      setCursor(cursor);

      let all_links = Array.from(document.getElementsByTagName('a'));

      all_links.forEach((link) => {
        link.addEventListener('mouseover', (e) => {
          gsap.to(cursor_dot, {
            width: '36px',
            height: '36px',
            duration: 0.25,
            ease: 'power3.inOut',
          });
        });

        link.addEventListener('mouseout', (e) => {
          gsap.to(cursor_dot, {
            width: '12px',
            height: '12px',
            duration: 0.25,
            ease: 'power3.inOut',
          });
        });
      });
    }
    ///

    /// Video Button
    const video_play_button = document.querySelector('.video_play-button') as HTMLElement;
    const video_play_button_inside = document.querySelector(
      '.video_play-button-image'
    ) as HTMLElement;
    const video_area = document.querySelector('.video_image') as HTMLElement;
    if (video_play_button && video_play_button_inside && video_area) {
      magnetAnimation(video_play_button, video_play_button_inside, video_area);
    }
    ///
  } else {
    if (cursor) {
      cursor.style.display = 'none';
    }
  }
});