var ab;

$(document).ready(function(){ab = new ActifBox()});

function ActifBox()
{
		this.src = '';
		this.desc = '';
		var bg = document.createElement('div');
		var cont = document.createElement('div');
		var box = document.createElement('div');		
		var controls = document.createElement('div');
		var footer = document.createElement('div');	
		var info = document.createElement('div');
		var infostatus = document.createElement('p');
		var infodesc = document.createElement('p');
		var loading = document.createElement('div');
		var img = null;
		this.imggroup = new Array;
		this.groupcount = 0;
		this.curid = 0;
		this.animation = 0;
		
		this.minsize = 350;
		this.nextprev = '<a href="" class="prev" onclick="ab.Prev(); return false;"><img src="templates/images/g_previous.png" alt="" /></a><span class="separator"><img src="templates/images/g_sep.png" alt="" /></span><a href="" onclick="ab.Next(); return false;" class="next"><img src="templates/images/g_next.png" alt="" /></a>';
		this.ctrlclose = '<a href="" class="close" onclick="ab.Hide(); return false;"></a>';
		
		$(cont).append(box);
		$(box).append(controls);
	
		$(box).append(loading);		
		
		$(box).attr("id","actifbox");
		$(bg).attr("id","actifbox-bg");

		$(img).attr("alt","");	
		
		$(bg).css({position: "absolute", top: "0px", left: "0px", opacity: "0.0"});
		$(cont).css({position: "absolute", top: "0px", left: "0px", width: "100%"});
		$(box).css({position: "relative", width: "300px", height: "300px", opacity: "0.0", overflow: "hidden"});

		$(loading).css({position: "absolute", opacity: "0.0"});

		$(controls).addClass('controls');
		$(footer).addClass('footer');
		$(loading).addClass('loading');
		$(info).addClass('info');
		$(infostatus).addClass('status');
		$(infodesc).addClass('desc');
		
		this.Show = function(id)
		{
			var off = $(document).scrollTop();
			$(cont).css("top",off);
			$(document.body).append(bg);			
			$(document.body).append(cont);	
			SetBgDim();
			$(bg).animate({opacity: "0.5"});
			$(box).animate({opacity: "1.0"});
			this.src = $(id).attr('href');
			this.desc = $(id).attr('title');
			this.GenGroup(id);
			img = new Image;
			this.StartLoading();
		}
		
		this.Hide = function()
		{
			$(bg).animate({opacity: "0.0"});
			$(box).animate({opacity: "0.0"});
			$(cont).remove();
			$(controls).empty();
			$(bg).queue(function(){
				$(box).css({opacity: "0.0"});			
				$(bg).remove();
				HideImg();
			})
		}
		
		this.Next = function()
		{
			$(img).remove();
			img = null;
			img = new Image;
			if (this.animation==1)
				return;
			this.curid++;
			if (this.curid == this.groupcount)
				this.curid = 0;
			HideImg();
			this.src = $(this.imggroup[this.curid]).attr('href');
			this.desc = $(this.imggroup[this.curid]).attr('title');
			$(img).css({opacity: "0.0"});
			$(footer).css({opacity: "0.0"});
			$(box).stop();
			$(img).stop();			
			this.StartLoading();
		}
		
		this.Prev = function()
		{
			if (this.animation==1)
				return;
			this.curid--;
			if (this.curid < 0)
				this.curid = this.groupcount-1;
			HideImg();
			this.src = $(this.imggroup[this.curid]).attr('href');
			this.desc = $(this.imggroup[this.curid]).attr('title');
			$(img).css({opacity: "0.0"});
			$(footer).css({opacity: "0.0"});
			$(box).stop();
			$(img).stop();			
			this.StartLoading();
		}		
		
		function HideImg()
		{

			$(img).css({opacity: "0.0"});
			$(footer).css({opacity: "0.0"});	
			$(img).remove();				
			$(footer).empty();
			$(footer).remove();
		}
		
		this.GenGroup = function(id)
		{
			var rel = $(id).attr('rel');
			var i;
			if (rel==null)
				this.groupcount=0;
			else
			{
				var g = new Array;
				$('a[rel='+rel+']').each(function(i){
					g[i]=this;
				});
				for (i=0; i<g.length; i++)
				{
					this.imggroup[i]=g[i];
					if (g[i]==id)
						this.curid = i;
				}
				this.groupcount = g.length;
				if (this.groupcount>1)
					$(controls).append(this.nextprev);				
			}
			$(controls).append(this.ctrlclose);
		}
		
		this.StartLoading = function()
		{
			this.animation = 1;
			$(img).css({opacity: "0.0"});
			$(footer).css({opacity: "0.0"});
			var w = $(box).width();
			var h = $(box).height();			
			$(loading).css({top: (h-$(loading).height())/2 + 20, left: (w-$(loading).width())/2 + 20, opacity: "1.0"});
			$(loading).show();		
			$(footer).append(info);
			if (this.groupcount>1)
				$(info).append(infostatus);
			$(info).append(infodesc);
			$(box).append(img);
			$(box).append(footer);
			$(img).attr('src',this.src);

			$(img).load(function(){ab.ShowImg()});
		}
		
		function SetBgDim()
		{
			var h = $(cont).height();
			
			if ($(document).height()>h)
				h = $(document).height();
			$(bg).height(h);
			$(bg).width($(window).width());
		}
		
		this.ShowImg = function()
		{
			SetBgDim();
			this.SetBoxSize();
			$(box).queue(function(){
				$(img).animate({opacity: "1.0"},500);
				$(footer).css({opacity: "1.0"});
				SetBgDim();
				$(loading).hide();
				ab.animation = 0;
			});
		}
		
		this.SetBoxSize = function()
		{
			var w = $(img).width();
			$(footer).width(w);
			$(infostatus).html('wyświetlono zdjęcie nr <strong>'+(this.curid+1)+'</strong> z <strong>'+this.groupcount+'</strong>');
			$(infodesc).html(this.desc);
			if ($(footer).height()<40)
				$(footer).height(40);			
			var h = $(img).height() + $(controls).outerHeight() + $(footer).outerHeight();

			if (w<this.minsize)
				w = this.minsize;
				
			$(box).animate({width: w, height: h},500);				
		}
		

}