https://butterflyonline.com/wp-content/themes/Butterfly/_/js/podsGallery-init.js?x95497&ver=1.0.0

1(function($) {
2    $(document).ready(function() {
3
4        // ---------------------------------------------------------
5        // 1. Pods / Layout Logic
6        // ---------------------------------------------------------
7        $('.contentFullWidth').addClass('hide');
8        
9        if ($('.et_lb_module').length > 0) {
10            $('.et_lb_module.et_lb_first').each(function() {
11                var tileClass = '';
12                var $this = $(this);
13
14                if ($this.hasClass('woodTile') || $this.children().hasClass('woodTile')) tileClass = 'woodTile';
15                else if ($this.hasClass('pinkButterfly') || $this.children().hasClass('pinkButterfly')) tileClass = 'pinkButterfly';
16                else if ($this.hasClass('fullWidth') || $this.children().hasClass('fullWidth')) tileClass = 'fullWidth';
17                else if ($this.hasClass('responsiveHide') || $this.children().hasClass('responsiveHide')) tileClass = 'responsiveHide';
18
19                $this.nextUntil('.et_lb_module.et_lb_first')
20                    .addBack()
21                    .wrapAll('<div class="contentRow ' + tileClass + '"><div class="inner"></div><div class="textureOverlay"></div></div>');
22            });
23        }
24        $('.contentFullWidth').removeClass('hide');
25
26        // ---------------------------------------------------------
27        // 2. Carousels
28        // ---------------------------------------------------------
29        if ($('.homeSlideshow').length > 0 && $('.homeSlideshow > .item').length > 1) {
30            $('.homeSlideshow').owlCarousel({
31                animateOut: 'fadeOut', animateIn: 'fadeIn', items: 1, margin: 0, loop: true, smartSpeed: 450, nav: true, navText: ['&#xf104;', '&#xf105;'], autoplay: true, autoplayTimeout: 5000
32            });
33        }
34
35        if ($('.featuredProducts').length > 0 && $('.featuredProducts > .item').length > 1) {
36            $('.featuredProducts').owlCarousel({
37                animateOut: 'fadeOutLeft', animateIn: 'fadeInRight', items: 1, margin: 0, loop: true, smartSpeed: 450, nav: true, navText: ['&#xf104;', '&#xf105;']
38            });
39        }
40
41        // ---------------------------------------------------------
42        // 3. UI Toggles
43        // ---------------------------------------------------------
44        if ($('.mailingListOverlay').length > 0) {
45            $('.mailingListOverlay .toggle').on('click touchend', function() {
46                $(this).parent('.mailingListOverlay').toggleClass('open');
47            });
48        }
49
50        $('.headerSearch .formToggle').on('click touchend', function(e) {
51            e.preventDefault();
52            if (!$(this).hasClass('active')) {
53                $('.headerSearch .formToggle').removeClass('active');
54                $(this).addClass('active');
55                if ($(this).hasClass('site')) {
56                    $('form.headerSearch').attr('action', '/').find('input[type="text"]').attr('name', 's');
57                } else if ($(this).hasClass('products')) {
58                    $('form.headerSearch').attr('action', 'https://shop.butterflyonline.com/search').find('input[type="text"]').attr('name', 'keywords');
59                }
60            }
61        });
62
63        // ---------------------------------------------------------
64        // 4. GALLERY SWAPPER (The Fix)
65        // ---------------------------------------------------------
66        if ($('.butterflyGallery').length > 0) {
67            // Use 'delegate' binding to ensure it works even if DOM updates
68            $(document).on('click touchend', '.butterflyGallery .thumbs ul > li', function() {
69                var $clickedThumb = $(this);
70                var $gallery = $clickedThumb.closest('.butterflyGallery');
71                var $mainImage = $gallery.find('.mainImage');
72                
73                // 1. Get High-Res URL
74                var highResUrl = $clickedThumb.attr('data-main-image');
75                
76                // Fallback to background-image if data attribute missing
77                if (!highResUrl) {
78                    var bgStyle = $clickedThumb.css('background-image');
79                    if (bgStyle && bgStyle !== 'none') {
80                        highResUrl = bgStyle.replace(/^url\(['"]?(.+?)['"]?\)/i, '$1');
81                    }
82                }
83
84                // 2. Get Mode
85                var bgMode = $clickedThumb.attr('data-bg-mode') || 'cover'; 
86
87                // 3. Apply
88                if (highResUrl && $mainImage.length) {
89                    $mainImage.css({
90                        'background-image': 'url("' + highResUrl + '")',
91                        'background-size': bgMode,
92                        'background-repeat': 'no-repeat'
93                    });
94
95                    // Alignment Logic: Small=Left-Top, Big=Center-Top
96                    if (bgMode === 'contain' || bgMode === 'auto') {
97                        $mainImage.css('background-position', 'left top');
98                    } else {
99                        $mainImage.css('background-position', 'center top');
100                    }
101                }
102            });
103        }
104
105        // ---------------------------------------------------------
106        // 5. YouTube Feed & Others
107        // ---------------------------------------------------------
108        if ($('.youtubeFeed').length > 0) {
109            $('.youtubeFeed').each(function() {
110                var thisFeed = $(this);
111                var thisForm = $('form', thisFeed);
112                
113                $('input[type="radio"]', thisForm).on('click touchend', function() { thisForm.submit(); });
114
115                $('.youtubeList', thisFeed).owlCarousel({
116                    animateOut: 'fadeOutLeft', animateIn: 'fadeInRight', items: 4, margin: 10, loop: true, nav: true, navText: ['&#xf104;', '&#xf105;'], autoplay: false,
117                    responsive: { 0: { items: 1 }, 500: { items: 2 }, 600: { items: 3 }, 800: { items: 4 } }
118                });
119                thisForm.addClass('ready');
120
121                $('ul.youtubeList a', thisFeed).click(function(e) {
122                    e.preventDefault();
123                    var vidID = $(this).data('video-id');
124                    $('.ytMainPlayer', thisFeed).html('<iframe id="player" width="100%" height="100%" src="//www.youtube.com/embed/' + vidID + '?enablejsapi=1&origin=https://www.butterflyonline.com/&rel=0" frameborder="0" allowfullscreen></iframe>');
125                });
126            });
127        }
128
129        // Mobile Menu / Dragging
130        var dragging = false;

131        $("body").on("touchmove", function() { dragging = true; });
132        $("body").on("touchstart", function() { dragging = false; });
133
134        $('.navigation li.menu-item-has-children, #homeShopMenu li.menu-item-has-children').on('touchend click', function(e) {
135            e.stopImmediatePropagation();
136            if (e.target == this) {
137                if (!dragging) $(this).toggleClass('showChild');
138                return false;
139            }
140        });
141
142        $('body').on('click touchend', '.searchToggle, .menuToggle, .activeOverlay', function(e) {
143            e.stopImmediatePropagation();
144            var body = $('body');
145            var isMenu = $(this).hasClass('menuToggle');
146            var isSearch = $(this).hasClass('searchToggle');
147            
148            if (!dragging) {
149                if (body.hasClass('showNav') || body.hasClass('showSearch')) {
150                    body.removeClass('showNav showSearch');
151                    $('header form input').blur();
152                } else {
153                    if (isMenu) body.addClass('showNav');
154                    if (isSearch) {
155                        body.addClass('showSearch');
156                        $('header form input').focus(); // Better UX
157                    }
158                }
159            }
160            if (e.target == this) return false;
161        });
162
163        // Accordion
164        if ($('.accordionWidget').length > 0) {
165            $('.accordionWidget .widget .textwidget').hide();
166            $('.accordionWidget .widget .widget-title').on('click', function() {
167                var thisAH = $(this);
168                var thisAC = thisAH.nextAll('.textwidget').first();
169                if (thisAC.is(':visible')) {
170                    thisAC.slideUp(function() { thisAC.removeClass('active'); thisAH.removeClass('active'); });
171                } else {
172                    thisAC.slideDown(); thisAC.addClass('active'); thisAH.addClass('active');
173                }
174            });
175        }
176
177    }); 
178})(window.jQuery);