$(document).ready(function(){
	$(document).keydown(
			function(e) {
			if(e.keyCode == 9)
			{
			$("#t").focus();
			}
        
		  });
	/*var winHeight =  $(document).height();
	$('.page_wrapper').height(winHeight);*/
	
	$('.overlay').css("opacity", 0.6);
	
	$('.page_nav li').animate({opacity: 'hide'})
	
	$('.page_nav li img:first').removeClass('navActive');
	$('.page_nav li img:first').parent().find("span").addClass('bg_navActive');
	$('.page_nav li img:first').removeClass('navActive');
	
	$('.page_nav li img').hover(function() {
		if($(this).hasClass('navActive')) {	
			$(this).parent().find("span").stop().animate({ top: '0' },{queue:false, duration:600, easing: 'easeOutQuart'});
		}
		
	    }, function() {
		if($(this).hasClass('navActive')) {		
			$(this).parent().find("span").stop().animate({ top: '-70px' },{queue:false, duration:600, easing: 'easeOutQuart'})
		}
	});
	
	$('.page_nav li img').live('click', function() {
		if($(this).hasClass('navMove')) {											 
		$('.page_nav li img').addClass('navActive');
		$('.page_nav li img').parent().find("span").stop().animate({ top: '-70px' },200, function(){
			$(this).parent().find("span").removeClass('bg_navActive');																		  
		});
		$(this).removeClass('navActive');
		$(this).parent().find("span").addClass('bg_navActive');
		$(this).parent().find("span").stop().animate({ top: '0px' },{queue:false, duration:600, easing: 'easeOutQuart'});
		}
	});
	
	
	$('.page_music div span').click(function(){
		$('.page_music').animate({top:'-72px', height:'87px'},{duration:1000, easing: 'easeOutQuint'});										 
		$(this).hide();
		$('.page_music div p').show();
	}); 
	$('.page_music div p').click(function(){
		$('.page_music').animate({top:'-7px', height:'23px'},{duration:700, easing: 'easeOutElastic'});								  
		$(this).hide();
		$('.page_music div span').show();
	});
	




	
	
	
		
	$('.tell_friend').hover( function() {
	$('.overlay').fadeIn('fast');								  
	$(this).animate({top: '0'},{queue:false, duration:1300, easing: 'easeOutBounce'});			   
	}, function(){
		$(this).animate({top: '-644px'},{queue:false, duration:1300, easing: 'easeOutBounce'});
		$('.overlay').fadeOut('fast');
	});
	
	
	
	$('.follow_us a img').hover( function(){
		$(this).animate({width: '36px', height: '36px'},{queue:false, duration:500, easing: 'easeOutElastic'});							 
	}, function(){
		$(this).animate({width: '30px', height: '30px'},{queue:false, duration:500, easing: 'easeOutElastic'});		
	});
	
	
	
	function smoke() {
		$('.bg_about').animate({left: '+8px'},1000);
		$('.bg_message_3').animate({right: '-10px'},1000);
		$('.bg_message_3').animate({right: '+10px'},1000);
		
		$(".bg_content_1 img").animate({top:"+10", left:"+10", height:'273px', width:'319px'}, 1200);
	   	$(".bg_content_1 img").animate({top:"-10", left:"-10", height:'283px', width:'329px'}, 1200);
	   
	   	
		$(".bg_content_2 img").animate({top:"-46"}, 1200);
	   	$(".bg_content_2 img").animate({top:"+10"}, 1200);
	   	$(".bg_content_2 img").animate({top:"-46"}, 1200);
	   	$(".bg_content_2 img").animate({tio:"+10"}, 1200);
		
		
		$('.bg_about').animate({left: '-0px'},1000, smoke);
	}
	smoke();
	
	function star1() {
		$('.bg_star1').animate({top: '-8px'},800);
		$('.bg_star1').animate({top: '+0px'},1000);
		
		$('.bg_star3').animate({top: '-15px'},1000);
		$('.bg_star3').animate({top: '+0px'},1000);
		
		$('.bg_star2').animate({top: '-10px'},1200);
		$('.bg_star2').animate({top: '+0px'},1000, star1);
	}
	star1();
	
	function BgMessage() {
	  $(".bg_message_1").animate({top:"+=15"}, 1200);
	  $(".bg_message_2").animate({top:"+=15"}, 1000);
	  $(".bg_message_1").animate({top:"-=15"}, 1200);
	  
	  $(".bg_ecard_2 img").animate({left:"-10", height:'203px'}, 1200);
	   $(".bg_ecard_2 img").animate({left:"+10", height:'194px'}, 1200);
	  $(".bg_message_2").animate({top:"-=15"}, 1000, BgMessage);
	}
	BgMessage();
	
	
	var totWidth=0;
	var positions = new Array();
	
	$('#slides .slide').each(function(i){
		positions[i]= totWidth;
		totWidth += $(this).width();
		
		if(!$(this).width())
		{
			return false;
		}
		
	});
	
	$('#slides').width(totWidth);


	$('.page_nav ul li img').click(function(e){
											
		var pos = $(this).parent().prevAll('.page_nav ul li').length;
		if($(this).hasClass('pageAnimate')) {	
		$('#slides').stop().animate({marginLeft:-positions[pos]+'px'},{duration:1000, easing: 'easeInOutExpo'});	
		}
		e.preventDefault();
	});
	
	$('.btn_feedback, .link_comments').click(function(){
		$('.feedback_load').load('feedback.html');							  
		$('.overlay').fadeIn('slow', function(){
			$('.feedback_load').fadeIn('fast');						   
		});							  
	});
	
	
	
	
});

var SmokeEffect = {
	
	imgLocation: "images/bg_fog.png", //url to image here
	smokeWidth: 22, //standard width
	smokeHeight: 68, //standard height
	
	//don't touch this:
	smokePos: new Array(),
		
	makeEffect: function(id, posX, posY) {
		//set position from the "parent"
		SmokeEffect.smokePos[id] = new Array();
		SmokeEffect.smokePos[id]['x'] = posX;
		SmokeEffect.smokePos[id]['y'] = posY;
		
		//set a random time to start puffing
		var time = (Math.floor(Math.random()*3001));
		setTimeout("SmokeEffect.animate('" + id + "')", time);
	},
	
	animate: function(id) {

		//create the smoke cloud
		var puff = document.createElement("IMG");
		$(puff).attr("src", SmokeEffect.imgLocation);
		$(puff).attr("alt", "puff");
		$(puff).attr("class", "puff");
		
		//create a temp id for the cloud so we can delete it later on
		var tempId = "puff" + Math.floor(Math.random()*1001);
		$(puff).attr("id", tempId);
		
		//append the cloud to the body
		$(document.body).append($(puff));
		
		var objPos = $('#' + id).offset();
		
		//do smoke animation
		$(puff).css({
			top: (objPos['top'] + SmokeEffect.smokePos[id]['y']) + "px",
			left: (objPos['left'] + SmokeEffect.smokePos[id]['x']) + "px",
			zIndex: 0,
			opacity: 0.4
		});
		$(puff).animate({
			width: SmokeEffect.smokeWidth + "px",
			height: SmokeEffect.smokeHeight + "px",
			marginLeft: "-" + (SmokeEffect.smokeWidth / 2) + "px",
			marginTop: "-" + (SmokeEffect.smokeHeight * 1.5) + "px",
			opacity: 0.9,
			marginTop: "-" + (SmokeEffect.smokeHeight * 2.4) + "px",
			opacity: 0.0
		},{
			duration: 4000
		});
		
		//create timeout and run the animation again
		var time = 3000 + (Math.floor(Math.random()*4501));
		
		setTimeout("SmokeEffect.animate('" + id + "')", time);
		
		//remove the old one
		setTimeout("$('#" + tempId + "').remove()", 4200);
		
	}
}