$(document).ready(function(){
$('#pager').prepend('<div class="back"></div>').append('<div class="forward"></div>');

$('#slides div').hide();
$('#slides div:first').show();

 cycle();

/*                                                 
*
*	when the mouse enters one of the list items the slideshow goes to that slide and pauses until the mouse leaves
*
*/
 $('#pager li a').unbind().mouseenter(function(){
 var slide = $(this).parent().attr("id").match(/.-(.*)/)[1];
 $(".activeSlide").removeClass("activeSlide");
 $('li#pager-' + slide).addClass("activeSlide");
 $('#slides div').hide();
 $('#slide-' + slide).show();
 stopcycle();
 }).mouseleave(function(){
 	cycle();
 });
 
 $('#slides').mouseenter(function(){
 	stopcycle();
 	}).mouseleave(function(){
 	cycle();
 	
 });
/*
*
*	when the user clicks on the arrows the slide show changes accordingly
*
*/

$('.forward').click(function(){
	var next = $('#slides div:visible').next();

 if(next.length == 0){
 next = $('#slides div:first');
 }

 $('#slides div:visible').next().show();
 $('#slides div:visible').hide();
 next.show();
 var slide = $('#slides div:visible').attr("id").match(/.-(.*)/)[1];
 $('.activeSlide').removeClass('activeSlide');
 $('ul#pager li#pager-' + slide).addClass("activeSlide");

});

$('.back').click(function(){
	var prev = $('#slides div:visible').prev();

 if(prev.length == 0){
 prev = $('#slides div:last');
 }

 $('#slides div:visible').prev().show();
 $('#slides div:visible').hide();
 prev.show();
 var slide = $('#slides div:visible').attr("id").match(/.-(.*)/)[1];
 $('.activeSlide').removeClass('activeSlide');
 $('ul#pager li#pager-' + slide).addClass("activeSlide");

});



});



function stopcycle(){
	clearInterval(slidecycle);
};

function cycle(){
 slidecycle = setInterval(function(){
 $('#slideshow').fadeTo(300, 0.01, function(){
 var next = $('#slides div:visible').next();

 if(next.length == 0){
 next = $('#slides div:first');
 }

 $('#slides div:visible').next().show();
 $('#slides div:visible').hide();
 next.show();
 var slide = $('#slides div:visible').attr("id").match(/.-(.*)/)[1];
 $('.activeSlide').removeClass('activeSlide');
 $('ul#pager li#pager-' + slide).addClass("activeSlide");
 });
 $('#slideshow').fadeTo(300, 1);

 }, 6000);

}