// JavaScript Document

function nextImage(){
	var $active = $('#thumbnails .active');
	var $next = ($('#thumbnails .active').next().length > 0) ? $('#thumbnails .active').next() : $('#thumbnails div.thumbnail:first');
	
	$('#large_image_box').fadeOut(function() {

		$active.removeClass('active');
		$next.addClass('active');

		$('#thumbnails div.thumbnail:first').insertAfter($('#thumbnails div.thumbnail:last'));
		
		$('#large_image').attr({
			'src':$next.children('div.big_src:first').html()
		});
		$('#project_link').attr({
			'href':$next.children('div.big_link:first').html()
		});

		$('#image_title').html($next.children('div.big_title:first').html());
		$('#image_description').html($next.children('div.big_description:first').html());

		$(this).fadeIn();
	});
}
function previousImage(){
	var $active = $('#thumbnails .active');
	var $previous = ($('#thumbnails .active').prev().length > 0) ? $('#thumbnails .active').prev() : $('#thumbnails div.thumbnail:last');
	
	$('#large_image_box').fadeOut(function() {
		$active.removeClass('active');
		$previous.addClass('active');

		$('#thumbnails div.thumbnail:last').insertBefore($('#thumbnails div.thumbnail:first'));
		
		$('#large_image').attr({
			'src':$previous.children('div.big_src:first').html()
		});
		$('#project_link').attr({
			'href':$previous.children('div.big_link:first').html()
		});
		$('#total_photos').attr({
			'href':$previous.children('div.big_link:first').html()
		});
		$('#total_photos').html($previous.children('div.photo_count').html());

		$('#image_title').html($previous.children('div.big_title:first').html());
		$('#image_description').html($previous.children('div.big_description:first').html());
		
		$(this).fadeIn();
	});
}
function showMore() {
	$('#project_data_wrapper').css({
		'overflow':'hidden',
		'display':'block',
		'z-index':'20',
		'width':'100%',
		'margin-top':'-200px',
		'height':'197px',
		'border-top':'3px solid #141206'
	});
	$('#project_data').css({
		'opacity':'.80',
		'filter':'alpha(opacity=80)',
		'position':'absolute',
		'height':'187px'
	});
	$('#project_description').css({
		'visibility':'visible'
	});
	$('#show_more').css({
		'display':'none'				
	});
	$('#show_less').css({
		'display':'inline'				
	});
}
function showLess() {
	$('#project_data_wrapper').css({
		'position':'absolute',
		'z-index':'11',
		'width':'100%',
		'margin-top':'-50px',
		'height':'47px',
		'border-top':'3px solid #141206'
	});
	$('#project_data').css({
		'opacity':'.80',
		'filter':'alpha(opacity=80)',
		'height':'37px'
	});
	$('#project_description').css({
		'visibility':'hidden'
	});
	$('#show_more').css({
		'display':'inline'	
	});
	$('#show_less').css({
		'display':'none'				
	});
}
var interval;
var doHideOverlays;
function hideOverlays() {
	$('#show_control').slideUp('slow');
	clearInterval(doHideOverlays);
}

$(document).ready(function(){

	$('#category_navigation').html($('#thumbnails'));
	$('#thumbnails').css({'display':''});

	$('#page_content').css({
		'height':'600px'
	});
	if($('div.thumbnail').length == 0) {
		$('#large_image').css({
			'display':'none'
		});
	}
	showLess();
	// Run our nextImage() function every 5 secs
	if($('div.thumbnail').length > 1) {
		$('#show_control').css({
			'display':'block'
		});
		interval = setInterval('nextImage()', 5000);
		doHideOverlays = setInterval('hideOverlays()', 1500);
	}

	$('#large_image_box').hover(function () {
		if($('div.thumbnail').length > 1) {
			$('#show_control').slideDown();
			clearInterval(doHideOverlays);
		}
	},function () {
		$('#show_control').slideUp();
	});

	$('#pause').click(function () {
		$(this).fadeOut();
		$('#play').fadeIn();
		clearInterval(interval);
	});
	$('#play').click(function () {
		$(this).fadeOut();
		$('#pause').fadeIn();
		interval = setInterval('nextImage()', 4000);
	});
	$('#next').click(function () {
		clearInterval(interval);
		$('#pause').fadeOut();
		$('#play').fadeIn();
		nextImage();
	});
	$('#previous').click(function () {
		clearInterval(interval);
		$('#pause').fadeOut();
		$('#play').fadeIn();
		previousImage();
	});

	$('#show_less').click(function() {
		showLess();
	});
	$('#show_more').click(function() {
		showMore();
	});
});