function showLargeImage( thumbNailElement )
{

  var largePreviewElement = document.getElementById( 'largeImagePreviewId' ); 
  var contentDiv = document.getElementById( 'content_Div' );
  var newContentDiv = document.getElementById( 'div_'+ thumbNailElement.id );

  contentDiv.innerHTML = '';
  contentDiv.innerHTML = newContentDiv.innerHTML;

  largePreviewElement.style.background = 'url(jewelleryArt/webApp/common/images/jewellery/large/' + thumbNailElement.id + '.jpg)';  
  
	toggleThumbnailBorderColor( thumbNailElement );  
}


function toggleThumbnailBorderColor( currentImage )
{
  // Get the row with all the image thumbnails
  var trElement = document.getElementById( 'thumbNailPlaceHolderId' );
  var imageThumbnails = trElement.getElementsByTagName( 'img' );
  
  for ( var i = 0; i < imageThumbnails.length; i++ )
  {    
    var imageThumbnail = imageThumbnails[ i ];
    
    if ( imageThumbnail.id != undefined && imageThumbnail.id != '' )
    { 
      
      if ( imageThumbnail.id == currentImage.id )
      { 
        // The td element we want to put the border around
        //var currentThumbNailTd = document.getElementById( 'td_' + currentImage.id );        
        //currentThumbNailTd.style.border = '3px solid green';
        currentImage.style.border = '3px solid #ADAF4F';
      }
      else
      {  
        // The td element we want to put the border around
        //var imageThumbNailTd = document.getElementById( 'td_' + imageThumbnail.id );
        //imageThumbNailTd.style.border = 'none'; 
        imageThumbnail.style.border = 'none';
      }
    }
  } 
}