var changeInProgress = false;
var indexSmallPhoto;
var indexPhotoSmall = new Array ();
var selected;
var norm;

//this function is used to display the thumbnail image in the main image block.
function displayAsMainImage (obj, src, ImageNumber, alt) {

    var topImage = document.getElementById ('Top_Image'+ImageNumber);
    var bottomImage = document.getElementById ('Bottom_Image'+ImageNumber);

    if (topImage.src != obj.src) {
        if (indexSmallPhoto) {
            //set the default border of the thumbnail.
            //indexSmallPhoto.className = norm;
        } else {
            //document.getElementById ('Small_Photo_0_0').className = norm;
        }
        indexSmallPhoto = obj;
        //indexSmallPhoto.className = selected;
        //setting the bottom image to the top.. used as a placeholder.
        bottomImage.src = topImage.src;
        //setting the bottom image's alt tag to the top image's alt tag.. used as a placeholder.
        bottomImage.alt = topImage.alt;
        //fade in the new image.
        changeOpac (1,'Top_Image');
        //display the new image.
        bottomImage.style.display = "block";
        topImage.src = src;
        topImage.alt = alt;
        if (!changeInProgress) {
            opacity ('Top_Image',1,100, 1000);
        }
    }
}

//this function does the fade in of the new picute.
function opacity(id, opacStart, opacEnd, millisec) { 
        changeInProgress = true;
        //speed for each frame 
        var speed = Math.round(millisec / 100); 
        var timer = 0; 

        //determine the direction for the blending, if start and end are the same nothing happens 
        if(opacStart > opacEnd) { 
                for(var i = opacStart; i >= opacEnd; i--) { 
                setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed)); 
                timer++; 
                } 
        } else if(opacStart < opacEnd) { 
                for(var i = opacStart; i <= opacEnd; i++) { 
                        setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed)); 
                        timer++; 
                } 
        }
        
        setTimeout("changeInProgress = false;",(timer * speed));
} 

        //change the opacity for different browsers 
function changeOpac(opacity, id) { 
        if (document.getElementById(id)) {
            var object = document.getElementById(id).style; 
            object.opacity = (opacity / 100); 
            object.MozOpacity = (opacity / 100); 
            object.KhtmlOpacity = (opacity / 100); 
            object.filter = "alpha(opacity=" + opacity + ")"; 
        }
}

function show_more_images (hidingDiv,shadowDiv, callingObj) {
    var div = $(hidingDiv);
    var SHWdiv = $(shadowDiv);
    if(div.style.display=='none') {
        div.style.display = 'block';
        callingObj.innerHTML = 'show less';
        SHWdiv.style.height = '304px';
    } else if (div.style.display=='block') {
        div.style.display = 'none';
        callingObj.innerHTML = 'show more';
        SHWdiv.style.height = '253px';
    }
}