(function($){ 
	
	
	/**
     * hier werden Konfigurationsblöcke definiert
     */
    $.fn.popup.configs({
        config1: {
            width: 600,
			height: 500,
			openIt: true,
			toolbar: 'no',
			menubar: 'no',
			center: 'yes'
        }
    }),

	
	// apply the popup plugin to our "download instructions"-links
	$(function(){
		$('a[rel^=popup]').popup();
	}), 
	
	$(function(){

		// place the cursor into the username-textfield
		$("#username").focus();


		// add the loading gif to the body
		$("body").append("<div id='loading'><img src='imgs/loader.gif' /></div>");
		var loading = $("div#loading");
		loading.css({ display: "none", position:"absolute", left:"0", top:"0" });




		// make the box draggable
		$("div#box").draggable();




		function CloseBox()
		{
			$("div#box").hide(300);
		}




		function ShowBox()
		{
			$("div#box").show(200);
		}




		function onPreload(aImages, nImages, o_reference)
		{
			// this is our image
			oImage = aImages[0];

			// get the dimensions of our image
			i_image_width = oImage.width;
			i_image_height = oImage.height;

			// insert the new image into our image container
			$("div#box > div#image").html(oImage);

			// set width of the box
			$("div#box").css({ width:i_image_width });

			var a_pos = CenterObjects(o_reference, $("div#box"));
			// reposition the box
			$("div#box").css({ top:a_pos[1]+"px", left:a_pos[0]+"px" });

			// hide loding container
			$(loading).hide(500);

			// make box visible
			ShowBox();
		}




		/**
		 * center an object with respect to another object
		 *
		 * @return Array Returns an array keeping the x- and y-position of the object to rearrange
		 */
		function CenterObjects(o_reference, o_rearrange)
		{
			// get dimensions of our reference object
			var i_reference_width = $(o_reference).width();
			var i_reference_height = $(o_reference).height();

			// get the absolute position of our reference
			var i_reference_pos_x = $(o_reference).offset().left;
			var i_reference_pos_y = $(o_reference).offset().top;

			// get the absolute position of the center of our reference object
			var i_reference_horizontal_middle = i_reference_pos_x + (i_reference_width/2);
			var i_reference_vertical_middle = i_reference_pos_y + (i_reference_height/2);

			// get the dimensions of the object to rearrange
			var i_rearrange_width = $(o_rearrange).width();
			var i_rearrange_height = $(o_rearrange).height();

			// calculate the position of our rearrange object
			var i_rearrange_pos_x = i_reference_horizontal_middle-(i_rearrange_width/2);
			var i_rearrange_pos_y = i_reference_vertical_middle-(i_rearrange_height/2);

			// this is the distance to the borders
			var i_padding = 20;

			// if the x position is negative, then set it to 10
			if (i_rearrange_pos_x<$(window).scrollLeft())
			{
				i_rearrange_pos_x = $(window).scrollLeft() + i_padding;
			}

			// if the y position is negative, then set it to 10 plus scroll-y
			if (i_rearrange_pos_y<$(window).scrollTop())
			{
				i_rearrange_pos_y = $(window).scrollTop() + i_padding;
			}

			// correct the x-position
			var i_image_right_pos = i_rearrange_pos_x + $(o_rearrange).width();
			var i_window_width = $(window).width() + $(window).scrollLeft();
			if (i_image_right_pos > i_window_width)
			{
				 i_rearrange_pos_x = i_window_width - $(o_rearrange).width() - i_padding;
			}

			// correct the y-position
			var i_image_bottom_pos = i_rearrange_pos_y + $(o_rearrange).height();
			var i_window_height = $(window).height() + $(window).scrollTop();
			if (i_image_bottom_pos > i_window_height)
			{
				 i_rearrange_pos_y = i_window_height - $(o_rearrange).height() - i_padding;
			}

			return Array(i_rearrange_pos_x, i_rearrange_pos_y);
		}




		function imagepreload(thumb)
		{
			// get the image name
			var s_image_name = $(thumb).attr('id');

			// get the folder name of the event
			var s_folder_name = $(thumb).attr('class');

			// set the right download link
			$("div#box div#bar a#download").attr({ href: "/download.php?event="+s_folder_name+"&filename="+s_image_name+".jpg" });

			// get position of the loading container
			var a_loading_pos = CenterObjects(thumb, loading);

			// reposition the loading container
			$(loading).css({ left:a_loading_pos[0]+"px", top:a_loading_pos[1]+"px", display: "block" });

			// array keeps the preview image
			var a_images = Array("/photos/"+s_folder_name+"/prevs/"+s_image_name+"_prev.jpg");
			// preload the image
			o_preloader = new CImagePreloader(a_images, onPreload, thumb);
		}




		$().mousemove
		(
			function(e)
			{
				x = (document.all) ? window.event.x + document.body.scrollLeft : e.pageX;
				y = (document.all) ? window.event.y + document.body.scrollTop  : e.pageY;
			}
		);




		// show the preview image
		function show_image(thumb)
		{
			// at first, close the box if it is visible
			if ($("div#box:visible").length>0)
			{
				//alert('sichtbar');
				$("div#box").hide(300, function(){ imagepreload(thumb); } );
			}
			else
			{
				//alert("versteckt");
				imagepreload(thumb);
			}
		}




		// place click event onto each thumbnail
		$("ul > li > img").click( function() { show_image($(this)); } );




		// activate the close button
		$("#close").click
		(
			function()
			{
				CloseBox();
			}
		)
		.css({ cursor:"pointer" });



	})
})(jQuery);