/**
 * @author Roger
 */
var locationPop = new Class({
	
	imagefile: null,
	mapfile: null,
	detailsXML: null,
	
	initialize: function(element, imagefile, mapfile,detailsXML){
		this.element = $(element);
		this.imagefile = imagefile;
		this.mapfile = mapfile;
		this.detailsXML = detailsXML;
		this.installimage();
		this.installmap();
		//this.loadEvents();
	},
	
	installimage: function(){
		var myImageEl = new Element('img',{
			id:'popupImageEl',
			src: this.imagefile,
			border: 0,
			usemap: '#imagePop'
		}).inject(this.element);
	},
	
	installmap: function(){
		var myMapEl = new Element('div',{
			id:'popupImageMap'
		}).inject(this.element);
		new Request({
			url: 'xml/propertylist.xml',
			onSuccess: function(responseText, responseXML){
						if (responseXML) {
							try //Internet Explorer
							{
								xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
								xmlDoc.async = "false";
								xmlDoc.loadXML(responseText);
							} 
							catch (e) {
								try //Firefox, Mozilla, Opera, etc.
								{
									parser = new DOMParser();
									xmlDoc = parser.parseFromString(responseText, "text/xml");
								} 
								catch (e) {
									alert(e.message);
									return;
								}
							}
							var properties = xmlDoc.getElementsByTagName('property');
							for (var i = 0; i <= properties.length - 1; i++) {
								property = properties[i];
								
								var xLoc = property.getElementsByTagName('xLoc')[0].childNodes[0].nodeValue;
								var yLoc = property.getElementsByTagName('yLoc')[0].childNodes[0].nodeValue;
								var propertyID = property.getElementsByTagName('id')[0].childNodes[0].nodeValue;
								var propertyClass = property.getElementsByTagName('class')[0].childNodes[0].nodeValue;
								new Element('a',{
									'href': '#',
									'id': propertyID,
									'class': propertyClass,
									'styles':{
										'position': 'relative',
										'z-index': '9999',
										'top':yLoc+'px',
										'left': xLoc+'px'
									}
								}).inject(this.element);
								new Element('img',{
									src: 'images/checkmark.png',
									border:'0'
								}).inject(propertyID);
							}
							var elements = $$('.mapImageMap');
							elements.each(function(el,ndx){
								el.addEvent('click',function(e){
									new Event(e).stop();
									new Request({
										url: 'xml/'+el.id+'.xml',
										onSuccess: function(responseText, responseXML){
											if(responseXML){
												try //Internet Explorer
												  {
												  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
												  xmlDoc.async="false";
												  xmlDoc.loadXML(responseText);
												  }
												catch(e)
												  {
												  try //Firefox, Mozilla, Opera, etc.
												  {
												  parser=new DOMParser();
												  xmlDoc=parser.parseFromString(responseText,"text/xml");
												  }
												  catch(e)
												  {
												  alert(e.message);
												  return;
												  }
												}
												var properties = xmlDoc.getElementsByTagName('property');
												//var properties = xmlDoc.getElements('properties');
												if(properties.length > 0){
													var linkPosition = el.getCoordinates();
													var elementPosition = this.element.getCoordinates();
													// get the coordinates of the document
													var docPosition = document.getSize();
													// set coordinates for info Div
													//if (!Browser.Engine.trident) {
													//	elementPosition.left = 0;
													//	elementPosition.top = 0;
													//}
													var leftPos = linkPosition.left;
													var topPos = linkPosition.top ;
													if ((linkPosition.left + 200) > docPosition.x) {
														leftPos = (linkPosition.left - 200);
													}
													if ((linkPosition.top + 200) > docPosition.y) {
														topPos = (linkPosition.top - 200);
													}
													var infoDiv = new Element('div', {
														id: el.id + 'InfoDiv',
														styles: {
															'background-color': '#336699',
															left: leftPos,
															top: topPos,
															width: 200,
															//height: 0,
															opacity: '0',
															'z-index': '99999',
															'display': 'block',
															'position': 'absolute',
															'padding-left': '2px',
															'padding-right': '2px',
															'color': '#FFF',
															'font-family': 'Verdana,Arial,San Serif',
															'font-size': '10px',
															'overflow':'visible'
														}
													}).inject(this.element, 'top');
													infoDiv.innerHTML = "";
													for (var i = 0; i <= properties.length - 1; i++) {
														property = properties[i];
														//}
														//properties.each(function(property,ndx){
														var propertyName = property.getElementsByTagName('name')[0].childNodes[0].nodeValue;
														var propertyAddress = property.getElementsByTagName('address')[0].childNodes[0].nodeValue;
														var propertyCity = property.getElementsByTagName('city')[0].childNodes[0].nodeValue;
														var propertyState = property.getElementsByTagName('state')[0].childNodes[0].nodeValue;
														var propertyZip = property.getElementsByTagName('zip')[0].childNodes[0].nodeValue;
														var propertyPhone = property.getElementsByTagName('phone')[0].childNodes[0].nodeValue;
														var propertyDescription = property.getElementsByTagName('description')[0].childNodes[0].nodeValue;
														var propertyURL = property.getElementsByTagName('url')[0].childNodes[0].nodeValue;
														var propertyImage = property.getElementsByTagName('image')[0].childNodes[0].nodeValue;
					
														infoDiv.innerHTML = infoDiv.innerHTML+ "<br/>" + "<b>" + propertyName + "</b><br/>" + propertyAddress + "<br/>" +propertyCity+","+propertyState+" "+propertyZip+"<br/>"+propertyPhone+"<br/>"+ propertyDescription + "<br/>";
														infoDiv.innerHTML = infoDiv.innerHTML + '<img src="http://bluedasher.guestwelcome.com' + propertyImage + '" width="200"/><br/>';
														infoDiv.innerHTML = infoDiv.innerHTML + '<a href="' + propertyURL + '" style="color:#FFF;font-weight:bold;">Link</a><br/>';
					
														// add the new id to the openBoxes array
					
													}
													var CloseElement = new Element('a', {
														href: '',
														id: el.id + 'InfoDiv_Close',
														styles: {
															'color': '#FFF',
															'font-weight': 'bold'
														}
													}).inject(infoDiv);
													CloseElement.innerHTML = 'Close';
													CloseElement.addEvent('click', function(e){
														new Event(e).stop();
														var myFx = new Fx.Tween(infoDiv,{
															complete: function(){
																infoDiv.dispose();
															}
														});
														myFx.start('opacity',1,0);
					
													});
													var myFx = new Fx.Elements([infoDiv]).start({
														'0': {
															//'width': [0, 200],
															//'height': [0, 300],
															'opacity': [0, 1]
														}
													});
												}
												
					
												//},this);
											}
										}.bind(this)
									}).get();
								}.bind(this));
							},this);
						}
					}.bind(this)
		}).get();
		
	},
	
	loadEvents: function(){
		$('popupImageEl').addEvent('click',function(e){
			new Event(e).stop();
			alert('imageclick');
		}).bind(this);
	}	
});

var locationInfoDiv = new Class({
	
	imagefile: null,
	locationName: null,
	locationDetails: null,
	
	
	initialize: function(elid, eldetails){
		this.id = elid;
		this.eldetails = eldetails;	
	}
});