//this module is a javascript class that pre loads all the images that should be
//displayed by the imageRotator from the server by calling the 'src' attribute 
//of each image. this call causes the browser to download the image and cache it
//------------------------------------------------------------------------------------

//class definition and constructor
//1. call-back functions
//2. class member variables: number loaded, number processed, array of images, legth of array
//3. preload array of images

function ImagePreload(p_aImages, pOnImgUpdate, pOnCompletion)
{
    //1
    this.m_pOnImgUpdate = pOnImgUpdate;
    this.m_pOnCompletion = pOnCompletion;

    //2
    this.m_nLoaded = 0;
    this.m_nProcessed = 0;
    this.m_aImages = new Array;
    this.m_nICount = p_aImages.length;

    //3
    for (var i = 0; i < p_aImages.length; i++)
        this.Preload(p_aImages[i]);
}

//preload method
//1. create new image object and push it into an image array
//2. connect the image onload event to the Onload function pointer of this class
//3. give the image object a Reference to our class
//4. custom value added to track state
//5. image object source path. execution of this line actually forces the browser
//   to request the image from the server.

ImagePreload.prototype.Preload = function(p_oImage)
{
    //1
    var oImage = new Image;
    this.m_aImages.push(oImage);
    //2
    oImage.onload = ImagePreload.prototype.OnLoad;
    
    oImage.oImagePreload = this;  //3
    oImage.bLoaded = false;       //4
    oImage.src = p_oImage;        //5
}

//1. 'this' pointer points to oImage object because this function was previously assigned
//   as an event-handler for the oImage object.
//2. access our class with the reference assigned previously and increment the number of loaded images
//3. execute the OnComplete function

ImagePreload.prototype.OnLoad = function()
{
    //1
    this.bLoaded = true;
    //2
    this.oImagePreload.m_nLoaded++; 
    //3
    this.oImagePreload.OnComplete();
}

//if the number of processed images has reached the total number of 
//image urls available call the finished() function. else incerement 
//the percentage of processed images for the user display

ImagePreload.prototype.OnComplete = function()
{
    this.m_nProcessed++;
    if (this.m_nProcessed == this.m_nICount)
        this.m_pOnCompletion();
    else
        this.m_pOnImgUpdate(Math.round((this.m_nProcessed / this.m_nICount) * 100));
}

//this funcion is called by the OnComplete function whenever an image
//has finished loading but there are still more images to load it then 
//updates the user display of the percent of loaded images

function OnImgUpdate(iProgress)
{
    if ((iProgress >= 0) && (iProgress <= 99))
    {
        var rePercent = new RegExp("percentCompleteText");
        var pCell = getSingleDomObj("td", rePercent);
        pCell.innerHTML = "&nbsp;&nbsp;loading&nbsp;&nbsp;" + (iProgress) + "%&nbsp;&nbsp;";
    }
}

//when the last image has finished loading the percent user display is 
//hidden and the image rotator is started

function OnCompletion()
{
    var percentTable;
    var re = new RegExp("percentComplete");
    percentTable = getSingleDomObj("table", re);
    percentTable.style.visibility = "hidden";
    setTimeout(startImageRotator, 200);
}

//this function is called by script on the containing page and starts rolling the
//whole process of the preloader.
//1. an array with the full path of the images on the server is created from global
//   variables existing in a script on the containing page
//2. an instance of the preloader class is generated, which starts the ball rolling

function StartPreload()
{
    //1
    var szImages = new Array();
    for (i = 0; i < imagesURLs.length; i++)
    {
        szImages[i] = serverFolder + imagesURLs[i];
    }
    //2
    var oPreload = new ImagePreload(szImages, OnImgUpdate, OnCompletion);
}