//SitOrSquat, copyrighted 2008
//Google overlay code

// A Rectangle is a simple overlay that outlines a lat/lng bounds on the
    // map. It has a border of the given weight and color and can optionally
    // have a semi-transparent background color.
function SHoverOverlay(point, toilets) {
	this.toilets = toilets;	
	this.point = point;
	
}
SHoverOverlay.prototype = new GOverlay();




var hoverToiletRowTemplate = new Template(
	'<div class="mapHoverRow"><div class="mapHoverLeft"></div><div class="mapHoverRight"></div><div class="mapHoverCenterBg"></div><div class="mapHoverCenter">' +
	'<div class="mapHoverNameText">#{name}</div><div class="mapHoverAddressText">#{address}</div></div></div>');

var hoverMoreRowTemplate = new Template(
	'<div class="mapHoverRow"><div class="mapHoverLeft"></div><div class="mapHoverRight"></div><div class="mapHoverCenterBg"></div><div class="mapHoverCenter">' +
	'<div class="mapHoverMoreText">#{more}</div></div></div>');


    // Creates the DIV representing this rectangle.
SHoverOverlay.prototype.initialize = function (map, toilet) {
      // Create the DIV representing our rectangle
	//console.log("Init overlay");
	var div = document.createElement("div");
	var style = div.style;
	
	
	div.className="mapHover";
	div.id = "mapHover";
	style.position = "absolute";
	style.display = "none";
	//console.log("Init overlay height");
	var height = ((this.toilets.length > 2) ? (3 * 49) : (this.toilets.length * 49));
	style.height= height + "px";
	//style.margin = "0px";
	
	//console.log("Init overlay looping toilets");
	var max = (this.toilets.length > 3) ? 2 : this.toilets.length;
	var html = "";
	for (var i = 0; i < max;i++) {
		var toilet = this.toilets[i];
		var name = toilet.locationName;
		var address = toilet.address;
		//console.log("Checking lengths")
		if (name.length > 30) {
			name = name.substring(0,27) + "...";
		}
		if (address.length > 50) {
			address = address.substring(0,47) + "...";
		}
		//console.log("Checked lengths")
		html += hoverToiletRowTemplate.evaluate({name: name, address: address});		
	}
	
	if (this.toilets.length > max) {
		var howMany = this.toilets.length - max;
		html += hoverMoreRowTemplate.evaluate({more: "(+" + howMany + " more...)"});
	}
	
	div.innerHTML = html;
	//console.log("Inited overlay");
    map.getPane(G_MAP_FLOAT_PANE).appendChild(div);
	this.map_ = map;
	this.div_ = div;
};

    // Remove the main DIV from the map pane
SHoverOverlay.prototype.remove = function () {
	
	if (this.div_ != null && this.div_.parentNode != null)
		this.div_.parentNode.removeChild(this.div_);
};

    // Copy our data to a new Rectangle
SHoverOverlay.prototype.copy = function () {
	return new SHoverOverlay(this.point, this.toilets);
};


    // Redraw the rectangle based on the current projection and zoom level
SHoverOverlay.prototype.redraw = function (force) {
      // We only need to redraw if the coordinate system has changed
	if (!force) {
		return;
	}
	
	//console.log("Drawing");
      // Calculate the DIV coordinates of two opposite corners of our bounds to
      // get the size and position of our rectangle
	
	

      // Now position our DIV based on the DIV coordinates of our bounds
	//this.div_.style.width = Math.abs(c2.x - c1.x) + "px";
	//this.div_.style.height = Math.abs(c2.y - c1.y) + "px";
	//var latlng = this.map_.fromContainerPixelToLatLng(this.point);
	var point = this.point;//this.map_.fromLatLngToDivPixel(latlng);
	var mapSize = this.map_.getSize();
	
	//console.log("Getting style values");
	var height = getCurrentStyleNumeric(this.div_,"height") + 20;
	var width = getCurrentStyleNumeric(this.div_,"width") + 20;
	
	var spaceRight = (this.point.x + width) < mapSize.width;
	var spaceLeft = (this.point.x - width) > 0;
	var spaceAbove = (this.point.y - height) > 0;
	var spaceBelow = (this.point.y + height) < mapSize.height;
	
	var x = 0;
	var y = 0;
	
	//console.log ("Point, Map Size, height/width, Space Right,Left,Above,Below",this.point.x, this.point.y, mapSize.width, mapSize.height, width, height, spaceRight,spaceLeft,spaceAbove,spaceBelow);
	if (spaceRight || (!spaceAbove && !spaceLeft && !spaceBelow)) {
		x = point.x + 20;
		y = (point.y - ((height - 20) / 2));
		
		if (y < 5)
			y = 5;
		else if (y + height > mapSize.height)
			y = mapSize.height - height;
		
	} else if (spaceAbove) {
		y = point.y - height;
		x = point.x
		if (x < 5)
			x = 5;
		else if (x + width > mapSize.width)
			x = mapSize.width - width;
			
	} else if (spaceBelow) {
		y = point.y + 10;
		x = point.x
		if (x < 5)
			x = 5;
		else if (x + width > mapSize.width)
			x = mapSize.width - width;
	} else if (spaceLeft) {
		x = point.x - width;
		y = (point.y - ((height - 20) / 2));
		
		if (y < 5)
			y = 5;
		else if (y + height > mapSize.height)
			y = mapSize.height - height;
		
	}
	
	//console.log("Setting location");
	var latlng = this.map_.fromContainerPixelToLatLng(new GPoint(x,y));
	var finalPoint = this.map_.fromLatLngToDivPixel(latlng);
	
	this.div_.style.left = finalPoint.x + "px";//(point.x - width - 20) + "px";
	this.div_.style.top = finalPoint.y + "px";//(point.y - (height /2)) + "px";
	this.div_.style.display = "block";
	if (isIE6) {
		//console.log("Doing ie6 cleanup");
    	var div = $('mapHover');
    	supersleight.runKids(div);
    }
};