$(document).ready(function(){
	$('#photos .thumbs a').css({opacity:0.5}).hover(function(){
		$(this).stop().animate({opacity:0.8},150)
	},function(){
		$(this).stop().animate({opacity:0.5},150)
	}).click(switchPhoto)
})
function switchPhoto() {
	a = $(this);

	d = $('#photos .thumbs div');
	p_src = $('#photos .photo img').attr('src'); // адрес большой фотки
	thumb_src = d.find('img').attr('src');
	$('<a href="'+p_src+'"><img src="'+thumb_src+'" alt="" /></a>').insertAfter(d).css({opacity:0.5}).hover(function(){
		$(this).stop().animate({opacity:0.8},150)
	},function(){
		$(this).stop().animate({opacity:0.5},150)
	}).click(switchPhoto);
	d.remove();

	p_a_src = a.attr('href'); // адрес новой большой фотки
	thumb_src = a.find('img').attr('src') // адрес тумбочки

	$('<div><img src="'+thumb_src+'" alt="" /></div>').insertAfter(a);
	a.remove();

	$('#photos .thumbs a').unbind('click').click(function(){ return false; });

	// делаем шторки
	shutterLeft = $('#photos .shutter_l');
	shutterRight = $('#photos .shutter_r');
	shutterLeft.css({
		backgroundImage:'url('+p_src+')',
		left:0
	}).animate({
		left:-400
	});
	shutterRight.css({
		backgroundImage:'url('+p_src+')',
		left:350
	}).animate({
		left:750
	},function(){
		flag = true;
	});
	$('#photos .photo img').remove(); // убираем большую картинку

	// вставляем лоадер
	loader = new Image();
	loader = $(loader);
	loader.load(function(){
		$(this).appendTo($('#photos .photo'));
	}).attr('src','/img/loader.gif').addClass('loader');

	// начинаем загрузку новой картинки
	img = new Image();
	img = $(img);
	img.load(function(){
		shutterRight.queue(function(){
			$(this).dequeue();

			//$('#photos .photo img').attr('src',p_a_src);

			shutterLeft.css({
				backgroundImage:'url('+p_a_src+')',
				left:-400
			}).animate({
				left:0
			},function(){
				$('#photos .photo .loader').remove()
				img.appendTo($('#photos .photo'));
				$(this).css({left:-350});
				$('#photos .thumbs a').unbind('click').click(switchPhoto);
			});
			shutterRight.css({
				backgroundImage:'url('+p_a_src+')',
				left:750
			}).animate({
				left:350
			},function(){
				$(this).css({left:700})
			});

		})
	})
	.attr('src',p_a_src);


	return false;
}