﻿/* ---------------------------------------
	lightbox window
--------------------------------------- */

	var lightbox = 
	{	
		dimensions : { x: 0, y: 0 },
		position : null,
		open : false,
	
		init : function()
		{
			// preload the loading image
			lightbox.animation = $(document.createElement('img')).attr({ id: 'loading', src: '/media/images/prizes/loading.gif' });
			lightbox.close = $(document.createElement('a')).attr({ id: 'lightbox-close', href: '#' }).hide();
			
			// make the images appear clickable
			$('.prizes li, .prizes li *').css('cursor', 'pointer');
		},
		
		grab : function()
		{
			if (lightbox.open == true) lightbox.finish();
			lightbox.open = true;

			// the clicked link
			lightbox.target = $(this);
			lightbox.source = lightbox.target.find('img:first')[0];

			lightbox.animation.hide();
			lightbox.target.prepend(lightbox.animation);

			// dull the image, add loading animation
			$(lightbox.source).fadeTo('fast', 0.1);
			lightbox.animation.fadeIn('slow');

			// set the new image
			lightbox.image = document.createElement('img');
			$(lightbox.image).attr({ id: 'lightbox', 'title': lightbox.source.title }).hide();

			// when the preload image has loaded
			lightbox.image.onload = lightbox.start;
			
			// start the preloading
			setTimeout(function() { lightbox.image.src = lightbox.source.src}, 600);
			return false;
		},
		
		start : function()
		{
			lightbox.dimensions.x = lightbox.image.width;
			lightbox.dimensions.y = lightbox.image.height;

			lightbox.image.width = lightbox.source.width;
			lightbox.image.height = lightbox.source.height;

			// define effect configuration
			$(lightbox.image).animate({ 'opacity': 1, 'width': lightbox.dimensions.x, 'height': lightbox.dimensions.y }, 250, 'easeOutQuart');

			lightbox.close.fadeIn();
			lightbox.animation.fadeOut('slow', function() { $(this).remove(); });

			// add the image
			$('body:first').append(lightbox.image);
			$('body:first').append(lightbox.close);
			
			lightbox.close.bind('click', lightbox.finish);
		},
		
		finish : function()
		{
			lightbox.open = false;

			$(lightbox.image).remove();
			lightbox.close.remove();

			$(lightbox.source).fadeTo('slows', 1);
			
			return false;
		}
	}
	
	$(function()
	{
		// kick off the lightbox
		lightbox.init();
		
		$('ul.prizes li').bind('click', lightbox.grab);
	});

