// The number of seconds to wait between each image change
var imageChangeInterval = 20;

// The number of milliseconds between fade operations
var fadeInterval = 50;

// The images to be used in the lifestyle image display
var images = new Array();
images[0] = "images/lifestyle0.jpg";
images[1] = "images/lifestyle1.jpg";
images[2] = "images/lifestyle2.jpg";
images[3] = "images/lifestyle3.jpg";
images[4] = "images/lifestyle4.jpg";
images[5] = "images/lifestyle5.jpg";

// Don't change these
var millisecondsPerSecond = 1000;
var changeLifestyleImageTimer = -1;
var fadeEffectTimer = -1;
var imageIndex = Math.floor(Math.random() * images.length);
var lifestyle;
var fader;
var fadeLevel = 0;
var fadeOut = false;

function Initialize() {
    if (CanDisplayLifestyleImages()) {
        SetImage(lifestyle, images[imageIndex]);

        changeLifestyleImageTimer =
            setInterval(ChangeLifestyleImage, (imageChangeInterval * millisecondsPerSecond));
    }
}

function Fade() {
    if (fadeOut) {
        if (fadeLevel > 0) {
            fadeLevel--;
            SetOpacity(fader, fadeLevel);
        } else {
            fadeOut = false;
            clearInterval(fadeEffectTimer);
        }
    } else {
        if (fadeLevel < 100) {
            fadeLevel++;
            SetOpacity(fader, fadeLevel);
        }
        else {
            fadeOut = true;
            clearInterval(fadeEffectTimer);
        }
    }
}

function CleanUp() {
    if (changeLifestyleImageTimer != -1) {
        clearInterval(changeLifestyleImageTimer);
    }
    if (fadeEffectTimer != -1) {
        clearInterval(fadeEffectTimer);
    }
}

function CanDisplayLifestyleImages() {
    var result = false;
    lifestyle = document.getElementById("lifestyle-display");
    fader = document.getElementById("fader");
    if ((images.length != 0) && (lifestyle != null) && (fader != null)) {
        result =
            ((typeof (lifestyle.style) != "undefined") &&
             (typeof (lifestyle.style.background) != "undefined"));
    }
    return result;
}

function SetImage(element, imageUrl) {
    element.style.background = ("url('" + imageUrl + "')");
}

function ChangeLifestyleImage() {
    imageIndex++;
    if (imageIndex >= images.length) {
        imageIndex = 0;
    }
    if (fadeOut) {
        SetImage(lifestyle, images[imageIndex]);
        fadeEffectTimer = setInterval(Fade, fadeInterval);
    } else {
        SetImage(fader, images[imageIndex]);
        fadeEffectTimer = setInterval(Fade, fadeInterval);
    }
}

function SetOpacity(element, value) {
    element.style.opacity = (value / 100);
    element.style.filter = 'alpha(opacity = ' + value + ')';
}

AddEventListener(window, "load", Initialize);
AddEventListener(window, "unload", CleanUp);