var IMAGE_INDEX;

function getThumbnailImages(categoryID)
{
    queueRequest('data/GetImageData.aspx?cat=' + categoryID, 'updateThumbnailImages');
}

function generateThumbnailImages()
{
    var html = '';
    var img;
    var imgWidth;
    var left;
    
    for (var i=0; i<THUMBNAILS.images.length; i++)
    {
        img = new Image;
        img.src = 'data/GetThumbnailImage.aspx?img=' + THUMBNAILS.images[i].imagename;
        imgWidth= img.width;
        
        if (imgWidth > 125)
        {
            left = Math.round((imgWidth-125)/2);
            left = left - left*2;
        }
        
        html += '<div style="position:relative;" class="left thumbnail_container">';
        html += '<a href="javascript:showFullSizeImage(' + i + ');">';
        html += '<img style="position:relative; left:' + left + 'px;" border="0" src="';
        html += img.src;
        html += '">';
        html += '</a>';
        html += '</div>';
        
        if ((i+1)%6 == 0)
            html += '<div class="cL"></div>';
            
        left = 0;
    }

    wH('thumbnail_inner', html);    
}

function returnToGallery()
{
    // hide full size image and description
    gE('fullSizeImg').src = 'images/black.jpg';
    wH('imageDescription', '');
    
    // hide navigation
    hide(gE('previous'));
    hide(gE('gallery'));
    hide(gE('next'));
    
    // show gallery
    show(gE('thumbnail_outer'));
}

function doPrevious()
{
    IMAGE_INDEX--;
    doNavigation();
}

function doNext()
{
    IMAGE_INDEX++;
    doNavigation();
}

function showFullSizeImage(index)
{
    // hide gallery
    hide(gE('thumbnail_outer'));
    
    IMAGE_INDEX = index;
    
    doNavigation();
}

function doNavigation()
{
    showBusy();
    
    if (IMAGE_INDEX > 0)
        show(gE('previous'));
    else
        hide(gE('previous'));
        
    show(gE('gallery'));

    if (IMAGE_INDEX < THUMBNAILS.images.length-1)
        show(gE('next'));
    else
        hide(gE('next'));
        
    doFullSizeImage();
}

function doFullSizeImage()
{
    // show full size image
    gE('fullSizeImg').src = 'images/artwork/' + THUMBNAILS.images[IMAGE_INDEX].imagename;
    wH('imageDescription', THUMBNAILS.images[IMAGE_INDEX].imagedescription);
    
    
    gE('fullSizeImg').onload = hideBusy;
}

function showBusy()
{
    hide(gE('fullSizeImgContainer'));
    show(gE('rollerContainer'));
}

function hideBusy()
{
    hide(gE('rollerContainer'));
    show(gE('fullSizeImgContainer'));
}