https://www.purdys.com/static/version1790083580/frontend/Purdys2/Firecheckout/en_US/js/accordion.js

1/**
2 * Simple accordion functionality for FAQ sections
3 * Handles click on .accordion buttons to toggle .faqpanel elements
4 */
5
6(function() {
7    'use strict';
8    
9    function handleAccordionClick(event) {
10        // Only handle clicks on elements with 'accordion' class
11        if (!event.target.classList.contains('accordion')) {
12            return;
13        }
14        
15        event.preventDefault();
16        
17        var accordion = event.target;
18
19        // Find the faqpanel (try multiple strategies)
20        var panel = null;
21        
22        // Strategy 1: Next sibling
23        panel = accordion.nextElementSibling;
24        while (panel && !panel.classList.contains('faqpanel')) {
25            panel = panel.nextElementSibling;
26        }
27        
28        // Strategy 2: Look in parent container
29        if (!panel) {
30            var parent = accordion.parentElement;
31            panel = parent ? parent.querySelector('.faqpanel') : null;
32        }
33        
34        if (!panel) {
35            return;
36        }
37
38        // Find the arrow element (look for .arrows or .arrow)
39        var arrow = accordion.querySelector('.arrows') || accordion.querySelector('.arrow');
40        
41        // Check if panel is currently open
42        var currentMaxHeight = panel.style.maxHeight;
43        var isOpen = panel.classList.contains('active') || 
44                     (currentMaxHeight && currentMaxHeight !== '0px' && currentMaxHeight !== 'none');
45
46        if (isOpen) {
47            // Close the panel
48            panel.classList.remove('active');
49            panel.style.maxHeight = '0px';
50            panel.style.overflow = 'hidden';
51            panel.style.transition = 'max-height 0.2s ease-out';
52            
53            if (arrow) {
54                arrow.classList.remove('arrowsRotate');
55            }
56        } else {
57            // Open the panel
58            panel.classList.add('active');
59            panel.style.overflow = 'hidden';
60            panel.style.transition = 'max-height 0.2s ease-out';
61            
62            // Use requestAnimationFrame to ensure proper measurement
63            requestAnimationFrame(function() {
64                // Temporarily remove max-height to measure content
65                var originalMaxHeight = panel.style.maxHeight;
66                panel.style.maxHeight = 'none';
67                var scrollHeight = panel.scrollHeight;
68                panel.style.maxHeight = originalMaxHeight;
69                
70                // Force reflow then animate to target height
71                panel.offsetHeight;
72                panel.style.maxHeight = scrollHeight + 'px';
73                
74                if (arrow) {
75                    arrow.classList.add('arrowsRotate');
76                }
77            });
78        }
79    }
80    
81    var initialized = false;
82    
83    function initAccordion() {
84        if (initialized) {
85            return;
86        }
87
88        // Initialize all accordion panels to ensure they start in correct state
89        var panels = document.querySelectorAll('.faqpanel');
90        panels.forEach(function(panel) {
91            if (!panel.classList.contains('active')) {
92                panel.style.maxHeight = '0px';
93                panel.style.overflow = 'hidden';
94                panel.style.transition = 'max-height 0.2s ease-out';
95            }
96        });
97
98        // Use event delegation on document
99        document.addEventListener('click', handleAccordionClick);
100        
101        initialized = true;
102    }
103
104    // Strategy 1: Immediate if DOM is ready
105    if (document.readyState === 'loading') {
106        document.addEventListener('DOMContentLoaded', function() {
107            initAccordion();
108        });
109    } else {
110        initAccordion();
111    }
112    
113    // Strategy 2: Fallback with setTimeout
114    setTimeout(function() {
115        initAccordion();
116    }, 1000);
117    
118    // Strategy 3: Window load event
119    window.addEventListener('load', function() {
120        initAccordion();
121    });
122})();