//create a variable for the current image int
current_image_int=0;

function display_image(int) //object)
{

    current_image_int=int;

    //make the aligner visible
    document.getElementById("gallery_control_wrapper_div").style.display="block";
    //document.getElementById("gallery_control_wrapper_div").style.visibility="visible";
    //I want to be center the displayed image when the user clicks a thumbnail
    center_on_screen("gallery_control_wrapper_div");
        //show the description
    show_description(current_image_int)
    //show the image
    display_image_from_int(int);
}

function display_image_from_int(int)
{
    var new_source="images/screenshot"+int+".jpg";
    var image_html = "<img src='"+new_source+"'>";
    //set the innerhtml of the "big_image div to the image_html
    document.getElementById("big_image").innerHTML = image_html;
     //show the description
    show_description(int)
}


function set_current_image_int_from_source(source)
{
  parts = source.split(".");
  //the name is the second to last part
  name = parts[ parts.length-2 ];
  //the int is the last char of the name
  current_image_int = parseInt(name[ name.length-1 ]);
}

function next_image()
{
    current_image_int+=1;
    if( current_image_int>5 )
    {
        current_image_int = 1;
    }
    display_image_from_int(current_image_int);
}

function prev_image()
{
    current_image_int-=1;
    if( current_image_int<1 )
    {
        current_image_int = 5;
    }
    display_image_from_int(current_image_int);   
}

function hide_image()
{
    //just hide the aligner
    document.getElementById("gallery_control_wrapper_div").style.display="none";
}

//we need to be able to hide all of the description divs
function hide_all_descriptions()
{
    for( i = 1; i<6; i++)
    {
        div = document.getElementById("description_div_"+i);
        div.style.display="none";
    }
}
function show_description(number)
{
       //hide all of the descriptons
       hide_all_descriptions(); 
       div = document.getElementById("description_div_"+number);
        div.style.display="block";
}