https://www.deltastream.io/wp-content/themes/delta-stream/acf/blocks/repeater-cards/js/script.js?ver=3.0.63

1/* global jQuery Swiper */
2( function( $ ) {
3	const initializeRepeaterBlock = function( ) {
4		const repeaterCards = document.querySelector( '.gl-b-repeater-cards-section .three-grid-container' );
5		if ( repeaterCards ) {
6			const list = $( '<ul class="swiper-wrapper flex flex-row"></ul>' );
7			$( '.cards-container' ).each( function( index ) {
8				const dataName = $( this ).data( 'name' );
9				const dataId = $( this ).data( 'id' );
10				const listItem = $( ' <li class="swiper-slide h-full w-auto px-2"></li>' );
11				const anchor = $( '<a class="block px-3 py-[8.5px]"></a>' ).attr( 'href', '#' + dataId ).text( dataName );
12				if ( index === 0 ) {
13					anchor.addClass( 'list-active' );
14				}
15				listItem.append( anchor );
16				list.append( listItem );
17			} );
18			$( '.three-button-container' ).append( list );
19
20			const prevButton = $( '.gl-b-repeater-cards-section ' ).find( '.three-grid-container .button-container .button-prev' ).get( 0 );
21			const nextButton = $( '.gl-b-repeater-cards-section ' ).find( '.three-grid-container .button-container .button-next' ).get( 0 );
22			if ( ! $( 'body' ).hasClass( 'wp-admin' ) ) {
23				// eslint-disable-next-line no-unused-vars
24				const swiper = new Swiper( '.three-grid-container .swiper', {
25					loop: false,
26					slidesPerView: 'auto',
27					centeredSlides: false,
28					draggable: false,
29					navigation: {
30						nextEl: [ nextButton ],
31						prevEl: [ prevButton ],
32					},
33				} );
34			}
35			$( window ).on( 'scroll', function() {
36				const scrollPosition = $( window ).scrollTop();
37				$( '.cards-container' ).each( function() {
38					const elementOffset = $( this ).offset().top;
39					const elementHeight = $( this ).outerHeight();
40					const offsetFromTop = 500;
41					const elementInViews = ( elementOffset - scrollPosition ) <= offsetFromTop &&
42											( elementOffset - scrollPosition + elementHeight ) >= 0;
43					if ( elementInViews ) {
44						const dataId = $( this ).data( 'id' );
45						$( '.three-grid-container li a' ).removeClass( 'list-active' );
46						$( '.three-grid-container li a[href="#' + dataId + '"]' ).addClass( 'list-active' );
47					}
48				} );
49			} );
50
51			$( '.three-grid-container' ).on( 'click', 'li a', function( event ) {
52				event.preventDefault();
53				const targetId = $( this ).attr( 'href' );
54				const target = $( targetId );
55				const targetOffset = target.offset().top;
56				const scrollToPosition = targetOffset - 200;
57				$( 'html, body' ).animate( {
58					scrollTop: scrollToPosition,
59				}, 800 );
60			} );
61		}
62
63		$( '.card-header-btn' ).on( 'click', function() {
64			$( this ).parent().siblings().children().next().slideUp();
65			$( '.dropdown-container img' ).removeClass( 'rotate-180' );
66			$( this ).stop().next().slideToggle();
67			$( this ).toggleClass( 'rounded-[16px] rounded-t-[16px]' );
68			$( this ).find( '.dropdown-container img' ).toggleClass( 'active' );
69			$( this ).find( '.dropdown-container img.active' ).addClass( 'rotate-180' );
70		} );
71	};
72
73	$( document ).ready( function() {
74		initializeRepeaterBlock();
75	} );
76
77	if ( window.acf ) {
78		window.acf.addAction( 'render_block_preview/type=repeater-cards', initializeRepeaterBlock );
79	}
80}( jQuery ) );