$addHandler(window, "load", InitialiseRI);

var MAIN_ID = "Main";
var IMAGE_URL = "Resources/Images/RotateImages/";

var SLASH = "/";

var ROTATE_IMAGE_DELAY = 10000; /* in miliseconds */

var ImageArray = new Array();
var arrayPointer = 0;

function InitialiseRI()
{
    var image;
    var imagePath;
    var imageObj;
    
    for (var i = 0; i < 10; i++)
    {
        imagePath = "MainImage" + (i + 1) + ".gif";
        
        // Preload Images
        image = new Image(795, 200);        
        image.src = GetURL() + IMAGE_URL + imagePath;
        
        // Add ImageObject to ImageArray
        imageObj = new ImageObject(imagePath);
        ImageArray[i] = imageObj;
    }
    
    setInterval(RotateImage, ROTATE_IMAGE_DELAY);
}

function GetURL()
{
    var URL = document.location.protocol + SLASH + SLASH;
    URL += document.location.host + SLASH;
    
    return URL;
}

function RotateImage()
{
    // TODO: FADE OUT
    
    try
    {
        var mainId = $get(MAIN_ID);
    }
    catch (e)
    {
        return false;
    }
    
    var imageObj = ImageArray[arrayPointer];
    
    mainId.style.background = imageObj.mainImage;
    
    // TODO: FADE IN
    
    IncrementArrayPointer();
}

function ImageObject(MainImage)
{
    MainImage = "#FFFFFF url(../" + IMAGE_URL + MainImage + ") no-repeat bottom center;";
    this.mainImage = MainImage;
}

function IncrementArrayPointer()
{
    arrayPointer++;
    
    if (arrayPointer >= ImageArray.length)
    {
        arrayPointer = 0;
    }   
}