(function($){

	var methods = {

		init: function(options) {

			return this.each(function(index, element){

				var $chronoList = $(this),

					$timeline =  $('.historyTimeline');
					$sliderHolder = $('div.historyTimeline div.historyTimelineSliderHolder'),
					$scaleHolder = $('div.historyTimeline .scale .inner'),
					$chronoListItems = $('.item', $chronoList),
					$scrollToTopLnk = $('.item .scrollToTop a', $chronoList),
					$scaleItems = null,

					numItems = $chronoListItems.length,
					scaleItemWidth = $scaleHolder.width() / numItems
					chronoListTitleTag = 'h2',
					chronoListTopGap = $($chronoListItems.get(0)).position().top,

					currentItem = null,


					timelineHeight =  $timeline.height();


				var buildScale = function(){

					$scaleHolder.empty()
					$timeline.hide();

					$chronoListItems.each(function(i){
						$scaleItem = $('<span>' + $(chronoListTitleTag, this).text() + '</span>')
						.width(scaleItemWidth)
						.click(function(){
							$sliderHolder.slider("value", [i+0.5]);
						})

						$scaleHolder.append($scaleItem);
						$(this).addClass('item-'+(i+1));
					})

					$scaleItems = $('span',$scaleHolder);

					$sliderHolder.width(scaleItemWidth * (numItems-1)).css('margin-left', (scaleItemWidth/2) + parseInt($scaleHolder.css('marginLeft')) )

					$sliderHolder.slider({
						min:0.5,
						max:numItems-0.5,
						step:(numItems)/100,
						value: numItems/100*numItems
					});

					$(window).load(onWindowLoaded)
				}

				var resetSlider = function(){
					$sliderHolder.slider("value", [0.5]);
				}

				var onSliderChange = function(event, ui){

					var newItem = Math.floor(ui.value);

					if(newItem === currentItem) return true;

					currentItem = newItem;

					$scaleItems.removeClass('active')
					$($scaleItems.get(currentItem)).addClass('active')

					var selectedEl = $chronoListItems.get(currentItem),
						top = $(selectedEl).position().top;

					//top = (currentItem > 0) ? top-30 : top;


					$chronoList.stop().animate({'top': -top+chronoListTopGap}, 200)
				}

				var onWindowLoaded = function(){
					$timeline.fadeIn();

					$('.leftCol').height($chronoList.outerHeight() + 50)

					$sliderHolder.bind( "slide slidechange", onSliderChange);
					$scrollToTopLnk.bind('click', resetSlider);
					resetSlider();
				}


				buildScale()

			});

		}

	};

	$.fn.timelineSlider = function(method) {

		if (methods[method]) {
			return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
		}else if(typeof method === 'object' || ! method){
			return methods.init.apply( this, arguments );
		}else{
			$.error('Method ' +  method + ' does not exist on jQuery.timelineSlider');
		}

	};

})(jQuery);

