/****************/
/* Ajax Pop-Ups */
/****************/
/*  c.s. fecit  */
/****************/
/****************/

/*
Make sure to set
pop_images[] and
$image_base_name
in the main HTML file
*/

//Show image
function makeImg(the_event) {
    //Set general variables
    the_image = the_event.target.name;
    indexArray = the_image.split("thumb");
    index = parseInt(indexArray[1])-1;
    my_image = $("img[name='"+the_image+"']");

    //Get suffix for rollover image
    //my_image_full_name = my_image.attr("src");
    //my_image_array = my_image_full_name.split(".");
    //my_image_suffix = my_image_array[0];

    //Apply page specific image array
    imgName = pop_images[index];


    //Highlight thumbnail image
    my_image.attr("src", $image_base_name+the_image+"_over.jpg");

    //If image is not loaded yet, append pop up image and container div
    if ( $("#"+the_image+" img").length == 0 ) {
        $("#container").prepend('<div id="'+the_image+'" class="big_popup"><div class="clearer"></div></div>');
        $("#"+the_image).append('<img src="../images/'+imgName+'" alt=""/>');
    }
    //Else change pop up image
    else $("#"+the_image+" img").attr("src", "../images/"+imgName);

    //Sow pop up image
    $("#"+the_image).fadeIn(200);

    return false;
}

//Hide Image
function hideImg(the_event) {

    the_image = the_event.target.name;

    //Un-highlight thumbnail image ...
    my_image.attr("src", $image_base_name+the_image+".jpg");

    //... then hide pop up image
    $("#"+the_image).fadeOut(200);
    //$("#"+the_image).remove()

    return false;
}


//Listen for events to show or hide image
$(document).ready(function(){

	//Make thumbnail links un-clickable for users with JS turned on
	$("#thumbbox a").bind("click", function(event){
	  event.preventDefault();
	});

    //Trigger pop up functions on mouseover/mouseout
    $("#thumbbox img").bind("mouseenter", makeImg);
    $("#thumbbox img").bind("mouseleave", hideImg);
});
