var iCurrentMarkerIndex = 0;

function InfoBox(pMarker, pWidth, pHeight, pAnchorOffsetX, pAnchorOffsetY, pMarkerIndex) 
{
	this.marker = pMarker;
	this.divHeight = pHeight;
	this.divWidth = pWidth;
	iCurrentMarkerIndex = pMarkerIndex

	this.anchorOffsetX = (pAnchorOffsetX == null) ? 0 : pAnchorOffsetX;
	this.anchorOffsetY = (pAnchorOffsetY == null) ? 0 : pAnchorOffsetY;	
}

InfoBox.prototype = new GOverlay();

InfoBox.prototype.initialize = function(map) 
{
  var oDiv = document.createElement("div");
  oDiv.style.height = this.divHeight + 'px';
  oDiv.style.width = this.divWidth + 'px';
  oDiv.style.position = "absolute";
  //oDiv.innerHTML = "<div style=\"height: 130px; width: 400px;\"><div style=\"height: 80px; width: 380px; background-image: url(images/background_infobox.gif);color:#ffffff;padding: 10px 10px 10px 10px;\"><a href=\"#\" onclick=\"return closeOverlay();\" title=\"close\"><img style=\"float: right;\" src=\"images/icon_close.gif\" alt=\"close\"/></a>LatLong = " + this.marker.getLatLng() + "</div><div style=\"height: 50px; width: 400px; background-image: url(images/pointer.png);\"></div></div>";
  var sThumbSrc = "";
  var sImageHTML = "";
  if (arrProjects[iCurrentMarkerIndex][8] != '')
  {
  	sThumbSrc = arrProjects[iCurrentMarkerIndex][8].replace('01','tb');
  	
  	sImageHTML = "<img style=\"float: left; border: 1px white solid; margin: 0 10px 0 0;\" src=\"images/projects/" + sThumbSrc + "\" alt=\"" + arrProjects[iCurrentMarkerIndex][2] + "\"/>";
  }
  
  oDiv.innerHTML = "<div style=\"height: 130px; width: 400px;\"><div style=\"height: 80px; width: 380px; font-size: 0.8em; background-image: url(images/background_infobox.gif);color:#ffffff;padding: 10px 10px 10px 10px;\"><a href=\"#\" onclick=\"return closeOverlay();\" title=\"close\"><img style=\"float: right;\" src=\"images/icon_close.gif\" alt=\"close\"/>" + sImageHTML + "</a><p style=\"margin: 0 0 5px 0; color: #ffffff;\"><b>" + arrProjects[iCurrentMarkerIndex][2] + ",</b><br/><b>" + arrProjects[iCurrentMarkerIndex][3] + "</b></p>Client: " + arrProjects[iCurrentMarkerIndex][4] + "<br/>Contract Value: " + arrProjects[iCurrentMarkerIndex][5] + "<br/> " + arrProjects[iCurrentMarkerIndex][6].substring(0,40) + "...</div><div style=\"height: 50px; width: 400px; background-image: url(images/pointer.png);\"></div></div>";

  oDiv.style.left = (map.fromLatLngToDivPixel(this.marker.getPoint()).x - this.anchorOffsetX)+ 'px';
  oDiv.style.top = (map.fromLatLngToDivPixel(this.marker.getPoint()).y - this.divHeight - this.anchorOffsetY) + 'px';

  map.getPane(G_MAP_FLOAT_PANE).appendChild(oDiv);
  this.map_ = map;
  this.div_ = oDiv;
  //this.marker.hide(); 
}

InfoBox.prototype.remove = function() 
{
  this.div_.parentNode.removeChild(this.div_);
}

InfoBox.prototype.redraw = function(force) 
{
  this.div_.style.left = (this.map_.fromLatLngToDivPixel(this.marker.getPoint()).x - this.anchorOffsetX)+ 'px';
  this.div_.style.top = (this.map_.fromLatLngToDivPixel(this.marker.getPoint()).y - this.divHeight - this.anchorOffsetY) + 'px';
}