// Isolate JS in a function
(function (Ecwid) {

'use strict';

const EC_APP_ID       = 'mollie-pg';
const EC_APP_LOCATION = 'mollie-payments.ecwid.com';

const EW_STORE_ID     = 'ecwid_storeId';
const EW_ORDER_ID     = 'ecwid_orderId';
const EW_TOKEN        = 'ecwid_token';

/**
 * Copyright (c) 2011-present Qualiteam software Ltd. All rights reserved.
 * See https://www.x-cart.com/license-agreement.html for license details.
 *
 * @author Michael Bugrov <mixon@x-cart.com>
 */

(function (Ecwid) {

    var ecwidLoadedHandler = function () {

        var appId = EC_APP_ID;
        var appLocation = 'https://' + EC_APP_LOCATION + '/';

        var getPaymentData = function(storeId) {
            return appLocation + '?controller=payment&action=getPaymentData&' + EW_STORE_ID + '=' + storeId + '&xhr=ajax';
        }

        var getPaymentContainer = function(label) {
            var container = label.parentNode.getElementsByClassName('payment-methods');
            if (container.length === 0) {
                container = [document.createElement('div')];
                container[0].className += 'payment-methods';
                container[0].style.paddingLeft = '18px';
                label.parentNode.appendChild(container[0]);
            }
            return container[0];
        }

        var ecwidPaymentIconsOld = function(result) {
            var optionsContainers = document.getElementsByClassName('ecwid-Checkout')[0].getElementsByClassName('ecwid-PaymentMethodsBlock-PaymentOption');

            for (var i = 0; i < optionsContainers.length; i++) {
                var radioContainer = optionsContainers[i].getElementsByClassName('gwt-RadioButton')[0];
                var label = radioContainer.getElementsByTagName('label')[0];

                if (result.label && label.innerHTML.indexOf(result.label) !== -1) {
                    var container = getPaymentContainer(label);
                    if (
                        container
                        && container.getElementsByTagName('img').length === 0
                    ) {
                        for (item in result.list) {
                            var image = document.createElement('img');
                            image.setAttribute('title', result.list[item].name);
                            image.setAttribute('src', result.list[item].img);
                            if (container.children.length !== 0) {
                                image.style.paddingLeft = '5px';
                            }
                            container.appendChild(image);
                        }
                    }
                }
            }
        }

        var getIconsListStyles = function(selector) {
            var iconsStyle = document.createElement('style');
            iconsStyle.textContent = '\
                ' + selector + ' {\
                    padding: 5px 5px 5px 0;\
                }\
                ' + selector + ' img {\
                    margin: 5px 5px 5px 0;\
                }\
            ';
            return iconsStyle;
        }

        var getIconsListContainer = function(paymentSection, selector) {
            var iconsList = paymentSection.querySelector('.payment-method-icons-list-container');
            if (!iconsList) {
                // Create new list
                iconsList = document.createElement('div');
                iconsList.className = 'payment-method-icons-list-container';
                paymentSection.appendChild(iconsList);
                // Create icons style
                var iconsStyle = getIconsListStyles(selector + ' .payment-method-icons-list-container');
                paymentSection.appendChild(iconsStyle);
            } else {
                // Cleanup the list
                iconsList.querySelectorAll('img').forEach(function (icon) {
                    icon.remove();
                });
            }
            return iconsList;
        }

        var ecwidPaymentIconsNew = function(result) {
            if (
                result &&
                result.selector
            ) {
                var selector = 'html#ecwid_html body#ecwid_body .ec-size .ec-store .ec-cart-step--payment .ec-radiogroup__item--' + ecwidPaymentSelectorGenerator(result.selector) + ' .ec-radiogroup__info';
                var paymentInfoSection = document.querySelector(selector);

                if (paymentInfoSection) {
                    var iconsList = getIconsListContainer(paymentInfoSection, selector);
                    if (iconsList) {
                        for (item in result.list) {
                            var image = document.createElement('img');

                            image.setAttribute('title', result.list[item].name);
                            image.setAttribute('src', result.list[item].img);

                            iconsList.appendChild(image);
                        }
                    }
                }
            }
        }

        var ecwidUpdatePaymentData = function(result) {
            var ecwidFeatureTogglesInfo = Ecwid.getFeatureToggles();

            if (ecwidFeatureTogglesInfo) {
                if (ecwidFeatureTogglesInfo.newCheckoutPage === true) {
                    ecwidPaymentIconsNew(result);
                } else {
                    ecwidPaymentIconsOld(result);
                }
            }
        }

        var ecwidPaymentSelectorGenerator = function(selector) {
            var replaceMatrix = [
                { search: ' ', replace: '-'}
            ];

            for (var i = 0; i < selector.length; i++) {
                var charCode = selector.charCodeAt(i);
                var charString = String.fromCharCode(charCode);

                if (!charString.match(/[A-Za-z0-9_-]/)) {
                    var encoded = ('000' + charCode.toString(16)).slice(-4);
                    replaceMatrix.push({ search: charString, replace: encoded });
                }
            }

            for (i = 0; i < replaceMatrix.length; i++)
            {
                selector = selector.replace(replaceMatrix[i].search, replaceMatrix[i].replace);
            }

            return selector;
        }

        var ecwidCheckoutPaymentDetailsHandler = function (page) {
            var storeId = Ecwid.getOwnerId();
            var xhttp = new XMLHttpRequest();

            xhttp.onreadystatechange = function() {
                if (this.readyState == 4 && this.status == 200) {
                    var response = JSON.parse(this.response);
                    if (
                        response
                        && response.success
                        && response.result
                    ) {
                        ecwidUpdatePaymentData(response.result);
                    }
                }
            };

            var request = getPaymentData(storeId);

            xhttp.open('GET', request, true);

            try {
                xhttp.send();
            } catch (e) {
                console.log(e);
            }
        }

        var ecwidPageLoadedHandler = function(page) {

            switch (page.type) {
                case 'CHECKOUT_PAYMENT_DETAILS':
                    ecwidCheckoutPaymentDetailsHandler(page);
                    break;
            }

        }

        Ecwid.OnPageLoaded.add(ecwidPageLoadedHandler);
    }

    Ecwid.OnAPILoaded.add(ecwidLoadedHandler);

})(Ecwid);

})(Ecwid);