if(!document.all) document.captureEvents(Event.MOUSEMOVE | Event.MOUSEDOWN | Event.MOUSEUP);
AttachEvent(document, "mousemove", mouseMove);
//http://developer.yahoo.com/yui/connection/#scope

if(!timers) timers = [];
bool_debug = false;
popboxes = {};
popevents = {};

addLoadEvent(function ()
{ 
	initboxes();
	initevents();
	
	/* FOR TESTING
	var ar = [];
	for(var i=0; i < popboxes.length; i++)
	{
		var popbox = popboxes[i];
		if(popbox.configs) ar.push(i +'='+popbox.configs.id);
		else alert('no configs');
	}
	alert(ar.join('\n'));
	*/
});


var PopBoxObj = Class.create();
PopBoxObj.prototype = 
{
	id: null,
	popbox: null,
	active: false,
	http_request:false,
	defaultconfigs: {
	'width':300,
	'height':300,
	'top':0,
	'left':0,
	'position':'absolute',
	'align':'center',
	'valign':'top',
	'status':'',
	'autoclose':false,
	'title':'Principa',
	'url':'',
	'text':'',
	'display':'none',
	'active':false,
	'mimetype':'text',
	'ajaxmethod':'POST',
	'autosize':false,
	'innerWidth':'90%',
	'innerHeight':'90%',
	'textalign':'left',
	'overflow':'auto',
	'padding':10,
	'zindex':100,
	'skintype':2,
	'followmouse':true,
	'scrolling':'auto'
	},
		
	initialize: function(popid) 
	{
		var popbox = document.getElementById(popid);
		if(!popbox) popbox = this.attach(popid)
		if(popbox.innerHTML) 
		{
			this.defaultconfigs.text = popbox.innerHTML;
		}
		this.id = popid;
		
		var output = [];
		for(var attr in this.defaultconfigs)
		{
			var value = popbox.getAttribute(attr);
			this[attr] = value ? value : this.defaultconfigs[attr];
			// FOR TESTING:  if(this.id == 'BOT' && attr=='height') alert(value);

			output.push(attr+'='+value);
		}
		//alert(output.join('\n'));
		
		this.popbox = popbox;
		this.load();
	},

	load: function(configs) 
	{
		this.setconfig(configs);	
		this.draw();
	},


	attach: function(id)
	{
		var popbox = document.createElement('DIV'); 
		popbox.setAttribute('id',id);
		popbox.setAttribute(document.all ? 'className' : 'class','popbox');
		//popbox.ClassName = 'popbox';
		document.getElementsByTagName("body")[0].appendChild(popbox); 
		return popbox;
	},
	
	show: function()
	{
		this.active = true;
		var popbox = this.popbox;
		var popid = this.id;
		this.clearTimer(popid);
		this.getconfigs();
		
		var objs = this.objs;
		if(objs.content) objs.content.innerHTML = this.text;		
		popbox.style.display = 'block'; 
	
		var winW = document.body ? document.body.clientWidth : window.innerWidth;
		var winH = document.body ? document.body.clientHeight : window.innerHeight;
	
		var offsetX = window.pageXOffset ||
		         document.body.scrollLeft ||
		         document.documentElement.scrollLeft;
		offsetX = parseInt(offsetX);
		var offsetY = window.pageYOffset ||
		         document.body.scrollTop ||
		         document.documentElement.scrollTop;
		offsetY = parseInt(offsetY);
	
		var w = parseInt(popbox.style.width)
		var h = parseInt(popbox.style.height)
		
		// mouse already has scroll added
		var x = mouse.x;
		var y = mouse.y - h;
	
	  debug(['winW',winW]);
	  debug(['winH',winH]);
	  debug(['offsetX',offsetX]);
	  debug(['offsetY',offsetY]);
	  debug(['w',w]);
	  debug(['h',h]);
	  debug(['x',x]);
	  debug(['y',y]);  
	
		// Get cursor position with respect to the page.
		if(0)// && popbox.left && popbox.top)
		{
			//alert(popbox);
		  popbox.style.top = popbox.top;
		  popbox.style.left = popbox.left;
		}
		else if(0)//popbox.followmouse)
		{	
	   // alert(['winW',winW]);
	    //alert(['winH',winH]);
			/* FIX THIS!!! */
			if(y < offsetY) y = offsetY;
			else if(y + h > winH - offsetY) {y = winH - offsetY - h;}
		 
		 	if(x < offsetX) x = offsetX;
			else if(x + w > winW - offsetX) x = winW - offsetX - w;
	
	    //alert(y + ' ' + h + ' ' + offsetY);    
		}	
		else if(1) // center
		{	
			//alert(popbox.style.left + ' ' + popbox.style.top); return;
			x = parseInt((winW - w) / 2 ) + offsetX;
			y = parseInt((winH - h) / 2) + offsetY;	
		}
	
	  popbox.style.top = y + 'px';
	  popbox.style.left = x + 'px';
		
		if(this.url.length) 
		{
			this.autoclose = false;
			this.clearTimer();
			/////this.ajax_request();
			var objs = this.objs;
			objs.content.innerHTML = "<iframe name='"+this.id+"_frame' class='"+this.id+"_frame' marginWidth=0 marginHeight=0 vspace=0 hspace=0 width='100%' height='100%' style='margin:0;padding:0;border:0;width:100%;height:100%;' id='"+this.id+"_frame' allowTransparency='true' frameborder='no' scrolling='"+this.scrolling+"' src='about:blank' framespacing=0 onload=''></iframe>";
			//var oFrame = window.frames[this.id+"_frame"]; 
			var oFrame = document.getElementById(this.id+"_frame"); 
			//oFrame.location.href.replace(this.url);
			oFrame.src = this.url;
			//oFrame.onload = function (){ }
			//oFrame.style.padding = 0;
			//oFrame.style.margin = 0;
			//oFrame.onload = function (){parent.style.height = document.body.scrollHeight+20; }
			//oFrame.onload = function (){parent.style.height = document.body.scrollHeight+20; }

			//oFrame.onload = function (){ alert([this.name,document.body.scrollWidth]); parent.width = document.body.scrollWidth+10; parent.height = document.body.scrollHeight+10;}
			//oFrame.document.onload = function (){alert(1);}
			/* These didn't work for IE
			alert(oFrame.document.getElementByTagName('BODY')[0].style.width);
			oFrame.getElementsByTagName('BODY')[0].onload = function (){alert('here')}
			oFrame.contentDocument.onload = function (){alert('here')} //"+this.url+"
			alert(oFrame.contentDocument);
			*/
		}
		
	  popbox.style.display = 'block';
	},
	
	hide: function(delay)
	{
		this.clearTimer(this.id);
		if(delay) 
		{
			setTimeout(function (){this.hide()},delay);
		}
		else
		{		
			var popbox = this.popbox;		
			if(this.objs.content.innerHTML) 
			{
				//////////////////////////////popbox.setAttribute('text', this.objs.content.innerHTML);
				this.text = this.objs.content.innerHTML;
				this.objs.content.innerHTML = "";
			}
			popbox.style.display = 'none'; 	
			this.active = false;
		}
	},

	query: function(configs)
	{
		var ar = [];
		for(var field in configs)
		{
			var value = configs[field];
			//if(field == 'each') continue; // due to weirdness of fuctions being looped
			ar.push(field + '='+ escape(value));
	  }
		var query = ar.join('&');	
		return query;
	},
	
	
	ajax_request: function()
	{
		var objs = this.objs;
		if(objs.content)
		{
			objs.content.innerHTML = '<div align="center"><img src="/box/images/preloader.gif" border=0 style="margin:40px;"></div>';
		}
		var query = {};
		var ajaxmethod = this.ajaxmethod;
		var mimetype = this.mimetype ? this.mimetype : "xml";
		var url = this.url;
		
		if(0) // separate url and query string
		{
			var query = {
			'mimetype':this.mimetype,
			'id':this.id,
			'title':this.title,
			'display':this.display,
			'url':this.url
			}
			//query += this.query(ar);		
			//url += '?'+query;	
		}	
		else if(0) // create an array of specific variables
		{
			var ar = {
			'mimetype':this.mimetype,
			'id':this.id,
			'title':this.title,
			'display':this.display,
			'url':this.url
			}
		}
		else // create array of requested variables 
		{
			var ar = url.split('?');
			url = ar[0];
			query = {};
			if(ar[1])
			{
				var tmp = ar[1].split('&');
				for(var i=0; i < tmp.length; tmp++)
				{
					var tmp2 = tmp[i].split('=',2);
					var field = tmp2[0];
					var value = tmp2[1];
					query[field] = value;
					//alert(value);
				}
			}
		}
		
		/**********************************************************************************
		http://www.codeguru.com/csharp/csharp/cs_network/internetweb/article.php/c14285__2/
		
		<<<< REQUEST >>>>
   	Method : null,
    URL : null,
    Params : null,
    Callback : null,
    Async : false,
    UserObject : null,

		var a = new System.Net.Ajax.Request (Method, URL, Callback, Async, UserObject);
		Example of Params:
		for(var field in query)
		{
			alert(field +' '+query[field]);
			a.AddParam(field,query[field]);
		}
		var b = new System.Net.Ajax.PageRequests(a);
		var c = new System.Net.Ajax.Connection(b);
		c.Open();

		<<<< RESPONSE >>>>
		ReadyState: This is an integer value stating whether the request is ready and if you can access the ResponseText object. The possible states are as follows: 
		0 = uninitialized 
		1 = loading 
		2 = loaded 
		3 = interactive 
		4 = complete 
		ResponseText: This is the response text, web page or XML content that is returned by the request. 
		Status: This is the status of the HTTP Request: 200 or 404. 
		URL: This is the URL that was requested. 
		UserObject: This is a free user object that was allowed to be passed around. Use it to store whatever you want. 
		Complete: This is a boolean telling you if all the page requests have been completed that were in the PageRequests Array Collection. 
		**********************************************************************************/
		var a = new System.Net.Ajax.Request (ajaxmethod, "/pop/pop.php", this.ajax_response, true, this);
		for(var field in query)
		{
			alert(field +' '+query[field]);
			a.AddParam(field,query[field]);
		}
		var b = new System.Net.Ajax.PageRequests(a);
		var c = new System.Net.Ajax.Connection(b);
		c.Open();
	},
	
	test: function (src)
	{
		if (http_request.readyState == 4)
		{
			try {
				
				var response = mimetype=='xml'?http_request.responseXML:http_request.responseText;
				//alert(this.id + ' ' + response);
				this.ajax_response(response);
			}
			catch (e) {
				
			}
	  }
	},

	// JS & AJAX etc:  ** http://www.tutorom.com/courses/418/Ajax.htm
	// Attributes:  http://www.howtocreate.co.uk/tutorials/javascript/dombasics
	ajax_response: function (src)
	{	
		//FOR TESTING: response = '<?xml version="1.0" encoding="UTF-8"?><results id="pop1"><pop id="1" type="store" code="1">This is a test</pop></results>';
    if(src.ReadyState==4)
    {
			if(src.Status==200)
			{
        if(this.mimetype == 'xml')
        {
			  	var pop = src.ResponseText.getElementsByTagName('pop').item(0);
				  var text = pop.firstChild.data;
					var title = pop.getAttribute('title');
					var display = pop.getAttribute('display');	
        }
      	else
      	{
      		var display = 'block';
        	var text = src.ResponseText;
        }
				var objs = src.UserObject.objs;
				alert(text);
				if(text) objs.content.innerHTML = unescape(text);
				if(title) objs.titlebar.innerHTML = title;
				src.UserObject.active = false;
			}
		}
	},		


	getobj: function()
	{
		var popbox = this.popbox;
		var tags = [];
		var objs = {};
	
		if(this.skintype == 2)
		{
			try
			{
				tags = popbox.getElementsByTagName("TABLE")[0].getElementsByTagName("TR")[1].getElementsByTagName("TD")[1].getElementsByTagName("DIV");
	
		 		if(tags)
		 		{
					var oContainer = popbox.getElementsByTagName("TABLE")[0];
					var oTitlebar = oContainer.getElementsByTagName("TR")[1].getElementsByTagName("TD")[0];
					var oCloseBtn = oContainer.getElementsByTagName("TR")[1].getElementsByTagName("TD")[2].getElementsByTagName("IMG")[0];
					var oClosebar = oContainer.getElementsByTagName("TR")[1].getElementsByTagName("TD")[1];
					var oContent = oContainer.getElementsByTagName("TR")[2].getElementsByTagName("TD")[1].getElementsByTagName("DIV")[0];
					var oStatusbar = oContainer.getElementsByTagName("TR")[3].getElementsByTagName("TD")[1];
					var objs = {'container':oContainer,'titlebar':oTitlebar,'content':oContent,'closebtn':oCloseBtn,'closebar':oClosebar,'statusbar':oStatusbar};
				 	//alert(oTitlebar.innerHTML);
				 	this.objs = objs;
					return objs;
				}
			}		
	 		catch (e) {}
	 	}
	},
	
	getconfigs: function()
	{
		// defaults should already be set during box initialization
		var popbox = this.popbox;
		var configs = this.configs;
		for(var field in configs)
		{
			if(popbox.getAttribute(field)) this[field] = popbox.getAttribute(field);
		}
		return configs;
	},
	
	
	draw: function()
	{
		// get configurations; defaults should already be set, if not passed specifically
		var popbox = this.popbox;
		var popid = this.id;
		var skintype = this.skintype;
		var skin = '/pop/images/skins/' + skintype;	
		
		// reset width & height
		if(this.width) popbox.style.width = this.width;
		if(this.height) popbox.style.height = this.height;
		if(this.text) popbox.innerHTML = this.text;
		if(this.top) popbox.style.top = this.top;
		if(this.left) popbox.style.left = this.left;
				
		if(skintype==2)
		{		
			var str = '';
			str += '<table height="100%" class="popcontainer" style="padding:0;" border=0 cellpadding=0 cellspacing=0>';
			str += '<tr>';
			str += ' <td align="left" style="background:url('+skin+'/tl.png);"><img width=24 height=42 src="/images/spacer.gif" border=0></td>';	
			str += ' <td NOWRAP valign="bottom" style="height:42px;width:100%;background: url('+skin+'/t.png) repeat bottom left;"><table border=0 cellpadding=0 cellspacing=0><tr><td valign="bottom" align="left" class="poptitle" style="padding-bottom:7px;cursor:move;">'+this.title+'</td><td id="popclose" class="popclose" style="text-align:right;cursor:pointer;padding-right:8px;">CLOSE</td><td valign="middle" align="right" style="padding-bottom:7px;cursor:pointer;" nowrap><img style="" onmouseover="this.src=\''+skin+'/close_on.gif\'" align="middle" onmouseout="this.src=\''+skin+'/close_off.gif\'" name="popclosebttn" src="'+skin+'/close_off.gif" border=0></td></tr></table></td>';
			str += ' <td align="right" style="background:url('+skin+'/tr.png);"><img width=22 height=42 src="/images/spacer.gif" border=0></td>';	
			str += '</tr>';	
			str += '<tr>';	
			str += ' <td style="height:auto;cursor:move;width:24px;background: url('+skin+'/l.png) repeat top left;" valign="bottom"></td>';	
			str += ' <td valign="top" align="center" style="padding:0px;width:100%;height:100%;margin:0;background: url('+skin+'/bg.gif) repeat top left #eeeeee;"><div id="popcontent class="popcontent" style="width:'+this.innerWidth+';height:'+this.innerHeight+';text-align:'+this.textalign+';overflow:'+this.overflow+';display:block;position:relative;top:0;left:0;padding:'+this.padding+';">' + unescape(this.text) + '</div></td>';	
			str += ' <td style="height:auto;cursor:move;width:24px;background: url('+skin+'/r.png) repeat top left;" valign="bottom"></td>';	
			str += '</tr>';
			str += '<tr>';
			str += ' <td align="left" valign="top" style="background:url('+skin+'/bl.png);"><img src="/images/spacer.gif" width=24 height=38 border=0></td>';	
			str += ' <td valign="top" style="height:38px;width:100%;cursor:move; background: url('+skin+'/b.png) repeat bottom left;" class="popstatus" valign="top">'+this.status+'</td>';	
			str += ' <td align="right" valign="top" style="background:url('+skin+'/br.png);"><img src="/images/spacer.gif" width=22 height=38 border=0></td>';	
			str += '</tr>';	
			str += '</table>';	
			str += '';	
		}
	
		popbox.innerHTML = str;
		//popbox.style.display = 'block';  // don't display until showpop function
	
		if(!this.objs)
		{
			//alert('here');
		}
		this.getobj(popid); 
	
		if(0 && this.autosize)
		{
			// this is the only way it resized window properly in IE and FireFox	
			popbox.style.overflow = 'visible';
			popbox.style.height = 'auto';
		}
		
		Event.observe(this.popbox, 'mouseover', this.onActivate.bindAsEventListener(this));
		Event.observe(this.popbox, 'mouseout', this.onDeactivate.bindAsEventListener(this));
		Event.observe(this.objs.closebtn, 'mousedown', this.onClose.bindAsEventListener(this));
		Event.observe(this.objs.closebar, 'mousedown', this.onClose.bindAsEventListener(this));
		Event.observe(this.objs.titlebar, 'mousedown', this.onDrag.bindAsEventListener(this));
		Event.observe(this.objs.statusbar, 'mousedown', this.onDrag.bindAsEventListener(this));

	},	

	onDrag: function(event)
	{
		dragStart(event, this.id);
	},
	
	onActivate: function()
	{
		if(!this.active) return;
		this.clearTimer();
	},

	onDeactivate: function()
	{
		if(!this.active) return;
		this.clearTimer();
		this.hide(3000);
	},

	onClose: function()
	{
		this.clearTimer();
		this.hide();
	},

	move: function(x,y)
	{
		var popbox = this.popbox;
		popbox.style.left = x;
		popbox.style.top = y;
	},

	setconfig: function(configs)
	{
		for(var field in configs)
		{
			var value = configs[field]
			if(value)
			{
				switch(field)
				{
					case 'width':
					case 'height':
					case 'top':
					case 'left':
						value = parseInt(value); break;
					case 'autoclose':
					case 'autohide':
					case 'autosize':
						value = Boolean(value); break;
					case 'text':
					case 'title':
						value = value.trim(); break;
					default:
						break;
				}
			}
			this[field] = value;
		}
		//alert(this.title);
	},

	update: function(newconfigs)
	{
		this.load(newconfigs);
	},
	
	clearTimer: function()
	{
		clearTimeout(timers[this.id]);
	}
};

var PopEventObj = Class.create();
PopEventObj.prototype = {

	ele: null,
	popid: null,
	popevent: null,
	popbox: null,
	PopBoxTarget: null,
	assocfields: {'poptitle':'title', 'poptext':'text', 'popurl':'url', 'popwidth':'width', 'popheight':'height'},

	
	initialize: function (ele)
	{
		this.ele = ele;
		this.popid = ele.getAttribute('popid');
		this.popevent = ele.getAttribute('popevent');
		this.PopBoxTarget = popboxes[this.popid] ? popboxes[this.popid] : new PopBoxObj(this.popid); //document.getElementById(this.popid);
		this.popbox = this.PopBoxTarget.popbox;
		if(this.popbox) this.initevents();
	},
	
	initevents: function ()
	{
		var ele = this.ele;
		var popbox = this.popbox;		
		if(this.popevent == "hover") Event.observe(this.ele, 'mouseover', this.onActivate.bindAsEventListener(this));
		else Event.observe(this.ele, 'click', this.onActivate.bindAsEventListener(this));
		Event.observe(this.ele, 'mouseout', this.onDeactivate.bindAsEventListener(this));
	},
	
	onActivate: function(e)
	{
		if(!e) e = window.event;
		if(!e.target) e.target = e.srcElement || ele;
		stopevent(e);
		var PopBoxTarget = this.PopBoxTarget;
		if(PopBoxTarget.active) return;
		if(this.PopBoxTarget)
		{
			this.configpop(e.target);
			PopBoxTarget.show();
			//alert('PopBox Activated');
		}
	},
	
	onDeactivate: function(e)
	{
		if(!e) e = window.event;
		if(!e.target) e.target = e.srcElement || ele;
		stopevent(e);
		var PopBoxTarget = this.PopBoxTarget;
		if(!PopBoxTarget.active) return;
		if(PopBoxTarget)
		{
			PopBoxTarget.onDeactivate();
			//alert('PopBoxTarget Deactivated');
		}
	},

	configpop: function()
	{
		var ele = this.ele;
		var modconfigs = {};
		var output = [];
		var assocfields = this.assocfields;
		for(var attr in assocfields)
		{
			var assocfield = assocfields[attr];
			var value = ele.getAttribute(attr);
			if(value) 
			{
				modconfigs[assocfield] = value;
				output.push(assocfield+'='+value);
			}
		}
		//alert(output.join('\n'));
		if(modconfigs) 
		{
			this.PopBoxTarget.load(modconfigs);
		}
	}
};


function getpos(id)
{
	var obj = document.getElementById(id);
	if(obj) 
	{
		var ar = [parseInt(obj.style.left), parseInt(obj.style.top)];
		return ar;
	}
}


//http://www.howtocreate.co.uk/tutorials/javascript/dombasics
//http://www.sitepoint.com/article/xml-javascript-mozilla/2

function escapestr(ar)
{
	var tmp = [];
	for(var i=0; i < ar.length; i++)
	{
		var tmp2 = ar[i].split('=');
		tmp.push(tmp2[0] + '=' + escape(tmp2[1]));
	}
	return tmp.join('&');
}


function getChildNode(obj,name,attr) 
{
	for( var x = 0; x < obj.childNodes.length; x++ ) 
	{
		var curNode = obj.childNodes[x];
		////alert(curNode.nodeName);
		if(curNode.ClassName!=name) continue;
		for( var y = 0; y < curNode.attributes.length; y++ ) 
		{
		  if( curNode.attributes[y].nodeName.toLowerCase() == attr ) 
		  {
		  	var node = curNode.attributes[y];
		  	var value = node.nodeValue;
		    //window.alert( 'The value of the \''+id+'\' attribute is: ' + value);
		    return {'node':node, 'value':value};
		  }
		}
	}
}

function stopevent(e) 
{
	if(!e) var e = window.event;
	if(!e.target) e.target = e.srcElement || ele;
	if(e.bubbles == null) e.bubbles = true;
	if(e.stopPropagation) e.stopPropagation();
	if(e.cancelable == null) e.cancelable = true;
	if(e.preventDefault) e.preventDefault();
	return;	 
	if(!e.currentTarget) e.currentTarget = ele;
	//e.stopPropagation = IEtoW3C.stopPropagation;
	//e.preventDefault = IEtoW3C.preventDefault;
	//if(!e.relatedTarget) e.relatedTarget = e.fromElement || e.toElement || null;
	e.cancelBubble = true;
	return;
}


function initboxes()
{
	// retrieve all the elements that are popboxes
	var eles = document.getElementsByClassName('popbox');  
	for(var x=0; x < eles.length; x++)
	{
		var popbox = eles[x];
		var popid = popbox.getAttribute('id');
		var Obj = new PopBoxObj(popid);
		popboxes[popid] = Obj;
	}
	//initpop('debuggit')
	//if(document.getElementById('debuggit') && 0) showpop('debuggit') // wait for debugger to write something to display window
}

function initevents()
{
	var eles = document.getElementsByClassName('popevent');  
	for (var i = 0; i < eles.length; i++) 
	{ 
		var popevent = eles[i];
		var Obj = new PopEventObj(popevent);
		popevents[Obj.id] = Obj;
	}
}

function debug(str)
{
	if(!bool_debug) return;
	var debuggit = document.getElementById('debuggit');
	var objs = getobj('debuggit');
	if(!debuggit) return;
	debuggit.configs.text = objs.content.innerHTML + "<p>"+str+"</p>";;
	show('debuggit');
}