/**
 * @author Joris Verbogt <joris@ph8.nl>
 * @version 1.0
 * The Balloon class
 */

/**
 * @constructor
 * @param GPoint marker
 * @param String text
 * @param Number padding
 */
function BalloonMarker(point, text, elementClass){
  this.point = point;
  this.text = text;
  this.elementClass = elementClass;
}

BalloonMarker.prototype = new GOverlay();

BalloonMarker.prototype.initialize = function(map){
  this.div = document.createElement("div");
  this.div.className = this.elementClass;
  var leftDiv = document.createElement("div");
  leftDiv.className = "bgleft";
  this.div.appendChild(leftDiv);
  var middleDiv = document.createElement("div");
  middleDiv.className = "bgmiddle";
  middleDiv.appendChild(document.createTextNode(this.text));
  this.div.appendChild(middleDiv);
  var rightDiv = document.createElement("div");
  rightDiv.className = "bgright";
  this.div.appendChild(rightDiv);
  map.getPane(G_MAP_FLOAT_PANE).appendChild(this.div);
  this.map = map;
}

BalloonMarker.prototype.remove = function(){
  this.div.parentNode.removeChild(this.div);
}

BalloonMarker.prototype.copy = function(){
  return new BalloonMarker(this.marker,this.text,this.elementClass);
}

BalloonMarker.prototype.redraw = function(force){
  if (!force) return;
  var markerPos = this.map.fromLatLngToDivPixel(this.point);
  /*
   * Shift marker to hotspot
   * TODO: get hotspot from caller or CSS
   */ 
  var xPos = Math.round(markerPos.x - 10);
  var yPos = markerPos.y - this.div.clientHeight;
  this.div.style.top = yPos + 'px';
  this.div.style.left = xPos + 'px';
}

BalloonMarker.prototype.show = function(){
  this.div.style.visibility = 'visible';
}

BalloonMarker.prototype.hide = function(){
  this.div.style.visibility = 'hidden';
}

/**
 * @author Joris Verbogt <joris@ph8.nl>
 * @version 1.0
 * The CustomMapControl class
 */

/**
 * @constructor
 * @param elementClass The class of the control element
 */
function CustomMapControl(elementClass){
  this.elementClass = elementClass;
}

CustomMapControl.prototype = new GControl();

CustomMapControl.prototype.initialize = function(map){
  map.savePosition();
  var container = document.createElement("div");
  container.className = this.elementClass;
  var children = [
    {elementClass: "zoomin", click: function(){map.zoomIn();}},
    {elementClass: "zoomout", click: function(){map.zoomOut();}},
    {elementClass: "panup", click: function(){map.panDirection(0,1);}},
    {elementClass: "pandown", click: function(){map.panDirection(0,-1);}},
    {elementClass: "panleft", click: function(){map.panDirection(1,0);}},
    {elementClass: "panright", click: function(){map.panDirection(-1,0);}},
    {elementClass: "return", click: function(){map.returnToSavedPosition();}}
  ];
  for (i=0;i<children.length;i++) {
    var div = document.createElement("div");
    div.className = children[i].elementClass;
    container.appendChild(div);
    GEvent.addDomListener(div, "click", children[i].click);
  }
  map.getContainer().appendChild(container);
  return container;
}

CustomMapControl.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(7, 7));
}


Object.extend(GMap2.prototype, {
  markerList: new Array(),
  markerStyle: "balloon",
	
  createMarker: function(point, title, markerStyle) {
    var marker = new BalloonMarker(point, title, markerStyle);
    return marker;
  },
	
  getMarkersXML: function(data, responseCode) {
		var xml = GXml.parse(data);
    var markers = xml.documentElement.getElementsByTagName("Placemark");
    for (var i = 0; i < markers.length; i++) {
      var name = markers[i].getElementsByTagName("name")[0].firstChild.nodeValue;
      var point = markers[i].getElementsByTagName("Point")[0];
      var coordinates = point.getElementsByTagName("coordinates")[0].firstChild.nodeValue.split(',');
      var markerPoint = new GLatLng(parseFloat(coordinates[1]), parseFloat(coordinates[0]));
      this.addOverlay(this.createMarker(markerPoint, name, this.markerStyle));
    }
	}
});