https://www.volarisgroup.com/wp-content/themes/generatepress_child…/spotlight.js?ver=202610031639

1document.addEventListener('DOMContentLoaded', function () {
2    // 1. Language Toggle System (Persistent via LocalStorage)
3    const savedLang = localStorage.getItem('volaris_spotlight_lang') || 'en';
4    setLanguage(savedLang);
5
6    // Toggle dropdown open/close
7    const langTrigger = document.querySelector('.volaris-lang-trigger');
8    const langDropdown = document.querySelector('.volaris-lang-dropdown');
9
10    if (langTrigger && langDropdown) {
11        langTrigger.addEventListener('click', function (e) {
12            e.stopPropagation();
13            const expanded = this.getAttribute('aria-expanded') === 'true';
14            this.setAttribute('aria-expanded', !expanded);
15            langDropdown.classList.toggle('open');
16        });
17
18        // Close dropdown when clicking outside
19        document.addEventListener('click', function () {
20            langTrigger.setAttribute('aria-expanded', 'false');
21            langDropdown.classList.remove('open');
22        });
23    }
24
25    // Target the options inside the custom dropdown selector
26    document.querySelectorAll('.volaris-lang-option').forEach(btn => {
27        btn.addEventListener('click', function (e) {
28            e.preventDefault();
29            const targetLang = this.getAttribute('data-lang-target');
30            if (targetLang) {
31                setLanguage(targetLang);
32                if (langTrigger) langTrigger.setAttribute('aria-expanded', 'false');
33                if (langDropdown) langDropdown.classList.remove('open');
34            }
35        });
36    });
37
38    function setLanguage(lang) {
39        localStorage.setItem('volaris_spotlight_lang', lang);
40
41        // Update active class on dropdown options
42        document.querySelectorAll('.volaris-lang-option').forEach(opt => {
43            if (opt.getAttribute('data-lang-target') === lang) {
44                opt.classList.add('active');
45            } else {
46                opt.classList.remove('active');
47            }
48        });
49
50        // Update the trigger button text label and flags
51        const triggerEnLabel = document.querySelector('.volaris-lang-trigger .lang-en-label');
52        const triggerSvLabel = document.querySelector('.volaris-lang-trigger .lang-sv-label');
53        const triggerEnFlag = document.querySelector('.volaris-lang-trigger .lang-en-flag');
54        const triggerSvFlag = document.querySelector('.volaris-lang-trigger .lang-sv-flag');
55        if (triggerEnLabel && triggerSvLabel) {
56            if (lang === 'sv') {
57                triggerEnLabel.style.display = 'none';
58                triggerSvLabel.style.display = 'inline-block';
59                if (triggerEnFlag && triggerSvFlag) {
60                    triggerEnFlag.style.display = 'none';
61                    triggerSvFlag.style.display = 'inline-block';
62                }
63            } else {
64                triggerSvLabel.style.display = 'none';
65                triggerEnLabel.style.display = 'inline-block';
66                if (triggerEnFlag && triggerSvFlag) {
67                    triggerSvFlag.style.display = 'none';
68                    triggerEnFlag.style.display = 'inline-block';
69                }
70            }
71        }
72
73        const wrapper = document.querySelector('.volaris-spotlight-wrapper');
74        if (wrapper) {
75            wrapper.setAttribute('data-current-lang', lang);
76        }
77
78        if (lang === 'sv') {
79            document.querySelectorAll('.lang-en').forEach(el => el.style.display = 'none');
80            document.querySelectorAll('.lang-sv').forEach(el => {
81                const tag = el.tagName.toLowerCase();
82                if (tag === 'span' || tag === 'a' || tag === 'button') {
83                    el.style.display = 'inline-block';
84                } else {
85                    el.style.display = 'block';
86                }
87            });
88        } else {
89            document.querySelectorAll('.lang-sv').forEach(el => el.style.display = 'none');
90            document.querySelectorAll('.lang-en').forEach(el => {
91                const tag = el.tagName.toLowerCase();
92                if (tag === 'span' || tag === 'a' || tag === 'button') {
93                    el.style.display = 'inline-block';
94                } else {
95                    el.style.display = 'block';
96                }
97            });
98        }
99
100        // Update select options labels dynamically
101        document.querySelectorAll('#country_residence option, #country_location option').forEach(opt => {
102            if (opt.hasAttribute('data-en') && opt.hasAttribute('data-sv')) {
103                opt.textContent = lang === 'sv' ? opt.getAttribute('data-sv') : opt.getAttribute('data-en');
104            }
105        });
106    }
107
108    // 2. Page 1 — Country Gate Form Validation
109    const gateForm = document.getElementById('volaris-gate-form');
110    const modal = document.getElementById('volaris-notice-modal');
111
112    if (gateForm) {
113        gateForm.addEventListener('submit', function (e) {
114            e.preventDefault();
115            const residence = document.getElementById('country_residence').value;
116            const location = document.getElementById('country_location').value;
117

118            if ((residence === 'Sweden' || residence === 'Sverige') && (location === 'Sweden' || location === 'Sverige')) {
119                localStorage.setItem('volaris_spotlight_verified', 'true');
120                window.location.href = volarisSpotlightData.page2Url;
121            } else {
122                showModal();
123            }
124        });
125    }
126
127    // 3. Page 2 — YES / NO Gate Validation
128    const btnYes = document.getElementById('btn-confirm-yes');
129    const btnNo = document.getElementById('btn-confirm-no');
130
131    if (btnYes && btnNo) {
132        // Redirect back to page 1 if they try to bypass the country selector
133        if (localStorage.getItem('volaris_spotlight_verified') !== 'true') {
134            window.location.href = volarisSpotlightData.page1Url;
135            return;
136        }
137
138        btnYes.addEventListener('click', function () {
139            localStorage.setItem('volaris_spotlight_confirmed', 'true');
140            window.location.href = volarisSpotlightData.page3Url;
141        });
142
143        btnNo.addEventListener('click', function () {
144            showModal();
145        });
146    }
147
148    // 4. Page 3 — Materials Page Security & Sticky Navigation Scrollspy
149    const materialsPage = document.querySelector('.materials-layout');
150    if (materialsPage) {
151        // Redirect back to page 1 if they didn't pass verification and confirmation
152        if (localStorage.getItem('volaris_spotlight_confirmed') !== 'true') {
153            window.location.href = volarisSpotlightData.page1Url;
154            return;
155        }
156
157        const navLinks = document.querySelectorAll('.volaris-nav-link');
158        const sections = document.querySelectorAll('.volaris-content-section');
159
160        navLinks.forEach(link => {
161            link.addEventListener('click', function (e) {
162                e.preventDefault();
163                const targetId = this.getAttribute('href');
164                const targetSection = document.querySelector(targetId);
165
166                if (targetSection) {
167                    const offset = 80; // Offset for sticky navigation header
168                    const bodyRect = document.body.getBoundingClientRect().top;
169                    const elementRect = targetSection.getBoundingClientRect().top;
170                    const elementPosition = elementRect - bodyRect;
171                    const offsetPosition = elementPosition - offset;
172
173                    window.scrollTo({
174                        top: offsetPosition,
175                        behavior: 'smooth'
176                    });
177                }
178            });
179        });
180
181        window.addEventListener('scroll', function () {
182            let currentSectionId = '';
183            const scrollPos = window.scrollY + 100;
184
185            sections.forEach(section => {
186                const sectionTop = section.offsetTop;
187                const sectionHeight = section.offsetHeight;
188
189                if (scrollPos >= sectionTop && scrollPos < sectionTop + sectionHeight) {
190                    currentSectionId = '#' + section.getAttribute('id');
191                }
192            });
193
194            navLinks.forEach(link => {
195                if (link.getAttribute('href') === currentSectionId) {
196                    link.classList.add('active');
197                } else {
198                    link.classList.remove('active');
199                }
200            });
201        });
202    }
203
204    // 5. Mobile Section Navigation Hamburger Toggle
205    const sectionToggle = document.getElementById('section-menu-toggle');
206    const sectionClose = document.getElementById('section-menu-close');
207    const navInner = document.querySelector('.volaris-nav-inner');
208
209    if (sectionToggle && navInner) {
210        sectionToggle.addEventListener('click', function () {
211            navInner.classList.add('open');
212        });
213    }
214
215    if (sectionClose && navInner) {
216        sectionClose.addEventListener('click', function () {
217            navInner.classList.remove('open');
218        });
219    }
220
221    // Close mobile overlay when a section link is clicked
222    document.querySelectorAll('.volaris-nav-link').forEach(link => {
223        link.addEventListener('click', function () {
224            if (navInner && window.innerWidth <= 767) {
225                navInner.classList.remove('open');
226            }
227        });
228    });

229
230    function showModal() {
231        if (typeof Fancybox !== 'undefined') {
232            Fancybox.show([{
233                src: "#volaris-notice-modal",
234                type: "inline"
235            }]);
236        } else if (window.jQuery && jQuery.fancybox) {
237            jQuery.fancybox.open({
238                src: "#volaris-notice-modal",
239                type: "inline"
240            });
241        } else {
242            const fallbackModal = document.getElementById('volaris-notice-modal');
243            if (fallbackModal) {
244                fallbackModal.style.display = 'block';
245            }
246        }
247    }
248});