import brand_data from '/js/brands.json.js';
//String(SITEconfig.brands_URL);

let Carousel = new Object();

Carousel.BrandAbbrevs = brand_data;

//console.log("setting the Brand Data");
//console.log(Carousel.BrandAbbrevs);

function DoCarousel() {

    var x, newHTML;

    //$('#brand_bar').css("background","#114538");
    $('#brand_bar').css("padding","1vw");

    Carousel.StartNumber = Carousel.StartNumber || 0;
    Carousel.ScreenWidth = $(window).width();
    Carousel.NumLogos    = Math.floor(Carousel.ScreenWidth/175); 

    if (Carousel.StartNumber == (Carousel.BrandAbbrevs.length-1)) {
        Carousel.StartNumber = 0;
    }

    let y = Carousel.StartNumber+Carousel.NumLogos;

    $('#brand_bar').empty();

    for (x=Carousel.StartNumber; x<y; x++) {

        newHTML = '<a href="/brand/'+Carousel.BrandAbbrevs[Carousel.StartNumber]['id']+'/'+Carousel.BrandAbbrevs[Carousel.StartNumber]['name']+'">';
        newHTML += '<img style="top:'+Carousel.BrandAbbrevs[Carousel.StartNumber]['offset']+'px;" class="rel" alt="'+Carousel.BrandAbbrevs[Carousel.StartNumber]['name']+' Logo"';
        newHTML += ' src="//pix.wftackle.com/brands/'+Carousel.BrandAbbrevs[Carousel.StartNumber]['id']+'/logo"></a>';
        $('#brand_bar').append(newHTML);
        
        if (Carousel.StartNumber >= (Carousel.BrandAbbrevs.length-1)) {
            Carousel.StartNumber = 0;
            continue;
        }
        Carousel.StartNumber++;
    }
    //Carousel.StartNumber+=Carousel.NumLogos;

    if (Carousel.StartNumber == (Carousel.BrandAbbrevs.length-1)) {
        Carousel.StartNumber = 0;
    }
}

setInterval(DoCarousel,3000);