// JavaScript Document

$(document).ready(function() {
	//png fix
	$(document).pngFix(); 
	
	var windowWidth = $(window).width();
	var pullWidth = $("#signupform").width();
	var pullPos = (windowWidth/2)+pullWidth;
	
	$("#signupform").css({'left': pullPos});




	//events dropdown style
	$(".dropdown").select_skin();
	
	//dragable 
	var formposition = 0;
	$("#signupform").draggable({ 
							   
		axis: 'y',
		containment: [0,-488,0,-55],
		scroll: true,
		stop: function() {
			if (formposition==0){
				$("#signupform").animate({"top": "-55px"});
				formposition=1;
			} else {
				$("#signupform").animate({"top": "-488px"});
				formposition=0;
			}
		}
	});
	
	



	//logo lights on and off
	/*$('#logo img').css('display', 'none');
	$('#logo img').delay(500).fadeIn(300);*/
	
	$('#light-switch').click(function(){
		if($('#light-switch').hasClass('lightoff')) {
			$('#logo img').stop(true, true).fadeIn(300);
			$('#light-switch img').stop(true, true).attr('src', 'images/light-on.jpg');
			$('#light-switch').stop(true, true).removeClass('lightoff');		
		}else {
			$('#logo img').stop(true, true).fadeOut(150);
			$('#light-switch img').stop(true, true).attr('src', 'images/light-off.jpg');
			$('#light-switch').stop(true, true).addClass('lightoff');		
		}
	});
	
	//social network buttons
	
	$(".facebook").mouseenter(function(){ 
			$(this).animate({'left':'6px'},200); 
			$(this).animate({'left':'-4px'},200);
			$(this).animate({'left':'0px'},200); 
	});
	
	// Moves UP & DOWN
	//$(".twitter").mouseenter(function(){ 
	//		$(this).animate({'top':'9px'},200); 
	//		$(this).animate({'top':'-2px'},200);
	//		$(this).animate({'top':'0px'},200); 
	//});
	// Moves LEFT & RIGHT
	$(".twitter").mouseenter(function(){ 
			$(this).animate({'left':'6px'},200); 
			$(this).animate({'left':'-4px'},200);
			$(this).animate({'left':'0px'},200); 
	});	
	

	$(".booking-btn").mouseenter(function(){ 
			$(this).animate({'top':'20px'},200); 
			$(this).animate({'top':'16px'},200);
			$(this).animate({'top':'18px'},200); 
	});	


// floating menu
var name = "#floatImages";
var menuYloc = 20;

$(document).ready(function(){
	//menuYloc = parseInt($(name).css("top").substring(0,$(name).css("top").indexOf("px")))
	$(window).scroll(function () {
		var offset = menuYloc+$(document).scrollTop(); //this sets the offset of the y axis from the top of the document
		var contentHeight = $('#content-outer').height(); //here we are finding the height of the div#content-outer
		var imageHeight = $(name).height(); // here we are finding the height of the images which we are targeting in the first variable i.e. var name = "#floatImages"
		if(offset<(contentHeight-imageHeight)){ //here we deduct the height of the div#content-outer by the height of the div#floatImages and then when we scroll, it wont scroll beyond the value achieved by deducting the 2 divs
			$(name).animate({top:offset+"px"},{duration:800,queue:false}); //this animates the div#floatImages whn scrolling using a pixel value with a specified speed
		}
	});
						   });


});