var FormCount = 0,waitdiv;
var Redirectors = new Array();
function InstallRedirector(Form,CityField)
{
	Redirectors[FormCount++] = new CityRedirector(Form,CityField);
}
function CityRedirector(Form,SearchField)
{
	var me = this;
	var _form = Form;
	var _input = SearchField;
	var _redirectlist,_popup,shadow;
	var _listcount = 0;
	var _lastResultStatus = 200;
	var _divWidth = 400
	this.ShowList = function(){ _popup.style.visibility = "visible";};
	this.HideList = function(){ if(_popup)_popup.style.visibility = "hidden";};
	this.DisableForm = function(){ 
		for(var i=0; i<_form.elements.length; i++)
		{
			_form.elements[i].disabled=true;
		}
		};
	this.EnableForm = function(){
		for(var i=0; i<_form.elements.length; i++)
		{
			_form.elements[i].disabled=false;
		}
		};
	this.ShowWait = function(){ 
		me.DisableForm();
		ShowWait();
		};
	this.HideWait = function(){ 
		me.EnableForm();
		HideWait();
		};
	this.GetOffSet = function(){
		//var left = calculateOffsetLeft(_form);
		//var top = calculateOffsetTop(_form);
		var iWidth = (window.innerWidth)?window.innerWidth:document.body.clientWidth;
		var iHeight = (window.innerHeight)?window.innerHeight:document.body.clientHeight;
		var scrollleft = document.body.scrollLeft;
		var scrollTop = document.body.scrollTop
		var left = (iWidth-_divWidth)/2 + scrollleft;
		var popupheight = _popup.offsetHeight;
		var top = Math.max((iHeight-popupheight)/2 + scrollTop,5);
		_popup.style.left = left + "px";
		_popup.style.top = top + "px";
	};
	this.CheckRedirect = function()
	{
		if(_hasXMLHTTP && _lastResultStatus==200)
		{
			var xmlhttp = getXMLHTTP();
			var query = escapeURI(_input.value);
			if(query.length>0)
			{
				me.ShowWait();
                if(window.console)
                {
                    window.console.log("xmlhttp = " + xmlhttp);
                    window.console.log("Calling " + "citylookup/service.xml?q="+query);
                }
				xmlhttp.open("GET","citylookup/service.xml?q="+query,true);
				xmlhttp.onreadystatechange = function(){
					if(xmlhttp.readyState==4)
					{
						_lastResultStatus = xmlhttp.status;
						var now=new Date();
						var timeDiff = now-calltime;
						if(window.console)
						{
                            window.console.log("readyState==4 and status = " + _lastResultStatus);
						}
						if(_lastResultStatus==200)
						{
							//TODO Handle status !=200
							if(xmlhttp.responseXML)
							{
								var results = new Results(xmlhttp.responseXML);
								var cityresults = results.CityResults
								if(cityresults)
								{
									_listcount=cityresults.length;
									if(cityresults.length>1)
									{
										var redirlist = me.ProcessList(cityresults);
										//TODO: Create HTML To display the cities
										//alert("Done! (" + cityresults.length + ") Results; Time Taken:"+ timeDiff);
									}
									else if (cityresults.length==1)
									{
										me.HideWait();
										window.location.href = "http://" + cityresults[0].Url;
									}
									else
									{
										me.HideWait();
										alert("No matching results found! Try Again!");
									}
								}
							}
						}
						else
						{
  							me.HideWait();
							_form.submit();
						}
					}
				};
				var calltime = new Date();
				xmlhttp.send(null);
				return false;
			}
			else
			{
				return false;
			}
		}
		else
			return true;
	};
	this.ProcessList = function(list){
		if(_popup)
		{
			me.HideList();
			document.body.removeChild(_popup);
		}
		_popup = document.createElement("div");
		_popup.id = "citylistpopup";
		_popup.style.position="absolute";
		_popup.style.visibility="hidden";
		_popup.style.zIndex="10";
		_popup.style.border= "1px solid #999999";
		_popup.style.width = _divWidth + "px";
		
		var header = document.createElement("div");
		header.style.height="20px";
		header.style.borderBottom= "1px solid #999999";
		header.style.backgroundImage = "url(http://images.myareaguide.com/shadow/bg.gif)";
		header.innerHTML = '<span style="position:absolute; padding-left:3px; top:2px; font-size:12px">' + list.length + ' cities matched "' + _input.value + '". Please choose one.</span>';
		
		var closebox = document.createElement("span");
		closebox.onclick = me.HideList;
		closebox.style.styleFloat = "right";
		closebox.style.cssFloat = "right";
		closebox.style.padding="2px 2px 2px 2px";
		closebox.style.cursor="pointer";
		closebox.innerHTML='<img src="http://images.myareaguide.com/shadow/closebox.png" width="14" height="15">';
		header.appendChild(closebox);
		
		_popup.appendChild(header);
		
		var citylist = document.createElement("div");
		citylist.id = "citylist";
		citylist.style.backgroundColor="#FFFFFF";
		citylist.style.padding ="3px 3px 3px 3px";
		citylist.style.fontSize="12px";
		var citylisthtml = '<table width="98%">';
		for(var i=1; i<= list.length; i++)
		{
			if(i%2==1)citylisthtml +="<tr>";
			citylisthtml += '<td><a style="font-size:12px;" href="http://' + list[i-1].Url + '">' + list[i-1].City + ", " + list[i-1].State + "</a></td>";
			if(i%2==0)citylisthtml +="</tr>";
		}
		if(list.length%1==1)citylisthtml +="<td></td></tr>";
		citylisthtml+="</table>";
		citylist.innerHTML = citylisthtml;
		_popup.appendChild(citylist);
		document.body.appendChild(_popup);
  		me.GetOffSet();
		AddDropShadow(_popup);
  		me.HideWait();
		me.ShowList();
	};
	if(_hasXMLHTTP)
	{
		_form.onsubmit = me.CheckRedirect;
		if(!_input.onfocus)
		{
			_input.onfocus = me.HideList;
		}
	}
}
function ShowWait()
{
	if(!waitdiv)
	{
		waitdiv= document.createElement("div");
		waitdiv.id = "citysitesdiv";
		waitdiv.style.position="absolute";
		waitdiv.style.visibility="hidden";
		waitdiv.style.zIndex="100";
		waitdiv.style.border="#000000 1px solid";
  		waitdiv.style.paddingRight="3px";
  		waitdiv.style.paddingLeft="3px";
  		waitdiv.style.paddingTop="3px";
  		waitdiv.style.paddingBottom="3px";
  		waitdiv.style.backgroundColor="white";
  		waitdiv.style.textAlign="center";
  		waitdiv.style.height="50px";
  		waitdiv.style.width="200px";
  		
		var iWidth = (window.innerWidth)?window.innerWidth:document.body.clientWidth;
		var iHeight = (window.innerHeight)?window.innerHeight:document.body.clientHeight;
		var scrollleft = document.body.scrollLeft;
		var scrollTop = document.body.scrollTop
		var left = Math.max((iWidth-200)/2 + scrollleft,5);
		var top = Math.max((iHeight-50)/2 + scrollTop,5);
		waitdiv.style.left = left + "px";
		waitdiv.style.top = top + "px";
		
  		waitdiv.innerHTML = '<span style="position:relative;top:15px;font-weight:bold">Please Wait...</span>';
  		document.body.appendChild(waitdiv);
  		AddDropShadow(waitdiv);
	}
	waitdiv.style.visibility="visible";
}
function CityResult(city,state,url)
{
	this.City = city;
	this.State = state;
	this.Url = url;
}
function Results(xml)
{
	var me = this;
	var q = xml.getElementsByTagName("query");
	this.Query = q[0].getAttribute("search");
	var cityresults = xml.getElementsByTagName("cityResult");
	this.CityResults = new Array();
	for(var i=0; i< cityresults.length; i++)
	{
		this.CityResults.push(new CityResult(cityresults[i].getAttribute("city"),cityresults[i].getAttribute("state"),cityresults[i].getAttribute("url")));
	}
}
function HideWait()
{
	waitdiv.style.visibility="hidden";
}
var dropshadowimages = new Array();
dropshadowimages[0] = new Image;
dropshadowimages[0].src = "http://images.myareaguide.com/shadow/closebox.png";
dropshadowimages[1] = new Image;
dropshadowimages[1].src = "http://images.myareaguide.com/shadow/lowerleft.png";
dropshadowimages[2] = new Image;
dropshadowimages[2].src = "http://images.myareaguide.com/shadow/bottom.png";
dropshadowimages[3] = new Image;
dropshadowimages[3].src = "http://images.myareaguide.com/shadow/lowerright.png";
dropshadowimages[4] = new Image;
dropshadowimages[4].src = "http://images.myareaguide.com/shadow/upperright.png";
dropshadowimages[5] = new Image;
dropshadowimages[5].src = "http://images.myareaguide.com/shadow/right.png";
dropshadowimages[6] = new Image;
dropshadowimages[6].src = "http://images.myareaguide.com/shadow/rightlower.png";
dropshadowimages[7] = new Image;
dropshadowimages[7].src = "http://images.myareaguide.com/shadow/bg.gif";
function AddDropShadow(elem)
{
	var elemwidth = elem.offsetWidth;
	var elemheight = elem.offsetHeight;
	if(elemwidth==0)
	{
		elemwidth = elem.style.width;
		elemheight = elem.style.height;
	}
	var left = calculateOffsetLeft(elem);
	var top = calculateOffsetTop(elem);
	var isabsolute = elem.style.position=="absolute";
	
	var bottomShadow = document.createElement("div");
	bottomShadow.id = elem.id + "-bs";
	var dsbleft = (isabsolute)?-1:left;
	var dsbtop = (isabsolute)?elemheight-1:elemheight + top ;
	var dsbwidth = 0;
	var bslImage = document.createElement("img");
	if(elem.filters)
	{
		bslImage.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://images.myareaguide.com/shadow/lowerleft.png', sizingMethod='scale')";
		bslImage.src = "http://images.myareaguide.com/blank.gif";
	}
	else
	{
		bslImage.src = "http://images.myareaguide.com/shadow/lowerleft.png";
	}
	bslImage.width = 26;
	bslImage.height = 13;
	bslImage.style.top = dsbtop + "px";
	bslImage.style.left = (dsbleft + dsbwidth) + "px";
	bslImage.style.position = "absolute";
	dsbwidth+=26;
	bottomShadow.appendChild(bslImage);
	
	var bsmImage = document.createElement("img");
	if(elem.filters)
	{
		bsmImage.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://images.myareaguide.com/shadow/bottom.png', sizingMethod='scale')";
		bsmImage.src = "http://images.myareaguide.com/blank.gif";
	}
	else
	{
		bsmImage.src = "http://images.myareaguide.com/shadow/bottom.png";
	}
	bsmImage.width = elemwidth+13 - 54;
	bsmImage.height = 13;
	bsmImage.style.top = dsbtop + "px";
	bsmImage.style.left = dsbleft+dsbwidth + "px";
	bsmImage.style.position = "absolute";
	dsbwidth+=elemwidth+13 - 54;
	bottomShadow.appendChild(bsmImage);
	
	var bsrImage = document.createElement("img");
	if(elem.filters)
	{
		bsrImage.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://images.myareaguide.com/shadow/lowerright.png', sizingMethod='scale')";
		bsrImage.src = "http://images.myareaguide.com/blank.gif";
	}
	else
	{
		bsrImage.src = "http://images.myareaguide.com/shadow/lowerright.png";
	}
	bsrImage.width = 28;
	bsrImage.height = 13;
	bsrImage.style.top = dsbtop + "px";
	bsrImage.style.left = dsbleft+dsbwidth + "px";
	bsrImage.style.position = "absolute";
	bottomShadow.appendChild(bsrImage);
	elem.appendChild(bottomShadow);
	
	var rightShadow = document.createElement("div");
	rightShadow.id = elem.id + "-rs";
	var dsrleft = (isabsolute)?elemwidth-1:elemwidth+left;
	var dsrtop = (isabsolute)?-1:top ;
	var dsrheight = 0;
	var rstImage = document.createElement("img");
	if(elem.filters)
	{
		rstImage.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://images.myareaguide.com/shadow/upperright.png', sizingMethod='scale')";
		rstImage.src = "http://images.myareaguide.com/blank.gif";
	}
	else
	{
		rstImage.src = "http://images.myareaguide.com/shadow/upperright.png";
	}
	rstImage.width = 13;
	rstImage.height = 28;
	rstImage.style.top = (dsrtop + dsrheight) + "px";
	rstImage.style.left = dsrleft + "px";
	rstImage.style.position = "absolute";
	dsrheight+=28;
	rightShadow.appendChild(rstImage);
	
	var rsmImage = document.createElement("img");
	if(elem.filters)
	{
		rsmImage.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://images.myareaguide.com/shadow/right.png', sizingMethod='scale')";
		rsmImage.src = "http://images.myareaguide.com/blank.gif";
	}
	else
	{
		rsmImage.src = "http://images.myareaguide.com/shadow/right.png";
	}
	rsmImage.width = 13;
	rsmImage.height = elemheight - 42;
	rsmImage.style.top = (dsrtop + dsrheight) + "px";
	rsmImage.style.left = dsrleft + "px";
	rsmImage.style.position = "absolute";
	dsrheight +=elemheight - 42;
	rightShadow.appendChild(rsmImage);
	
	var rsbImage = document.createElement("img");
	if(elem.filters)
	{
		rsbImage.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://images.myareaguide.com/shadow/rightlower.png', sizingMethod='scale')";
		rsbImage.src = "http://images.myareaguide.com/blank.gif";
	}
	else
	{
		rsbImage.src = "http://images.myareaguide.com/shadow/rightlower.png";
	}
	rsbImage.width = 13;
	rsbImage.height = 14;
	rsbImage.style.top = (dsrtop + dsrheight) + "px";
	rsbImage.style.left = dsrleft + "px";
	rsbImage.style.position = "absolute";
	rightShadow.appendChild(rsbImage);
	elem.appendChild(rightShadow);
}