var Picture = {
	
	Init : function(){
		
		var thumbs = $("#thumbs").children();
		$("#imginfo").hide();
		
		//Lägger första bilden som aktiv
		thumbs.eq(0).toggleClass("active");
		
		thumbs.hover(
			function(){
				$(this).toggleClass("hover");
			},
			function(){
				$(this).removeClass("hover");
			}
		);
		
		thumbs.click(function(e){
			
			//Kolla igenom alla bilder och ta bort aktiv 
			for(var i = 0; i < thumbs.length; i++){
				$("#thumbs img").removeClass("active");	
			}
			
			//Lägger på aktiv
			$(this).toggleClass("active");
			
			//Visar den klickade bilden i huvudfönstret
			$("#showpic").attr({src: "image_display.php?iid=" + ($(this).attr("alt")) + "&big", alt: $(this).attr("alt")});
			
			//var TimeOut = setTimeout((function() {
			//	Picture.Padding();
			//}), 50);
			
			if($("#info-text").html() == "x")
				Picture.Picinfo();
		});
		
		$("#info-btn").click(function(e){
			
			if ($("#info-text").html() == "x")
			{
				$("#imginfo").hide();
				$("#info-text").html("i");
			}
			else
			{
				$("#info-text").html("x");
				
				Picture.Picinfo();
			}
		});
		
		
	},
	
	Picinfo : function(){
		
		var iID = $("#showpic").attr("alt");
		
		$.post("image_info.php", {
			queryString: "" + iID + ""
		}, function(data){
			$("#imginfo").show();
			$("#imginfo").html(data);
		});
	},
	
	Padding : function(){
		$("#showpic").removeAttr("width");
		$("#showpic").removeAttr("height");
		var height = $("#showpic").height();
		var top = (600 - height) / 2;
		
		$("#showpic").css('padding', top + 'px 0px ' + top + 'px 0px');
	}
}

window.onload = Picture.Init;