https://ironwoodstudiosinc.com/wp-content/plugins/rometheme-for-el…/widgets/assets/js/home_slider.js?ver=1.6.1

1jQuery(window).on('elementor/frontend/init', function () {
2  elementorFrontend.hooks.addAction('frontend/element_ready/rkit-home-slider.default', function ($scope, $) {
3
4    const slider = $scope.find('.rkit-homeslider-slider');
5    var config = slider.data('config');
6 
7
8    var conf = {
9      rtl: config.rtl,
10      arrows: config.arrows,
11      dots: config.dots,
12      autoplay: config.autoplay,
13      loop: config.loop,
14      speed: config.speed,
15      slidesPerView: config.slidesPerView,
16      slidesPerGroup: config.slidesPerGroup,
17      breakpoints: config.breakpoints,
18      grabCursor : true,
19      initialSlide : (config.initial_slide == null) ? 0 : config.initial_slide, 
20      // effect: 'fade',  
21      // fadeEffect: {
22      //   crossFade: true  
23      // },
24    }
25    if (config.slideStyle === 'fade') {
26      conf.effect = 'fade';
27      conf.cardsEffect = {
28          crossFade: true,
29      };
30    }
31
32    var pagination = {
33      pagination: {
34        enabled: config.dots,
35        el: '.rkit-homeslider-pagination',
36        type: 'bullets',
37        clickable: true,
38        bulletClass: 'rkit-homeslider-bullet',
39        bulletActiveClass: 'rkit-homeslider-bullet-active',
40        clickableClass: 'rkit-homeslider-bullet-clickable'
41      }
42    }
43
44    var navigation = {
45      navigation: {
46        enabled: config.arrows,
47        nextEl: '.rkit-swiper-hs-button-next',
48        prevEl: '.rkit-swiper-hs-button-prev',
49      }
50    }
51
52    var dataConfig = { ...conf, ...pagination, ...navigation }
53
54    let container = $scope.find('.rkit-swiper-hs');
55      const swiper = new Swiper(container[0], dataConfig);
56
57console.log(swiper);
58
59
60
61    swiper.on('slideChangeTransitionStart', function () { 
62      $('.image-cover-hsl').removeClass('animate-zoom-out');
63       
64      $('.swiper-slide-active .image-cover-hsl').addClass('animate-zoom-out');
65
66      //text animation  
67        // Seleksi elemen judul di slide aktif
68
69        // subtitle
70      // Pilih elemen subtitle section
71      const activeSlideSubTitleSection = document.querySelector('.swiper-slide-active .hs-subtitle-section');
72
73      if (activeSlideSubTitleSection) {
74        const activeSlideSubTitle = activeSlideSubTitleSection.querySelector('.hs-sub-title');
75        const iconElement = activeSlideSubTitleSection.querySelector('.icon-subtitle-hs');
76      
77        if (activeSlideSubTitle) {
78          const textContent = activeSlideSubTitle.textContent.trim(); // Ambil teks tanpa spasi berlebih
79          activeSlideSubTitle.textContent = ''; // Kosongkan teks untuk diisi ulang dengan elemen <span>
80      
81          // Bagi teks menjadi kata-kata dan tambahkan animasi
82          const words = textContent.split(' ');
83          words.forEach((word, index) => {
84            const span = document.createElement('span');
85            span.textContent = word;
86            span.style.animationDelay = `${0.2 * (index + 1)}s`;
87            activeSlideSubTitle.appendChild(span);
88            activeSlideSubTitle.appendChild(document.createTextNode(' ')); // Tambahkan spasi antar kata
89          });
90      
91          // Pastikan ikon tetap di tempatnya, baik di depan atau di belakang
92        
93        }
94      }
95      
96      
97
98        // title
99        const activeSlideTitle = document.querySelector('.swiper-slide-active .hs-animation-1-title');
100        
101        if (activeSlideTitle) {
102          // Ambil teks di dalam elemen
103          const words = activeSlideTitle.textContent.split(' ');
104          // Kosongkan teks asli
105          activeSlideTitle.textContent = '';
106          // Tambahkan setiap kata ke dalam elemen span
107          words.forEach(word => {
108            const span = document.createElement('span');
109            span.textContent = word;
110            activeSlideTitle.appendChild(span);
111            activeSlideTitle.appendChild(document.createTextNode(' '));  
112          });
113      
114          // Setelah elemen span dibuat, tambahkan animation-delay
115          activeSlideTitle.querySelectorAll('span').forEach((span, index) => {

116            const delay = 0.2 * (index + 1); 
117            span.style.animationDelay = `${delay}s`;
118          });
119        }
120
121        // desc
122        const activeSlideDesc = document.querySelector('.swiper-slide-active .hs-animation-1-desc');
123        
124        if (activeSlideDesc) { 
125          const words = activeSlideDesc.textContent.split(' '); 
126          activeSlideDesc.textContent = ''; 
127          words.forEach(word => {
128            const span = document.createElement('span');
129            span.textContent = word;
130            activeSlideDesc.appendChild(span);
131            activeSlideDesc.appendChild(document.createTextNode(' '));  
132          }); 
133          activeSlideDesc.querySelectorAll('span').forEach((span, index) => {
134            const delay = 0.2 * (index + 1); 
135            span.style.animationDelay = `${delay}s`;
136          });
137        }
138
139
140
141
142
143
144
145
146
147
148
149
150        // typewriter 
151        const activeSlideTextSubtitle = document.querySelector('.swiper-slide-active .hs-animation-2-subtitle');
152
153        if (activeSlideTextSubtitle) { 

154          activeSlideTextSubtitle.style.animation = 'none';
155          void activeSlideTextSubtitle.offsetWidth; // Trigger reflow
156          activeSlideTextSubtitle.style.animation = 'typewritersubtitle 4s steps(30) 1s forwards, blink 0.7s step-end infinite';
157        }
158
159        const activeSlideTextTitle = document.querySelector('.swiper-slide-active .hs-animation-2-title');
160
161        if (activeSlideTextTitle) { 
162          activeSlideTextTitle.style.animation = 'none';
163          void activeSlideTextTitle.offsetWidth; // Trigger reflow
164          activeSlideTextTitle.style.animation = 'typewritertitle 4s steps(30) 1s forwards, blink 0.7s step-end infinite';
165        }
166
167        const activeSlideTextDesc = document.querySelector('.swiper-slide-active .hs-animation-2-desc');
168
169        if (activeSlideTextDesc) { 
170          activeSlideTextDesc.style.animation = 'none';
171          void activeSlideTextDesc.offsetWidth; // Trigger reflow
172          activeSlideTextDesc.style.animation = 'typewriterdesc 4s steps(30) 1s forwards, blink 0.7s step-end infinite';
173        }
174
175
176        
177      });
178      
179
180      
181  
182
183
184 
185
186  });
187});