// Al Cargar el Doom
$(document).ready(function () {
	liquidColumns();
	imagePreview();
	//$().blox();
	botones();

});

//funcion que se utiliza al redimencionar la pantalla
$(window).resize(function () {
	liquidColumns();
});


function botones(){
	loadPage("#brisaFresca","brisaFresca.php");
	loadPage("#coloridoAnimal","coloridoAnimal.php");
}

function loadPage(boton,web){
	 	$(boton).click(function(){
				$("#contenedor").load(web);
	});	
}

//Funcion para calcular el numero de columnas.
function liquidColumns() { 
	var ancho_columna=200;
	var ancho_total="97%"
        
	$("ul.column").css({ 'width' : ancho_total});//reinicia las columnas 
	var colWrap = $("ul.column").width(); //Obtiene el ancho de las filas
	var colNum = Math.floor(colWrap / ancho_columna); /*Find how many columns of 200px can fit per row */
	var colFixed = Math.floor(colWrap / colNum); /*Obtiene el ancho de las columnas dividido entre el numero de columnas*/
	$("ul.column").css({ 'width' : colWrap}); //Set exact width of row in pixels instead of using % - Prevents cross-browser bugs that appear in certain view port resolutions.
	$("ul.column li").css({ 'width' : colFixed}); //Set exact width of the re-adjusted column	

}	

/*PREVIEW*/
this.imagePreview = function(){	
		
		xOffset = 10;
		yOffset = 30;
		
		// these 2 variable determine popup's distance from the cursor
		// you might want to adjust to get the right result
		
	/* END CONFIG */
	$("a.preview").hover(function(e){
		this.t = this.title;
		this.title = "";	
		var c = (this.t != "") ? "<br/>" + this.t : "";
		$("body").append("<p id='preview'><img src='"+ this.name +"' alt='Image preview' />"+ c +"</p>");								 
		$("#preview")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px")
			.fadeIn("fast");						
    },
	function(){
		this.title = this.t;	
		$("#preview").remove();
    });	
	$("a.preview").mousemove(function(e){
		$("#preview")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px");
	});			
};


/*TRANSPARENCIA*/
jQuery.fn.blox = function(){

	settings = jQuery.extend({
		container: '#blox',
		content: '.block',
		box: '.miImagen',
		fadein: 0.2,
		fadeout: 1,
		timein: 200,
		timeout: 200,
		animation: 'yes',		// values: [yes/no]
		transparency: 'yes',	// values: [yes/no]
		direction: 'lefty' 		// values: [lefty/righty]
	});
			
	var fadeIn = settings.fadein;
	var fadeOut = settings.fadeout;
	var timeIn = settings.timeIn;
	var timeOut = settings.timeOut;

	$(settings.content).each(function(){
		
		if(settings.transparency == 'yes') {
			$(this).find(settings.box).hover(
				function(){
					$(settings.box).animate({'opacity': fadeIn},{queue:false,duration:timeIn});
					$(this).animate({'opacity': 1},{queue:fadeOut,duration:timeOut})
					$('ul.column li').css({background:"url(trama2.png)"})
				},
				function(){
					$(settings.box).animate({'opacity': fadeOut},{queue:false,duration:timeOut})
					$('ul.column li').css({background:"url(trama2.png)"})
				}	
			);
		};

	});


};


copiarDatos = function(){
	
$("#nombre1-2").val($("#nombre1-1").val());
$("#nombre2-2").val($("#nombre2-1").val());
$("#compania1-2").val($("#compania1-1").val());
$("#direccion1-2").val($("#direccion1-1").val());
$("#direccion2-2").val($("#direccion2-1").val());
$("#direccion3-2").val($("#direccion3-1").val());
$("#direccion3s-2").val($("#direccion3s-1").val());
$("#direccion4-2").val($("#direccion4-1").val());
}