var floatingcontainerClass = {
	tplURL: "global/components/floatingcontainer/floatingcontainer.html",
    tplReference : '.floatingcontainer',
    datasource : 'floatingcontainer_html',
	
	/* POSITION: le posizioni sono Maiuscole
	 * 
	 *       TL   T   TR
	 *       v____v____v
	 *  LT >|           |< RT
	 *      |           |
	 *  L  >|  target   |< R
	 *      |           |
	 *  LB >|___________|< RB
	 *       ^    ^    ^
	 *       BR   B   BR
	 */	
    options: {
    	position: "RB",
		dimentionw: 'auto', //-> fix/auto
		dimentionh: 'auto', //-> fix/auto
		width: '144',       // solo nel caso di fix
		height: '72',        // solo nel caso di fix
		interactive: true,     // true/false
		hide:true,
		color: 'black',
		bg:	'light'
    },

	init: function(target,content,_options){
		this.options = $.extend(this.options,_options);
		
		// Aggiungi i contenuti nella tpl
		//$(floatingcontainerClass.tplReference).append('<div class="target" id='+target+'>avatar</div>');
		$(floatingcontainerClass.tplReference + " #contentmessage").html(content);

		// Dimentions
		floatingcontainerClass.dimension(this.options);
		
		// posiziona il floatcontainer
		floatingcontainerClass._position(target,this.options.position,this.options.bg);
		
		// mouse hover al target
		floatingcontainerClass._hover(target,this.options.interactive,this.options.hide);
		$(floatingcontainerClass.tplReference+ " #floatposition").addClass("bg-"+this.options.bg);
		$(floatingcontainerClass.tplReference+ " #floatposition").css('color',this.options.color);
		
	
	},
	dimension:function(options){
		
		// Dimentions Width
		if(options.dimentionw!='auto'){
			$(floatingcontainerClass.tplReference+ " #floatposition").css('width',options.width+'px');
		}else{
			var w = $(floatingcontainerClass.tplReference+ " #contentmessage");	
			w = (w[0].clientWidth);// larghezza massima del contenuto	

			$(floatingcontainerClass.tplReference+ " #floatposition").css('width', w+'px');
		}
		
		// Dimentions Height
		if(options.dimentionh!='auto'){
			$(floatingcontainerClass.tplReference+ " #floatposition").css('height',options.height+'px');
		}else{
			var h = $(floatingcontainerClass.tplReference+ " #contentmessage");
			h = (h[0].clientHeight);		
			$(floatingcontainerClass.tplReference+ " #floatposition").css('height', h+'px');
		}

	},
	_hover: function(target,interactive,hide){
		if(hide!=false){
			$(floatingcontainerClass.tplReference + " #floatposition").css('display','none');
			$(floatingcontainerClass.tplReference + " #arrow").css('display','none');
		}

		if(interactive!=true){
			target.hover(
				function(){
					$(floatingcontainerClass.tplReference + " #floatposition").css('display','block');
					$(floatingcontainerClass.tplReference + " #arrow").css('display','block');				
				},function(){
					$(floatingcontainerClass.tplReference + " #floatposition").css('display','none');
					$(floatingcontainerClass.tplReference + " #arrow").css('display','none');
				});
		}else{
			target.hover(function(){
				$(floatingcontainerClass.tplReference + " #floatposition").css('display','block');
				$(floatingcontainerClass.tplReference + " #arrow").css('display','block');	
			});

			$(floatingcontainerClass.tplReference+ " #floatposition").hover(function(){
				$(floatingcontainerClass.tplReference + " #floatposition").css('display','block');
				$(floatingcontainerClass.tplReference + " #arrow").css('display','block');
			},function(){
				$(floatingcontainerClass.tplReference + " #floatposition").css('display','none');
				$(floatingcontainerClass.tplReference + " #arrow").css('display','none');
			});
		}
	},
	_position: function(target,position,bg){

		switch(position){
		   case "TL":
			   $(floatingcontainerClass.tplReference+" #floatposition").position({
				   of: target,
				   my: "left bottom",
				   at: "left top",
				   offset: "0 -11",
				   collision: "fit none"
				 });
			   $(floatingcontainerClass.tplReference+" #arrow").position({
				   of: target,
				   my: "left bottom",
				   at: "center top",
				   offset: "0 0",
				   collision: "fit none"
				 }).css({
					 'background-image': 'url("/global/img/icons/'+bg+'/freccia_giu.png")',
					 'background-position': '0 -3'});
			   break;
			   
		   case "T":
			   $(floatingcontainerClass.tplReference+" #floatposition").position({
				   of: target,
				   my: "center bottom",
				   at: "center top",
				   offset: "0 -11",
				   collision: "fit none"
				 });
			   $(floatingcontainerClass.tplReference+" #arrow").position({
				   of: target,
				   my: "center bottom",
				   at: "center top",
				   offset: "0 0",
				   collision: "fit"
				 }).css({
					 'background-image': 'url("/global/img/icons/'+bg+'/freccia_giu.png")',
					 'background-position': '0 -3'});
			   break;
			   
		   case "TR":
			   $(floatingcontainerClass.tplReference+" #floatposition").position({
				   of: target,
				   my: "right bottom",
				   at: "right top",
				   offset: "0 -11",
				   collision: "fit none"
				 });
			   $(floatingcontainerClass.tplReference+" #arrow").position({
				   of: target,
				   my: "right bottom",
				   at: "center top",
				   offset: "0 0",
				   collision: "flip flip"
				 }).css({
					 'background-image': 'url("/global/img/icons/'+bg+'/freccia_giu.png")',
					 'background-position': '0 -3'});
			   break;
			   
		   case "RT":
			   $(floatingcontainerClass.tplReference+" #floatposition").position({
				   of: target,
				   my: "left top",
				   at: "right top",
				   offset: "11 0",
				   collision: "fit none"
				 });
			   
			   $(floatingcontainerClass.tplReference+" #arrow").position({
				   of: target,
				   my: "left top",
				   at: "right center",
				   offset: "0 0",
				   collision: "flip flip"
				 }).css({
					 'background-image': 'url("/global/img/icons/'+bg+'/freccia_sinistra.png")',
					 'background-position': '3 0'});
			   break;
			   
		   case "R":
			   $(floatingcontainerClass.tplReference+" #floatposition").position({
				   of: target,
				   my: "left center",
				   at: "right center",
				   offset: "11 0",
				   collision: "fit none"
				 });
			   $(floatingcontainerClass.tplReference+" #arrow").position({
				   of: target,
				   my: "left center",
				   at: "right center",
				   offset: "0 0",
				   collision: "flip flip"
				 }).css({
					 'background-image': 'url("/global/img/icons/'+bg+'/freccia_sinistra.png")',
					 'background-position': '3 0',
					 'height':'11px',
					 'width':'11px'});
			   break;
			   
		   case "RB":
			   $(floatingcontainerClass.tplReference+" #floatposition").position({
				   of: target,
				   my: "left bottom",
				   at: "right bottom",
				   offset: "11 0",
				   collision: "flip flip"
				 });
			   $(floatingcontainerClass.tplReference+" #arrow").position({
				   of: target,
				   my: "left bottom",
				   at: "right center",
				   offset: "0 0",
				   collision: "flip flip"
				 }).css({
					 'background-image': 'url("/global/img/icons/'+bg+'/freccia_sinistra.png")',
					 'background-position': '3 0'});
			   break;
			   
		   case "BR":
			   $(floatingcontainerClass.tplReference+" #floatposition").position({
				   of: target,
				   my: "right top",
				   at: "right bottom",
				   offset: "0 11",
				   collision: "fit none"
				 });
			   $(floatingcontainerClass.tplReference+" #arrow").position({
				   of: target,
				   my: "right top",
				   at: "center bottom",
				   offset: "0 0",
				   collision: "flip flip"
				 }).css({
					 'background-image': 'url("/global/img/icons/'+bg+'/freccia_su.png")',
					 'background-position': '0 3'});
			   break;
			   
		   case "B":
			   $(floatingcontainerClass.tplReference+" #floatposition").position({
				   of: target,
				   my: "center top",
				   at: "center bottom",
				   offset: "0 11",
				   collision: "fit none"
				 });
			   $(floatingcontainerClass.tplReference+" #arrow").position({
				   of: target,
				   my: "center top",
				   at: "center bottom",
				   offset: "0 0",
				   collision: "flip flip"
				 }).css({
					 'background-image': 'url("/global/img/icons/'+bg+'/freccia_su.png")',
					 'background-position': '0 3'});
			   break;
			   
		   case "BL":
			   $(floatingcontainerClass.tplReference+" #floatposition").position({
				   my: "left top",
				   at: "left bottom",
				   of: target,
				   offset: "0 11",
				   collision: "fit none"
				 });
			   $(floatingcontainerClass.tplReference+" #arrow").position({
				   of: target,
				   my: "left top",
				   at: "center bottom",
				   offset: "0 0",
				   collision: "flip flip"
				 }).css({
					 'background-image': 'url("/global/img/icons/'+bg+'/freccia_su.png")',
					 'background-position': '0 3'});
			   break;
			   
		   case "LB":
			   $(floatingcontainerClass.tplReference+" #floatposition").position({
				   my: "right bottom",
				   at: "left bottom",
				   of: target,
				   offset: "-11 0",
				   collision: "fit none"
				 });
			   $(floatingcontainerClass.tplReference+" #arrow").position({
				   of: target,
				   my: "right bottom",
				   at: "left center",
				   offset: "0 0",
				   collision: "flip flip"
				 }).css({
					 'background-image': 'url("/global/img/icons/'+bg+'/freccia_destra.png")',
					 'background-position': '-3 0'});

			   break;
			   
		   case "L":
			   $(floatingcontainerClass.tplReference+" #floatposition").position({
				   my: "right center",
				   at: "left center",
				   of: target,
				   offset: "-11 0",
				   collision: "fit none"
				 });
			   $(floatingcontainerClass.tplReference+" #arrow").position({
				   of: target,
				   my: "right center",
				   at: "left center",
				   offset: "0 0",
				   collision: "flip flip"
				 }).css({
					 'background-image': 'url("/global/img/icons/'+bg+'/freccia_destra.png")',
					 'background-position': '-3 0'});
			   break;
			   
		   case "LT":
			   $(floatingcontainerClass.tplReference+" #floatposition").position({
				   my: "right top",
				   at: "left top",
				   of: target,
				   offset: "-11 0",
				   collision: "fit none"
				 });
			   $(floatingcontainerClass.tplReference+" #arrow").position({
				   of: target,
				   my: "right top",
				   at: "left center",
				   offset: "0 0",
				   collision: "flip flip"
				 }).css({
					 'background-image': 'url("/global/img/icons/'+bg+'/freccia_destra.png")',
					 'background-position': '-3 0',
					 'height':'11px',
					 'width':'11px'});
			   break;
		}
	}
	
};