// Sliders for seanbellows.com
$(document).ready(function(){
	/* This code is executed after the DOM has been completely loaded */

//EPUB SLIDER
	//Set Default State of each portfolio piece
		$("#epub-box menu").show();
		$("#epub-box menu a:first").addClass("active");

	//Get size of images, how many there are, then determin the size of the image reel.
		var imageWidth = $("#epub-box .window").width();
		var imageSum = $("#epub-box .image_reel img").size();
		var imageReelWidth = imageWidth * imageSum;

		//Adjust the image reel to its new size
		$("#epub-box .image_reel").css({'width' : imageReelWidth});

	//Paging + Slider Function
		rotate = function(){	
			var triggerID = $active.attr("rel") - 1; //Get number of times to slide
			var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide
			$("#epub-box menu a").removeClass('active'); //Remove all active class
			$active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)

	//Slider Animation
			$("#epub-box .image_reel").animate({ 
				left: -image_reelPosition
			}, 500 );
		}; 

	//Rotation + Timing Event
		rotateSwitch = function(){		
			play = setInterval(function() { //Set timer - this will repeat itself every 3 seconds
				$active = $('#epub-box menu a.active').next();
				if ( $active.length === 0) { //If paging reaches the end...
					$active = $('#epub-box menu a:first'); //go back to first
				}
				rotate(); //Trigger the paging and slider function
			}, 7000); //Timer speed in milliseconds (3 seconds)
		};
		rotateSwitch(); //Run function on launch

	//On Hover
		$("#epub-box .image_reel a").hover(function() {
			clearInterval(play); //Stop the rotation
		}, function() {
			rotateSwitch(); //Resume rotation
		});	

	//On Click
		$("#epub-box menu a").click(function() {	
			$active = $(this); //Activate the clicked paging

			//Reset Timer
			clearInterval(play); //Stop the rotation
			rotate(); //Trigger rotation immediately
			rotateSwitch(); // Resume rotation
			return false; //Prevent browser jump to link anchor
		});	
	});

/************************************************************************************/
//DESIGN SLIDER
/************************************************************************************/
$(document).ready(function(){
	var totWidth=0;
	var positions = new Array();
	
	$('#design-box .slides .slide').each(function(i){
		
		/* Traverse through all the slides and store their accumulative widths in totWidth */
		
		positions[i]= totWidth;
		totWidth += $(this).width();
		
		/* The positions array contains each slide's commulutative offset from the left part of the container */
		
		if(!$(this).width())
		{
			alert("Please, fill in width & height for all your images!");
			return false;
		}
		
	});
	
	$('#design-box .slides').width(totWidth);

	/* Change the cotnainer div's width to the exact width of all the slides combined */

	$('#design-box menu ul li a').click(function(e,keepScroll){

			/* On a thumbnail click */

			$('li.menuItem').removeClass('act').addClass('inact');
			$(this).parent().addClass('act');
			
			var pos = $(this).parent().prevAll('.menuItem').length;
			
			$('#design-box .slides').stop().animate({marginLeft:-positions[pos]+'px'},500);
			/* Start the sliding animation */
			
			e.preventDefault();
			/* Prevent the default action of the link */
			
			
			// Stopping the auto-advance if an icon has been clicked:
			if(!keepScroll) clearInterval(itvl);
	});
	
	$('#design-box menu ul li.menuItem:first').addClass('act').siblings().addClass('inact');
	/* On page load, mark the first thumbnail as active */
	
	
	
	/*****
	 *
	 *	Enabling auto-advance.
	 *
	 ****/
	 
	var current=1;
	function autoAdvance()
	{
		if(current==-1) return false;
		
		$('#design-box menu ul li a').eq(current%$('#design-box menu ul li a').length).trigger('click',[true]);	// [true] will be passed as the keepScroll parameter of the click function on line 28
		current++;
	}

	// The number of seconds that the slider will auto-advance in:
	
	var changeEvery = 10;

	var itvl = setInterval(function(){autoAdvance()},changeEvery*1000);
		});	


/************************************************************************************/
//ILLUSTRATION SLIDER
/************************************************************************************/
$(document).ready(function(){
	var totWidth=0;
	var positions = new Array();
	
	$('#frames .frame').each(function(i){
		
		/* Traverse through all the frames and store their accumulative widths in totWidth */
		
		positions[i]= totWidth;
		totWidth += $(this).width();
		
		/* The positions array contains each frame's commulutative offset from the left part of the container */
		
		if(!$(this).width())
		{
			alert("Please, fill in width & height for all your images!");
			return false;
		}
		
	});
	
	$('#frames').width(totWidth);

	/* Change the cotnainer div's width to the exact width of all the frames combined */

	$('#illo-box menu ul li a').click(function(e,keepScroll){

			/* On a thumbnail click */

			$('li.menuItem2').removeClass('act').addClass('inact');
			$(this).parent().addClass('act');
			
			var pos = $(this).parent().prevAll('.menuItem2').length;
			
			$('#frames').stop().animate({marginLeft:-positions[pos]+'px'},500);
			/* Start the sliding animation */
			
			e.preventDefault();
			/* Prevent the default action of the link */
			
			
			// Stopping the auto-advance if an icon has been clicked:
			if(!keepScroll) clearInterval(itvl);
	});
	
	$('#illo-box menu ul li.menuItem2:first').addClass('act').siblings().addClass('inact');
	/* On page load, mark the first thumbnail as active */
	
	
	
	/*****
	 *
	 *	Enabling auto-advance.
	 *
	 ****/
	 
	var current=1;
	function autoAdvance()
	{
		if(current==-1) return false;
		
		$('#illo-box menu ul li a').eq(current%$('#illo-box menu ul li a').length).trigger('click',[true]);	// [true] will be passed as the keepScroll parameter of the click function on line 28
		current++;
	}

	// The number of seconds that the framer will auto-advance in:
	
	var changeEvery = 10;

	var itvl = setInterval(function(){autoAdvance()},changeEvery*1000);

	/* End of customizations */
}
);