var prevThumbnailEle = null;
var highlightBorder = "2px solid #4cb151";
var normalBorder = "2px solid silver";
// changes the current image
function change_image_style(newdiv)
{
    if (prevThumbnailEle != null)
        prevThumbnailEle.style.border = normalBorder;
  
    // store the pre element
    prevThumbnailEle = newdiv;
    newdiv.style.border = highlightBorder;
}

function change_image(newdiv)
{
     if (prevThumbnailEle != null)
        prevThumbnailEle.style.border = normalBorder;
    // get the new image information
    var newimagediv = newdiv;
    var newimageid = newdiv.getAttribute("imageid");
    // get the current image element
    var curImageEle = document.getElementById("curImage");
    // create the new image url
//var newimageurl = "images/green/"+newimageid;
    // change the current image url
//curImageEle.src = newimageurl;
curImageEle.src = eval("image_"+newimageid + "_full.src");
    // store the pre element
    prevThumbnailEle = newdiv;
    newdiv.style.border = highlightBorder;
    
    //get header and description for the right side
    var title_id = "image_"+newimageid+"_title";
    var desc_id = "image_"+newimageid+"_description";
    //alert(document.getElementById('imageTitle').innerText);
    //alert(document.getElementById("imageDescription").innerText);
    document.getElementById('imageTitle').innerHTML = document.getElementById(title_id).value;
    document.getElementById('imageDescription').innerHTML = document.getElementById(desc_id).value;
}

function clear_image_style(adiv)
{
    adiv.style.border = normalBorder;
}