$(document).ready(function() {                  	

	// CUFON REPLACEMENT
	Cufon.replace('#navbar li a, h1.name, #main h2', { fontFamily: 'PT Sans Narrow' }); 
	
	Cufon.replace('#navbar li a span, .post h3 a, a.read_more, #sidebar h3, #main h3, #main h4', { fontFamily: 'PT Sans' }); 
	
	Cufon.replace('a.button', {
	fontFamily: 'PT Sans',
	textShadow: '1px 1px #434343'
	});

	//NAVIGATION "DROPDOWN" SCRIPT
	$('#navbar ul').css({display: "none"}); 
	$('#navbar li').hover(function(){
		$(this).find('ul:first').css({visibility: "visible", display: "none"}).fadeIn('fast');
		},function(){
		$(this).find('ul:first').css({visibility: "hidden"});
		});	
		
	
	//SHOW THE LOADER AND HIDE FIRST IMAGE IN THE SLIDESHOW UNTIL ALL IMAGES ARE LOADED (SEE THE WINDOW.LOAD FUNCTION BELOW FOR THE SLIDESHOW SCRIPT)
	
	$('#bg img').css('display', 'none');
	$('body').append('<span id="body_loader"></span>');	
	$('#body_loader').fadeIn();
	$('#bg').append('<div class="grid"></div>');  
	
	//RANDOM IMAGE ON PAGE LOAD 	
	$.randomImage = {
		defaults: {
			
			//you can change these defaults to your own preferences.
			path: 'images/', //change this to the path of your images
			myImages: ['background1.jpg', 'background2.jpg', 'background3.jpg', 'background4.jpg', 'background5.jpg' ] //put image names in this bracket. 
			
		}			
	}
	
	$.fn.extend({
			randomImage:function(config) {	
				var config = $.extend({}, $.randomImage.defaults, config); 
				 return this.each(function() {		
						var imageNames = config.myImages;	
						//get size of array, randomize a number from this
						// use this number as the array index
						var imageNamesSize = imageNames.length;
						var lotteryNumber = Math.floor(Math.random()*imageNamesSize);
						var winnerImage = imageNames[lotteryNumber];
						var fullPath = config.path + winnerImage;
						//put this image into DOM at class of randomImage
						// alt tag will be image filename.
						$(this).attr( {
										src: fullPath,
										alt: winnerImage
									});	
				});	
			}
	});
	
		
	//run the random script
	$('.random').randomImage();
	
	//random image script ends here
	

	//ALL THE THINGS HAPPEN AFTER AJAX LOAD   
	var afterLoad = function() { 
			
		//darken the background so it doesn't catch too much attention (but wait 1 second before)
		setTimeout(function(){ 
			var docHeight = $(document).height();
		 	$('.grid').height(docHeight);  		 	                 
            $('.grid').fadeIn('fast');   
            $('#bg').fadeTo('fast', .8);          
        }, 1000); 
	       
		//load fancybox and options
      	$("#gallery_fancybox ul li a").fancybox({
			'overlayOpacity'	: '0.8',
			'overlayColor' 		: 'black',
			'transitionIn' : 'elastic',
			'transitionOut' : 'fade'
		});	
			
		        
        //refresh Cufon (very important!)   			
     	Cufon.refresh();
        
       	// fade in loaded content (main div)	
		$('#loader').fadeOut();	
		$('#main').fadeIn();	
		
		//fade out 'hide menu link'
		$('#hide_menu a').fadeOut();
   		 

        //GALLERY IMAGES HOVER SCRIPT
			
			//add span that will be shown on hover on gallery item
			$("#gallery_fancybox li a.image, #gallery_colorbox li a.image").append('<span class="image_hover"></span>'); //add span to images
			$("#gallery_fancybox li a.video, #gallery_colorbox li a.video").append('<span class="video_hover"></span>'); //add span to videos
	
			$('#gallery_fancybox li a span, #gallery_colorbox li a span').css('opacity', '0').css('display', 'block') //span opacity = 0 
			
			// show / hide span on hover
			$("#gallery_fancybox li a, #gallery_colorbox li a").hover(
				 function () {
					 $(this).find('.image_hover, .video_hover').stop().fadeTo('slow', .7); }, 
				function () {
			  		  $('.image_hover, .video_hover').stop().fadeOut('slow', 0);
			});
				
						
	
    	//FORM (CONTACT) SCRIPT

			//set variables
			var nameVal = $("#form_name").val();
			var emailVal = $("#form_email").val();
			var messageVal = $("#form_message").val();
					

			//if name field is empty, show label in it
			if(nameVal == '') {
			$("#form_name").parent().find('label').css('display', 'block');	
			}
			
			//if email field is empty, show label in it
			if(emailVal == '') {
			$("#form_email").parent().find('label').css('display', 'block');	
			}
						
			
			//if message field is empty, show label in it
			if(messageVal == '') {
			$("#form_message").parent().find('label').css('display', 'block');	
			}

					
			//hide labels on focus		
			$('form input, form textarea').focus(function(){
				$(this).parent().find('label').fadeOut('fast');		
			});
			
			//show labels when field is not focused - only if there are no text
			$('form input, form textarea').blur(function(){
		
				var currentInput = 	$(this);	
				if (currentInput.val() == ""){
	   			 $(this).parent().find('label').fadeIn('fast');
	 			 }
			});		
			
			
			// FORM HANDLING SCRIPT - WHEN USER CLICKS "SUBMIT"
			$("#form_submit").click(function(){		
						   				 		
				// hide all error messages
				$(".error").hide();
				
				// remove "error" class from text fields
				$("form input, form textarea").focus(function() {
		 			$(this).removeClass('error_input');
					});
				
				// remove error messages when user starts typing		
				$("form input, form textarea").keypress(function() {
		 			$(this).parent().find('span').fadeOut();	
					});
					
				$("#form_message").keypress(function() {	
					$(this).animate({ 
  			  			width: "380px"
 			 		}, 100); 
				});	
				
				
				// set variables
				var hasError = false;
				var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
				
				
				// validate "name" field
				var nameVal = $("#form_name").val();
				if(nameVal == '') {
					$("#form_name")
					.after('<span class="error">Please enter your name</span>')
					.addClass('error_input')				  
					hasError = true;
				}
				
			
			
				// validate "e-mail" field - andd error message and animate border to red color on error
				var emailVal = $("#form_email").val();
				if(emailVal == '') {
					$("#form_email")
					.after('<span class="error">Please enter your e-mail</span>')
					.addClass('error_input')
					hasError = true; 
						
				} else if(!emailReg.test(emailVal)) {	
					$("#form_email")
					.after('<span class="error">Please provide a valid e-mail</span>')
					.addClass('error_input')
					hasError = true;
				}
				
						
				// validate "message" field
				var messageVal = $("#form_message").val();
				if(messageVal == '') {
					$("#form_message")
					.animate({ 
  			  			width: "250px"
 			 		}, 100 )
					.after('<span class="error comment_error">Please enter your message</span>')
					.addClass('error_input')
					hasError = true;
				}
				
		                // if the are errors - return false
		                if(hasError == true) { return false; }
		            
				// if no errors are found - submit the form with AJAX
				if(hasError == false) {
					
				var dataString = $('#contact_form').serialize();
		
					//hide the submit button and show the loader image	
					$("#form_submit").fadeOut('fast', function () {
					$('#contact_form').append('<span id="loader"></span>'); 
					});
					       
					
				// make an Ajax request
		        $.ajax({
		            type: "POST",
		            url: "php/contact-send.php",
		            data: dataString,
		            success: function(){ 
		           
		          // on success fade out the form and show the success message
		          $('#loader').remove();
		          $('#contact_form').children().fadeOut('fast');
		          $('.contact_info').fadeOut('fast');
		           $('.success').fadeIn();    	
		            }
		        }); // end ajax
		
				 return false;  
				} 	
				
			});			
			
					
 } //afterLoad ends here	
	

	//LOAD CONTENT WITH AJAX                  
    $("#navbar li").delegate("a:not(.index)", "click", function() {
        window.location.hash = $(this).attr("href");
        return false;
    
    });
    
       
    
 	$(window).bind('hashchange', function(){

		var hash = window.location.hash.substr(1);

        toLoad = hash + " #main"
        
        toBg = hash + " #bg img.active"
               
        if (hash) {
        	
        	$('#main').fadeOut('fast', function () {
				
	//we'll be loading #main div	
            
            $('#main_wrap').fadeIn('normal', function (){   
            			
            	$(this).css('filter',''); 
            	            	       
			       $('#bg img.active').css('display', 'inline');
				            		 	           	
            //add loader  
           	$('#main_wrap').append('<span id="loader">Loading...</span>');  	
           	$('#loader').fadeIn('fast');
  
			  //load main itself
			$('#main').load(toLoad, '', afterLoad); 
			});
		});
		
		
		$("#navbar li a")
		.css('color', '#a3a3a3')
			.find('span')
			.css('color', '#555555');
			
    	
		$("#navbar li a[href="+hash+"]")
        	.css('color', 'white')
				.find('span')
				.css('color', '#aaaaaa');
        	      	
        $("#navbar li ul li a[href="+hash+"]")
        	.parents('li')
	        	.find('a:first')
	        	.css('color', 'white')
        	.parents('li.top_nav')
	        	.find('span')
	        	.css('color', '#aaaaaa');
			
		};
        
	

                                            
 });
 
 	//TRIGGER HASHCHANGE EVENT
	$(window).trigger('hashchange');
	       
	//if link has class 'not' link - prevent default behaviour (make it unclickable)
	$('#navbar li a.not_link').click(function(event){
		event.preventDefault();
		});   
         
    
	//CONTACT PAGE MAP - CHANE OPACITY ON HOVER
		$('img.map').css('opacity', '.5');
		
		$('img.map').hover(function(){
			$(this).fadeTo('fast', 1);
			
		},
		function(){
		$(this).fadeTo('fast', .5);	
		
		});


}); //document.ready function ends here



//WAIT UNTIL CONTENT IS LOADED
$(window).load(function() {
	 
	//hide loader
	$('#body_loader').hide().remove();
	
	//fade in the image
	$('#bg img').fadeIn('normal');
	   	
});