google.load("maps", "2.x");

var gMap;
var bizMarker;
var myMarker;
var bizList;

var bubble;
var stem;

var isBubbleOpen = false;
var objDiv;

function showBizList()
{
  if (! bizList)
    return;

  gMap.clearOverlays();
  gMap.setCenter(myMarker.getLatLng()); // needs a center to do overlays

  if (bizMarker != null)
    gMap.removeOverlay(bizMarker);

    var bounds = new GLatLngBounds;
    for (var i=0; i < bizList.length; i++)
    {
        gMap.addOverlay(bizList[i]);
        bounds.extend(bizList[i].getPoint());
    }
    bounds.extend(myMarker.getPoint());
    gMap.setZoom(gMap.getBoundsZoomLevel(bounds));
    gMap.setCenter(bounds.getCenter());

    gMap.addOverlay(myMarker);
}

function setMe(lat, lng)
{
        // Create our own location's icon
        var myIcon = new GIcon(G_DEFAULT_ICON);
        myIcon.image = "http://outalot.com/images/teardrop-blue.png";
        myIcon.shadow = "http://outalot.com/images/teardrop-shadow.png";
        myIcon.shadowSize = new GSize(32,31);
        myIcon.iconSize = new GSize(20,31);
        myIcon.iconAnchor = new GPoint(10,31);
            
        // Set up our GMarkerOptions object
        markerOptions = { icon:myIcon,
            title:"You",
            draggable: true,
            dragCrossMove: false,
            autoPan: true
        };
        var myPoint = new google.maps.LatLng(lat, lng);
        myMarker = new GMarker(myPoint, markerOptions);

	GEvent.addListener(myMarker, "dragstart", HideBubble);

        GEvent.addListener(myMarker, "click", function() {
                  ShowBubble(myMarker, 
'<a class="closebutton" href="#" onclick="HideBubble();" title="Close">[x]</a>' + 
                  "Your location<br/><i>(drag this pin to move)</i>", 
                  false);
              });
}

function setBiz(name, lat, lng)
{
        gMap.clearOverlays();
        // Create our "tiny" marker icon
        var bizIcon = new GIcon(G_DEFAULT_ICON);
        bizIcon.image = "http://outalot.com/images/teardrop-red.png";
        bizIcon.shadow = "http://outalot.com/images/teardrop-shadow.png";
        bizIcon.shadowSize = new GSize(32,31);
        bizIcon.iconSize = new GSize(20,31);
        bizIcon.iconAnchor = new GPoint(10,31);
            
        bizpoint = new google.maps.LatLng(lat, lng);
        
        markerOptions = { icon:bizIcon, title: name };

        bizMarker = new GMarker(bizpoint, markerOptions);
        GEvent.addListener(bizMarker, "click", function() {
            bizMarker.openInfoWindowHtml(name);
              });

        gMap.addOverlay(bizMarker);
        gMap.addOverlay(myMarker);
}

function setBizAndPosition(biz, lat, lng)
{
  gMap.setCenter(new google.maps.LatLng(lat, lng)); // needs a center to do overlays

  setBiz(biz, lat, lng)
  var bounds = new GLatLngBounds;
  bounds.extend(bizMarker.getPoint());
  bounds.extend(myMarker.getPoint());
  gMap.setZoom(gMap.getBoundsZoomLevel(bounds));
  gMap.setCenter(bounds.getCenter());

}

//***** Bubble Code *****//

		function HideBubble() {
			isBubbleOpen = false;
			curBubble = null;
      if (bubble) {
			  with (bubble) {
			  	style.visibility = "hidden";
			  	style.width = "";
			  	style.height = "";
			  }
			}
      if (stem)
        stem.style.visibility = "hidden";
		}		
		
		function ShowBubble(marker, bubbleHtml, dragging) {		
			var markerPt = marker.getPoint();

			if (! dragging) {
		    bubble = document.getElementById("bubble");
		    stem = document.getElementById("stem");
				bubble.innerHTML = bubbleHtml;
			}

			var pixel = gMap.fromLatLngToDivPixel(markerPt);
			// map world relative to map container
			var dragObject = gMap.getPane(G_MAP_MAP_PANE).parentNode;
			var x = pixel.x + parseInt(dragObject.style.left);
			var y = pixel.y + parseInt(dragObject.style.top);
			
			// map container relative to the page
			x += gMap.getContainer().offsetLeft;
			y += gMap.getContainer().offsetTop;

			var vx = marker.getIcon().iconAnchor.x - marker.getIcon().infoWindowAnchor.x;
			var vy = marker.getIcon().iconAnchor.y - marker.getIcon().infoWindowAnchor.y;
			var offset = new GPoint(vx,vy)

			y -= offset.y;
			x -= offset.x;

			x = parseInt(x);
			y = parseInt(y);

			var h = bubble.offsetHeight;
			var w = bubble.offsetWidth;

			bubble.style.left = (x-250) + "px";
			bubble.style.top = ((y - h) - 23) + "px";

			stem.style.left = (x-24) + "px";
			stem.style.top = (y - 24) + "px";

			if (! dragging) {
				bubble.style.visibility = "visible";
				stem.style.visibility = "visible";
				isBubbleOpen = true;
				curBubble = marker;
			} else {
			
				if ((y < objDiv.offsetTop) || (x < objDiv.offsetLeft) || (y > (objDiv.offsetTop + objDiv.offsetHeight)) || 
				(x > (objDiv.offsetLeft + objDiv.offsetWidth))) {
					bubble.style.visibility = "hidden";
					stem.style.visibility = "hidden";
					
				} else {
					bubble.style.visibility = "visible";
					stem.style.visibility = "visible";
				}
			}
		}


		function MoveBubble() {
			if (isBubbleOpen) {
				ShowBubble(curBubble,"", true);
			}
		}
		
//***** End Bubble Code *****//



// Call this function when the page has been loaded
function initialize() {
        if (gMap) // already initialized!
          return;

        gMap = new google.maps.Map2(document.getElementById("map"));
        gMap.addControl(new GSmallZoomControl());

			  GEvent.addListener(gMap, "move", function() { MoveBubble(); });				
        objDiv = document.getElementById("map");
}