$(function() {
	$('body').append($('<div id="cargador"></div>').hide());
	$('body').append($('<img src="/resources/nuevo/ajax-loader.gif" id="loading" />').hide());

	$('table tr').hover(
		function() {
			$(this).addClass('over');
		},

		function() {
			$(this).removeClass('over');
		}
	).click(function(e) {
		var enlace = $(this).find('a');

		muestraDetalle(enlace.attr('href'), enlace.position(), e);
	});

	$('table a').click(function(e) {
		e.preventDefault();

		muestraDetalle(this.href, $(this).position(), e);
	});
});

function muestraDetalle(enlace, position, e) {
	$('#loading').show().css('left', e.pageX).css('top', e.pageY).css('position', 'absolute');

	$('#cargador').load(enlace + '&ajax=1', function() {
		$('body>.detalle, body>.fondo').remove();

		$('#loading').hide();

		var detalle = $('#cargador #detalle').css('left', position.left + 15).css('top', position.top + 15).addClass('detalle').attr('id', '');
		detalle.find('h2').remove();

		var lista = $('<ul class="pestanas"></ul>');
		detalle.prepend(lista);

		detalle.find('h3').each(function() {
			lista.append('<li class="' + $(this).next().attr('class') + '"><span><span>' + $(this).text() + '</span></span></li>');
			$(this).remove();
		});

		lista.find('li').click(function() {
			detalle.find('div').hide();
			detalle.find('div.' + $(this).attr('class').split(' ')[0]).show();

			lista.find('li').removeClass('activo');
			$(this).addClass('activo');
		}).filter(':first').addClass('primero').click();

		// Fotos
		detalle.find('div.fotos').prepend($('<img src="' + detalle.find('div.fotos img:first').attr('src') + '" width="236" height="155" alt="" />'));
		detalle.find('div.fotos ul img').click(function() {
			$(this.parentNode.parentNode.parentNode).find('img:first').attr('src', $(this).attr('src'));
		});

		var fondo = $('<div class="fondo"></div>').css('left', position.left + 15).css('top', position.top + 37).css('opacity', 0.9);

		$('body').append( fondo ).append( detalle );

		var cerrar = $('<span class="cerrar"></span>').click(function() {
			$(this.parentNode).prev().remove();
			$(this.parentNode).remove();
		});

		if(detalle.find('.zonas img').length == 0) {
			detalle.find('div.zonas').prepend('<img src="/resources/nuevo/remontes/remontes.gif" alt="" />');
		}

		detalle.prepend(cerrar);

		$('#cargador').html('');
	});
}