$(document).ready(function(){
	/* initialise the slideshow when the DOM is ready */ 
	
	$slideshow.init();  
	
	$("#slider-overlay .overlay:not(:first)").hide();
	
	/* Navigation */
	
	$( "#navigation ul li:first" ).before( "<li class='sub-top'></li>" );
	$( "#navigation ul li:last" ).after( "<li class='sub-bottom'></li>" );
	
	jQuery("#navigation ul").css({display: "none"}); // Opera Fix

	jQuery("#navigation li").hover(function() {
		jQuery(this).find('ul:first').css({visibility: "visible",display: "none"}).slideDown(400,"easeInOutQuart");
	}, function() {
		jQuery(this).find('ul:first').css({visibility: "hidden"});
	}); 
	
	$("#slider-container .project").hover( 
		function(){
			$( this ).find( ".detail" ).animate( { top : "120px" }, {queue: false, duration: 800, easing: "easeOutExpo"} );
			//$( "#slider .project a" ).removeClass("shadow");
		},
		function(){
			$( this ).find( ".detail" ).animate( { top : "320px" }, {queue: false, duration: 800, easing: "easeOutExpo"} );
			//$( "#slider .project a" ).addClass("shadow");
		}
	);
	
	// Init Fancybox to ID "fancybox"
	$("a.fancybox").fancybox(); 
	
	// Portfolio
	
	$( ".expand" ).hide();
	
	$( ".toggle" ).click(function() {
		$elem = $( this ).parent().find( ".expand" );
		
		if( $elem.is( ":hidden" ) ) {
			$elem.slideDown(300);
			$( this ).removeClass( "show" ).addClass( "hide" );
		}
		else { 
			$elem.slideUp(300);
			$( this ).removeClass( "hide" ).addClass( "show" );
		}
		return false;
	});
	
	$( "#projects .image-big a, #projects .expand a" ).hover(function(){
		$( this ).find( "img" ).before( "<span class='magnifier' style='visibility: hidden' title='Show Big Image'>Zoom In</span>" );
		$( this ).find( ".magnifier").css( {visibility: "visible", display: "none"} ).fadeIn(1000);
	}, function(){
		$( this ).find( ".magnifier" ).remove();
	});
	
	
	$( ".filter input" ).click(function(){
		var projectTypes = new Array();
		var filterString = ""; 
		
		//Traverse Input's and get all checked Filters
		jQuery.each( $( ".filter input" ), function(){
			if( $( this ).is( ":checked" ) ) 
				projectTypes.push( $( this ).attr( "value" ) );
		});
		
		jQuery.each( projectTypes, function( i ) {
			filterString += "." + this;
			
			if( ++i != projectTypes.length )
				filterString += ", ";
		});

		$( "#projects .project" ).hide();
		if( filterString != "" )
			$( "#projects .project" ).filter( filterString ).fadeIn(500);
		else
			$( "#projects .project" ).fadeIn(500);
	});
	DD_belatedPNG.fix("#bg-wrapper, #logo a, #shadow-top, #shadow-bottom, #wrapper, .services-intro img, .project .detail, #navigation .sub-top, #navigation .sub-bottom, #navigation li ul li, #thumbs, #thumbs .arrow, #footer h4, #footer li, #footer img, .single-service h3");
});

$slideshow = {
	context: false,
	tabs: false,
	projects: false,
	wrapper: false,
	slidespeed: 1000,
	
	init: function(){
		this.context = $("#slider");
		this.tabs = $("#thumbs a");
		this.projects = $(".project", this.context);
		this.wrapper = $(".wrapper", this.context);
		
		var anz_proj = this.projects.length;
		var width = 960 * anz_proj;
		
		this.wrapper.css("width", width);
		$( "#thumbs li:first" ).addClass("active");
		
		this.tabs.click(function(){
			var mult = $slideshow.getIndexOfTab(this.getAttribute("href").split("#")[1]);
			var offsetX = mult * 960;
			$slideshow.setActiveTab( this );
			
			$slideshow.wrapper.animate( { right: offsetX + "px" }, this.slidespeed );
			//$slideshow.setOverlay( this.getAttribute("href").split("#")[1] );	
			return false;
		});
	},
	
	getIndexOfTab: function( id ){
		var index = 0;

		jQuery.each(this.projects, function(){
			if ( this.getAttribute("id") == id )
				return false;
			else
				index++;
		});
		
		return index;
	},
	
	setActiveTab: function( id ){
		jQuery.each( this.tabs, function(){
			if ( $( this ).attr( "href" ) == $( id ).attr( "href" ) ){
				$(this).parent().addClass("active");
				$cur_thumb = $( this ).position();
				$newposition = $cur_thumb.left + $( this ).width() / 2 - 8;

				$( "#thumbs .arrow" ).animate( { left : $newposition }, 800, "easeOutBack" );
			}
			else
				$(this).parent().removeClass("active");
		});
	},
	
	setOverlay: function( id ){
		$("#slider-overlay .overlay").hide();
		
		jQuery.each( $("#slider-overlay .overlay"), function(){
			if ( $(this).attr("id") == id )
				$(this).show();
		});
	}
};