//Javascript for Servite Houses Splash Page
//Developed by Appetere Ltd, www.appetere.com
//February 2009

//Any code-exceptions or missing/inaccessible images
//on the server will simply halt the slide-show.

//--USER SETTINGS STARTS--

//Number of images to rotate each time
var numberToRotate = 3;
//Time between image rotations, in seconds
var rotationInterval = 5;

//Array of image file names
var imageNames = new Array();

imageNames[0]="splash_images/Image00.jpg";
imageNames[1]="splash_images/Image01.jpg";
imageNames[2]="splash_images/Image02.jpg";
imageNames[3]="splash_images/Image03.jpg";
imageNames[4]="splash_images/Image04.jpg";
imageNames[5]="splash_images/Image05.jpg";
imageNames[6]="splash_images/Image06.jpg";
imageNames[7]="splash_images/Image07.jpg";
imageNames[8]="splash_images/Image08.jpg";
imageNames[9]="splash_images/Image09.jpg";
imageNames[10]="splash_images/Image10.jpg";
imageNames[11]="splash_images/Image11.jpg";
imageNames[12]="splash_images/Image12.jpg";
imageNames[13]="splash_images/Image13.jpg";
imageNames[14]="splash_images/Image14.jpg";
imageNames[15]="splash_images/Image15.jpg";
imageNames[16]="splash_images/Image16.jpg";
imageNames[17]="splash_images/Image17.jpg";
imageNames[18]="splash_images/Image18.jpg";
imageNames[19]="splash_images/Image19.jpg";  

var imageAltText = "Servite Houses property, tenants & owners";

//--USER SETTINGS ENDS--

//Image dimensions in pixels
var imageX = 150;
var imageY = 150;
      
//Array of image element IDs
var imageIds = new Array();
imageIds[0]="img00";
imageIds[1]="img01";
imageIds[2]="img02";
imageIds[3]="img03";
imageIds[4]="img04";
imageIds[5]="img05";

//Index of the last image loaded into memory
var lastLoadedIndex=0;
//Index of the last image displayed in browser
var lastMemoryImageIndex=0;

//Array of pre-loaded images
var memoryImages = new Array();

//Handle for interval timer
var timeoutId;

function startImageRotation()
{
    try
    {
        //Add the images that are already displayed on the page
        //to the memoryImages array
        for (var i=0; i < imageIds.length; i++)
        {
            memoryImages[i]=new Image(imageX,imageY);
            memoryImages[i].src= imageNames[i];
        }
        lastLoadedIndex = imageIds.length-1;
        lastMemoryImageIndex = lastLoadedIndex;
        
        //Pre-load next images for rotation
        preLoadNextImages();
        
        //Rotate the images at specified interval
        timeoutId = setInterval("rotateImages()",rotationInterval*1000);
    }
    catch (exc)
    {
        stopRotation();
    }
}

function preLoadNextImages()
{
    try
    {
        //Loads only the images needed for the next rotation.
        //Skips over this function when all images pre-loaded.
        if (lastLoadedIndex <(imageNames.length-1))
        {
            var numberToLoad;
                    
            if (lastLoadedIndex+numberToRotate <= (imageNames.length-1))
            {
                numberToLoad = numberToRotate;
            }
            else
            {
                numberToLoad = (imageNames.length-1)-lastLoadedIndex;
            }

            for (var i=lastLoadedIndex+1; i<lastLoadedIndex+1+numberToLoad;i++)
            {
                memoryImages[i]=new Image(imageX,imageY);
                memoryImages[i].src= imageNames[i];          
            }
            lastLoadedIndex+=numberToLoad;
        }    
    }
    catch (exc)
    {
        stopRotation();
    }
}

function rotateImages()
{
    try
    {
        //Randomly select which images in the grid are to be changed.
        //Uses Fisher-Yates(?) method to avoid choosing the same image twice.
        
        //Create array with one entry for each image on the page (an outcome)
        var outcomes = new Array();
        for (var i = 0; i < imageIds.length; i++)
        {
            outcomes[i] = i;
        }
        
        //Select an outcome, and swap with outcome at the end of list.
        //Then select next outcome from all items excluding those already chosen
        //(ie the ones now at the end of the list)
        //This way an outcome can only be selected once.
        var randomValue;
        var randomOutcome;
        var numberOfUnselectedItems;
        
        for (var j = 0; j < numberToRotate; j++)
        {
            numberOfUnselectedItems = imageIds.length-j;
            randomValue = Math.floor(Math.random() * numberOfUnselectedItems);
            randomOutcome = outcomes[ randomValue ];
            outcomes[randomValue] = outcomes[numberOfUnselectedItems - 1];
            outcomes[numberOfUnselectedItems - 1] = randomOutcome;
        }
        
        //Work through the outcomes backwards from the end of the array
        //to identify which images on the page are to be changed
        for (var k = imageIds.length-1; k > (imageIds.length - 1 - numberToRotate); k--)
        {
            if (lastMemoryImageIndex == (imageNames.length-1))
            {
                //If we've just used the last image in memory, we reset the pointer but skip
                //over the images already displayed on the page, to avoid displaying the 
                //same picture more than once at any time.
                lastMemoryImageIndex = imageIds.length;
            }

            if( memoryImages[ lastMemoryImageIndex+1 ].complete == false)
            {
                //Detects that an image was not loaded into memory
                //Rather than leave a gap in grid, halts rotation
                throw memoryImages[ lastMemoryImageIndex+1 ].src + " was not pre-loaded in memory";
            }

            //This shuffling keeps the images currently displayed on the page
            //as the first entries in the memoryImages array, so they will not be
            //selected to be displayed again.
            var oldImage = memoryImages[ outcomes[k] ];
            memoryImages[ outcomes[k] ] = memoryImages[lastMemoryImageIndex+1];
            document.getElementById(imageIds[ outcomes[k] ]).src = memoryImages[ outcomes[k] ].src;
            memoryImages[ lastMemoryImageIndex+1 ] = oldImage;

            lastMemoryImageIndex++;  

        }
        //Pre-load images for next rotation
        preLoadNextImages();
    }
    catch (exc)
    {
        stopRotation();
    }
}

function stopRotation()
{
    if (timeoutId)
    {
        clearTimeout(timeoutId);
    }
}

window.onload=startImageRotation;