let searchButton = document.getElementById('srp-search-button');
let anExpressButton = document.getElementById('an-express-footer-button');
let searchInput = document.getElementById('js-typeahead-inventory');
let searchButtonText = searchButton.innerHTML.trim().split(' ').join('_').toLowerCase();

searchButton.addEventListener('click', function () {
    srpSearch();
    tealiumEventClick('srp_filter_click', searchButtonText);
});

searchInput.addEventListener('keydown', function (e) {
    if (e.keyCode === 13) {
        tealiumEventClick('srp_filter_click', searchButtonText);
        srpSearch();
    }
});

anExpressButton.addEventListener('click', function() {
    tealiumEventClick('srp_click', anExpressButton.innerHTML.trim().split(' ').join('_').toLowerCase());
});


function tealiumEventClick(event, eventLabel) {
    let clickdata = {
        "category_l1":"MLP",
        "category_l2":"How Buying Online Works",
        "category_l3":"(not set)",
        "category_l4":"(not set)",
        "event": event,
        "event_category":"EngagementType",
        "event_action":"EngagementType_MLP|||Click",
        "event_label":"" + eventLabel,
        "event_value":"1",
        "pagegroup":"mlp"            
    };

    window.utag_data = clickdata;
    window.utag.link(window.utag_data);
}

function srpSearch() {
    let textValue = searchInput.value;
    let URL = "/v2/api/sitecore/HomePageWidget/AutoCompleteFields?text=" + textValue;

    $.get(URL, function (result) {
        let resultObj = result;

        if (typeof result != 'object') {
            resultObj = JSON.parse(result);
        }

        let srpURL = sendToSRP(resultObj);
        //            window.open( srpURL, "_blank");
        location.href = srpURL;
    });
}

function sendToSRP(arguments) {
    let url = '/cars-for-sale?';
    let parameter = '';
    let keyCount = 0;

    for (let key in arguments) {
        keyCount++;
        if (keyCount > 1) {
            parameter += '&';
        }
        parameter += key + '=';
        if (arguments.hasOwnProperty(key)) {
            let paramList = arguments[key];
            for (let i = 0; i < paramList.length; i++) {
                if (i > 0) {
                    parameter += '|' + paramList[i];
                } else {
                    parameter += paramList[i];
                }
            }
        }
    }

    return url + parameter;
}

document.addEventListener("DOMContentLoaded", function (event) {
    $(document).ready(function () {
        let carouselId = '#autonationexpresscarousel';
        let carouselAdded = false;
        let smCarouselAdded = false;

        addOrRemoveCarousel();
        window.onresize = function () {
            addOrRemoveCarousel();
        };

        function addOrRemoveCarousel() {
            if (window.outerWidth >= 851) {
                removeCarousel(carouselId);
                carouselAdded = false;
            } else if (window.outerWidth < 851 && window.outerWidth > 491 && carouselAdded === false) {
                carouselAdded = true;
                smCarouselAdded = false;
                removeCarousel(carouselId);
                addCarousel(carouselId);
            } else if (window.outerWidth <= 490 && smCarouselAdded == false) {
                removeCarousel(carouselId);
                addSmCarousel(carouselId);
                carouselAdded = false;
                smCarouselAdded = true;
            }
        }

        function addCarousel(eleId) {
            $(eleId).slick({
                mobileFirst: true,
                slidesToShow: 2,
                slidesToScroll: 2,
                arrows: false,
                infinite: true,
                dots: true,
                rows: 0
            });
        }

        function addSmCarousel(eleId) {
            $(eleId).slick({
                mobileFirst: true,
                slidesToShow: 1,
                slidesToScroll: 1,
                arrows: false,
                infinite: true,
                dots: true,
                rows: 0
            });
        }

        function removeCarousel(eleId) {
            let carousel = $(eleId);

            if (carousel.hasClass('slick-initialized')) {
                carousel.slick("unslick");
            }
        }
    });

});