var testCssDiv = document.createElement("div");
var useOpacity =
   (typeof testCssDiv.style.opacity != 'undefined');

var useTransitions =
   (typeof testCssDiv.style.webkitTransition != 'undefined') ||
   (typeof testCssDiv.style.MozTransition != 'undefined') ||
   (typeof testCssDiv.style.OTransition != 'undefined') ||
   (typeof testCssDiv.style.transition != 'undefined');

var bgIndex = 0;
var bgMaxIndex = 4;
var bgIntervalId = 0;

function getBgImage(index) {
    return $(".background-image:eq(" + bgIndex + ")");
}

function getBgImageFrame(index) {
    return $(".home-content:eq(" + bgIndex + ")");
}

function fadeOutBgImage(index) {
    var image = getBgImage(index);
    var frame = getBgImageFrame(index);

    if (useOpacity && useTransitions) {
        image.css("opacity", 0);
        frame.css("opacity", 0);
    }
    else {
        image.fadeOut(1000);
        frame.fadeOut(1000);
    }
}

function fadeInBgImage(index) {
    var image = getBgImage(index);
    var frame = getBgImageFrame(index);

    if (useOpacity && useTransitions) {
        image.css("opacity", 1);
        frame.css("opacity", 1);
    }
    else {
        image.fadeIn(1000);
        frame.fadeIn(1000);
    }
}

function nextBgImage() {
    fadeOutBgImage(bgIndex);
    bgIndex++;
    if (bgIndex > bgMaxIndex) {
        bgIndex = 0;
    }
    fadeInBgImage(bgIndex);
}

function startBgImageCarousel() {
    bgIntervalId = setInterval("nextBgImage();", 10000);
}

function stopBgImageCarousel() {
    clearInterval(bgIntervalId);
}

$(document).ready(function () {
    startBgImageCarousel();
    $(".home-content > .home-carousel > a").click(function () {
        var frameIndex = $(this).attr("class").match(/home-frame-\d/i).toString().replace("home-frame-", "");
        if (frameIndex != bgIndex) {
            stopBgImageCarousel();
            fadeOutBgImage(bgIndex);
            bgIndex = frameIndex;
            fadeInBgImage(bgIndex);
            startBgImageCarousel();
        }
        return false;
    });
});