var $jq = jQuery.noConflict();

//Marker Manager
var MarkerManager = MarkerManager || {};
MarkerManager.markerCount = 0;
MarkerManager.GenerateMarkerID = function(){ return this.markerCount++; };
MarkerManager.MarkerMaxHeight = 0;
MarkerManager.ImageHeight = 80;

var Marker_CONST = {
	EXHIBIT:365, 
	LECTURE:364, 
	WORKSHOP:367, 
	VENUE : 448,
	BAR:3
};

/*
 Marker Object used on Image Map
*/
function MarkerObject(init_settings)
{
	this.$jqtip = null;
	this.$jqepanel = null;
	
	var self = this;
	
	
	this.info = init_settings.info;
	//icon title
	this.title = init_settings.title;
	this.content = init_settings.content;
	this.plugin = init_settings.plugin;
	
	this.icon = this.plugin + "images/default.png";
	
	//console.log(init_settings.multiple.length + ' ' + init_settings.multiple[0].type)
	
	//if (init_settings.multiple.length == 1)
	//{
		
		switch(parseInt(init_settings.multiple[0].type))
		{
			case Marker_CONST.EXHIBIT :
				this.icon = this.plugin + "images/icon_exhibit.png";
			break;
			case Marker_CONST.LECTURE :				
				this.icon = this.plugin + "images/icon_lecture.png";
			break;
			case Marker_CONST.WORKSHOP :
				this.icon = this.plugin + "images/icon_workshop.png";
			break;
			case Marker_CONST.BAR :
				this.icon = this.plugin + "images/icon_bar.png";
			break;
			case Marker_CONST.VENUE :
				this.icon = this.plugin + "images/default.png";
			break;
		}
		
	//}
	
	
	//register the new marker
	this.marker_id = MarkerManager.GenerateMarkerID();
	
	init_settings.target.append(this.Render());
	
	this.$jqthis.css("position","absolute");
	
	//set the pos
	this.Pos(init_settings.x,init_settings.y);
	
	
	
	if (init_settings.multiple.length == 1)
	{
		this.$jqthis.click(function()
				{					
					init_settings.show_id = 0;
					InfoDialog.Show(init_settings, $jq(this));			
				});
	}
	
	this.$jqthis.hover(
		function(){			
			$jq(this).css("z-index",1000);
			
			if (init_settings.multiple.length == 1)
			{	
				//single content				
				self.ShowTip(init_settings.multiple[0].title);				
			}
			else
			{				
				//multiple contents
				self.ShowEpanel(init_settings);				
			}	
			return false;
		},
		function(){
			$jq(this).css("z-index",100);
			self.HideEpanel();
			self.HideTip();
			return false;
		}		
	);
	
	
	
}

MarkerObject.prototype.ShowEpanel= function(init_settings)
{
	if (this.$jqepanel == null)
	{
		
		var content ="";
		
		var $jqself = this.$jqthis;
		
		content+="<span><ul>";
		
		for (var item in init_settings.multiple)
		{			
			content += '<li class="epanel_entry" id="ep_' + item  + '">'+init_settings.multiple[item].title +'</li>';		
		}
		
		content+="</ul></span>";
		
		this.$jqepanel = $jq('<div class="epanel">'+content+'</div>');
		
		this.$jqepanel.css("position","absolute");		
		this.$jqepanel.css("left", 25 );				
		this.$jqepanel.css("opacity", 0);
		this.$jqthis.append(this.$jqepanel);
		var width = this.$jqepanel.width();
		this.$jqepanel.css("width", 0);
		this.$jqepanel.css("top",-this.$jqepanel.height()/2);		
		$jq('#ep_'+item).addClass('lastLi');
		$jq('#ep_0').addClass('firstLi');		
		this.$jqthis.css("z-index",1000);
		
		$jq(".epanel_entry").each(function(item){
			$jq(this).click(function(){
				var idx = $jq(this).attr("id").split("_")[1];
				init_settings.show_id = idx;				
				InfoDialog.Show(init_settings,$jqself);
			});					
		});
		
		
		if (this.$jqepanel.height() > 200){			
			this.$jqepanel.css("height",210);
			
			var height = $jq('#ep_'+item).offset().top + $jq('#ep_'+item).parent().height();			
			//mouse scrolling
			this.$jqepanel.mousemove(function(e){
	          var top = (e.pageY - 110 - $jq(this).offset().top) * (height-$jq(this).height()) / $jq(this).height();
	          $jq(this).scrollTop(top + 50);          
	        });
		}
		
		this.$jqepanel.stop();
		this.$jqepanel.animate({
			opacity:1,					
			top  : -this.$jqepanel.height(),
			left  : - width /2.5 + 1,
			width : width 
		},{ queue:false, duration:500, easing:"expoEaseOut"});
	}
};

MarkerObject.prototype.HideEpanel= function()
{
	if (this.$jqepanel)
	{
		this.$jqthis.css("z-index",100);
		this.$jqepanel.remove();
		this.$jqepanel = null;
	}
};


MarkerObject.prototype.ShowTip = function(content)
{
	if (this.$jqtip != null) return; 
	
	this.$jqtip = $jq('<div class="marker_tip"><p>'+content+'</p></div>');
	this.$jqtip.css("position","absolute");
	this.$jqtip.css("cursor","pointer");
	
	
	
	this.$jqtip.css("text-align","center");	
	this.$jqtip.css("left",0);
	this.$jqtip.css("top",  50);
	this.$jqtip.css("opacity",0);
	this.$jqtip.css("z-index",100);
	this.$jqthis.append(this.$jqtip);	
	var height = this.$jqtip.height();
	this.$jqtip.css("height",0);
	var width = this.$jqtip.width(); 
	this.$jqtip.css("width",0);
	
	this.$jqtip.stop();
	this.$jqtip.animate({
		opacity:1,		
		left : - width/2.3 +1,
		top  : -10 - height,
		width : width,
		height : height
		
	},{ queue:false, duration:500, easing:"expoEaseOut"});

};

MarkerObject.prototype.HideTip = function()
{	
	if (this.$jqtip)
	{
		this.$jqtip.remove();
		this.$jqtip = null;
	}
};

MarkerObject.prototype.Pos = function(x,y)
{	
	//position correction 
	//x + 20 , etc...
	this.$jqthis.css("left",parseInt(x)+10);
	this.$jqthis.css("top",parseInt(y)+70);
	
	MarkerManager.MarkerMaxHeight = Math.max(MarkerManager.MarkerMaxHeight, parseInt(y)+90+ MarkerManager.ImageHeight  );	
};

/*
 * Render would entangle the object properties into one jquery object
 */
MarkerObject.prototype.Render = function()
{
	var jq_object = $jq("<div id=\"marker_"+ this.marker_id +"\"align=center>" +
			"<img src=\""+ this.icon +"\"/>" +		
	"</div>");		
	
	this.$jqthis = jq_object;
	
	this.$jqthis.css("cursor","pointer");
	
	return jq_object;
};