$(document).ready(function(){
	$('.foto .wr a').draggable({ 
		revert: 'invalid',
		start: function(event, ui) {
			//$('.ui-draggable').parent().removeClass('dropped');
			//$('.ui-draggable').css({left:0,top:0})
		} 
	});
	$('.pan').droppable({
		activeClass: 'ui-state-active',
		hoverClass: 'ui-state-hover',
		drop: function(event, ui){
			link = $('.ui-draggable-dragging').attr('rel');
			$('.pic img').hide().attr('src',link).load(function(){
				if($('.dropped').parent().parent().hasClass('tw')) {
					$('.pic img').css('left','-395px')
				} else {
					$('.pic img').css('left','-555px')
				}
				$('.pic img').show();
			});
			
			if($.browser.msie && $.browser.version == 6) {			
				$('.dropped').children('a').css('display','none');
				$('.dropped').addClass('cur').removeClass('dropped');
				$('.cur a').animate({left:0,top:0},1,function(){
					$('.cur a').show();
					$('.cur').removeClass('cur');
				});		
								
			} else {	
				$('.dropped').children('a').css('opacity','0');
				$('.dropped').addClass('cur').removeClass('dropped');
				$('.cur a').animate({left:0,top:0,opacity:1},300,function(){$('.cur').removeClass('cur')});		
			}
			
			$('.ui-draggable-dragging').parent().addClass('dropped');
			
			
			name = $('.ui-draggable-dragging').attr('title');
			link = $('.ui-draggable-dragging').attr('name');
			$('.pan .name a').html(name);
			$('.pan .name a').attr('href','/'+link+'/');
		}
	});
	
	$('.foto .wr a').hover(function(){
		$('.pan').addClass('ui-state-active2');
	},function(){
		$('.pan').removeClass('ui-state-active2');
		
	});
	drag();
	
	$('.emul').hover(function(){
		
	},function(){
		$(this).unbind('mousemove').removeClass('cmove');
	});
	
	move();
	setInterval("move()",3000);
	
});



function move(){
	$('.hand div').animate({left:0},200).animate({left:22},200).animate({left:12},200);
}
	

function drag(){
	$('.emul').bind('mousedown', function(def) {
		if (!$('.emul').hasClass('cmove')) {
				$('.emul').addClass('cmove');
			}
		sx = def.pageX - $('.index .pic img').get(0).offsetLeft;
		
		$(this).bind('mousemove', function(neww) {			
		cLeft = neww.pageX - sx;
		if (cLeft < 0) {
			var mw = ($('.index .pic img').width() - $('.pan .pic').width()) * (-1);			
			if (cLeft <= mw) {				
				$('.index .pic img').css('left', mw + 'px');
				//$('.index .pic img').stop().animate({left:mw+60},600);
			}
			else
				$('.index .pic img').css('left', cLeft + 'px');
		}
		else $('.index .pic img').css('left', '0px');
		}).bind('mouseup', function() {
			$(this).unbind('mousemove').removeClass('cmove');
		});
	}).bind('mouseup', function() {
		$(this).unbind('mousemove').removeClass('cmove');
	});
}
