import { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';
import anime from 'animejs';

const onShowPopup = (popup, closeButton, shownClass, onClose) => {
  const closeHandler = (evt) => {
    evt.preventDefault(evt);
    evt.stopPropagation();

    evt.currentTarget.removeEventListener('click', closeHandler);

    popup.classList.remove(shownClass);
    enableBodyScroll(popup);
    onClose();
  };

  closeButton.addEventListener('click', closeHandler);

  disableBodyScroll(popup);
  return closeHandler;
};

const splitListIntoColumns = (container, list, columns) => {
  const items = [...list.children];
  const itemsPerColumn = parseInt(items.length / columns);
  let remain = items.length - (itemsPerColumn * columns);

  container.removeChild(list);
  for (let i = 0; i < columns; i++) {
    const newList = document.createElement('ul');

    while (newList.children.length < itemsPerColumn) {
      newList.appendChild(items.shift());
    }

    if (remain > 0) {
      newList.appendChild(items.shift());
      remain--;
    }

    container.appendChild(newList);
  }
};

const $ = document.querySelector.bind(document);
const $$ = document.querySelectorAll.bind(document);

const plural_ru = (count, one, two, five) => {
  let n = Math.abs(count);
  n %= 100;
  if (n >= 5 && n <= 20) {
    return five;
  }
  n %= 10;
  if (n === 1) {
    return one;
  }
  if (n >= 2 && n <= 4) {
    return two;
  }
  return five;
};

const plural_en = (count, one, two, five) => {
  if (count == 1) {
    return one;
  } else {
    return two;
  }
};

const pll = (word) => {
  if (typeof window.translations !== 'undefined' && typeof window.translations[word] !== 'undefined') {
    return window.translations[word];
  } else {
    return word;
  }
};

const pll_cat = (categoryId) => {
  if (typeof window.categories !== 'undefined' && typeof window.categories[categoryId] !== 'undefined') {
    return window.categories[categoryId];
  } else {
    return categoryId;
  }
};

const isMobile = () => window.innerWidth < 768;
const isIOs = () => !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);

const pageYOffset = () => window.pageYOffset || document.documentElement.scrollTop;

const smoothScrollToElement = (element, cbBegin, cbComplete) => {
  anime({
    targets: ['html', 'body'],
    begin: cbBegin,
    complete: cbComplete,
    scrollTop: pageYOffset() + element.getBoundingClientRect().top,
    duration: 500,
    easing: 'linear'
  });
};

export {
  isMobile,
  pll_cat,
  pll,
  onShowPopup,
  splitListIntoColumns,
  $,
  $$,
  plural_ru,
  plural_en,
  isIOs,
  pageYOffset,
  smoothScrollToElement
};