https://sensfrx.ai/assets/scripts/header.js?v=2

1window.addEventListener('scroll', function () {
2    const button = document.getElementById('scrollButton');
3    if (window.scrollY > 150) {
4        button.classList.remove('hidden');
5    } else {
6        button.classList.add('hidden');
7    }
8});
9
10//drop downmenu for solution
11const dropdownButton = document.getElementById('dropdownButton');
12const dropdownMenu = document.getElementById('dropdownMenu');
13
14dropdownButton.addEventListener('mouseenter', () => {
15    dropdownMenu.classList.remove('opacity-0', 'invisible');
16    dropdownMenu.classList.add('opacity-100', 'visible');
17});
18
19dropdownButton.addEventListener('mouseleave', () => {
20    setTimeout(() => {
21        if (!dropdownMenu.matches(':hover')) {
22            dropdownMenu.classList.add('opacity-0', 'invisible');
23            dropdownMenu.classList.remove('opacity-100', 'visible');
24        }
25    }, 200);
26});
27
28dropdownMenu.addEventListener('mouseleave', () => {
29    dropdownMenu.classList.add('opacity-0', 'invisible');
30    dropdownMenu.classList.remove('opacity-100', 'visible');
31});
32
33// Toggle on click for mobile users
34dropdownButton.addEventListener('click', () => {
35    dropdownMenu.classList.toggle('opacity-0');
36    dropdownMenu.classList.toggle('invisible');
37    dropdownMenu.classList.toggle('opacity-100');
38    dropdownMenu.classList.toggle('visible');
39});
40//drop downmenu for industries
41const dropdownButton2 = document.getElementById('dropdownButton2');
42const dropdownMenu2 = document.getElementById('dropdownMenu2');
43
44dropdownButton2.addEventListener('mouseenter', () => {
45    dropdownMenu2.classList.remove('opacity-0', 'invisible');
46    dropdownMenu2.classList.add('opacity-100', 'visible');
47});
48
49dropdownButton2.addEventListener('mouseleave', () => {
50    setTimeout(() => {
51        if (!dropdownMenu2.matches(':hover')) {
52            dropdownMenu2.classList.add('opacity-0', 'invisible');
53            dropdownMenu2.classList.remove('opacity-100', 'visible');
54        }
55    }, 200);
56});
57
58dropdownMenu2.addEventListener('mouseleave', () => {
59    dropdownMenu2.classList.add('opacity-0', 'invisible');
60    dropdownMenu2.classList.remove('opacity-100', 'visible');
61});
62
63// Toggle on click for mobile users
64dropdownButton2.addEventListener('click', () => {
65    dropdownMenu2.classList.toggle('opacity-0');
66    dropdownMenu2.classList.toggle('invisible');
67    dropdownMenu2.classList.toggle('opacity-100');
68    dropdownMenu2.classList.toggle('visible');
69});
70//drop downmenu for marketplace
71const dropdownButton3 = document.getElementById('dropdownButton3');
72const dropdownMenu3 = document.getElementById('dropdownMenu3');
73
74dropdownButton3.addEventListener('mouseenter', () => {
75    dropdownMenu3.classList.remove('opacity-0', 'invisible');
76    dropdownMenu3.classList.add('opacity-100', 'visible');
77});
78
79dropdownButton3.addEventListener('mouseleave', () => {
80    setTimeout(() => {
81        if (!dropdownMenu3.matches(':hover')) {
82            dropdownMenu3.classList.add('opacity-0', 'invisible');
83            dropdownMenu3.classList.remove('opacity-100', 'visible');
84        }
85    }, 200);
86});
87
88dropdownMenu3.addEventListener('mouseleave', () => {
89    dropdownMenu3.classList.add('opacity-0', 'invisible');
90    dropdownMenu3.classList.remove('opacity-100', 'visible');
91});
92
93// Toggle on click for mobile users
94dropdownButton3.addEventListener('click', () => {
95    dropdownMenu3.classList.toggle('opacity-0');
96    dropdownMenu3.classList.toggle('invisible');
97    dropdownMenu3.classList.toggle('opacity-100');
98    dropdownMenu3.classList.toggle('visible');
99});
100//dropdown for company 
101
102// Tools dropdown
103const dropdownButton5 = document.getElementById('dropdownButton5');
104const dropdownMenu5 = document.getElementById('dropdownMenu5');
105
106if (dropdownButton5 && dropdownMenu5) {
107    dropdownButton5.addEventListener('mouseenter', () => {
108        dropdownMenu5.classList.remove('opacity-0', 'invisible');
109        dropdownMenu5.classList.add('opacity-100', 'visible');
110    });
111
112    dropdownButton5.addEventListener('mouseleave', () => {
113        setTimeout(() => {
114            if (!dropdownMenu5.matches(':hover')) {
115                dropdownMenu5.classList.add('opacity-0', 'invisible');
116                dropdownMenu5.classList.remove('opacity-100', 'visible');
117            }
118        }, 200);
119    });
120
121    dropdownMenu5.addEventListener('mouseleave', () => {
122        dropdownMenu5.classList.add('opacity-0', 'invisible');
123        dropdownMenu5.classList.remove('opacity-100', 'visible');
124    });
125
126    dropdownButton5.addEventListener('click', () => {
127        dropdownMenu5.classList.toggle('opacity-0');
128        dropdownMenu5.classList.toggle('invisible');
129        dropdownMenu5.classList.toggle('opacity-100');
130        dropdownMenu5.classList.toggle('visible');
131    });
132}
133
134//drop downmenu for marketplace
135const dropdownButton4 = document.getElementById('dropdownButton4');
136const dropdownMenu4 = document.getElementById('dropdownMenu4');
137
138dropdownButton4.addEventListener('mouseenter', () => {
139    dropdownMenu4.classList.remove('opacity-0', 'invisible');
140    dropdownMenu4.classList.add('opacity-100', 'visible');
141});
142
143dropdownButton4.addEventListener('mouseleave', () => {
144    setTimeout(() => {
145        if (!dropdownMenu4.matches(':hover')) {
146            dropdownMenu4.classList.add('opacity-0', 'invisible');
147            dropdownMenu4.classList.remove('opacity-100', 'visible');
148        }
149    }, 200);
150});
151
152dropdownMenu4.addEventListener('mouseleave', () => {
153    dropdownMenu4.classList.add('opacity-0', 'invisible');
154    dropdownMenu4.classList.remove('opacity-100', 'visible');
155});
156
157// Toggle on click for mobile users
158dropdownButton4.addEventListener('click', () => {
159    dropdownMenu4.classList.toggle('opacity-0');
160    dropdownMenu4.classList.toggle('invisible');
161    dropdownMenu4.classList.toggle('opacity-100');
162    dropdownMenu4.classList.toggle('visible');
163});
164
165document.getElementById('menu-toggle').addEventListener('click', function () {
166    document.getElementById('mobile-menu').classList.toggle('hidden');
167});
168
169document.getElementById('mobile-dropdown-1').addEventListener('click', function () {
170    document.getElementById('mobile-dropdown-menu-1').classList.toggle('hidden');
171});
172
173document.getElementById('mobile-dropdown-2').addEventListener('click', function () {
174    document.getElementById('mobile-dropdown-menu-2').classList.toggle('hidden');
175});
176document.getElementById('mobile-dropdown-3').addEventListener('click', function () {
177    document.getElementById('mobile-dropdown-menu-3').classList.toggle('hidden');
178});
179document.getElementById('mobile-dropdown-4').addEventListener('click', function () {
180    document.getElementById('mobile-dropdown-menu-4').classList.toggle('hidden');
181});
182document.getElementById('mobile-dropdown-5').addEventListener('click', function () {
183    document.getElementById('mobile-dropdown-menu-5').classList.toggle('hidden');
184});
185// document.getElementById('mobile-dropdown-5').addEventListener('click', function() {
186//     document.getElementById('mobile-dropdown-menu-5').classList.toggle('hidden');
187// });
188
189function adjustLayout() {
190    const topBar = document.getElementById('topBar');
191    const header = document.getElementById('mainHeader');
192    const spacer = document.getElementById('headerSpacer');
193
194    const isVisible = topBar && !topBar.classList.contains('hidden');
195
196    const topBarHeight = isVisible ? topBar.offsetHeight : 0;
197
198    header.style.top = topBarHeight + 'px';
199    // spacer.style.height = (header.offsetHeight + topBarHeight) + 'px';
200}
201
202function closeTopBar() {
203    const topBar = document.getElementById('topBar');
204
205    // Smooth collapse
206    topBar.style.height = topBar.offsetHeight + "px";
207    setTimeout(() => {
208        topBar.style.height = "0px";
209        topBar.style.padding = "0px";
210        topBar.style.overflow = "hidden";
211    }, 10);
212    // 🔥 Recalculate navbar position
213    window.dispatchEvent(new Event('scroll'));
214    // Fully remove after animation
215    setTimeout(() => {
216        topBar.classList.add('hidden');
217        adjustLayout();
218    }, 300);
219}
220
221window.onload = adjustLayout;
222window.onresize = adjustLayout;