var updateCount = 0;
var currentlyShownBackgroundImageId = "";
var timeOut;

var currentDate;
var homePageFeatures;


function InitializeHomePageFeature(pHomePageFeatures) {
    homePageFeatures = pHomePageFeatures;

    var images = GetBackgroundImageUrls();

    $(images).preloadImages(function () {
        AppendBackGroundImages(images);
        GenerateImageSelector();
        UpdateHomePage(2000, 2000);
    });


}
// Helper function, used below.
// Usage: ['img1.jpg','img2.jpg'].remove('img1.jpg');
Array.prototype.remove = function (element) {
    for (var i = 0; i < this.length; i++) {
        if (this[i] == element) { this.splice(i, 1); }
    }
};

// Usage: $(['img1.jpg','img2.jpg']).preloadImages(function(){ ... });
// Callback function gets called after all images are preloaded
$.fn.preloadImages = function (callback) {
    checklist = this.toArray();
    checklist.remove($("img#imgBackground").attr("src"));
    this.each(function () {
        $('<img>').attr({ src: this }).load(function () {
            checklist.remove($(this).attr('src'));
            if (checklist.length == 0) { callback(); }
        });
    });
};

function AppendBackGroundImages(images) {
    var htmlToAppend = "";
    var count = images.length - 1;
    var x = 0;
    for (x = 0; x <= count; x++) {
        htmlToAppend = htmlToAppend + '<img id="slide-img-' + x.toString() + '" src="' + images[x] + '" width="1317" height="1300" class="slide" alt="" style="display:none;" />';
    }

    $('#backgroundImages').html(htmlToAppend);


}



function GenerateImageSelector() {
    var html = "";
    var count = homePageFeatures.length - 1;

    $('#imageSelector').css("display", "block");

    html = '<div class="imagetitle"></div>'

    if (count > 0) {
        html = html + '<ul id="imagelist">'

        for (x = 0; x <= count; x++) {
            html = html + '<li><a id="showFeature1" href="#" class="">' + x.toString() + '</a></li>';
        }

        html = html + '</ul>';

        $('div#imageSelector').html(html);

        $('div#imageSelector a').click(function () {
            var index = $("div#imageSelector a").index(this);
            updateCount = index;
            clearTimeout(timeOut);
            UpdateHomePage(20, 20);
        });

    }

}

function GetBackgroundImageUrls() {
    var images = new Array();
    var count = homePageFeatures.length - 1;
    var x = 0;
    for (x = 0; x <= count; x++) {
        images[x] = homePageFeatures[x].ImageUrl;
    }

    return images;
}


function UpdateHomePage(FadeIn, FadeOut) {    

    var imageTitle = "";
    imageTitle = '<a href="' + homePageFeatures[updateCount].Link + '">' + homePageFeatures[updateCount].Title + '</a>'

    var description = "";
    description = '<a href="' + homePageFeatures[updateCount].Link + '">' + homePageFeatures[updateCount].Description + '</a>'
    
    $('#sliderInfo').html(description);
    $(".imagetitle").html(imageTitle);

    Cufon.replace('#sliderInfo, .imagetitle, ul#imagelist li', {
        fontFamily: 'helveticaNeueLtCn', hover: true
    });


    if (currentlyShownBackgroundImageId != "") {
        $(currentlyShownBackgroundImageId).fadeOut(FadeOut);
    }
    currentlyShownBackgroundImageId = '#slide-img-' + updateCount;
    $(currentlyShownBackgroundImageId).fadeIn(FadeIn);

    timeOut = setTimeout("UpdateHomePage()", 10000);

    if (updateCount >= (homePageFeatures.length - 1)) {
        updateCount = 0;
    }
    else {
        updateCount = updateCount + 1;
    }
}