var kLeftAlign	= 0;
var kRightAlign	= 1;
var kTopAlign	= 0;
var kBottomAlign= 2;
var kAnchorAlign= 4;
	function MarkerLegende ( x, y, map, icon, html ) {
		var align = kLeftAlign | kTopAlign | kAnchorAlign;
		this.marker   = new Rectangle(align, false, x -16, y-16,  32, 32, "marker");
		this.label = [	new Rectangle(align, false, x -75, y-35, 150, 25, "markerTopLabel"),
						new Rectangle(align, false, x +17, y-20, 150, 20, "markerRightLabel"),
						new Rectangle(align, false, x -75, y+20, 150, 20, "markerBottomLabel"),
						new Rectangle(align, false, x +17, y +0, 150, 20, "markerRightLabel"),
						new Rectangle(align, false, x-167, y-13, 150, 20, "markerLeftLabel")
					];
		this.marker.insertInto(map);
		this.marker.setHTML ( icon );
		for ( var i = 0; i < this.label.length; ++i ) {
			this.label[i].insertInto(map);
			this.label[i].setHTML ( html[i] );
		}
	}

	function MarkerPack ( loc, icon, map ) {
		var align = kLeftAlign | kTopAlign | kAnchorAlign;
		this.marker   = new GMarker(loc,icon);
		this.label = [	new Rectangle(align, loc, -75, -29, 150, 25, "markerTopLabel"),
						new Rectangle(align, loc,  17, -20, 150, 20, "markerRightLabel"),
						new Rectangle(align, loc, -75,  10, 150, 20, "markerBottomLabel"),
						new Rectangle(align, loc,  17,   0, 150, 20, "markerRightLabel"),
						new Rectangle(align, loc,-167, -13, 150, 20, "markerLeftLabel")
					];
		map.addOverlay(this.marker);
		for ( var i = 0; i < this.label.length; ++i )
			this.label[i].insertInto(map);

		this.addClickHandler = function ( handler ) {
			GEvent.addListener( this.marker, "click", handler ); 
			
		}
		this.setHTML = function ( selector, html ) {
			if ( html )
				this.label[selector].setHTML ( html );
		}
		this.setLabels = function ( html ) {
			for ( var i = 0; i < this.label.length; ++i )
				this.label[i].setHTML ( html[i] );
		}
		this.moveTo = function ( location ) {
			this.marker.setPoint ( location );
			for ( var i = 0; i < this.label.length; ++i )
				this.label[i].setLocation ( location );
		}
		this.destruct = function () {
			map.removeOverlay(this.marker);
			for ( var i = 0; i < this.label.length; ++i )
				this.label[i].removeFrom ( map );
		}
	}
	// A Rectangle 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.
	function Rectangle( align, anchor, x, y, w, h, _class ) {
		this.align		= align;
		this.anchor_	= anchor;
		this.offset_	= new GPoint(x, y);
		this.size_		= new GPoint(w, h);
		this.class_		= _class;
	}
	Rectangle.prototype = new GOverlay();

	// Creates the DIV representing this rectangle.
	Rectangle.prototype.initialize = function(map) {
		// Create the DIV representing our rectangle
		var div = document.createElement("div");
		div.style.position = "absolute";
		div.className = this.class_;

		if ( this.align & kAnchorAlign /*this.anchor_*/ )
			map.getPane(G_MAP_MARKER_PANE).appendChild(div);
		else
			map.getContainer().appendChild(div);
		this.map_ = map;
		this.div_ = div;
	}

	// move the main DIV to location
	Rectangle.prototype.setLocation = function(location) {
		this.anchor_ = location;
		this.redraw(true);
	}

	// set the html for the main DIV 
	Rectangle.prototype.setHTML = function(html) {
		var span = "<span class=\"" + this.class_ + "\">";
		this.div_.innerHTML = span + span + html + "</span>" + "</span>";
	}

	// Remove the main DIV from the map pane
	Rectangle.prototype.remove = function() {
		this.div_.parentNode.removeChild(this.div_);
	}

	// Insert the main DIV 
	Rectangle.prototype.insertInto = function(map) {
		map.addOverlay(this);
	}

	// Insert the main DIV 
	Rectangle.prototype.removeFrom = function(map) {
		map.removeOverlay(this);
	}

	// Copy our data to a new Rectangle
	Rectangle.prototype.copy = function() {
		return new Rectangle(this.align, this.anchor_, this.offset_, this.size_, this.class_);
	}

	// Redraw the rectangle based on the current projection and zoom level
	Rectangle.prototype.redraw = function(force) {
		// We only need to redraw if the coordinate system has changed
		if (!force) return;

		var pos = this.align & kAnchorAlign
						? this.map_.fromLatLngToDivPixel(this.anchor_) 
						: new GPoint(0,0);

		this.div_.style.width	= this.size_.x + "px";
		this.div_.style.height	= this.size_.y + "px";

		if ( this.align & kRightAlign )
			this.div_.style.right	= String(this.offset_.x + pos.x) + "px";
		else
			this.div_.style.left	= String(this.offset_.x + pos.x) + "px";

		if ( this.align & kBottomAlign )
			this.div_.style.bottom	= String(this.offset_.y + pos.y) + "px";
		else
			this.div_.style.top		= String(this.offset_.y + pos.y) + "px";
	}
