// JavaScript Document

$(document).ready(function(){
	$("#scroll-images").css("width", $("#scroll-images li").length * ( $("#scroll-images li").width() + 8 ) + "px")
	var visibleArea = $("#scroll-container").width();
	var maxPos = $("#scroll-images li").length * ( $("#scroll-images li").width() + 8 ) - visibleArea;
	var left = 0;
	if ( $("#scroll-images").width() <= $("#scroll-container").width() ) {
		$("#scroll-button-right").hide();
	}
	$("#scroll-button-left").hide();
	$("#scroll-button-left").click(function(){
		if ( left - visibleArea <= 0 ) {
		left -= left - visibleArea;
			left -= visibleArea;
			$("#scroll-button-right").show();
			$("#scroll-button-left").hide();
		} else {
			left -= visibleArea;
			$("#scroll-button-right").show();
		}
		$("#scroll-images").animate( { left: -1 * left + "px" }, 800 );
	});
	
	$("#scroll-button-right").click(function(){
		if ( left + visibleArea < maxPos ) {
			left += visibleArea;
			$("#scroll-button-left").show();
		} else {
			left += maxPos - left - visibleArea;
			left += visibleArea;
			$("#scroll-button-left").show();
			$("#scroll-button-right").hide();
		}
		$("#scroll-images").animate( { left: -1 * left + "px" }, 800 );
	});
});