var MyOverlay = function(marker, html) {
  this.marker = marker;
  this.html = html;
}

MyOverlay.prototype = new GOverlay();
MyOverlay.prototype.initialize = function(map) {

var div = document.createElement("div");
  div.className = 'mywindow';
  div.innerHTML = this.html;

  // offsets based on popup div dimensions
  offsetX = 120;
  offsetY = 150;

  div.style.top = (map.fromLatLngToDivPixel(this.marker.getPoint()).y - offsetY) + 'px';
  div.style.left = (map.fromLatLngToDivPixel(this.marker.getPoint()).x - offsetX) + 'px';

	//document.getElementById('close').onclick = closeOverlay;

  this._map = map;
  this._div = div;

  map.getPane(G_MAP_FLOAT_PANE).appendChild(div);  
}
MyOverlay.prototype.remove = function(){
  this._div.parentNode.removeChild(this._div);
}
MyOverlay.prototype.redraw = function() {
  //haven't had need for this yet
}

function closeOverlay() {
  if (currentMarker) {
    map.removeOverlay(currentMarker.overlay);
  //  currentMarker.show();
  }
}
		
function createMarker(point, icon, html) {
	var marker = new GMarker(point, icon);
	
	GEvent.addListener(marker, "click", function() {
  if (typeof MyOverlay !== 'undefined') {
    if (currentMarker) {
      closeOverlay();
    }
    if (!this.overlay) {
    // just recording this for use in the closeOverlay function
      this.overlay = new MyOverlay(this, html);
    }
    currentMarker = this;
    map.panTo(new GLatLng(this.getPoint().lat(), this.getPoint().lng()));
    map.addOverlay(this.overlay);
   // this.hide();
  } else {
    marker.openInfoWindowHtml(html);
  }
	});
		
	return marker;
}


var map;
var currentMarker;
		var addresses = Array();
function loadWhitehall() {
	if (GBrowserIsCompatible()) {
		map = new GMap2(document.getElementById("whitehall-map"));
		var point = new GLatLng(51.50187,-0.13301);
		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());
		map.setCenter(point, 15);

		var icon = new GIcon();
		icon.shadow = "/images/logo-small-shadow.png";
		icon.iconSize = new GSize(52, 35);
		icon.shadowSize = new GSize(0, 0);
		icon.iconAnchor = new GPoint(12, 35);
		icon.infoWindowAnchor = new GPoint(12, 0);
		icon.image = "/images/whitehall-map/"+addresses[0][2];		
		var point = new GLatLng(addresses[0][0], addresses[0][1]);
		map.addOverlay(createMarker(point, icon, addresses[0][3]));
		
		var icon = new GIcon();
		icon.shadow = "/images/msmarker_shadow.png";
		icon.iconSize = new GSize(24, 35);  // sets the size of the icon
		icon.shadowSize = new GSize(0, 0);  // sets the size of the shadow
		icon.iconAnchor = new GPoint(12, 35);  // sets the bottom position of the anchor - (half the width of the iconSize, full height of iconSize)
		icon.infoWindowAnchor = new GPoint(12, 0);  // sets the offset of the information speach bubble
		for(i=1;i<addresses.length;i++) {
			icon.image = "/images/whitehall-map/"+addresses[i][2];
			var point = new GLatLng(addresses[i][0], addresses[i][1]);
			map.addOverlay(createMarker(point, icon, addresses[i][3]));
		}
		
	}
}