/*
Javascript popup window
By Michael Butler 07/01/09

Usage:
to auto generate the popup window, simply include this script and add this click handler:
onclick="return Popup.display('Hello World',this)"
to use an existing div as the popup (the div must have 3 divs beneath it)
onclick="return Popup.display('Hello World',this,'Div_Id')"
*/

var Popup = {};

Popup.display = function(theText,clickedEl,divId,iWidth){
	if(!divId){
		divId = "myPopup";
	}
	var oDiv = $(divId);
	if(!oDiv){
		oDiv = this.insertDiv();
	}
	if(!oDiv){
		alert("Div not found.");
		return false;
	}

	if(!oDiv.hasClassName("styled")){
		this.styleDiv(oDiv);
		oDiv.addClassName("styled");
	}

	if(iWidth){
		oDiv.style.width = "" + iWidth + "px";
	}

	oDiv.show();
	this.moveDiv(oDiv,clickedEl);

	var children = oDiv.childElements();

	children[1].update(theText);

	Event.observe(children[0].down(),'click',function(e){
		var el = Event.element(e);
		el.up().up().fade({duration:0.5});
	});

	if(!this.dragg){
		new Draggable(divId,{handle:"hd"});
		this.dragg = true;
	}

	return false;
};

Popup.moveDiv = function(oDiv,clickedEl){
	var loc = this.findPos(clickedEl);

	oDiv.style.position = "absolute";

	var dimen = oDiv.getDimensions();
	var wdimen = document.viewport.getDimensions();
	var offset = document.viewport.getScrollOffsets();
	var offsety = offset.top;
	var w,h;

	if( typeof( window.innerWidth ) == 'number' ) {
		//Non-IE
		w = window.innerWidth;
		h = window.innerHeight;
	} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
		//IE 6+ in 'standards compliant mode'
		w = document.documentElement.clientWidth;
		h = document.documentElement.clientHeight;
	} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
		//IE 4 compatible
		w = document.body.clientWidth;
		h = document.body.clientHeight;
	}

//	console.log("loc[1] " + loc[1]);
//	console.log("offsety " + offsety);
//	console.log("h " + h);
//	console.log("dimen.height " + dimen.height);
//
	if(loc[0] > w/2){
		oDiv.style.left = "" + (loc[0] - dimen.width) + "px";
	} else {
		oDiv.style.left = "" + (loc[0]+16) + "px";
	}
	if( (loc[1]-offsety) > (h/2) ){
		oDiv.style.top  = "" + (loc[1] - dimen.height) + "px";
	} else {
		oDiv.style.top  = "" + (loc[1]+10) + "px";
	}
};

Popup.styleDiv = function(oDiv,clickedEl){

	oDiv.style.position = "absolute";
	oDiv.style.margin = 0;
};

Popup.insertDiv = function(){
	var html = '<div id="myPopup" style="display:none;"><div class="hd"><div class="close">&times;</div></div><div class="bd"></div><div class="ft"></div></div>';
	var n = $(window.document.body);
	var newN = n.insert(html);
	return $('myPopup');
};

Popup.findPos = function(obj){
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		do {
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
		} while (obj = obj.offsetParent);
	} else {
		curleft = 20;
		curtop = 20;
	}

	return [curleft,curtop];
};
