var imgList = new Array();
var theIndex = 0;
var groupSize = 4;
var totalImages = 30;

function make2Digits( num )
{
    return ( num < 10 ) ? '0' + num : num; 
}

function preloadImages()
{
    for( i = 0; i <= totalImages - 1; i++ )
    {
        imgList[i] = new Image();
        myNum = make2Digits( i );
        imgList[i].src = 'img_gallery/' + myNum + '-t.jpg';
    }
}

function displayWait()
{
    document.getElementById( 'helpInfo' ).innerHTML = '<b>' + TEXT_loading_image + '</b>';
}

function displayHelp()
{
    document.getElementById( 'helpInfo' ).innerHTML = TEXT_click_any_image;
}

function myShiftL()
{
//alert(2);
    theIndex = theIndex > 0 ? theIndex - 1 : theIndex;
    for ( i = 0; i < groupSize; i++ )
    {
        theimg = document.getElementById( 'img_' + i );
        theimg.src = imgList[ theIndex + i ].src;
    }
    displayInfo();
}

function displayInfo()
{
    theIndexEnd = ( theIndex + groupSize ) >= totalImages ? totalImages : theIndex + groupSize;
    document.getElementById( 'pictureInfo' ).innerHTML = TEXT_showing_image + ( theIndex + 1 ) + TEXT_showing_image_to + theIndexEnd + ' ( ' + totalImages + ' Total )' ;
}

function myShiftR()
{
//alert(3);
    theIndex = theIndex >= totalImages - groupSize ? theIndex : theIndex + 1;
    for ( i = 0; i < groupSize; i++ )
    {
        theimg = document.getElementById( 'img_' + i );
        theimg.src = imgList[ theIndex + i ].src;
    }
    displayInfo();
}

function myShiftRR()
{
    for ( x = 0; x < groupSize; x++ )
    {
        myShiftR();
    }
}

function myShiftLL()
{
    for ( x = 0; x < groupSize; x++ )
    {
        myShiftL();
    }
}

function displayImg( imgName )
{
    imgObj = document.getElementById( imgName );
    theSrc = imgObj.src;
    theimg = document.getElementById( 'mainimg' );
    theimg.src = theSrc.replace( '-t', '' );
    displayWait();
}

function doImageLoaded()
{
    displayHelp();
    displayInfo();
}

function createImage( num )
{
    document.write( '<td>' );
    document.write( '<a href="JavaScript: displayImg( \'img_' + num + '\' )"><img id="img_' + num + '" src="img_gallery/' + make2Digits( num ) + '-t.jpg" border="0">' );
    document.write( '</a></td>' );
}

function createImageObjects()
{
    for( i = 0; i < groupSize; createImage( i++ ) );
}

function additionalPreload()
{
    preloadImages();
}