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, flag, src, displayPassedSource) {

        if (flag == 1) {
                selected = 'dev_thumbnail_pics_selected';
                norm = 'dev_thumbnail_pics';
        } else if (flag == 2) {
                selected = 'image_small_selected';
                norm = 'image_small';
        }
        
        var topImage = document.getElementById ('Top_Image');
	
        var bottomImage = document.getElementById ('Bottom_Image');
        if (topImage.src != obj.src) {
	
		if (document.getElementById ('lightbox_carasol')) {
                        document.getElementById ('lightbox_carasol').href=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;
                bottomImage.title = (topImage.title) ? topImage.title : "";
                bottomImage.alt = (topImage.alt) ? topImage.alt : "";
                //fade in the new image.
                changeOpac (1,'Top_Image');
                //display the new image.
                bottomImage.style.display = "block";
                if (displayPassedSource=="yes") {
                        topImage.src = src;
                } else {                        // I don't know who or why used the bottom method. I added the if statement and "displayPassedSource" not to break whatever there madness has intented # Shaheed 04 June 2010
                        topImage.src = obj.src;
                }
                topImage.title = (obj.title) ? obj.title : "";
                topImage.alt = (obj.alt) ? obj.alt : "";
                if (!changeInProgress) {
                        opacity ('Top_Image',1,100, 1000);
                }
                if ($("image_info") && $(indexSmallPhoto.id + "_info")) {
                        $("image_info").innerHTML = $(indexSmallPhoto.id + "_info").innerHTML;
                }
                
                if ($('Top_Image_Link')) {
                        if (!src)  {
                                src = topImage.src;
                        }
                        $('Top_Image_Link').href = src;
                        $('Top_Image_Link').rel = "lightbox[" +src+"]";
                        $('Top_Image_Link').title = indexSmallPhoto.title;
                }
        }
}

function displayImageAsMain (obj, num) {
        var topImage = document.getElementById ('Top_Image_'+num);
        var bottomImage = document.getElementById ('Bottom_Image_'+num);
        //if (topImage.src != obj.src) {
                if (indexPhotoSmall[num]) {
                        indexPhotoSmall[num].className = "image_small";

                } else {
                        document.getElementById ('Small_Photo_'+ num +'_0_0').className = "image_small";
                }
                indexPhotoSmall[num] = obj;
                indexPhotoSmall[num].className = "image_small_selected";
                bottomImage.src = topImage.src;
                changeOpac (1,'Top_Image_'+num);
                bottomImage.style.display = "block";
                topImage.src = obj.src;
                if (!changeInProgress) {
                        opacity ('Top_Image_'+num,1,100, 1000);
                }
       // }
}

//this function is used to diplay more images in the thumnail section.
function displayMorePhotos (obj, amount, limit) {
        var flag = false;
        //checking the limit of rows.
        for (var i = limit; i < amount; i++) {
                var photoRow = document.getElementById ('Photo_Row_' + i);
                if (photoRow.style.display=="none") {
                        photoRow.style.display="block";
                        flag = true;
                } else {
                        photoRow.style.display="none";
                }
        }
        //used to set the show more/show less graphic.
        if (flag) {
                if (document.getElementById ('Show_More_Images_On')) {
                        obj.innerHTML = document.getElementById ('Show_More_Images_On').innerHTML;
                } else if (document.getElementById ('Show_More_On')) {
                        obj.innerHTML = document.getElementById ('Show_More_On').innerHTML;
                }
        } else {
                if (document.getElementById ('Show_More_Images')) {
                        obj.innerHTML = document.getElementById ('Show_More_Images').innerHTML;
                } else if (document.getElementById ('Show_More')) {
                        obj.innerHTML = document.getElementById ('Show_More').innerHTML;
                }
        }
}

function displayMorePhotos2 (obj, amount, limit) {
        var flag = false;
        //checking the limit of rows.
        for (var i = limit; i < amount; i++) {
                var photoRow = document.getElementById ('Photo_Row_' + i);
                if (photoRow.style.display=="none") {
                        photoRow.style.display="block";
                        flag = true;
                } else {
                        photoRow.style.display="none";
                }
        }
        //used to set the show more/show less graphic.
        if (flag) {
                obj.src = document.getElementById ('Show_More_On').src;
        } else {
                obj.src = document.getElementById ('Show_More').src;
        }
}

function displayMoreRows (obj, amount, limit, si) {
        var flag = false;
        for (var i = limit; i < amount; i++) {
                var photoRow = document.getElementById ('Photo_Row_' + si + '_' + i);
                if (photoRow.style.display=="none") {
                        photoRow.style.display="block";
                        flag = true;
                } else {
                        photoRow.style.display="none";
                }
        }
        
        if (flag) {
                obj.src = document.getElementById ('Show_More_'+si+'_On').src;
        } else {
                obj.src = document.getElementById ('Show_More_'+si).src;
        }
}
//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) { 
        var object = document.getElementById(id).style; 
        object.opacity = (opacity / 100); 
        object.MozOpacity = (opacity / 100); 
        object.KhtmlOpacity = (opacity / 100); 
        object.filter = "alpha(opacity=" + opacity + ")"; 
}