https://info.zotabox.com/wp-content/themes/smartpopup/assets/js/main.js

1/**
2* Template Name: Arsha
3* Template URL: https://bootstrapmade.com/arsha-free-bootstrap-html-template-corporate/
4* Updated: Aug 07 2024 with Bootstrap v5.3.3
5* Author: BootstrapMade.com
6* License: https://bootstrapmade.com/license/
7*/
8
9(function () {
10  "use strict";
11
12  /**
13   * Apply .scrolled class to the body as the page is scrolled down
14   */
15  function toggleScrolled() {
16    const selectBody = document.querySelector('body');
17    const selectHeader = document.querySelector('#header');
18    if (!selectHeader.classList.contains('scroll-up-sticky') && !selectHeader.classList.contains('sticky-top') && !selectHeader.classList.contains('fixed-top')) return;
19    window.scrollY > 100 ? selectBody.classList.add('scrolled') : selectBody.classList.remove('scrolled');
20  }
21
22  document.addEventListener('scroll', toggleScrolled);
23  window.addEventListener('load', toggleScrolled);
24
25
26  setTimeout(function () {
27    var setIntervalElm = setInterval(function () {
28      if (document.querySelector('#crisp-chatbox .cc-1m2mf').length != 0) {
29        document.querySelector('#crisp-chatbox .cc-1m2mf').style.setProperty("bottom", "65px", "important");
30        clearInterval(setIntervalElm)
31      }
32    }, 100)
33  }, 2000)
34
35
36
37  /**
38   * Mobile nav toggle
39   */
40  const mobileNavToggleBtn = document.querySelector('.mobile-nav-toggle');
41
42  function mobileNavToogle() {
43    document.querySelector('body').classList.toggle('mobile-nav-active');
44    mobileNavToggleBtn.classList.toggle('bi-list');
45    mobileNavToggleBtn.classList.toggle('bi-x');
46  }
47  mobileNavToggleBtn.addEventListener('click', mobileNavToogle);
48
49  /**
50   * Hide mobile nav on same-page/hash links
51   */
52  document.querySelectorAll('#navmenu a').forEach(navmenu => {
53    navmenu.addEventListener('click', () => {
54      if (document.querySelector('.mobile-nav-active')) {
55        mobileNavToogle();
56      }
57    });
58
59  });
60
61  /**
62   * Toggle mobile nav dropdowns
63   */
64  document.querySelectorAll('.navmenu .toggle-dropdown').forEach(navmenu => {
65    navmenu.addEventListener('click', function (e) {
66      e.preventDefault();
67      this.parentNode.classList.toggle('active');
68      this.parentNode.nextElementSibling.classList.toggle('dropdown-active');
69      e.stopImmediatePropagation();
70    });
71  });
72
73  /**
74   * Preloader
75   */
76  const preloader = document.querySelector('#preloader');
77  if (preloader) {
78    window.addEventListener('load', () => {
79      preloader.remove();
80    });
81  }
82
83  /**
84   * Scroll top button
85   */
86  let scrollTop = document.querySelector('.scroll-top');
87
88  function toggleScrollTop() {
89    if (scrollTop) {
90      window.scrollY > 100 ? scrollTop.classList.add('active') : scrollTop.classList.remove('active');
91    }
92  }
93  scrollTop.addEventListener('click', (e) => {
94    e.preventDefault();
95    window.scrollTo({
96      top: 0,
97      behavior: 'smooth'
98    });
99  });
100
101  window.addEventListener('load', toggleScrollTop);
102  document.addEventListener('scroll', toggleScrollTop);
103
104  /**
105   * Animation on scroll function and init
106   */
107  function aosInit() {
108    AOS.init({
109      duration: 600,
110      easing: 'ease-in-out',
111      once: true,
112      mirror: false
113    });
114  }
115  window.addEventListener('load', aosInit);
116
117  /**
118   * Initiate glightbox
119   */
120  const glightbox = GLightbox({
121    selector: '.glightbox'
122  });
123
124  /**
125   * Init swiper sliders
126   */
127  function initSwiper() {
128    document.querySelectorAll(".init-swiper").forEach(function (swiperElement) {
129
130      new Swiper(swiperElement, configSwiper);
131    });
132  }
133
134  window.addEventListener("load", initSwiper);
135
136  /**
137   * Frequently Asked Questions Toggle
138   */
139  document.querySelectorAll('.faq-item h3, .faq-item .faq-toggle').forEach((faqItem) => {
140    faqItem.addEventListener('click', () => {
141      faqItem.parentNode.classList.toggle('faq-active');
142    });
143  });
144
145  /**
146   * Animate the skills items on reveal
147   */
148  let skillsAnimation = document.querySelectorAll('.skills-animation');
149  skillsAnimation.forEach((item) => {
150    new Waypoint({
151      element: item,
152      offset: '80%',
153      handler: function (direction) {
154        let progress = item.querySelectorAll('.progress .progress-bar');
155        progress.forEach(el => {
156          el.style.width = el.getAttribute('aria-valuenow') + '%';
157        });
158      }
159    });
160  });
161
162  /**
163   * Init isotope layout and filters
164   */
165  document.querySelectorAll('.isotope-layout').forEach(function (isotopeItem) {
166    let layout = isotopeItem.getAttribute('data-layout') ?? 'masonry';
167    let filter = isotopeItem.getAttribute('data-default-filter') ?? '*';
168    let sort = isotopeItem.getAttribute('data-sort') ?? 'original-order';
169
170    let initIsotope;
171    imagesLoaded(isotopeItem.querySelector('.isotope-container'), function () {
172      initIsotope = new Isotope(isotopeItem.querySelector('.isotope-container'), {
173        itemSelector: '.isotope-item',
174        layoutMode: layout,
175        filter: filter,
176        sortBy: sort
177      });
178    });
179
180    isotopeItem.querySelectorAll('.isotope-filters li').forEach(function (filters) {
181      filters.addEventListener('click', function () {
182        isotopeItem.querySelector('.isotope-filters .filter-active').classList.remove('filter-active');
183        this.classList.add('filter-active');
184        initIsotope.arrange({
185          filter: this.getAttribute('data-filter')
186        });
187        if (typeof aosInit === 'function') {
188          aosInit();
189        }
190      }, false);
191    });
192
193  });
194
195  /**
196   * Correct scrolling position upon page load for URLs containing hash links.
197   */
198  window.addEventListener('load', function (e) {
199    if (window.location.hash) {
200      if (document.querySelector(window.location.hash)) {
201        setTimeout(() => {
202          let section = document.querySelector(window.location.hash);
203          let scrollMarginTop = getComputedStyle(section).scrollMarginTop;
204          window.scrollTo({
205            top: section.offsetTop - parseInt(scrollMarginTop),
206            behavior: 'smooth'
207          });
208        }, 100);
209      }
210    }
211  });
212
213  /**
214   * Navmenu Scrollspy
215   */
216  let navmenulinks = document.querySelectorAll('.navmenu a');
217
218  function navmenuScrollspy() {
219    navmenulinks.forEach(navmenulink => {
220      if (!navmenulink.hash) return;
221      let section = document.querySelector(navmenulink.hash);
222      if (!section) return;
223      let position = window.scrollY + 200;
224      if (position >= section.offsetTop && position <= (section.offsetTop + section.offsetHeight)) {
225        document.querySelectorAll('.navmenu a.active').forEach(link => link.classList.remove('active'));
226        navmenulink.classList.add('active');
227      } else {
228        navmenulink.classList.remove('active');
229      }
230    })
231  }
232  window.addEventListener('load', navmenuScrollspy);
233  document.addEventListener('scroll', navmenuScrollspy);
234
235})();