const OrderIntakeHandler = {

    products: 0,

    init: function () {

        const productQuantities = document.querySelectorAll('.js-product-quantity');
        const productHandlers = document.querySelectorAll('.js-handled');
        const freeInputs = document.querySelectorAll('.js-free-input');

        OrderIntakeHandler.products = productHandlers.length;

        for(let f = 0; f < freeInputs.length; f++) {
            freeInputs[f].addEventListener('change', OrderIntakeHandler.handleFreeInput);
        }

        for(let i = 0; i < productQuantities.length; i++) {
            OrderIntakeHandler.initProductQuantity(productQuantities[i]);
        }

        for(let j = 0; j < OrderIntakeHandler.products; j++) {
            const productHandler = productHandlers[j];
            productHandler.addEventListener('change', OrderIntakeHandler.countHandled);
        }
    },

    handleFreeInput(event)
    {
        const input = event.currentTarget;
        const amount = parseFloat(input.value);


        input.setAttribute('data-total', amount * 100);

        OrderIntakeHandler.calculatedTotal();
    },

    initProductQuantity(element)
    {

        const input = element.querySelector('.js-amount');
        const total = element.querySelector('.js-total');

        if(!isset(input) || !isset(total)) return;

        input.addEventListener('change', OrderIntakeHandler.changeEvent);

        const addButton = element.querySelector('.js-add');
        const subButton = element.querySelector('.js-sub');

        if(isset(addButton)) addButton.addEventListener('click', function () {
            let amount = parseInt(input.value);
            amount++;
            if(amount > input.max) amount = input.max;
            input.value = amount;
            OrderIntakeHandler.updateElementByInput(input);
        });


        if(isset(subButton)) subButton.addEventListener('click', function () {
            let amount = parseInt(input.value);
            amount--;
            if(amount < 0) amount = 0;
            input.value = amount;
            OrderIntakeHandler.updateElementByInput(input);
        });
    },

    changeEvent(event) {
        OrderIntakeHandler.updateElementByInput(event.currentTarget);
    },

    updateElementByInput(input)
    {
        const productQuantityElement = input.parentNode.parentNode.parentNode;
        const total = productQuantityElement.querySelector('.js-total');

        const price = parseInt(total.getAttribute('data-price'));
        const amount = parseInt(input.value);

        if(amount === 0) total.classList.remove('u-color-primary--500');
        else total.classList.add('u-color-primary--500');

        total.setAttribute('data-total', price * amount );
        total.innerHTML = number_format((price * amount/100), 2, ',', '.');

        OrderIntakeHandler.calculatedTotal();
    },

    calculatedTotal() {

        let total = 0;
        const priceElements = document.querySelectorAll('.js-total');

        for(let p = 0; p < priceElements.length; p++ ) {
            const priceElement = priceElements[p];
            total += parseInt( priceElement.getAttribute('data-total') );
        }

        const shortageTotalElement = document.querySelector('.js-shortage-total');
        shortageTotalElement.innerHTML = number_format((total/100), 2, ',', '.');

        const depositTotalElement = document.querySelector('.js-deposit');
        const depositAmount = parseInt(depositTotalElement.getAttribute('data-deposit'));

        let returnAmount = depositAmount - total;

        const returnTotalElement = document.querySelector('.js-return-total');

        const positiveLabel =document.querySelector('.js-label-positive');
        const negativeLabel =document.querySelector('.js-label-negative');

        const payOutButton = document.querySelector('.js-pay-out-button');
        const payOutButtonPositiveLabel = document.querySelector('.js-button-positive');
        const payOutButtonNegativeLabel = document.querySelector('.js-button-negative');

        if(returnAmount >= 0) {
            payOutButton.classList.add('c-button--positive');
            positiveLabel.classList.remove('is-hidden');
            payOutButtonPositiveLabel.classList.remove('is-hidden');
            negativeLabel.classList.add('is-hidden');
            payOutButtonNegativeLabel.classList.add('is-hidden');
        }
        else {

            payOutButton.classList.remove('c-button--positive');
            positiveLabel.classList.add('is-hidden');
            payOutButtonPositiveLabel.classList.add('is-hidden');
            negativeLabel.classList.remove('is-hidden');
            payOutButtonNegativeLabel.classList.remove('is-hidden');
            returnAmount *= -1;
        }

        returnTotalElement.innerHTML = number_format((returnAmount/100), 2, ',', '.');
    },

    countHandled() {

        let handled = 0;

        const productHandlers = document.querySelectorAll('.js-handled');
        for(let j = 0; j < OrderIntakeHandler.products; j++) {
            const productHandler = productHandlers[j];
            if(productHandler.checked) handled++;
        }

        const handledNotice = document.querySelector('.js-unhandled-products-note');
        const payOutButton = document.querySelector('.js-pay-out-button');

        // If handled is the same as the handled, unlock send refund/payment button
        if(OrderIntakeHandler.products === handled) {

            if(isset(handledNotice)) handledNotice.classList.add('is-invisible');
            if(isset(payOutButton)) payOutButton.classList.remove('c-button--inactive');

        }
        else {
            if(isset(handledNotice)) handledNotice.classList.remove('is-invisible');
            if(isset(payOutButton)) payOutButton.classList.add('c-button--inactive');
        }

    }
};

OrderIntakeHandler.init();