//////////////////
// FLOPUP STUFF //
//////////////////

/* Shows a flopup.  Hides any existing flopup and creates/shows the opaque background
 *
 * @param mixed - flopup_id - id of flopup to show, or flopup object itself
 * @param object - oCaller - optinal object that called the flopup
 * @param object - opt - optional list of options passed in format {a:b, c:"d"}
 *
 * @return void
 */
function showFlopup(flopup_id, oCaller, opt)
{
	// If another flopup is shown, hide it
	if ( typeof(flopup_id) != "string" ) flopup_id = flopup_id.id;

	var oBack = document.getElementById("flopup_back");
	if ( !oBack )
	{
		// If the back doesn't exist, create it
		var oBack = document.createElement("div");
		oBack.id = "flopup_back";
		oBack.onclick = function() { closeFlopup(); }
		document.body.appendChild(oBack);
	}
	else
	{
		if (oBack.flopup_id !== undefined && oBack.flopup_id != "" )
		{
			var oFlopupOld = document.getElementById(oBack.flopup_id);
			if ( oFlopupOld ) oFlopupOld.style.display = "none";
		}
	}
	oBack.style.display = "block";
	oBack.flopup_id = flopup_id;

	var oFlopup = document.getElementById(flopup_id);
	if ( oFlopup ) oBack.parentNode.appendChild(oFlopup);
	else
	{
		// flopup doesn't exist, create it
		oFlopup = document.createElement("div");
		oFlopup.id = flopup_id;
		oFlopup.style.zIndex = 100;
		oBack.parentNode.appendChild(oFlopup);
	}

	oFlopup.style.visibility = "hidden";
	oFlopup.style.display = "block";
	if ( oCaller !== undefined ) setPosition(oFlopup, oCaller, opt)
	else setPosition(oFlopup, null, opt)
	oFlopup.style.visibility = "visible";
	resizeFlopupBack();

	return oFlopup;
}


function resizeFlopupBack()
{
	var oBack = document.getElementById("flopup_back");
	if ( oBack )
	{
		if ( window.innerHeight && window.scrollMaxY ) h = (window.innerHeight+window.scrollMaxY)+"px";	// Firefox
		else h = document.body.scrollHeight+"px";	// IE 
		oBack.style.height = h;
	}
}


function closeFlopup()
{
	var oBack = document.getElementById("flopup_back");
	if ( oBack )
	{
		var oFlopup = document.getElementById(oBack.flopup_id);
		if ( oFlopup ) oFlopup.style.display = "none";

		oBack.style.display = "none";
	}
}

/**
 * Sets the positions of a flopup in relation to the calling object.  The calling object is optional, and if left out
 * the flopup will be centered on the screen.
 *   
 * opt is an optional set of variables indicating where the flopup should be placed in relation to the caller
 *  
 *  - align_x/align_y: positions the flopup F in relations to the called C 
 * 
 * 		align_x		align_y
 * 		=======		======= 
 * FFF	center		above
 *  C
 * 
 * FFF	left		above
 *   C
 *  
 * FF	left		floor
 * FFC
 * 
 * FF
 * FFC	left		center	
 * FF
 * 
 * FFC	left		ceiling
 * FF
 *
 *   C
 * FFF	left		below
 *
 *  C	center		below	(default)
 * FFF
 *
 * C	right		below
 * FFF
 * 
 * CFF	right		ceiling
 *  FF 
 *
 *  FF
 * CFF  right		center
 *  FF
 * 
 *  FF	right		floor
 * CFF
 *
 * FFF	right		above
 * C
 *
 * example call: setPosition(oFlopup, oCaller, {align_x:"center", align_y:"above"});
 * 
 **/ 
function setPosition(oFlopup, oCaller, opt)
{
	if ( opt == undefined ) opt = new Object();
	if ( opt.align_x == undefined ) opt.align_x = "center";		// left, right or center
	if ( opt.align_y == undefined ) opt.align_y = "below";		// above, below or center

	var f		= new Object();					// flopup info
	f.w			= getWidth(oFlopup);
	f.h			= getHeight(oFlopup);
	f.half_w	= Math.floor(f.w/2);
	f.half_h	= Math.floor(f.h/2);

	if ( oCaller !== undefined && oCaller )
	{
		c			= findPosition(oCaller);	// caller info
		c.w			= getWidth(oCaller);
		c.h			= getHeight(oCaller);
		c.half_w	= Math.floor(c.w/2);
		c.half_h	= Math.floor(c.h/2);

		var align_x = opt.align_x;
		var align_y = opt.align_y;

		if		( align_x == "center" && align_y == "above" )	{l = c.x + c.half_w - f.half_w;		t = c.y - f.h;}
		else if	( align_x == "left"   && align_y == "above" )	{l = c.x + c.w - f.w;				t = c.y - f.h;}
		else if	( align_x == "left"   && align_y == "floor" )	{l = c.x - f.w;						t = c.y + c.h - f.h;}
		else if	( align_x == "left"   && align_y == "center" )	{l = c.x - f.w;						t = c.y + c.half_h - f.half_h;}
		else if	( align_x == "left"   && align_y == "ceiling" )	{l = c.x - f.w;						t = c.y;}
		else if	( align_x == "left"   && align_y == "below" )	{l = c.x + c.w - f.w;				t = c.y + c.h;}
		else if	( align_x == "center" && align_y == "below" )	{l = c.x + c.half_w - f.half_w;		t = c.y + c.h;}
		else if	( align_x == "right"  && align_y == "below" )	{l = c.x;							t = c.y + c.h;}
		else if	( align_x == "right"  && align_y == "ceiling" )	{l = c.x + c.h;						t = c.y;}
		else if	( align_x == "right"  && align_y == "center" )	{l = c.x + c.h;						t = c.y + c.half_h - f.half_h;}
		else if	( align_x == "right"  && align_y == "floor" )	{l = c.x + c.h;						t = c.y + c.h - f.h;}
		else if	( align_x == "right"  && align_y == "above" )	{l = c.x;							t = c.y - f.h;}
		else if	( align_x == "center" && align_y == "center" )	{l = c.x + c.half_w - f.half_w;		t = c.y + c.half_h - f.half_h;}
//		else													{l = c.x + c.half_w - f.half_w;		t = c.y + c.h;}

//		alert("x:"+c.x+" y:"+c.y+"\nw:"+c.w+" h:"+c.h+" left:"+l+" top:"+t+"\nalign_x:"+align_x+" align_y:"+align_y);
	}
	else
	{
		// center the flopup
		var scroll_y = ( document.all ) ? document.documentElement.scrollTop : window.pageYOffset; 

		// if no caller, then center on screen
		win_w = ( window.innerWidth ) ? window.innerWidth : document.documentElement.clientWidth;
		win_h = ( window.innerHeight ) ?  window.innerHeight : document.documentElement.clientHeight;

		l = Math.floor(win_w/2) - Math.floor(f.w/2);
		t = Math.floor(win_h/2) - Math.floor(f.h/2) + scroll_y;
	}
	oFlopup.style.left = l+"px";
	oFlopup.style.top = t+"px";
}


/**
 * Called when the signin flopup is to be shown.  If flopup doesn't exist, uses ajax to fetch html.
 * 
 * @param object - oCaller - calling object 
 * @param object - opt - optional list of options passed in format {a:b, c:"d"}
 *
 * @return void
 */
function showSigninFlopup(oCaller, opt)
{
	var oFlopup = document.getElementById("flopup_signin");
	if ( !oFlopup )
	{
		if (!xmlh_lock)
		{
			xmlh_lock = true;
			if ( opt == undefined ) opt = null;
			xmlh_queryPost("/ajax/flopup.signin.php", "", buildSigninFlopup, {oCaller:oCaller, opt:opt});
		}
	}
	else
	{
		if ( opt == undefined || !opt ) opt = {align_x:"center", align_y:"below"};
		showFlopup("flopup_signin", oCaller, opt);
	}
}


/**
 * Callback function from showSigninFlopup ajax call.  Builds the actual flopup.
 * 
 * @param string - html - html of signin flopup 
 * @param object - data - contains oCaller and options object
 *
 * @return void
 */
function buildSigninFlopup(html, data)
{
	// extract items from data object
	var oCaller	= data.oCaller;
	var opt		= data.opt;

	var oFlopup = document.createElement("div");
	oFlopup.id = "flopup_signin";
	oFlopup.innerHTML = html;
	oFlopup.style.position = "absolute";
	oFlopup.style.zIndex = 100;
	document.body.appendChild(oFlopup);

	xmlh_lock = false;
	showSigninFlopup(oCaller, opt);
}
