import {callAction} from '../utils/http-action';
import {ROUTES} from '../utils/routes';
import {showLoader} from '../utils/loader';

const charityEl = {
  charityItem: '.charity-new',
  charityMultiple: 'charity-multiple',
  charityInput: '#donation',
  charityTitleWrap: '.title-wrap',
  donationCart: '.donation-cart',
  donationCartHide: 'donation-cart__hide',
  donationCartBtn: '.donation-cart__btn, .donation-cart-new__btn',
  donationCartBtnSelected: '.donation-cart-new__btn.btn-selected',
  donationCartHolder: '.donation-cart__holder, .donation-cart-new__holder',
  donationCartValue: '.donation-cart__value, .donation-cart-new__value',
  charityAdded: 'charity-added',
  donationCartCostBlock: '.donation-cart-new__cost',
  donationCartCostBlockHide: 'donation-cart-new__cost-hide',
  donationCartRemove: '.donation-cart-new__cost .order-item__remove',
}

export function updateCharity(button) {
  if ($('#donation').attr('disabled') === 'disabled') {
    $('#donation').removeAttr('disabled');
  } else {
    $('#donation').prop('disabled', (_, value) => !value);
  }

  const context = getCurrentCharityItem(button);
  const productCode = getCurrentProductCode(context);
  const quantity = getSelectedCharityAmount(button);

  showLoader('.basket-loader');

  if (context.hasClass(charityEl.charityAdded)) {
    $(button).removeAttr('checked');
  } else {
    $(button).attr('checked', 'checked');
    repaintCharityButton(button);
    context
      .find(charityEl.donationCartValue)
      .text(quantity);
    showDonationCostBlock(context);
    charityActionForAdd(productCode, quantity);
  }
}

function getSelectedCharityAmount(context) {
  return $(context).data('value');
}

function getCurrentCharityItem(context) {
  return $(context).closest(charityEl.charityItem);
}

function getCurrentProductCode(context) {
  return context.find('input[name="productCode"]').val();
}

export function charityActionForAdd(value, quantity) {
  if (!Wick.checkLocalEnv) {
    const payload = {
      url: ROUTES.CHARITY_ADD,
      queries: {
        productCodePost: value,
        qty: quantity,
      },
      type: 'POST',
    };
    const productInfo = {
      quantity: null,
      fulfillment: 'Delivery',
    };

    callAction(payload, executeCharityAction, productInfo);
  } else {
    Wick.BasketPage.updateCart(...Array(2), true);
  }
}

function executeCharityAction(response, productInfo) {
  if (response.addedProducts && response.addedProducts[0]) {
    productInfo.quantity = response.addedProducts[0].qty;
    $(document).trigger("EEAddToCart", productInfo);
  }

  Wick.BasketPage.updateCart(...Array(2), true);
}

export function changeCharityPrice() {
  if ($(this).hasClass('btn-selected')) {
    return;
  }

  const charityValue = $(this).attr('data-value'),
    context = getCurrentCharityItem(this),
    productCode = getCurrentProductCode(context);

  repaintCharityButton(this);
  $(charityEl.donationCartValue).text(charityValue);
  showDonationCostBlock(context);
  charityActionForChangePrice(this);
}

function charityActionForChangePrice(context) {
  const component = $(context).closest(Wick.BasketPage.el.charityItem);
  const entryNumber = $(component).find('input[name="entryNumber"]').val();
  const value = $(context).attr('data-value');

  showLoader('.basket-loader');
  Wick.BasketPage.updateQuantityAction(entryNumber, value, context, component);
}

function repaintCharityButton(context) {
  const donationButtons = $(context).closest(charityEl.donationCartHolder).find(charityEl.donationCartBtn);
  const btnSelected = 'btn-selected';
  const btnSecondary = 'btn-secondary';

  donationButtons.each((i, btn) => {
    $(btn).hasClass(btnSelected) && $(btn).removeClass(btnSelected).addClass(btnSecondary);
  })

  $(context).removeClass(btnSecondary).addClass(btnSelected);
}

function getDefaultCharityAmount() {
  const donationButtons = $(charityEl.charityItem).find(charityEl.donationCartBtn);
  return donationButtons.first().attr('data-value');
}

export function setDefaultCharityValue() {
  $(charityEl.donationCartBtnSelected).each(function() {
    const $btn   = $(this);
    const $item  = $btn.closest(charityEl.charityItem);
    const value  = $btn.data('value');

    $item.find(charityEl.donationCartValue).text(value);
    $item.find(charityEl.donationCartCostBlock)
      .removeClass(charityEl.donationCartCostBlockHide);
  });
}

function showDonationCostBlock($charity) {
  $charity.find(charityEl.donationCartCostBlock)
    .removeClass(charityEl.donationCartCostBlockHide);
}

function resetCharityValue() {
  const defaultValue = getDefaultCharityAmount();
  $(charityEl.donationCartValue).text(defaultValue);
}

export function initCharityInteractions() {
  $(document).on('click', charityEl.donationCartRemove, function(e) {
    e.preventDefault();

    const $item = $(this).closest(charityEl.charityItem);
    $item.removeClass(charityEl.charityAdded);
    $item
      .find(charityEl.donationCartCostBlock)
      .addClass(charityEl.donationCartCostBlockHide);
    $item
      .find(charityEl.donationCartBtn)
      .removeClass('btn-selected')
      .addClass('btn-secondary');
    resetCharityValue();
  });
}
