jQuery(function($){
	$(function(){
		$('#count1').show().animate({opacity:1}, 0);
		
		$('.multiple').each(function(i){
			if(i!=0){
				$(this).css('opacity', .5);
			}
		});
		
		var leftpad = ($(window).width()-900)/2-10;
		$('#scroller #scrollbar').css('paddingLeft', leftpad);
		
		var currentItem = 1;
		var maxItems = $('.workitem').size();
		
		var startScroll = function(toNum){
			var nextEl = $('a.workitem[rel=' + toNum + ']');
			
			// OPTIONS GO HERE
			$('#scroller').scrollTo(nextEl, {
				'duration': 500,
				'offset': {left: (-($(window).width()-900)/2+10)},
				'axis' : 'x'
			});
		};
		
		$(document).keydown(function(e){
			console.log("somethingmorecreative");
			if (e.keyCode==37) {
				slideleft();
			} else
			if (e.keyCode==39) {
				slideright();
			}
		});
		
		function slideleft() {
			$(this).animate({'opacity':1}, 500);
			$(".multiple[rel='"+currentItem+"']").animate({'opacity':.5}, 500);
			$('.workdesc').stop().animate({'opacity':0}, 500, function () {$(this).hide()});
			if( currentItem > 1 ) {
				currentItem--;
				startScroll(currentItem);
			}
			$(".multiple[rel='"+currentItem+"']").animate({'opacity':1}, 500);
			$('#count'+ currentItem).stop().show().animate({'opacity':1}, 500);
		};
		
		function slideright() {
			$(this).animate({'opacity':1}, 500);
			$(".multiple[rel='"+currentItem+"']").animate({'opacity':.5}, 500);
			$('.workdesc').stop().animate({'opacity':0}, 500, function () {$(this).hide()});
			if( currentItem < maxItems ) {
				currentItem++;
				startScroll(currentItem);
			}
			$(".multiple[rel='"+currentItem+"']").animate({'opacity':1}, 500);
			$('#count'+ currentItem).stop().show().animate({'opacity':1}, 500);
		};
		
		$('#scroll-left').click(slideleft);
		
		$('#scroll-right').click(slideright);
		
		$('.single').click(function(){
			$('#scroller').scrollTo(this, {
				'duration': 500,
				'offset': {left: (-($(window).width()-900)/2+10)},
				'axis' : 'x'
			});
			$(this).animate({'opacity':1}, 500);
			currentItem = $(this).attr('rel');
		});
		
		$('.multiple').click(function(){
			if( currentItem == $(this).attr('rel')) {					
			}
			else{
				$('.workdesc').stop().animate({'opacity':0}, 500, function () {$(this).hide()});
				$('#scroller').scrollTo(this, {
				'duration': 500,
				'offset': {left: (-($(window).width()-900)/2+10)},
				'axis' : 'x'
				});
				$(this).animate({'opacity':1}, 500);
				$(".multiple[rel='"+currentItem+"']").animate({'opacity':.5}, 500);
				currentItem = $(this).attr('rel');
				$('#count'+ currentItem).stop().show().animate({'opacity':1}, 500);
				return false
			}
		});
	});
});