var Speed = 70; 		// Velocidad en milliseconds
var step = 1; 				// Cuantos pixeles mover por cada step
var current = 0;			// posición del actual pixe
var bWidth = 1300;			// Ancho de los sprites de las nubes
var hWave = 0;
var wWave = 0;
var hdir=1;
var wdir=1;
var wwidth = $(window).width();
var whale= wwidth;
var pbird1 = wwidth;
var pbird2 = wwidth + 300;
var pbird3 = wwidth + 700;
var pbird4 = wwidth + 1000;

	
function magia(){
	
	//Declaracion de variables.
	current += step;
	hWave += hdir;
	wWave += wdir;
	whale -= step;
	pbird1 -= step;
	pbird2 -= step;
	pbird3 -= step*2;
	pbird4 -= step*3;
	
	//Para reiniciar las valores una vez que crucen el ancho de la ventana.
	if (current >= bWidth*4)		{current = 0;}
	if (whale <= -321)				{whale = wwidth;}				
	if (pbird1 <= -40)				{pbird1 = wwidth;}				
	if (pbird2 <= -40)				{pbird2 = wwidth;}				
	if (pbird3 <= -40)				{pbird3 = wwidth;}				
	if (pbird4 <= -40)				{pbird4 = wwidth;}				
	if (hWave == 10 || hWave == 0)	{hdir=-hdir;}
	if (wWave == 22 || wWave == -22){wdir=-wdir;}
	
	//Aqui está toda la magia :D
	$('#clouds1').css("background-position",current+"px");
	$('#clouds2').css("background-position",current/2+"px");
	$('#clouds3').css("background-position",current/4+"px");
	
	$('#whale').css("background-position",whale+"px "+(10+hWave/-2)+"px");
	
	$('#wave1').css("background-position","0 "+hWave+"px");
	$('#wave2').css("background-position",wWave+"px "+(-hWave+15)+"px" );
	
	$('#bird1').css("background-position",pbird1+"px "+(-1*wWave/5+15)+"px");
	$('#bird2').css("background-position",pbird2+"px "+(-1*wWave+65)+"px");
	$('#bird3').css("background-position",pbird3+"px "+(wWave+25)+"px");
	$('#bird4').css("background-position",pbird4+"px "+(-wWave+65)+"px");
}


$(document).ready(function() {

	$("#draggable").draggable({ revert: 'invalid' });
	
	$("#contactame").fancybox({
		'scrolling'		: 'no',
		'titleShow'		: false		
	});

	$("#droppable").droppable({
	  drop: function() { 
		
		if ($("#contacto").validate().form()){
			$("#draggable").draggable( "destroy" );
			$("#droppable").droppable( "destroy" );
			$.post("sendmail.php", $("#contacto").serialize());
			$.fancybox.close();
		} else {
					
			$("#draggable").draggable({ revert: true });
			$.fancybox.resize();
		}
						
		return false;
	   }
	});
	
	$(function(){ $("label").inFieldLabels(); });
	
	jQuery.validator.setDefaults({ 
    	errorElement: "span" 
	});
	$("#contacto").validate();
	$("#commentform").validate();
	
	//Lo llama un chingo de veces para que todo se mueva
	var init = setInterval("magia()", Speed);

});
/*
 In-Field Label $ Plugin
 http://fuelyourcoding.com/scripts/infield.html

 Copyright (c) 2009 Doug Neiner
 Dual licensed under the MIT and GPL licenses.
 Uses the same license as $, see:
 http://docs.$.com/License

*/
(function(d){d.InFieldLabels=function(e,b,f){var a=this;a.$label=d(e);a.label=e;a.$field=d(b);a.field=b;a.$label.data("InFieldLabels",a);a.showing=true;a.init=function(){a.options=d.extend({},d.InFieldLabels.defaultOptions,f);if(a.$field.val()!==""){a.$label.hide();a.showing=false}a.$field.focus(function(){a.fadeOnFocus()}).blur(function(){a.checkForEmpty(true)}).bind("keydown.infieldlabel",function(c){a.hideOnChange(c)}).bind("paste",function(){a.setOpacity(0)}).change(function(){a.checkForEmpty()}).bind("onPropertyChange",
function(){a.checkForEmpty()})};a.fadeOnFocus=function(){a.showing&&a.setOpacity(a.options.fadeOpacity)};a.setOpacity=function(c){a.$label.stop().animate({opacity:c},a.options.fadeDuration);a.showing=c>0};a.checkForEmpty=function(c){if(a.$field.val()===""){a.prepForShow();a.setOpacity(c?1:a.options.fadeOpacity)}else a.setOpacity(0)};a.prepForShow=function(){if(!a.showing){a.$label.css({opacity:0}).show();a.$field.bind("keydown.infieldlabel",function(c){a.hideOnChange(c)})}};a.hideOnChange=function(c){if(!(c.keyCode===
16||c.keyCode===9)){if(a.showing){a.$label.hide();a.showing=false}a.$field.unbind("keydown.infieldlabel")}};a.init()};d.InFieldLabels.defaultOptions={fadeOpacity:0.5,fadeDuration:300};d.fn.inFieldLabels=function(e){return this.each(function(){var b=d(this).attr("for");if(b){b=d("input#"+b+"[type='text'],input#"+b+"[type='search'],input#"+b+"[type='tel'],input#"+b+"[type='url'],input#"+b+"[type='email'],input#"+b+"[type='password'],textarea#"+b);b.length!==0&&new d.InFieldLabels(this,b[0],e)}})}})($);

