/* A Bar is a simple overlay that outlines a lat/lng bounds on the
 * map. It has a border of the given weight and color and can optionally
 * have a semi-transparent background color.
 * @param latlng {GLatLng} Point to place bar at.
 * @param opts {Object Literal} Passes configuration options - 
 *   weight, color, height, width, text, and offset.
 */
function LabeledMarkerLight(latlng, opts, labelText, labelX, labelY, label, zbias, color) {
  this.latlng = latlng;
  this.zbias = zbias;
	
  if (!opts) opts = {};

  this.height_ = opts.iconSize.height || 32;
  this.width_ = opts.iconSize.width || 32;
  this.anchor_x_ = opts.iconAnchor.x;
  this.anchor_y_ = opts.iconAnchor.y;
  this.color_ = color;
  this.image_ = opts.image;
  this.imageOver_ = opts.imageOver;
  this.labelText_ = labelText;
  this.labelX_ = labelX;
  this.labelY_ = labelY;
  this.label_ = label || '';
  this.clicked_ = 0;
  this.mouseMoved_ = false;
  this.mouseDownTime_ = 0;
  this.clickListener_ = 0;
  this.mouseDownListener_ = 0;
  this.mouseOverListener_ = 0;
  this.mouseOutListener_ = 0;
  this.mouseMoveListener_ = 0;
}

/* LabeledMarkerLight extends GOverlay class from the Google Maps API
 */
LabeledMarkerLight.prototype = new GOverlay();

/* Creates the DIV representing this LabeledMarkerLight.
 * @param map {GMap2} Map that bar overlay is added to.
 */
LabeledMarkerLight.prototype.initialize = function(map) {
  var me = this;

  // Create the DIV representing our LabeledMarkerLight
  var div = document.createElement("div");
  div.style.position = "absolute";
  div.style.paddingLeft = "0px";
  div.style.cursor = 'pointer';
  div.style.zIndex = /*GOverlay.getZIndex(this.latlng.lat()) +*/ me.zbias;

  var img = document.createElement("img");
  img.src = me.image_;
  img.style.width = me.width_ + "px";
  img.style.height = me.height_ + "px";
  div.appendChild(img);

  var text = document.createElement("div");
  text.style.fontFamily = "arial";
  text.style.fontWeight = "bold";
  text.style.position = "absolute";
  text.style.top = this.labelY_;//"8px";
  text.style.left = this.labelX_;//"-3px";

  text.style.width = me.width_ + "px";
  text.style.height = "0px";
  text.style.textAlign = "center";
  text.style.fontSize = "12px";
  text.style.color = this.color_;
  text.innerHTML = this.labelText_;
  div.appendChild(text);
  this.text_ = text;

  this.clickListener_ = GEvent.addDomListener(div, "click", function(event) {
	if (!me.mouseMoved_ || (new Date().getTime() < me.mouseDownTime_ + 150))
	{
		me.clicked_ = 1;
	    GEvent.trigger(me, "click");
	}
  });

  if (this.label_ != '')
  {
	  this.mouseOverListener_ = GEvent.addDomListener(div, "mouseover", function(event) {
		GEvent.trigger(map, "hover", me.latlng, me.label_);
	  });
	  
	  this.mouseOutListener_ = GEvent.addDomListener(div, "mouseout", function(event) {
		GEvent.trigger(map, "hover-off");
	  });
  }
  
  this.mouseDownListener_ = GEvent.addDomListener(div, "mousedown", function(event) {
	me.mouseMoved_ = false;
	me.mouseDownTime_ = new Date().getTime();
  });

  this.mouseMoveListener_ = GEvent.addDomListener(div, "mousemove", function(event) {
	me.mouseMoved_ = true;
  });

  map.getPane(G_MAP_MARKER_PANE).appendChild(div);

  this.map_ = map;
  this.div_ = div;
};

LabeledMarkerLight.prototype.setLabelText = function(label) {
	this.text_.innerHTML = label;
	this.labelText_ = label;
};

/* Remove the main DIV from the map pane
 */
LabeledMarkerLight.prototype.remove = function() {
  this.div_.parentNode.removeChild(this.div_);
  GEvent.removeListener(this.clickListener_);
  GEvent.removeListener(this.mouseDownListener_);
  GEvent.removeListener(this.mouseMoveListener_);
  if (this.mouseOverListener_ != 0)
  {
	GEvent.removeListener(this.mouseOverListener_);
  }
  if (this.mouseOutListener_ != 0)
  {
	GEvent.removeListener(this.mouseOutListener_);
  }
};

/* Copy our data to a new LabeledMarkerLight
 * @return {LabeledMarkerLight} Copy of bar
 */
LabeledMarkerLight.prototype.copy = function() {
  var opts = {};
//  opts.color = this.color_;
  opts.height = this.height_;
  opts.width = this.width_;
  opts.iconAnchor.x = this.anchor_x_;
  opts.iconAnchor.y = this.anchor_y_;
  opts.labelText = this.labelText;

  opts.image = this.image_;
  opts.imageOver = this.image_;
  return new LabeledMarkerLight(this.latlng, opts);
};

/* Redraw the LabeledMarkerLight based on the current projection and zoom level
 * @param force {boolean} Helps decide whether to redraw overlay
 */
LabeledMarkerLight.prototype.redraw = function(force) {

  // We only need to redraw if the coordinate system has changed
//  if (!force) return;

  // Calculate the DIV coordinates of two opposite corners 
  // of our bounds to get the size and position of our LabeledMarkerLight
  var divPixel = this.map_.fromLatLngToDivPixel(this.latlng);
  // Now position our DIV based on the DIV coordinates of our bounds
  this.div_.style.width = this.width_ + "px";
  this.div_.style.left = (divPixel.x) - this.anchor_x_ + "px"
  this.div_.style.height = (this.height_) + "px";
  this.div_.style.top = (divPixel.y) + this.anchor_y_ - this.height_ + "px";
};

LabeledMarkerLight.prototype.getPoint = function() {
  return this.latlng;
};

LabeledMarkerLight.prototype.setPoint = function(latlng_) {
  this.latlng = latlng_;
  this.redraw();
}

LabeledMarkerLight.prototype.setStyle = function(style) {
  for (s in style) {
    this.div_.style[s] = style[s];
  }
};

LabeledMarkerLight.prototype.setImage = function(image) {
  this.div_.style.background = 'url("' + image + '")';
}