$(document).ready(function() {
	//this fades the textbox div in and out on the image pages
    $('div#fadebox').animate({
	opacity: 1.0,
	},1000).animate({
	opacity: 1.0,
	},2000).animate({
	opacity: 0,
	},1000);
	
	var slider_length = 0;
	$("div.imagecontainer img").each(function(e){
		slider_length = slider_length + $(this).width() + 10;
	});
	
	//this controls the slider
	$("div#slider").width(slider_length + "px");

	$('div.wrapper div.main div.slider_bar_container div#slider_bar').slider({
		min: 0, 
		max: slider_length - ($(window).width() ), 
		animate: 1,
		slide: function(){
			var slider_pos = $('div.wrapper div.main div.slider_bar_container div#slider_bar').slider('value');
			$("div.wrapper div.main div.slider_container .slider").css("margin-left","-"+slider_pos+"px");

		}
	});
//slides the naviagation items in and out	
	$("div.nav ul li a").hover(
	function(){
		$(this).animate({ 
	        marginLeft: "0px" }, 200 );
	   
	},function(){
		offset = "-50px";
		if ($(this).parent().attr("class") == 'download'){
			offset = "-28px"
		}
		if ($(this).parent().attr("class") == 'biography'){
			offset = "-28px"
		}
		$(this).animate({ marginLeft: offset }, 200 );
	});
	
	//controls the hover states of the slider left and right arrows
	$("a.slider_arrow").hover(function(){
		var imgsrc = $("img",$(this)).attr("src");
		$("img",$(this)).attr("src",imgsrc.replace("\.gif","_over\.gif"));
	},function(){
		var imgsrc = $("img",$(this)).attr("src");
		$("img",$(this)).attr("src",imgsrc.replace("_over\.gif","\.gif"));
	}).click(function(){
		//adds the onclick action to the arrows, this slides the images across
		var slider_pos = $('div#slider_bar').slider('value');
		var width = 0;
		var index = 0;
		$("div#slider div.imagecontainer").each(function(){
			var newindex = $("div#slider div.imagecontainer").index($(this)); 
			if (width < slider_pos + 101){
				width += $(this).width() + 7;
				index = newindex;
			}
		});
		if($(this).attr("class").match("left")){index -= 1;}
		else {index += 1}
		var width = getwidth(index);
		var container = $('div.imagecontainer:eq('+index+')');
		var position = width ;
		moveSlides(position,width);
		return false;
	});
	
	
	$("div.imagecontainer img").addClass('main');
	//add back arrow to each image
	$('<a class="imgbackarrow" href="#"><img src="images/left_arrow.gif" /></a>').insertBefore($("div.imagecontainer img.main"));
	
	//add forward arrow to each image
	$('<a class="imgforwardarrow" href="#"><img src="images/right_arrow.gif" /></a>').insertAfter($("div.imagecontainer img.main"));
	

	$("div.imagecontainer a.imgforwardarrow").click(function(){
		var container = $(this).parent();
		var index = $("div.imagecontainer").index(container);
		var width = getwidth(index + 1);
		var position = width ;
	 	moveSlides(position,width);
		return false;

	});	
	
	$("div.imagecontainer a.imgbackarrow").click(function(){
		
		var container = $(this).parent();
		var xposition = container.position();
		var index = $("div.imagecontainer").index(container);
		if (xposition.left = 0){
			var width = getwidth(index - 1);
			var position = width ;
		} else {
			index = getfirstimage();
			var width = getwidth(index - 1);
			var position = width ;
		}
	 	moveSlides(position,width);
		return false;
	});
//	set all hover arrows to 0 opacity
	
	$("div.imagecontainer a img").animate({
	opacity: 0,
	},0);
	
	$("div.imagecontainer a").hover(function(){
		$("img",this).animate({
		opacity: 1.0,
		},200);
	},function(){
		$("img",this).animate({
		opacity: 0,
		},200);
	}
	);


function moveSlides (position,width){
	$("div.slider_container .slider").animate({
		marginLeft: "-"+position+"px"
	},500, '', function(){$('div#slider_bar').slider("moveTo", width)});
}

//returns distance in px for a image div from it's parent contatiner
function getwidth (index){
		var width = 0;
		$("div.imagecontainer").each(function(){
			var newindex = $("div.imagecontainer").index($(this)); 
			if (newindex < index){
				width += $(this).width() + 7;	
			}
		});
		return width;
}
	
function getfirstimage (){
		var index = 0;
		$("div.imagecontainer").each(function(){
			var xposition = $(this).position();
			if (xposition.left == 0){				
				index = $("div.imagecontainer").index(this);
			}
		});
		return index;
}


// adds the correct number of dashed under the text
	$('div.imagecontainer p').each(function(){
	var secondlength = $(this).text().split('(').pop();
	secondlength = secondlength.length;
	firstlength = $(this).text();
	secondlength = firstlength.length - secondlength - 2;
	strlength = "";
	strsecond = "";
	for(i = 0;i < secondlength;i++){
    	strsecond = strsecond + "-";
	}
	for(i = 0;i < firstlength.length;i++){
    	strlength = strlength + "-";
	}
//	alert(strlength.length + " " + strsecond.length );
	$(this).prepend("<span>" + strsecond + "</span><br />")
	$(this).append("<br /><span class='white'>" + strlength + "</span>");
}
);
	
 });