var markers = new Array();
var slides = new Array();

function initSlider()
{
	var curr_marker = document.getElementById('current_marker');
	var marker_div = document.getElementById('slide_markers');
	var slider_div = document.getElementById('big_slider');
	var links = marker_div.getElementsByTagName('a');
	var items = slider_div.getElementsByTagName('div');
	var i;
	var count = 0;
	var currSlide = 0;
	var slideInterval;
	var slidePause = 8000;
	var slideSpeed = 350;
	
	// assign markers
	for(i = 0; i < links.length; i++) {
		if(links[i].className == 'marker_link') {
			markers.push(links[i]);
		}
	}
	
	// assign slides
	for(i = 0; i < items.length; i++) {
		if(items[i].className == 'big_slide') {
			slides.push(items[i]);
			$(markers[count]).bind('click', {msg: count}, onMarkerClick);
			$(slides[count]).css({'margin-left' : (count * $(slides[count]).width()) + 'px'});
			if(count > 0) {
				$(slides[count]).css({'margin-top' : '-400px'});
			}
			count++;
		}
	}
	
	// run animation
	slideInterval = setTimeout(nextSlide, slidePause);
	
	function onMarkerClick(e)
	{
		var i;
		var j = e.data.msg;
		currSlide = j;
		unbindMarkers();
		clearTimeout(slideInterval);
		moveSlide(j);
		
		// grey out thumbs
		for(i = 0; i < markers.length; i++) {
			$(markers[i]).animate({'opacity' : 0.35}, 'slow');
			$(markers[i]).css({'cursor' : 'default'});
		}
		
		// show resume image and add click event
		$(curr_marker).attr('src', 'images/current_marker_resume.png');
		$(curr_marker).css({'cursor' : 'pointer'});
		$(curr_marker).bind('click', function() {
			for(i = 0; i < markers.length; i++) {
				$(markers[i]).animate({'opacity' : 1}, 'slow');
				$(markers[i]).css({'cursor' : 'pointer'});
			}
			$(this).attr('src', 'images/current_marker.png');
			$(curr_marker).css({'cursor' : 'default'});
			bindMarkers();
			resetSlideInterval();
		});
		
		return false;
	}
	
	function nextSlide()
	{
		resetSlideInterval();
		currSlide++;
		if(currSlide == slides.length)
			currSlide = 0;
		moveSlide(currSlide);
	}
	
	function moveSlide(slideIndex)
	{
		var i;
		var diff = 0 - $(slides[slideIndex]).css('margin-left').replace("px","");
		for(i = 0; i < slides.length; i++) {
			var newMargin = parseInt($(slides[i]).css('margin-left').replace("px","")) + diff;
			$(slides[i]).animate({marginLeft: newMargin}, slideSpeed);
		}
		$(curr_marker).animate({marginLeft: 784 + (slideIndex * 46)}, slideSpeed + 150);
	}
	
	function bindMarkers()
	{
		var i;
		for(i = 0; i < markers.length; i++) {
			$(markers[i]).bind('click', {msg: i}, onMarkerClick);
		}
	}
	
	function unbindMarkers()
	{
		var i;
		for(i = 0; i < markers.length; i++) {
			$(markers[i]).unbind('click', onMarkerClick);
		}
	}
	
	function resetSlideInterval()
	{
		clearTimeout(slideInterval);
		slideInterval = null;
		slideInterval = setTimeout(nextSlide, slidePause);
	}
}

$(document).ready(initSlider);