// Based on the Google demo Rectangle class.
function FitzMarker(point,name,description,group,distance)
{
	this.point = point;
	this.name = name;
	this.description = description;
	this.group = group;
	this.distance = distance;

	// the main element
	this.div = $('<div class="marker"/>')
		.append('<div class="rounded"><div><div><div><div><span class="center-outer"><span class="center-middle"><span class="center-inner"></span></span></span></div></div></div></div></div>')
		.append('<div class="stalk"/>');
		
}
FitzMarker.prototype = new GOverlay();


// REQUIRED
FitzMarker.prototype.initialize = function(map)
{
	this.map = map;

	map.getPane(G_MAP_MAP_PANE).appendChild(this.div[0]);
}



FitzMarker.prototype.drawFullMarker = function()
{
	if(this.group== 'lightblue') return this.drawDistrictMarker(); // district markers
	
	var point = this.point,
		label = Fitzrovia.group_labels[this.group],
		map = this.map,
		link = $("<a/>")
			.attr( {href:'#', rel:this.group, title:this.name} )
			.addClass('lightbox-link')
			.click( $.bind(this,this.openContent) );
		
	if(this.group=='flickr')
		link
			.html(
				$('<img class="icon" src=\'gfx/empty.png\'/>')
			)
			.attr( {title:this.name} )
	else link.html('View');
	
	// filling the div	
	this.div.find('.center-inner')
		.html(
			this.group!='flickr' ?
				this.name+'<br/>'+(label?label+'<br/>':'')+this.distance+'<br/>' : ""
		)
		.append(link);
	
	this.div.attr('class', this.group!='flickr'? 'marker' : 'charcoal-1 marker');
};


FitzMarker.prototype.drawSmallMarker = function()
{
	if(this.group== 'lightblue') return this.drawDistrictMarker(); // district markers
	
	var point = this.point,
		label = Fitzrovia.group_labels[this.group],
		map = this.map,
		link = $("<a/>")
			.attr( {title:this.name, href:'#',rel:this.group} )
			.addClass('lightbox-link')
			.click( $.bind(this,this.openContent) );
	
	if(this.group=='flickr') link.html(
		$('<img class="icon" src=\'gfx/empty.png\'/>')
	)
	else link.html('View');
	
	// .addClass('label-small')
	this.div.find('.center-inner').html(link);
	this.div.attr('class','charcoal-1 marker');
};



FitzMarker.prototype.drawDistrictMarker = function()
{
	this.div.attr('class','district marker');
	this.div.find('.center-inner').html(this.name);
}


FitzMarker.prototype.openContent = function(e)
{
	if(e) e.preventDefault();
	
	// already on target - open now
	//if ( this.point.x.isRoughly(this.map.getCenter().x) && this.point.y.isRoughly(this.map.getCenter().y) )
		//return this.openLightBox(e);

	//log('--',this.name, this.point);
	
	// open lightbox after pan finished
	this.map.panTo(this.point);
	this.openLightBox(e);
	/*var that = this, l = GEvent.addListener(that.map, 'moveend',
		function(){
			//log('--',that.name, that.point);
			that.openLightBox(e);
			GEvent.removeListener(l);
		}
	);*/
	
	return false;
}

FitzMarker.prototype.openLightBox = function(e)
{
	Lightbox
		.setTitle(this.name + '<span class="distance">'+ this.distance +'</span>' )
		.resize() // resizes to default setting
		.setContent(this.description)
		.setSkin();
	
	Fitzrovia.formatLightboxContentLinks();
	
	// reset LB height if img too big
	$("#lightbox-content").find('img').each(function(i)
	{
		$(this).load(function(e){
			if( $("#lightbox-content").height() < $(this).height() ) Lightbox.resize(null,0);
		});
	});
	
	var group = Fitzrovia.groups()[this.group];
	for(var i=0; i<group.length; i++) if( this === group[i] ) break;
	
	var prev = group[i-1], next = group[i+1];
	Lightbox.setPrev.apply(Lightbox, prev? [function(e){prev.openContent(null)}, prev.name] : [] );
	Lightbox.setNext.apply(Lightbox, next? [function(e){next.openContent(null)}, next.name] : [] );
	
	Lightbox.open();
}




// REQUIRED
FitzMarker.prototype.remove = function()
{
	this.div.remove();
	//log('removing',this.name);
}


// REQUIRED
FitzMarker.prototype.copy = function()
{
	return new FitzMarker(this.point,this.name);
}

// REQUIRED
FitzMarker.prototype.hide = function()
{
	this.div.hide();
	//log('hiding',this.name);
	return this;
}

// REQUIRED
FitzMarker.prototype.show = function(noAnim)
{
	var y = this.div.css('top');
	
	if(noAnim /*|| $.browser.msie*/) this.div.show();
	else this.div
		.hide()
		.css('top',( Number( y.replace(/px/,'') ) -10 ) + 'px') // set 10px higher
		.fadeIn( 500 )
		.animate( { top:y }, {queue:false,duration:500} );
		
	return this;
}

// REQUIRED
FitzMarker.prototype.redraw = function(force)
{
	// We only need to redraw if the coordinate system has changed
	if (!force) return;
	
	if( this.map.getZoom() >=16 ) this.drawFullMarker();
	else this.drawSmallMarker();
	
	if($.browser.msie){
		//log($.userAgent().browser);
		if($.userAgent().browser == "ie6") this.div.find('.center-inner').width(10);
		this.div.width( this.div.find('.center-inner').width()+14 ); // force width of div to content (add padding)
	}
	
	var p = this.map.fromLatLngToDivPixel(this.point);
	p.x -= Math.round(this.div.width()/2);
	p.y -= this.div.height();
	
	this.div.css({
		left: p.x+"px", top: p.y+"px",
		zIndex:GOverlay.getZIndex(this.point.y)
	});
	
}