//Gallery Slider for Zickl
//Made Better Studio
//Jasmine Hegman

var currentPosition = 0;
var slideHeight = 325;
var slides = '';
var numberOfSlides = 0;

$(document).ready(function() {	
	slides = $('#slides img, #about-box .about-page');
	numberOfSlides = slides.length;	

	// Wrap all .slides with #slideInner div
	slides.css('text-align','center');
	slides.css('vertical-align','middle');
	slides.css('margin','0 auto');
	
	
	//Wrap and ignore the whitespace created from Wordpress's gallery listing output
	slides.wrap('<div class="slide-image" style="height:325px; vertical-align: middle; display: table-cell; text-align:center;"><center></center></div>');

	//Change [gallery]'s output to utilize our image resizer
	//$('.gallery-item').each(function() {
	//	var src = $(this).find('a').attr('href');
	//	var newsrc = 'http://davidzickl.com.previewdns.com/resize.php?image=' + src + '&w=458&h=325';
	//	$(this).find('.attachment-thumbnail').attr('src', newsrc);
	//	$(this).find('.attachment-thumbnail').attr('width', 458);
	//	$(this).find('.attachment-thumbnail').attr('height', 325);
	//});
	
	
	// Set #slideInner width equal to total width of all slides
	$('#slides-strip').css('height', slideHeight * numberOfSlides);

	checkArrows(); //Run on page load! :)

	// Create event listeners for .arrows clicks
	$('.arrows, a .arrows').bind('click', function(){
		//Which arrow was clicked?
		var direction = ($(this).attr('id')=='arrow-right') ? 'false' : 'true';
		
		// Determine new position		
		currentPosition = ($(this).attr('id')=='arrow-right')	? currentPosition+1 : currentPosition-1;

		if ( currentPosition >= numberOfSlides ) {
			currentPosition--;
		} else if ( currentPosition < 0 ) {
			currentPosition++;
		}
		
		checkArrows();

		// Move slide strip using margin-top
		$('#slides-strip').css({
			'margin-top' : -1 * (slideHeight*(currentPosition))
			//'top' : slideHeight*(-currentPosition)
		});
	});	
	
});

function checkArrows() {
	if ( currentPosition >= numberOfSlides-1 ) {
		//Disable right arrow
		$("#arrow-right").hide();
	} else
		$("#arrow-right").show();

	if ( currentPosition <= 0 ) {
		//Disable left arrow	
		$("#arrow-left").hide();
		$("#arrow-right").css('margin-left', '39px');
	} else {
		$("#arrow-left").show();
		$("#arrow-right").css('margin-left', '0px');
	}
}