var dom = YAHOO.util.Dom;


var mapMarkerArray = new Array();

function createMarker(point, content, url) {

	var markerImage = "http://labs.google.com/ridefinder/images/mm_20_red.png";
	var mouseoverMarkerImage = "http://labs.google.com/ridefinder/images/mm_20_yellow.png";

	var tinyIcon = new GIcon();
	tinyIcon.image = markerImage;
	tinyIcon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
	tinyIcon.iconSize = new GSize(12, 20);
	tinyIcon.shadowSize = new GSize(22, 20);
	tinyIcon.iconAnchor = new GPoint(6, 20);
	tinyIcon.infoWindowAnchor = new GPoint(5, 1);


	var marker = new GMarker(point, {icon:tinyIcon});

	var i = mapMarkerArray.length;
	mapMarkerArray[i] = {"marker":marker, "content":content};

	GEvent.addListener(marker, "mouseover", function() {
		marker.setImage(mouseoverMarkerImage);
		showInfoBubble("map", map, i);
		});

	GEvent.addListener(marker, "mouseout", function() {
		marker.setImage(markerImage);
		hideInfoBubble();
		});

	if (url && url != '') {
		GEvent.addListener(marker, "click", function() {
			window.location = url;
			});
	}
	return marker;
}

function showInfoBubble(mapId, mapObject, mapMarkerIndex) {
	var mapDiv = dom.get(mapId);
	var bubbleDiv = dom.get("mapInfoBubble");

	var marker = mapMarkerArray[mapMarkerIndex]["marker"];
	var content = mapMarkerArray[mapMarkerIndex]["content"];

	content = formatInfoBubbleContent(marker, content);

	var markerBounds = getMarkerBounds(mapObject, marker);


	var nearbyMarkerIndexArray = new Array();
	var n = mapMarkerArray.length;
	for(var i = 0; i < n; i++) {
		if (i == mapMarkerIndex) { continue; }

		var myMarker = mapMarkerArray[i]["marker"];

		var myMarkerBounds = getMarkerBounds(mapObject, myMarker);

		// Check for overlapping boundaries
		if (myMarkerBounds.maxX > markerBounds.minX &&
			myMarkerBounds.maxY > markerBounds.minY &&
			myMarkerBounds.minX < markerBounds.maxX &&
			myMarkerBounds.minY < markerBounds.maxY) {

			nearbyMarkerIndexArray[nearbyMarkerIndexArray.length] = i;
		}
	}

	if (nearbyMarkerIndexArray.length > 0) {
		content += "<hr/>";
		content += "<div class=\"nearbyMapMarkers\">";
		content += "<p>Nearby map markers:</p>";

		for(var i = 0; i < nearbyMarkerIndexArray.length; i++) {
			// Only show the first 3 nearby map markers
			if (i > 2) {
				content += "<div style=\"margin-top:6px;font-style:italic;\">Zoom in to see more</div>";
				break;
			}

			var myMarker = mapMarkerArray[nearbyMarkerIndexArray[i]]["marker"];

			content += formatInfoBubbleContent(myMarker, mapMarkerArray[nearbyMarkerIndexArray[i]]["content"]);
		}

		content += "</div>";
	}


	// Set the info bubble content
	bubbleDiv.innerHTML = content;
	dom.setStyle(bubbleDiv, "display", "block");

	// Get the position of the map
	var mapPosition = dom.getXY(mapDiv);

	// Get the position of the marker
	var latLng = marker.getLatLng();
	var markerPoint = mapObject.fromLatLngToContainerPixel(latLng);

	// Get the height and width of the info bubble
	var bubbleRegion = dom.getRegion(bubbleDiv);
	var height = bubbleRegion.bottom - bubbleRegion.top;
	var width = bubbleRegion.right - bubbleRegion.left;

	// Offset of the bubble in relation to the marker point
	var xOffset = -16;
	var yOffset = 0;

	// Calculate the position of the info bubble
	var x = Math.floor(mapPosition[0]) + markerPoint.x - width + xOffset;
	var y = Math.floor(mapPosition[1]) + markerPoint.y - height + yOffset;

	// Try to keep things inside the viewport
	if (x < 0 || x < dom.getDocumentScrollLeft()) {
		x = Math.floor(mapPosition[0]) + markerPoint.x - xOffset;
	}
	if (y < 0 || y <  dom.getDocumentScrollTop()) {
		y = Math.floor(mapPosition[1]) + markerPoint.y + yOffset;
	}

	// Position the info bubble
	dom.setXY(bubbleDiv, { 0:x, 1:y });
}

function hideInfoBubble() {
	var bubbleDiv = YAHOO.util.Dom.get("mapInfoBubble");

	// Hide the info bubble
	YAHOO.util.Dom.setStyle(bubbleDiv, 'display', 'none');
	bubbleDiv.innerHTML = "";
}

/**
 *
 */
function getMarkerBounds(mapObject, marker) {
	var latLng = marker.getLatLng();
	var point = mapObject.fromLatLngToContainerPixel(latLng);

	var icon = marker.getIcon();
	var iconAnchor = icon.iconAnchor;
	var iconSize = icon.iconSize;

	var topLeft = new GPoint(point.x - iconAnchor.x,
		point.y - iconAnchor.y);

	var bottomRight = new GPoint(point.x + (iconSize.width - iconAnchor.x),
		point.y + (iconSize.height - iconAnchor.y));

	//var bounds = new GBounds({ 0:topLeft, 1:bottomRight });
	var bounds = new GBounds(new Array(topLeft, bottomRight));

	return bounds;
}

/**
 *
 */
function formatInfoBubbleContent(marker, content) {
	var myIcon = marker.getIcon();

	var image = myIcon.image;
	image = image.replace(/border=y/,"&border=n");

	var myContent = "";
	myContent += "<div style=\"margin-top:4px;;\">";
	myContent += "<div style=\"float:left;\">";
	myContent += "<img src=\"" + image + "\"/>";
	myContent += "</div>";
	myContent += "<div style=\"margin-left:35px;\">";
	myContent += content;
	myContent += "</div>";
	myContent += "</div>";
	myContent += "<div style=\"clear:both;\"></div>";

	return myContent;
}

/**
 *
 */
function clearMapMarkers() {
	for(var i = 0; i < mapMarkerArray.length; i++) {
		map.removeOverlay(mapMarkerArray[i].marker);
	}
	mapMarkerArray = new Array();
}
