import {isMobile} from '../detect-mobile';

export default function setNumberInput(elems) {

  let initChangeToInput = (elem) => {
    let input = elem.querySelector('.set-number__output');
    let minus = elem.querySelector('.set-number__action_minus');
    let plus = elem.querySelector('.set-number__action_plus');

    let maxValue = parseInt(input.getAttribute('data-max-value')) || 3;

    if (!input.value) {
      input.value = 1 + '+';
    } else {
      input.value = parseInt(input.value) + '+';
    }

    if (parseInt(input.value) <= 1) {
      minus.classList.add('btn-disabled');
    }

    if (isMobile.any()) {
      elem.classList.add('mobile-device');
    }

    minus.onclick = () => {
      let temp = parseInt(input.value);
      plus.classList.remove('btn-disabled');
      if (--temp > 0) {
        input.value = temp + '+';

        if (temp <= 1) {
          minus.classList.add('btn-disabled');
        }
      }
      input.dispatchEvent(new Event('change'));

      minus.blur();
    };

    plus.onclick = () => {
      let temp = parseInt(input.value);
      minus.classList.remove('btn-disabled');
      if (++temp < (maxValue + 1)) {
        input.value = temp + '+';

        if (temp >= maxValue) {
          plus.classList.add('btn-disabled');
        }
      }
      input.dispatchEvent(new Event('change'));
      plus.blur();
    };
  };

  [].map.call(elems, (item) => {
    initChangeToInput(item);
  });
}
