// denim - drag 
var wImg = 488;
var hImg = 606;
		
$(document).ready(
	function(){
		// el contenedor de im‡genes es dragable œnicamente dentro de una zona (contenedorDrag)
		dragSettings();
		var contenedor = ($.browser.safari)? [-1220,-1209,2440,2418] : 'parent'; 
		$('#contenedorImagenes').draggable(
			{
				containment:	contenedor,
				cursor:			'move',
				start:			onStartDragImagenes,
				stop:			onStopDragOk
				//stop:			onStopDragImagenes
			}
		);		
	}
);

function dragSettings(){
	// calculamos la posici—n y tama–o del contenedor donde se "dragean" las im‡genes
	var difAltura = $(window).height() - ($('#contenedorgeneral').height());
	var xContDrag = $(window).width() - $('#contenedorImagenes').width();
	var yContDrag = $(window).height() - $('#contenedorImagenes').height() - difAltura;
	var wContDrag = $('#contenedorImagenes').width()-xContDrag;
	var hContDrag = $('#contenedorImagenes').height()-yContDrag;
	// se lo aplicamos
	$('#contenedorDrag').animate({left:xContDrag, top:yContDrag}, 'slow');	
	$('#contenedorDrag').width(wContDrag);
	$('#contenedorDrag').height(hContDrag);
	// y tambiŽn recolocamos las im‡genes (centradas)
	var xContImg = parseInt(-xContDrag/2);
	var yContImg = parseInt(-yContDrag/2);
	$('#contenedorImagenes').animate({left:xContImg, top:yContImg}, 'slow');
	
	// hacemos el ancho del contenedor del interior igual al ancho de la pantalla
	$('#contenedorgeneral').width($(document).width());
}


var dragging = false;
var firstTimeDrag = true;
function onStartDragImagenes(e){
	// ocultamos el tooltip
	dragging = true;
	$('#btDrag').fadeOut('fast');
	
	if (firstTimeDrag) firstTimeDrag = false;
	else $('.fi_boton').fadeOut('fast');

}

function onStopDragOk(e){
	dragging = false;
	//$('.fi_boton').fadeIn(1000);
}

function onStopDragImagenes(e){
	// mostrar el tooltip
	dragging = false;
	//$(document).mousemove(e);
	$('#btDrag').fadeIn('slow');
	//$('.fi_boton').fadeIn(1000);
	

	// calculamos el centro de las im‡genes
	var xDifImg = parseInt($('#contenedorDrag').css('left')) + parseInt($('#contenedorImagenes').css('left'));
	var yDifImg = parseInt($('#contenedorDrag').css('top')) + parseInt($('#contenedorImagenes').css('top'));
	
	// calculamos si hay que hacer algœn ajuste de rejilla
	var modX = Math.abs(xDifImg%wImg);
	if (modX<100 || modX>350){
		// c‡lculo de la X
		var columna = Math.round(xDifImg/wImg) + 1 - 1;
		var xFoto = wImg*columna;
		var xFin = -parseInt($('#contenedorDrag').css('left')) + xFoto;
			xFin = (xFin<0)? 0 : xFin;
	} else {
		var xFin = parseInt($('#contenedorImagenes').css('left'));
	}
	
	var modY = Math.abs(yDifImg%hImg);
	if (modY<250 || modY>450){
		// c‡lculo de la Y
		var fila = 1 - Math.round(yDifImg/hImg) - 1;
		var yFoto = hImg*fila;
		var yFin = -parseInt($('#contenedorDrag').css('top')) - yFoto;
	} else {
		var yFin = parseInt($('#contenedorImagenes').css('top'));
	}
	
	// ajustamos a la rejilla
	$('#contenedorImagenes').animate({left:xFin, top:yFin}, 'slow');

}

var firstTimeMove = true;
// hacemos que aparezca en un alpha el tooltip de drag
$(document).bind('mousemove', 
	function(e){
		if (firstTimeMove){
			firstTimeMove = false;
			$('#btDrag').fadeIn('slow');
		}
		
		if (!dragging){
			//pointer = jQuery.iUtil.getPointer(e);
			var pointerX = e.pageX - $('#btDrag').width() - 15;
			var pointerY = e.pageY - parseInt($('#contenedorgeneral').css('top')) - 15;
		
			$('#btDrag').css('left', pointerX);
			$('#btDrag').css('top', pointerY);
		}
	}
);

		
// evento de resize
// tenemos que reajustar los settings del drag
$(window).bind("resize",dragSettings);


// rollover de los botones
$(document).ready(
	function(){
		$('.fi_boton').show();
		$('.fi_boton').fadeTo('fast',0);
		
		$('.fi_boton_closer_over').show();
		$('.fi_boton_closer_over').fadeTo('fast',0);
		
		$('.fi_boton_buy_over').show();
		$('.fi_boton_buy_over').fadeTo('fast',0);
		
		
		$('.fi_imagen').mouseover(
			function(){
				$(this).find('.fi_boton').stop();
				$(this).find('.fi_boton').show();
				$(this).find('.fi_boton').fadeTo('fast',1);
				//$('#btDrag').fadeOut('fast');
			}
		);
		$('.fi_imagen').mouseout(
			function(){
				$(this).find('.fi_boton').stop();
				$(this).find('.fi_boton').fadeTo('fast',0);
				//$('#btDrag').fadeIn('fast');
			}
		);
		
		$('.fi_boton_closer').mouseover(
			function(){
				$(this).prev().stop();
				$(this).prev().show();
				$(this).prev().fadeTo('fast',1);
				
				//$(this).prev().fadeIn('fast');
				
				//$('#btDrag').fadeOut('fast');
			}
		);
		$('.fi_boton_closer').mouseout(
			function(){
				$(this).prev().stop();
				$(this).prev().fadeTo('fast',0);
				
				//$(this).prev().fadeOut('fast');
				
				//$('#btDrag').fadeIn('fast');
			}
		);	
	
		$('.fi_boton_buy').mouseover(
			function(){
				$(this).prev().stop();
				$(this).prev().show();
				$(this).prev().fadeTo('fast',1);
				
				//$(this).prev().fadeIn('fast');
				
				//$('#btDrag').fadeOut('fast');
			}
		);
		$('.fi_boton_buy').mouseout(
			function(){
				$(this).prev().stop();
				$(this).prev().fadeTo('fast',0);
				
				//$(this).prev().fadeOut('fast');
				
				//$('#btDrag').fadeIn('fast');
			}
		);	
	
		$('#btWatchVideoAgain').mouseover(
			function(){
				$(this).fadeTo('fast',0.5);
				//$('#btDrag').fadeOut('fast');
			}
		);
		$('#btWatchVideoAgain').mouseout(
			function(){
				$(this).fadeTo('fast',1);
				//$('#btDrag').fadeIn('fast');
			}
		);	
		
		
	}
);

