var docWidth;
var docHeight;
var picObject;
var imgObject;
var viewportheight;

var closeButton="";
closeButton+= "<div height=20 class=\"closeButton\" align='right'  >"
closeButton+= "<a href = 'javascript:closeLiteBox()'>"
closeButton+= "<img border=0 src=\"/_images/close_button.gif\" alt=\"close image\">"
closeButton+= "<p>close window</p>"
closeButton+= "</a>"
closeButton+= "</div>"



/////////////////////////////////////////////////////////////////////////////////////////////////////////

function initLiteLight(){
  	var anchors = document.getElementsByTagName('a');
	for (var i=0; i<anchors.length; i++){
		var anchor = anchors[i];
		if (anchor.getAttribute('href') && anchor.getAttribute('href').match('PHOTOLINK')){
			anchor.onclick = function () {showLiteBox(this); return false;}
		}
	}
}

/////////////////////////////////////////////////////////////////////////////////////////////////////////

function initLiteLightOLD(){

  	var anchors = document.getElementsByTagName('a');
	// loop through all anchor tags
	for (var i=0; i<anchors.length; i++){
		var anchor = anchors[i];
		var relAttribute = String(anchor.getAttribute('rel'));
		var hrefAttribute = String(anchor.getAttribute('href'));
		//alert(hrefAttribute+"\n"+relAttribute);
		if (anchor.getAttribute('href') && (relAttribute.toLowerCase().match('litelight'))){
			//alert(hrefAttribute);
			anchor.onclick = function () {showLiteBox(this); return false;}
		}
	}

}

/////////////////////////////////////////////////////////////////////////////////////////////////////////

function showLiteBox(pic){

	getDocDimensions();
	picObject=pic;
	showFadeBackground()

//show the image div
	var html=closeButton+"<div align='center'><br><br>LOADING...<br><br></div>";
	document.getElementById('light').innerHTML=html;
	document.getElementById('light').style.display='block';
	
	
	positionImageDiv(150,70);

	var im=document.getElementById('theImg');
	imgObject=new Image();
	imgObject.src=pic.href;
	
	
	addEventSimple(imgObject, 'load', completeLoadingImage);
	//completeLoadingImage();

	return false; 
}


/////////////////////////////////////////////////////////////////////////////////////////////////////////

function completeLoadingImage(){
	//this all happens once the image has finished loading....
	//alert("here2..."+picObject.getAttribute('href'));
								 
	var href=picObject.getAttribute('href');
	var desc=picObject.getAttribute('title');
	var html=closeButton+"<br><img id='theImg' src='"+href+"' alt=\""+desc+"\"><br>"+desc;
	document.getElementById('light').innerHTML=html;

	//get the image width
	var w=document.getElementById('theImg').width;
	var h=document.getElementById('theImg').height+50;
	
	//set the div width
	//w=100;
	document.getElementById('light').style.width=w+"px";

	positionImageDiv(w,h);

}


/////////////////////////////////////////////////////////////////////////////////////////////////////////

function positionImageDiv(divWidth,divHeight){

	document.getElementById('light').style.width=divWidth+"px";
	
	//work out how wide the div actually is including padding
	var pad=16;
	var border=16;
	var overallWidth=pad+border+divWidth
	
	var overallHeight=divHeight+pad+border;
	
	//work out the left position ofg the div
	var l=(docWidth/2)-(overallWidth/2)+"px";
	var t=(viewportheight/2)-(overallHeight/2)+"px";	
	
	//move the div
	document.getElementById('light').style.left=l;
	document.getElementById('light').style.top=t;


}


/////////////////////////////////////////////////////////////////////////////////////////////////////////

function addEventSimple(obj,evt,fn) { 
	// asign eventHandlers
	if (obj.addEventListener)
		obj.addEventListener(evt,fn,false);
	else if (obj.attachEvent)
		obj.attachEvent('on'+evt,fn);
}

/////////////////////////////////////////////////////////////////////////////////////////////////////////

function showFadeBackground(){
	fadeHeight=docHeight;
	document.getElementById('fade').style.height=fadeHeight+"px";
	document.getElementById('fade').style.width="100%";
	document.getElementById('fade').style.display='block';
}
	

/////////////////////////////////////////////////////////////////////////////////////////////////////////

function closeLiteBox(){
	document.getElementById('light').style.display='none';
	document.getElementById('fade').style.display='none';
	//alertTimerId = setTimeout ( "showAlert()", 3000 );
}

/////////////////////////////////////////////////////////////////////////////////////////////////////////

function getDocDimensions(){

	if( window.innerHeight && window.scrollMaxY ) {
		// Firefox
		docWidth = window.innerWidth + window.scrollMaxX;
		docHeight = window.innerHeight + window.scrollMaxY;
	} else if( document.body.scrollHeight > document.body.offsetHeight ) { 
		// all but Explorer Mac{
		docWidth = document.body.scrollWidth;
		docHeight = document.body.scrollHeight;
	} else { 
		// works in Explorer 6 Strict, Mozilla (not FF) and Safari
		docWidth = document.body.offsetWidth + document.body.offsetLeft; 
		docHeight = document.body.offsetHeight + document.body.offsetTop;
	}



 	if (typeof window.innerWidth != 'undefined'){
		// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
	  	viewportheight = window.innerHeight
	} else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth !='undefined' && document.documentElement.clientWidth != 0) {
		// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
       	viewportheight = document.documentElement.clientHeight
 	} else {
	// older versions of IE
       	viewportheight = document.getElementsByTagName('body')[0].clientHeight
 	}
 }