var flyoutlist = new Array();

Behaviour.register({
	'.openFlyout' : function (elem)
	{
		var flyout = $("flyout_" + elem.id);
		var flyout_body = $("flyout_body_" + elem.id);
		var body_elem = document.getElementsByTagName("BODY")[0];

		flyout.flyout_body = flyout_body;

		flyoutlist.push(flyout);

		flyout.parentNode.removeChild(flyout);
		body_elem.appendChild(flyout);


		Try.these(
  			flyout.style.filter = "alpha(opacity:95)",
  			flyout.style.KHTMLOpacity = 0.95,
  			flyout.style.MozOpacity = 0.95,
  			flyout.style.opacity = 0.95
		);

		if (flyout_body != null)
		{
			flyout_body.parentNode.removeChild(flyout_body);
			body_elem.appendChild(flyout_body);

			Try.these(
	  			flyout_body.style.filter = "alpha(opacity:100)",
	  			flyout_body.style.KHTMLOpacity = 1,
	  			flyout_body.style.MozOpacity = 1,
	  			flyout_body.style.opacity = 1
			);
		}
		
	
		Event.observe(elem,"click",function (evt)
		{
			var body_elem = document.getElementsByTagName("BODY")[0];
			var flyout = this;
			var height = 0;
			var width = 0;

			// close all other flyouts
			for (var I=0; I < flyoutlist.length; I++)
			{
				flyoutlist[I].className = flyoutlist[I].className.replace(/ on/,"");
				flyoutlist[I].flyout_body.className = flyoutlist[I].flyout_body.className.replace(/ on/,"");
			}

			if (document.clientHeight != null)
			{
				height = document.clientHeight;
				width = document.clientWidth;
			}
			else
			{
				height = body_elem.clientHeight;
				width = body_elem.clientWidth;
			}
			Event.stop(evt);
			flyout.className += " on";
			flyout.flyout_body.className += " on";
			//flyout.style.top = (((height - flyout.offsetHeight) / 2) + body_elem.scrollTop) + "px";
			flyout.style.top = "150px";
			//flyout.flyout_body.style.top = (((height - flyout.offsetHeight) / 2) + body_elem.scrollTop + 20) + "px";
			flyout.flyout_body.style.top = "170px";
			flyout.style.left = (((width - flyout.offsetWidth) / 2) + body_elem.scrollLeft) + "px";
			flyout.flyout_body.style.left = (((width - flyout.offsetWidth) / 2) + body_elem.scrollLeft) + "px";
			return false;
		}.bindAsEventListener(flyout),true);
	},
	'.closeFlyout' : function (elem)
	{

		Event.observe(elem,"click",function (evt)
		{
			var flyout = $("flyout_" + this.id);
			flyout.className = flyout.className.replace(/ on/,"");
			flyout.flyout_body.className = flyout.flyout_body.className.replace(/ on/,"");
			Event.stop(evt);
		}.bindAsEventListener(elem),true);
	},

	'.openFlyout3' : function (elem)
	{
		var flyout = $("flyout_" + elem.id);
		var body_elem = document.getElementsByTagName("BODY")[0];

		flyoutlist.push(flyout);

		flyout.parentNode.removeChild(flyout);
		body_elem.appendChild(flyout);
	
		Event.observe(elem,"click",function (evt)
		{
			var body_elem = document.getElementsByTagName("BODY")[0];
			var flyout = this;
			var height = 0;
			var width = 0;

			// close all other flyouts
			for (var I=0; I < flyoutlist.length; I++)
			{
				flyoutlist[I].className = flyoutlist[I].className.replace(/ on/,"");
			}

			if (document.clientHeight != null)
			{
				height = document.clientHeight;
				width = document.clientWidth;
			}
			else
			{
				height = body_elem.clientHeight;
				width = body_elem.clientWidth;
			}
			Event.stop(evt);
			flyout.className += " on";

			flyout.style.top = (((height - flyout.offsetHeight) / 2) + body_elem.scrollTop) + "px";
			flyout.style.left = (((width - flyout.offsetWidth) / 2) + body_elem.scrollLeft) + "px";
			return false;
		}.bind(flyout),true);
	},
	'.openFlyout2' : function (elem)
	{
		var flyout = $("flyout_" + elem.id);
		var body_elem = document.getElementsByTagName("BODY")[0];

		flyout.parentNode.removeChild(flyout);
		body_elem.appendChild(flyout);
	
		Event.observe(elem,"click",function (evt)
		{
			var body_elem = document.getElementsByTagName("BODY")[0];
			var flyout = this;
			var height = 0;
			var width = 0;
			height = document.documentElement.clientHeight;
			width = document.documentElement.clientWidth;
			Event.stop(evt);
			flyout.className += " on";
			flyout.style.top = (((height - flyout.offsetHeight) / 2) + document.documentElement.scrollTop) + "px";
			flyout.style.left = (((width - flyout.offsetWidth) / 2) + document.documentElement.scrollLeft) + "px";
			return false;
		}.bind(flyout),true);
	},
	'.closeFlyout2' : function (elem)
	{

		Event.observe(elem,"click",function (evt)
		{
			var flyout = $("flyout_" + this.id);
			flyout.className = flyout.className.replace(/ on/,"");
			Event.stop(evt);
		}.bind(elem),true);
	}
});