$(document).ready(function() {
	
  	$(".buttons button").hover( //hover states for info form
	      function () {
	        $(this).addClass('hover');
	      }, 
	      function () {
	        $(this).removeClass("hover");
	      }
	    );
	

	
	 $(".buttons button").mouseup(function(){
	      $(this).removeClass('click');
	    }).mousedown(function(){
	      $(this).addClass('click');
	    });
	
	$('.slideshow').cycle({//cycle for hompage 
		   fx:     'scrollRight', 
		    speed:  'fast', 
		    timeout: 8000, 
		    pager:  '#nav' 
		});

	/*image swap for home page*/
	var newPhoto2 = new Image();
	var newPhoto3 = new Image();
	var newPhoto4 = new Image();
	newPhoto2.src = '../../../wp-content/themes/skeleton/images/focal-2-image-hover.png';
	newPhoto3.src = '../../../wp-content/themes/skeleton/images/focal-3-image-hover.png';
	newPhoto4.src = '../../../wp-content/themes/skeleton/images/focal-4-image-hover.png';
	var oldSrc2 = $('#focal-2 img').attr('src');
	var oldSrc3 = $('#focal-3 img').attr('src');
	var oldSrc4 = $('#focal-4 img').attr('src');
	
	$('#focal-2 img').hover(
		
		function(){
			$(this).attr('src', newPhoto2.src);
		
		},
		
		function(){
			$(this).attr('src', oldSrc2);
		}); 
	
	$('#focal-3 img').hover(
		function(){
			$(this).attr('src', newPhoto3.src);
		
		},
		
		function(){
			$(this).attr('src', oldSrc3);
		}); 
		
	$('#focal-4 img').hover(
		function(){
			$(this).attr('src', newPhoto4.src);
		},

		function(){
			$(this).attr('src', oldSrc4);
		});
		
		/*end image swap*/



		$("#commentform").validate({
		   rules: {
		     author: "required",
		     email: {
		       required: true,
		       email: true
		     }
		   },
		   messages: {
		     name: "Please specify your name",
		     email: {
		       required: "Your email will not be published, but is required",
		       email: "Your email address must be in the format of name@domain.com"
		     }
		   }
		})
		
		$("#main-form").validate({
		   rules: {
		     contactName: "required",
		 	comments: "required",
		     email: {
		       required: true,
		       email: true
		     }
		   },
		   messages: {
		     contactName: "Please specify your name.",
			comments: "Please provide a little information for me.", 
		     email: {
		       required: "Please submit your email address so I can contact you.",
		       email: "Your email address must be in the format of name@domain.com"
		     }
		   }
		})
		


$('#contactName').focus();

// lightbox on work page	
	// when the DOM is ready
	$(function () {
	  	var img = new Image();
		$('#work-list li a, .slideshow li a').not('.new').bind('click', function() {
			$('#loader').modal()
			var myImage = $(this).attr('href');
			// wrap our new image in jQuery, then:
			$(img)
	    	// once the image has loaded, execute this code
	    	.load(function () {
	      	// set the image hidden by default    
	  		$(this).hide();
			// with the holding div #loader, apply:
	      	$('#loader')
	        // remove the loading class (so no background spinner), 
	        .removeClass('loading')
	        // then insert our image
			 .append(this)
			// fade our image in to create a nice effect
	        $(this).fadeIn('fast');
	 	})
			// if there was an error loading the image, react accordingly
	    	.error(function () {
	      	// notify the user that the image could not be loaded
	    })
			// *finally*, set the src attribute of the new image to our image
	     	.attr('src', myImage);	
			return false;
});	
	
	 
	
				 
			
	 

});

 $('.new').bind('click', function(){
	var link = $(this).attr('href');
	window.open(link)
	return false
	})


})

 
