$().ready(function() {
		initCarousels();

		// disolve header on services page
		$("#services_photo").cjSimpleSlideShow({
			delay: 7000,
			dissolve: 100,
			showCaptions: false
		});
		
		
		// homepage carousel
		$("#homepage-carousel").jcarousel({
	        scroll: 1,
	        auto: 8,
	        animation: "slow",
	        wrap: "circular",
    	    buttonNextHTML: null,
        	buttonPrevHTML: null,
		    initCallback: hmcarousel_initCallback,			
			itemVisibleInCallback: {
				onBeforeAnimation: hmcarousel_itemVisibleInCallback
			},
	        itemVisibleOutCallback: {onAfterAnimation: hmcarousel_itemVisibleOutCallback}
        	
		});
	});


	function hmcarousel_initCallback(carousel, item, i, state, evt) {
	    var idx = carousel.index(i, $(".homepage-slide").size());
	    var idx2 = carousel.index(i+1, $(".homepage-slide").size());
	    carousel.add(i, hmcarousel_getItemHTML(idx) );
	    
	    // if there's a next slide grab that too
	    if(idx != idx2)
		    carousel.add(i+1, hmcarousel_getItemHTML(idx2) );
	}
	function hmcarousel_itemVisibleInCallback(carousel, item, i, state, evt) {
	    var idx = carousel.index(i, $(".homepage-slide").size());
	    var idx2 = carousel.index(i+1, $(".homepage-slide").size());
	    carousel.add(i, hmcarousel_getItemHTML(idx) );
	    
	    // if there's a next slide grab that too
	    if(idx != idx2)
		    carousel.add(i+1, hmcarousel_getItemHTML(idx2) );
	}
	function hmcarousel_itemVisibleOutCallback(carousel, item, i, state, evt) {
	    carousel.remove(i);
	}
	function hmcarousel_getItemHTML(idx) {
	    var html = $("#homepage-slide-"+idx).html();
	    return html;
	}	
	function hmcarousel_itemVisibleOutCallback(carousel, item, i, state, evt) {
	    carousel.remove(i);
	}
	
	



	function initCarousels() {
		// Init carousels on showcase
		$(".showcase-carousel").jcarousel({
			scroll: 1,
			wrap: "circular",
			itemVisibleInCallback: {onBeforeAnimation: mycarousel_itemVisibleInCallback},
	        itemVisibleOutCallback: {onAfterAnimation: mycarousel_itemVisibleOutCallback}
		});	
	}
	
	function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt) {
		var carouselID = carousel.id.replace("carousel-","");
	    var idx = carousel.index(i, $(".carousel-"+ carouselID +"-slides").size());
	    var idx2 = carousel.index(i+1, $(".carousel-"+ carouselID +"-slides").size());
	    carousel.add(i, mycarousel_getItemHTML(carouselID, idx) );
	    
	    // if there's a next slide grab that too
	    if(idx != idx2)
		    carousel.add(i+1, mycarousel_getItemHTML(carouselID, idx2) );
	};

	function mycarousel_itemVisibleOutCallback(carousel, item, i, state, evt) {
	    carousel.remove(i);
	};
	
	function mycarousel_getItemHTML(carouselID, idx) {
	    var html = $("#carousel-"+ carouselID +"-slide-"+idx).html();
	    return html;
	};	
	


	
	function loadShowcase(s) {
		filterID = $("#categoryFilter").val();
		if(filterID != "") {
			filterName = s.options[s.selectedIndex].value;
			//filterName = filterName.replace(/&/g,"and").replace(/\ /g, "-").toLowerCase();
			window.location.href = "/web-design-portfolio/"+ filterName +"/index.phps";
		}
	}

$(document).ready(function() {
    $('#blog_items img').hide().fadeIn(1000);
    //$('.showcase_summary img').hide().fadeIn(1000);
    
    
    	$("#contact_form").validate({
		rules: {
			con_name: "required",
			con_email: { required: true, email: true},
			con_comment: "required"
			
		},
		errorLabelContainer: $("#contact_form div.hideerror"),
		errorContainer: "#errorContainer",
		submitHandler: function(form) {
			if($("#contact_form").valid()) 
				form.submit();
		}		
	});	
		

});