// Studios Carousel
// ver 0.3
// April 20, 2011

/***************************************************************
	follow this structure: 
	
	<div class="studios_carousel">
		<a href="#" class="prev">Prev</a>
		<a href="#" class="next">Next</a>
		<div class="clip">
			<ul class="reel">
				<li></li>
				<li></li>
			</ul>
		</div
	</div>
	
*****************************************************************/


var StudiosCarousel = function($slide_show) {
	
	// set step
	var current_step = 0;
	
	// DOM elements
	var $slide_show = $slide_show;
	var $nav = $slide_show.find('.nav');
	var $reel = $slide_show.find('.reel');

	if ($slide_show.data('pageclass')) {
		var $slides = $reel.find('.'+$slide_show.data('pageclass'));	
	} else {
		var $slides = $reel.find('LI');	
	}

	if ($slide_show.find('.prev A').length) {
		var $prev = $slide_show.find('.prev A');
		var $next = $slide_show.find('.next A');
	} else {
		var $prev = $slide_show.find('A.prev');
		var $next = $slide_show.find('A.next');
	}

// UL.nav_prev_next.big LI.prev

	var $count = $slide_show.find('SPAN.count');  // this does not exist on all carousels

	//  total slides
	var total_slides = $slides.size();	

	// some useful widths
	var clip_width = $slide_show.find('.clip').width();
	var slide_width = $slides.width();
	var reel_width = 0;	
	var margin_right = parseInt($slides.first().css('margin-right'));
	var margin_left = parseInt($slides.last().css('margin-left'));
	var gutter_width = margin_left + margin_right;
	
	// calculate number of slides per view
	var visible_slides = clip_width/slide_width;	
	// round down (there will be margins)
	visible_slides = Math.floor(visible_slides);
	
	var step_distance = visible_slides * ( gutter_width + slide_width);
	
	// calculate total steps
	var total_steps = total_slides/visible_slides;
	// remainders make up a final step
	total_steps = Math.ceil(total_steps);

	/*
		constructor
	*/
	var _init = function() {
	
		_set_count();
		$reel.css('left', 0);
		$prev.addClass('disabled');
		
		if (total_steps == 1) {
			
			// Single page
			
			$next.hide();	
			$prev.hide();	
			
		} else {
			
			// Multiple pages
		
			$reel.css('width', _set_width());
		
			// attach handlers to prev/next
			$next.click(function(event){ 
				event.preventDefault();
				if($(this).hasClass('disabled')) {
					return false;
				};
				_move_slides(current_step + 1);
			});
			$prev.click(function(event){ 
				event.preventDefault();
				if($(this).hasClass('disabled')) {
					return false;
				};
				_move_slides(current_step - 1);
			});
		
		}
	};
	
	var _set_count = function() {
		if($count.length == 0) {
			return false;
		};
		$count.text((current_step + 1) + '/' + total_steps);
	};
	
	var _move_slides = function(new_step) {
	
		current_step = new_step;

		_set_count();
		
		if(current_step == (total_steps - 1)) { 
			$next.addClass('disabled'); 
		} else { 
			$next.removeClass('disabled'); 
		}

		if(current_step == 0) {
			$prev.addClass('disabled'); 
		} else {
			$prev.removeClass('disabled'); 
		}
		
		$reel.animate({
			left : current_step * -step_distance
		},'slow');
		
	};
	
	
	var _set_width = function() {
		_w = 0;
		$slides.first().css('margin-left', 0);
		$slides.last().css('margin-right', 0);
		$slides.each(function(){
			_w += $(this).width();
			_w += parseInt($(this).css('margin-left'));
			_w += parseInt($(this).css('margin-right'));
		});
		
		return _w;
	};

	_init();
};

$(document).ready(function() {
	$('.studios_carousel').each(function() {
		new StudiosCarousel($(this));
	});
});