// function to determine if something is an integer
function is_int(value){
  if((parseFloat(value) == parseInt(value)) && !isNaN(value)){
      return true;
  } else {
      return false;
  }
}


// set animation variable
var animation = 'no';

// set slider page
var page = 0;


$(document).ready(function() {
/*
	Check to see if we need to adjust the css for the .pager ul. 
	If more than 5 samples are available, we need to update CSS for sliding
*/
var numSamples = $('.pager ul li').length;
if(numSamples > 5) {
	// show arrows
	$('.toolbar .prev, .toolbar .next').show();
	
	// adjust .pager ul properties
	$('.pager ul').css({
		'text-align':'left',
		'width':'9999px'
	});
	
}


/* 
	Slide the thumbnails when clicking the arrows
*/
$('.toolbar .next, .toolbar .prev').click(function() {
	var direction = $(this).attr('class');
	Slide(direction);	
});


/*
	Swap out visible sample when corresponding thumbnail is clicked.
*/
$('.toolbar ul li').click(function(){
	var isVisible = $(this).hasClass('visible');
	if (animation == 'no' && !isVisible) {
		var sample = $(this).attr('data-sample');
		animation='yes';
		// switch thumbnail .visible
		$('.toolbar ul li.visible').removeClass('visible');
		$(this).addClass('visible');
		
		// switch .aside and big image .visible
		$('.banners .banner.visible').removeClass('visible').hide();
		$('.banners .banner[data-sample="'+sample+'"]').fadeIn('normal').addClass('visible');
		animation='no';
		
					
	}// if(animation)
});




}); // $(document).ready()


function Slide(direction) {
	// count total number of samples, then divide by width of .pager
	var windowWidth = $('.pager').width();
	var numSamples = $('.pager ul li').length;
	// because there's only 5 visible at a time, divide windowWidth by 5.
	// this will be the base number of pixels to slide.
	var sampleWidth = windowWidth/5; 
	
	// we want to slide to show up to 5 new samples, but not so far that
	// we have empty spaces.  So we have to keep track of number of
	// pages and maxSlide. 
	var maxSlide = sampleWidth * numSamples - windowWidth;
	var numItems = $('.pager ul li').length;
	var maxPages = Math.ceil(numItems/5);
	
	// current 'left' position of .pager ul
	var pos = $('.pager ul').css('left');
	pos = parseInt(pos);
	if(direction == 'next') {
		if(page < maxPages - 1) {
			page++
		}
			
		if (page * windowWidth <= maxSlide) {
			pos = pos - windowWidth;
			$('.pager ul').animate({left:pos});
		} else {
			
			$('.pager ul').animate({left:-maxSlide});
		}
	}
	
	if(direction == 'prev' && (pos < 0)) {
		// determine if there's a "gap" and calculate that gap
		var gap = Math.abs(pos / windowWidth);
		var decimal = gap - parseInt(gap);
		if(is_int(gap)){ // if not a decimal number, there is no gap
			page--;
			pos = pos + windowWidth;
			$('.pager ul').animate({left:pos});
		} else {
			page--;
			if(page > 0) {
				pos = pos + windowWidth;
				$('.pager ul').animate({left:pos});
			} else {
				$('.pager ul').animate({left:0});
				page = 0;
			}
		}
			
	}
}