https://macula-retina.es/wp-content/themes/mednix/assets/js/gsap-script.js?ver=7.1.2

1(function($) {
2  "use strict";
3
4  const gsapanim = function() {
5
6    // SVG Animation
7    document.querySelectorAll(".svg-animate").forEach(box => {
8      const paths = box.querySelectorAll("path");
9
10      paths.forEach(path => {
11        const length = path.getTotalLength();
12
13        gsap.set(path, {
14          strokeDasharray: length,
15          strokeDashoffset: length,
16          visibility: "visible",
17          opacity: 1,
18        });
19
20        gsap.to(path, {
21          strokeDashoffset: 0,
22          duration: 1.5,
23          ease: "power2.out",
24          scrollTrigger: {
25            trigger: box,
26            start: "top 80%",
27            toggleActions: "play none none none",
28          },
29        });
30      });
31    });
32
33
34const splitTypes = document.querySelectorAll('.themeht-anim-text');
35splitTypes.forEach((element) => {
36    const splitText = new SplitType(element, { types: 'chars, words' });
37
38    gsap.from(splitText.chars, {
39        opacity: 0.2,
40        stagger: 0.05, // Reduced for smoother animation
41        scrollTrigger: {
42            trigger: element,
43            start: 'top 80%',
44            end: 'top -10%',
45            scrub: true,
46        }
47    });
48});
49
50
51const textAnimeElements = document.querySelectorAll('.text-anime-style');
52
53if (textAnimeElements.length > 0) {
54  textAnimeElements.forEach(el => {
55    const split = new SplitType(el, { types: 'words' });
56
57    // Defensive check for split.words existence and length
58    if (split.words && split.words.length > 0) {
59      gsap.from(split.words, {
60        clipPath: 'inset(0 100% 0 0)',
61        opacity: 0,
62        duration: 0.5,
63        ease: 'power2.out',
64        stagger: 0.1,
65        scrollTrigger: {
66          trigger: el,
67          start: 'top 85%',
68          toggleActions: 'play none none none'
69        }
70      });
71    }
72  });
73}
74
75
76  if (document.querySelector('.bg-gsap')) {
77  gsap.to(".bg-gsap", {
78    backgroundPosition: "center 100%",
79    ease: "none",
80    scrollTrigger: {
81      trigger: ".bg-gsap",
82      start: "top bottom",
83      end: "bottom top",
84      scrub: true
85    }
86  });
87}
88
89    // Slide Left/Right Animation
90    gsap.utils.toArray(['.slide-left', '.slide-right']).forEach(elem => {
91      if(elem) {
92        gsap.fromTo(elem,
93          { x: elem.classList.contains('slide-left') ? -100 : 100 },
94          {
95            x: 0,
96            ease: "power3.out",
97            scrollTrigger: {
98              trigger: elem,
99              start: "top 80%",
100              end: "bottom 20%",
101              scrub: true,
102            }
103          }
104        );
105      }
106    });
107
108    // Title Icon Rotation
109    if (document.querySelector(".title-icon")) {
110      gsap.to(".title-icon", {
111        rotation: 720,
112        duration: 10,
113        ease: "linear",
114        repeat: -1,
115        transformOrigin: "50% 50%"
116      });
117    }
118
119  }
120
121  $(function() {
122    gsapanim();
123  });
124  
125  jQuery(window).on('elementor/frontend/init', function() {
126        elementorFrontend.hooks.addAction( 'frontend/element_ready/title.default', gsapanim );
127        elementorFrontend.hooks.addAction( 'frontend/element_ready/feature.default', gsapanim );
128        elementorFrontend.hooks.addAction( 'frontend/element_ready/ht-anim-title.default', gsapanim );
129        elementorFrontend.hooks.addAction( 'frontend/element_ready/image.default', gsapanim );
130    });
131
132})(jQuery);