function DisplayLightBoxById(id, width, releventObject, color){
	// layer
	if(color != "black" && color != "white"){
		color = "black";
	}
	var a=document;
	var d=0;
	var l=0;
	var fullH
	if(typeof window.innerWidth!="undefined"){
		d=window.innerHeight;
		l=window.innerWidth
	}else{
		if(typeof a.documentElement!="undefined" && typeof a.documentElement.clientWidth!="undefined" && a.documentElement.clientWidth!=0){
			d=a.documentElement.clientHeight;
			l=a.documentElement.clientWidth
		}else{
			d=$$("body")[0].clientHeight;
			l=$$("body")[0].clientWidth
		}
	}
	
	// container position
	$(id).addClassName("LightBoxPanel");
	if(width != null){
		$(id).style.width = width + 'px';
	}
	var k=0;
	var j=0;
	if(releventObject != null){
		var e=$(releventObject);
		$(id).writeAttribute("RelativeObj", e.identify());
		var o=e.getHeight();
		var oElement=e;
		
		while(oElement!=null){
			k+=oElement.offsetLeft;
			j+=oElement.offsetTop;
			oElement=oElement.offsetParent
		}
		j = j + o - e.cumulativeScrollOffset().top;
	}else{
		$(id).addClassName("CenterObject");
		if(width != null){
			var height = $(id).getHeight();
			j = (d - height) / 2;
			k = (l - width) / 2;
		}else{
			var dimension = $(id).getDimensions();
			if(dimension.width > 800){
				$(id).style.width = '800px';
				k = (l - 800) / 2;
			}else{
				k = (l - dimension.width) / 2;
			}
			j = (d - dimension.height) / 2;
			
		}
		//alert(dimension.width);
	}
	if(k < 0){ k = 0; }
	if(j < 0){ j = 0; }
	$(id).style.left=k+"px";
	$(id).style.top=(j)+"px";

	$(id).show();
	

	var n=Math.max(Math.max(a.body.scrollHeight, a.documentElement.scrollHeight), Math.max(a.body.offsetHeight, a.documentElement.offsetHeight), Math.max(a.body.clientHeight, a.documentElement.clientHeight));
	var g=Math.max(Math.max(a.body.scrollWidth, a.documentElement.scrollWidth), Math.max(a.body.offsetWidth, a.documentElement.offsetWidth), Math.max(a.body.clientWidth, a.documentElement.clientWidth));

	if((n-d)<=4){n=d}
	if((g-l)<=4){g=l}
	if($$('.LightBoxBackground').length == 0){
		var b=document.createElement("div");
		b.innerHTML='<div class="LightBoxBackground" onclick="HideLightBox()" style="display: none; "></div>';
		document.body.appendChild(b);
	}
	var h=$$(".LightBoxBackground")[0];
	h.className = "LightBoxBackground " + "LightBoxBackground_" + color;
	h.style.top="0px";
	h.style.left="0px";
	h.style.height=n+"px";
	h.style.width=(g)+"px";
	h.style.overflow="hidden";
	h.style.display="block";
	h.show();
	h.scrollTo();
}

function DisplayLightBoxByContent(content, title, width, releventObject, color){
	if($('lightBoxContentCotainer') == null){
		var b=document.createElement("div");
		b.innerHTML='<div id="lightBoxContentCotainer" style="display: none"></div>';
		document.body.appendChild(b);
	}
	var node = $('lightBoxContentCotainer');
	node.innerHTML = content;
	DisplayLightBoxById("lightBoxContentCotainer", width, releventObject, color);
}

Event.observe(window, 'resize', function(){
	if($$('.LightBoxBackground').length > 0 && $$('.LightBoxBackground')[0].visible()){
		var a=document;
		var d=0;
		var l=0;
		if(typeof window.innerWidth!="undefined"){
			d=window.innerHeight;
			l=window.innerWidth
		}else{
			if(typeof a.documentElement!="undefined" && typeof a.documentElement.clientWidth!="undefined" && a.documentElement.clientWidth!=0){
				d=a.documentElement.clientHeight;
				l=a.documentElement.clientWidth
			}else{
				d=$$("body")[0].clientHeight;
				l=$$("body")[0].clientWidth
			}
		}
		var node = $$(".LightBoxPanel")[0];
		if(node.hasClassName("CenterObject")){
			var k=0;
			var j=0;
			width = node.style.width;
			if(width != null){
				var height = node.getHeight();
				j = (d - height) / 2;
				k = (l - parseInt(width)) / 2;
			}else{
				var dimension = node.getDimensions();
				j = (d - dimension.height) / 2;
				k = (l - dimension.width) / 2;
			}
			if(k < 0){ k = 0; }
			if(j < 0){ j = 0; }
			node.style.left=k+"px";
			node.style.top=(j)+"px";
		}
		var relativeObj = node.readAttribute("RelativeObj");
		if(relativeObj != null && $(relativeObj) != null){
			var k=0;
			var j=0;
			var e=$(relativeObj);
			var o=e.getHeight();
			var oElement=e;
			while(oElement!=null){
				k+=oElement.offsetLeft;
				j+=oElement.offsetTop;
				oElement=oElement.offsetParent
			}
			j = j + o - e.cumulativeScrollOffset().top;
			if(k < 0){ k = 0; }
			if(j < 0){ j = 0; }
			node.style.left=k+"px";
			node.style.top=(j)+"px";
		}

		var h=$$(".LightBoxBackground")[0];
		$$(".LightBoxBackground").invoke('hide');
		setTimeout(function(){
			var n=Math.max(Math.max(a.body.scrollHeight, a.documentElement.scrollHeight), Math.max(a.body.offsetHeight, a.documentElement.offsetHeight), Math.max(a.body.clientHeight, a.documentElement.clientHeight));
			var g=Math.max(Math.max(a.body.scrollWidth, a.documentElement.scrollWidth), Math.max(a.body.offsetWidth, a.documentElement.offsetWidth), Math.max(a.body.clientWidth, a.documentElement.clientWidth));
			h.show();
			if((n)<=d){n=d}
			if((g-l)<=4){g=l}
			h.style.height=n+"px";
			h.style.width=(g)+"px";
		}, 1);
	}
});

function HideLightBox(){
	$$(".LightBoxPanel").each(function (o){
		o.hide(); 
		o.removeClassName("LightBoxPanel");
		o.removeClassName("CenterObject");
	});
	$$(".LightBoxBackground").invoke("hide");
}