function popUp(url){     
    window.open(url, "smallwin", "scrollbars=yes,resizable=yes,height=450,width=450") ;
   }


function thumbnailClick(){
  var linkList= document.getElementsByTagName("img");
	for (var i=0;i<linkList.length;i++){	
		if (linkList[i].className=="thumbnail"){	
		   linkList[i].onclick = thumbnailOnClick;  			  
         }	  
	  }	
    return false;	
}

function thumbnailOnClick(e){
	if (!e)	 var e = window.event;	
	setCoordinates(e,this);		
    return false;
}



function setCoordinates(e,obj) {    
	var posx = 0;
	var posy = 0;	
	if (!e) var e = window.event;
	if (e.pageX || e.pageY) 	{
		posx = e.pageX;
		posy = e.pageY;
	}
	else if (e.clientX || e.clientY) 	{
		posx = e.clientX + document.body.scrollLeft
			+ document.documentElement.scrollLeft;
		posy = e.clientY + document.body.scrollTop
			+ document.documentElement.scrollTop;
	}
	// posx and posy contain the mouse position relative to the document
    
	showTip(posx,posy,obj);
	
}

function showTip(posx,posy,obj){
    
	var imgSrc=obj.src.substring(0,obj.src.length-7)+"_lg.jpg"; 
	var content="<"+"p>"+"<"+"img src='"+imgSrc+"' alt='"+obj.alt+"' ><br>"+obj.alt+"</"+"p>";
	
	var closeLink = '<a href="#" id="close" onclick="hideTip();return false;">Close</a><div class="clearAll">&nbsp;</div>';	
	document.getElementById('container').innerHTML=closeLink + content;
	document.getElementById('container').style.left= posx-250+"px";
	document.getElementById('container').style.top= posy -150+"px";		
	document.getElementById('container').style.position="absolute";
	document.getElementById('container').style.display="block";
   
}

function hideTip(){
	document.getElementById('container').style.display="none";	
}

function writeLayout(list,start,end){
	document.getElementById("gallery").innerHTML="";
	var i=start-1 ;
	  
	for(i;i<=end;i++){
	   var items=new Array();
	   if (list[i] && i<end){ items.push(list[i]);i++;}
	   
	   if (list[i] && i<end){ items.push(list[i]);i++;}
	   
	   if (list[i] && i<end){ items.push(list[i]); i++;}
	  
	   if (list[i] && i<end){ items.push(list[i]);}
	   writeRow (items);
	   thumbnailClick();
	}
   return false;
}

function writeRow(items){
	var innertext="<"+"div cl"+"ass='thumbnailRow' "+">";	 
	for (var i=0;i<items.length;i++){  
	   innertext=innertext + "<"+"span><"+"img"+" src='/images/gallery/"+items[i][0]+"' class='thumbnail' alt='"+items[i][1]+"'><"+"br>"+items[i][1]+"</"+"span>";
	  }
	 innertext=innertext + "<"+"div cla"+"ss='clearAll'>&nbsp;</"+"div><"+"/div"+">";
	 document.getElementById("gallery").innerHTML=document.getElementById("gallery").innerHTML+innertext;
}