$j(document).ready(function(){
	var caseStudies= new caseStudiesInstance();
	caseStudies.init();
	
});
function caseStudiesInstance(){};
caseStudiesInstance.prototype = {
	init : function(){
		var o = this;
		//o.firstRun = true;
		o.component = $j('#Timeline');
		o.scroll = $j('#TimelineScroll',o.component);
		o.scrollPane = $j('#TimelineScrollPane',o.component);
		o.items = $j('.scroll-item',o.component);
		o.scrollTriggers = $j('.scroll-trigger', o.component);
		o.next = $j('#TimelineNext', o.component);
		o.previous = $j('#TimelinePrevious', o.component);
		o.setScrollPaneWidth();
		o.scrolling = false;
		o.caseStudies = $j('div.case-study');
		o.caseStudyTrigger = $j('.scroll-item a');
		o.currentCase = $j('div.case-study-active');
		o.render();
	},
	render : function() {
		var o = this;
		o.scrollPane.css({ width:  o.scollPaneWidth });
		o.scroll.serialScroll({
			items:'li',
			prev: o.previous,
			next: o.next,
			offset:0, //when scrolling to photo, stop 230 before reaching it (from the left)
			start:1, //as we are centering it, start at the 2nd
			step: 4,
			duration:1200,
			force:false,
			stop:true,
			lock:false,
			cycle:false, //don't pull back once you reach the end
			jump: false //click on the images to scroll to them
		});
	
		o.events();
	},
	setScrollPaneWidth : function(){
		var o = this;
		o.scollPaneWidth = 0;
		o.items.each(function(e) {
			o.scollPaneWidth += ($j(this).outerWidth());
		});
	},
	events : function(){
		var o = this;
		o.scrollTriggers.hover(
			function() { $j(this).css({backgroundPosition: '0 -31px'}); },
			function() { $j(this).css({backgroundPosition: '0 0'}); }
		);
		//Set Case Studies
		o.caseStudyTrigger.click(function(){
			if(o.firstRun){
				o.firstRun = false;
				return;
			}	
			var anchor = $j(this).attr('href');
			o.currentCase.animate({opacity: 'hide'},600,function(){
				o.caseStudies.removeClass('case-study-active');
				o.currentCase = $j(anchor);
				o.currentCase.animate({opacity: 'show'},1000);
				o.currentCase.addClass('case-study-active');
			});			
		});
	}
}