/* ==========================================================================
   PricingHandler handler
   - Handles the Pricing component which has the proper classes.
 ========================================================================== */

export const PricingHandler = {
    pricingSwitch : null,
    pricingSymbolsList : null,
    pricingPricesList: null,
    pricingSymbols: ['€', '$'],

    init: function () {
        PricingHandler.pricingSwitch = document.querySelector('.js-pricing-switch');
        PricingHandler.pricingSymbolsList = document.querySelectorAll('.js-pricing-symbol');
        PricingHandler.pricingPricesList = document.querySelectorAll('.js-pricing-price');
        PricingHandler.preventClickElements = document.querySelectorAll('.js-pricing-prevent-click');

        if(isset(PricingHandler.pricingSwitch) && PricingHandler.pricingSwitch.count !== 0) {
            PricingHandler.pricingSwitch.addEventListener('change', PricingHandler.toggleCurrency, false);
        }

        for( let i = 0; i < PricingHandler.preventClickElements.length; i++) {
            const preventClickElement =  PricingHandler.preventClickElements[i];
            preventClickElement.addEventListener('click', function (event) {
                event.preventDefault();
            });
        }

    },

    toggleCurrency: function (event) {
        const toggle = event.target;

        for (let i = 0; i < PricingHandler.pricingSymbolsList.length; i++) {
            const symbol = toggle.checked ? PricingHandler.pricingSymbols[1] : PricingHandler.pricingSymbols[0];
            PricingHandler.pricingSymbolsList[i].setAttribute('data-currency-symbol', symbol);
        }

        for (let i = 0; i < PricingHandler.pricingPricesList.length; i++) {
            const symbol = toggle.checked ? PricingHandler.pricingSymbols[1] : PricingHandler.pricingSymbols[0];
            const elem = PricingHandler.pricingPricesList[i];
            const eur = elem.getAttribute('data-price-eur');
            const usd = elem.getAttribute('data-price-usd');
            const price = toggle.checked ? usd : eur;
            elem.textContent = price;
        }
    }
};