/** infoWindow is a custom info window for Google Maps
	Must be loaded with Gmaps js includes or will not work
	*/
function infoWindow(parentDIV, map, data, index) {
	
	this.parentDIV = parentDIV; 
	this.map = map;
	this.width = 240; 			// info window width
	this.height = 140;			// info window height
	this.data;
	this.index = index;
	this.panoResult;

	_this = this;
	
	this.data = data;
	this.streetviewCheck;
	this.container = document.createElement("div");
	
	$(this.container).attr("class","infoWindow");
	$(this.container).append("<div class='wrapper'></div><div class='shadow'></div>");
	
	$("#"+parentDIV).append(this.container);
	
	/** hover on, hover out events handlers **/
	$(this.container).hover( 
		function() {
			$(this).attr("class","infoWindow hover");
		},
		function() {
			$(this).attr("class","infoWindow");
			$(this).css("display","none");
		}
	);
	
	/** paronamacheckcallback */
	this.panoCheck = function(panoData) {
		if (panoData.Location) {
			this.panoResult = true;
		}	
		else {
			this.panoResult = false;
		}
	}
	/** Display info window **/
	this.display = function(markerpos, index) {
		// detect streetview
		//if($(this.container).find("div[class=isStreetView]").text()=="") {
			

		
		var mls_number = data['mls_number'];
		var address = data['address'];
		var price = data['price'];
		var bedrooms = data['bedrooms'];
		var bathrooms = data['bathrooms'];
		var sqft = "";
		
		var city = data["city"];
		var picNum = data["picNum"];
		var picURL = data['picURL'];
		var svc = new GStreetviewClient();
		var html = "";
		var streetHTML = "";
		var listingOffice = data['listingOffice'];
		var url = data['propURL'];
		
		this.position(markerpos);
		if(data['sqft']) sqft = data['sqft'] +" sqft";
		
		container = this.container;
		//$(this.container).find(".wrapper").empty(); //this prevents content from being overwritten
		//$(this.container).css("display","block"); // makes the window visible
		//alert($(this.container).html());
		var result;
		if($(this.container).find(".wrapper").html()!="") $(this.container).css("display","block");
		else {
			
			html += "<a class='infoHeader' href='" +url+"'>";
			html += "<span class='str_addr'>" +address +"</span>";
			html += "</a>";
			
			html += "<div class='infoDetails'>";
	
			html += "<p class='price'>" +price +"</p>";
			html += "<p>" +bedrooms +" br " +bathrooms +" ba ";
			html += sqft +"</p>";
			html += city +" <span class='camera'></span> " +picNum+ "<br />";
			html += "<span class='metrolistLogo metrolistBottom'></span>" + listingOffice+ "<br />";
			//html += listingOffice +"<br />";
	
			html += "</div>";
			html += "<img width=78 height=60 src='" +picURL+ "'>";
			// Metrolist Logo
			//html += "<span class='metrolistLogoSmall'></span>";
			html += "<ul class='bottomLinks'>";
			html += "<li class='street aLink'></li>";
			html += "<li class='aLink' onclick='zoomInHouse(" +markerpos.lat()+","+markerpos.lng()+");'>Zoom</li>";
			html += "<li class='aLink'><a href='" +url+"'>More Details</a></li>";
			html += "</ul>";
			
			$(this.container).find(".wrapper").append(html);
			
			/** getNearestPanorama is AJAX - so lock is used to prevent data corruption **/
			svc.getNearestPanorama(markerpos, function (data) {
														
				infoWinLock = true;
				if (data.Location) {
					//$(this.container).find(".street").attr("onclick", "street(" +markerpos.lat()+","+markerpos.lng()+","+index+");");
					$(this.container).find(".street").click(function() {
						street(markerpos.lat(),markerpos.lng(),index)
					});
					$(this.container).find(".street").text("Streetview");
				}
				$(this.container).css("display","block");
				infoWinLock = false;
			});
		}
	}
	
	/** Hide info window **/
	this.hide = function() {
		if($(this.container).attr("class")=="infoWindow") {
			$(this.container).css("display","none");
		}
	}
	/** 
		Figure out where to display the infoWindow
		map: Gmap2
		markerpos: GLatLng
		*/
	this.position = function(markerpos) {
		var bounds = this.map.getBounds();
		var size = this.map.getSize();
		var mapWidth = size.width;
		var mapHeight = size.height;
		var sw = bounds.getSouthWest();
		var ne = bounds.getNorthEast();
		var lwidth = Math.abs(sw.lng() - ne.lng());
		var lheight = Math.abs(ne.lat() - sw.lat());
		var lngConversion = size.width / lwidth;
		var latConversion = size.height/ lheight;
		var lngOffset = markerpos.lng() - sw.lng();
		var latOffset = ne.lat() - markerpos.lat();
		//alert(latOffset +" "+lngOffset);
		var y = latOffset * latConversion;
		var x = lngOffset * lngConversion;
		
		// calculate direction (figure out which side of the point to display the infowindow
        							
		if((x + this.width)>mapWidth) { 
			x = x - this.width; } // show it on the left hand side
		if((y + this.height)>mapHeight) { 
			y = y - this.height; }
		
		$(this.container).css("top",y+"px");
		$(this.container).css("left",x+"px");
		
		
	}
}
	
