syn_promo-8.x-1.3/assets/js/script.js

/**
 * @file
 * Author: Synapse-studio.
 */

(function ($) {
  'use strict';
  document.addEventListener('DOMContentLoaded', function () {
    let timeDelay = drupalSettings['promo-event'] ?? 0;

    setTimeout(() => {
      promoTabBehaviour();
    }, timeDelay * 1000);
  });

  function promoTabBehaviour() {
    let tab = document.querySelector('.promo-event');
    let actions_show = Cookies.get('actions_show');
    if (!tab || actions_show) return;
    tab.classList.remove('closed');
    let items = tab.querySelectorAll('.promo-event__item');
    if (items.length > 1) {
      let slider = tab.querySelector('.promo-event__list');
      let flkty = new Flickity(slider, {
        cellAlign: 'left',
        contain: true,
        pageDots: false,
        prevNextButtons: false,
        fade: true,
        accessibility: false,
        autoPlay: 4000,
        on: {
          ready: function () {
            setOffset(tab);
          },
          select: function (index) {
            let color = items[index].getAttribute('data-color');
            if (color) {
              tab.style.background = color;
            } else {
              tab.removeAttribute('style');
            }
          },
        },
      });
    } else {
      let row = tab.querySelector('.promo-event__item');
      if (row) {
        let color = row.getAttribute('data-color');
        if (color) {
          tab.style.background = color;
        }
      }
      setOffset(tab);
    }
  }

  function setOffset(tab) {
    let page = document.querySelector('.page');
    page.classList.add('page--promo-top');
    let closeTabBtn = document.querySelector('.promo-event__close');
    let tabHeight = tab.querySelector('.page-container').offsetHeight;
    let header = document.querySelector('.header');
    let nav = document.querySelector('.header-nav');
    if (window.innerWidth < 991) {
      //&& ['visitka', 'store'].includes(tab.getAttribute('data-layout'))
      header.style.top = tabHeight + 'px';
      nav.style.top = tabHeight + 'px';
    }
    page.style.top = tabHeight + 'px';
    closeTabBtn.addEventListener('click', function () {
      tab.classList.add('closed');
      page.classList.remove('page--promo-top');
      page.removeAttribute('style');
      header.removeAttribute('style');
      nav.removeAttribute('style');
      let flkty = Flickity.data('.promo-event__list');
      if (flkty) {
        flkty.destroy();
      }
      Cookies.set('actions_show', 1, {
        path: '/',
      });
    });
  }
})();