/*
 *	@author: Zsotyooo
 *	@description:
 *
 */

	(function($){
		$.fn.hoverCard=function(options)
		{
			$(this).each(
				function(elementIndex)
				{
					if(!$(this).attr("data-hovercardoptions") || $(this).attr("data-hovercard-added") ) return;
					$(this).attr("data-hovercard-added",1);
					new $hoverCard(elementIndex,this,options);
				}
			);
		}

		//konstruktor
		$.hoverCard=function(elementIndex,element,options)
		{
			var This=this;
			var data;
			this.element=element;
			this.elementindex=elementIndex;
			this.disableHide=false;

			this.options={};
			try {
				data = $.parseJSON($(this.element).attr("data-hovercardoptions"))
			} catch (exception) {
				if(console) console.log(exception);
				data = {};
			}
			$.extend(
				this.options,
				{
					hideTimeoutTime: 500,
					showTimeoutTime: 300,
					animationDuration: 100,
					template: 'hoverCardEmptyTemplate',
					data: {content: ''},
					leftOffset: 0,
					topOffset: 0
				},
				options || {},
				data
			);

			$(this.element).bind( {
					'mouseover': function(){
						This.showData();
					},
					'mouseout': function(){
						This.disableHide=false;
						if(This.showTimer) clearTimeout(This.showTimer);
						This.hideTimer=setTimeout(
							function()
							{
								This.hideData();
							},
							This.options.hideTimeoutTime
						);
					}
				}
			);
			this.card=null;
		}

		//shortcutok
		$hoverCard=$.hoverCard;
		$hoverCard.fn=$hoverCard.prototype={};
		//egyszerűség kedvéért a jQuery extend fgv-ét használjuk a statikus és példány szintű elemeknél is
		$hoverCard.fn.extend = $hoverCard.extend = $.extend;

		//statikus változók, függvények:
		$hoverCard.extend(
		{
		});

		//Instance függvényei
		$hoverCard.fn.extend({
			createCard: function()
			{
				if(!this.card){
					var This=this;
					This.card=$("#"+This.options.template).tmpl(This.options.data).css({
						left: -10000,
						top: -10000
					})
					$('body').append(This.card);
					This.card.bind( {
							'mouseover': function(){
								This.disableHide=true;
								This.card.stop(true, true).show();
								clearTimeout(This.hideTimer);
							},
							'mouseout': function(){
								This.disableHide=false;
								This.hideTimer=setTimeout(
									function(){
										This.hideData();
									},
									This.options.hideTimeoutTime
								);
							}
						}
					);

				}

			},
			showData: function()
			{
				var This=this;
				if(This.showTimer) clearTimeout(This.showTimer);
				if(This.hideTimer) clearTimeout(This.hideTimer);
				This.showTimer=setTimeout(function(){
					This.createCard();
					if(!$.browser.msie){
						This.card.stop(true,true)
						.css({
							left: $(This.element).offset().left+This.options.leftOffset,
							top: $(This.element).offset().top-$(This.card).height()+This.options.topOffset
						})
						.fadeIn(This.options.animationDuration)
					}
					else{
						This.card.css({
							left: $(This.element).offset().left+This.options.leftOffset,
							top: $(This.element).offset().top-$(This.card).height()+This.options.topOffset
						}).show();
					}

					if(This.hideTimer)clearTimeout(This.hideTimer);
				},This.options.showTimeoutTime);
			},
			hideData: function()
			{
				var This=this;
				if(This.showTimer) clearTimeout(This.showTimer);
				if(This.hideTimer) clearTimeout(This.hideTimer);
				if(!this.disableHide && this.card!=undefined){
					this.card.hide();
					this.card.remove();
					this.card=null;
				}
			}
		});

		$(document).ready(
			function(){
				$(".username").hoverCard({
					leftOffset: -35,
					topOffset: -20
				});
			}
		);

	})(jQuery)