onload = function() {

/* the default set values */
currentphoto = 1;
buttonnum = 1;
timer=0;

/* time before transition in milliseconds */
delay=9000;

/* auto settings */
photocount = $('#buttons div img').length;
width = $('#p1 img').outerWidth();

/* initial set up */
$('#buttons div img').animate({opacity: 0.7});
$('#buttons #b1 img').animate({opacity: 1});
$('#buttons #b1 img').css("borderColor","#fff");

$('#p1').animate({"left": "0px"}, 950, "swing");
$('#loading').css("display","none");

/* start the timer */
timer = setTimeout ("autoPlay()", delay);


$("#next").click(function() {
		buttonnum = currentphoto;
		currentphoto++
	if (currentphoto == (photocount+1) ) {currentphoto = 1}
animateLeft(currentphoto,buttonnum)
});

$("#previous").click(function() {
		buttonnum = currentphoto;
		currentphoto--
	if (currentphoto == 0 ) {currentphoto = photocount}
animateRight(currentphoto,buttonnum)
});

$("#buttons div").click(function() {
	buttonnum=currentphoto;
	clickButton = $(this).attr('id');
	currentphoto = parseInt(clickButton.slice(1));
	if (currentphoto > buttonnum) {animateLeft(currentphoto,buttonnum)}
	if (currentphoto < buttonnum) {animateRight(currentphoto,buttonnum)}
});

function animateRight(currentphoto,buttonnum) {
	$('#p'+currentphoto).css("left",-width+"px");
	$('#p'+currentphoto).animate({"left": "0px"}, 950, "swing");
	$('#p'+buttonnum).animate({"left": width+"px"}, 950, "swing");
	setbutton()
}

$("#wrap").mouseover(function() {clearTimeout(timer);});
$("#wrap").mouseout(function() {timer = setTimeout ("autoPlay()", delay);});

}  /* closes onload function */

function autoPlay () {
	buttonnum = currentphoto;
	currentphoto++
	if (currentphoto == (photocount+1) ) {currentphoto = 1}
	animateLeft(currentphoto,buttonnum)

timer = setTimeout ("autoPlay()", delay);
}

function animateLeft(currentphoto,buttonnum) {
	$('#p'+currentphoto).css("left",width +"px");
	$('#p'+currentphoto).animate({"left": "0px"}, 950, "swing");
	$('#p'+buttonnum).animate({"left": -width+"px"}, 950, "swing");
	setbutton()
}

function setbutton () {
	$('#b'+buttonnum+' img').animate({opacity: 0.7})
						.css("borderColor","#333");
	$('#b'+currentphoto+' img').animate({opacity: 1})
						.css("borderColor","#fff");
}
