var sliderItemWidth = 150 + 16;
var paddingToDecrease = 6;
var animationSpeedMS = 1000;
var imgSmlW = 150, imgSmlH = 85;
var imgBigW = 584, imgBigH = 330;
var autoSlideDir = 1;
var autoCounterS = 5, autoCounterSTemp;
var isAnimating = false;

$(document).ready(function() {
	if ($("#slider_big").length && $("#slider_big table:first td").length >= 5) {
		$("#slider_big table:first td a").click(function() {
			if (isAnimating) return false;

			var $curImg = $(this).children("img:first");
			if (parseInt($curImg.width()) < (imgSmlW+imgBigW)/2) {
				var $nxtImg = $curImg.parent().parent().parent().nextAll("td:first").find("img:first");
				var step = (parseInt($nxtImg.width()) < (imgSmlW+imgBigW)/2) ? 2 : 1;
				sliderCommander(-1, step);
				return false;
			}
		});

		initSlider();
	}
});


function initSlider() {
	$("#slider_big_container a.nav_left").click(function(e) {
		sliderCommander(+1);
		return false;
	});
	$("#slider_big_container a.nav_right").click(function(e) {
		sliderCommander(-1);
		return false;
	});

	autoCounterSTemp = autoCounterS + 1;
	autoSlide();
}


function autoSlide() {
	autoCounterSTemp--;
	if (autoCounterSTemp < 1) {
		sliderCommander(autoSlideDir);
		autoCounterSTemp = 6;
	}
	setTimeout("autoSlide()", 1000);
}


function sliderCommander(dir, step) {
	if (isAnimating) return;

	isAnimating = true;

	step = (step != 1 && step != 2) ? 1 : step;

	autoSlideDir = dir;
	autoCounterSTemp = autoCounterS + 1;

	if (dir < 0) {
		slideImagesLeft(step);
		fadeContentLeft(step);
	}
	else {
		slideImagesRight(step);
		fadeContentRight(step);
	}

	// detect the old image (the currently selected one)
	var $oldImg = $("#slider_big table:first td.sel:first img:first");
	// detect the new image (the one which will be selected)
	var $newImg = (dir < 0)
		? $oldImg.parent().parent().parent().prevAll("td:eq(" + (step-1) + ")").find("img:first")
		: $oldImg.parent().parent().parent().nextAll("td:eq(" + (step-1) + ")").find("img:first");

	animateOldImage(dir, $oldImg);
	animateNewImage(dir, $oldImg, $newImg);
}


function slideImagesLeft(step) {
	// slide the image list to the left
	$("#slider_big table:first").animate({left: '+=' + sliderItemWidth * step}, animationSpeedMS, function() {
		for (var i=0; i<step; i++) {
			$("#slider_big table:first td:last").insertBefore($("#slider_big table:first td:first"));
		}
		var newLeft = (parseInt($("#slider_big table:first").css("left")) - sliderItemWidth * step) + "px";
		$("#slider_big table:first").css("left", newLeft);
	});
}

function slideImagesRight(step) {
	// slide the image list to the right
	$("#slider_big table:first").animate({left: '-=' + sliderItemWidth * step}, animationSpeedMS, function() {
		for (var i=0; i<step; i++) {
			$("#slider_big table:first td:first").appendTo("#slider_big table:first tr:first");
		}
		var newLeft = (parseInt($("#slider_big table:first").css("left")) + sliderItemWidth * step) + "px";
		$("#slider_big table:first").css("left", newLeft);
	});
}

function fadeContentLeft(step) {
	// fade out the old content
	$("#slider_big li.sel:first").fadeOut(animationSpeedMS / 2, function() {
		$prev = $(this).prevAll("li:eq(" + (step-1) + ")");
		for (var i=0; i<step; i++) {
			$("#slider_big ul:first li:last").insertBefore($("#slider_big ul:first li:first"));
		}
		$(this).removeClass("sel");
		// fade in the new content
		$prev.fadeIn(animationSpeedMS / 2, function() {
			$(this).addClass("sel");
		});
	});
}

function fadeContentRight(step) {
	// fade out the old content
	$("#slider_big li.sel:first").fadeOut(animationSpeedMS / 2, function() {
		$prev = $(this).nextAll("li:eq(" + (step-1) + ")");
		for (var i=0; i<step; i++) {
			$("#slider_big ul:first li:first").appendTo($("#slider_big ul:first"));
		}
		$(this).removeClass("sel");
		// fade in the new content
		$prev.fadeIn(animationSpeedMS / 2, function() {
			$(this).addClass("sel");
		});
	});
}

function animateOldImage(dir, $oldImg) {
	// decrease the size of the old image (the currently selected)
	$oldImg.animate({width: imgSmlW, height: imgSmlH}, animationSpeedMS, function() {
			$(this).parent().parent().parent().removeClass("sel");
			setTimeout("isAnimating = false;", 100);
		}
	);
	// increase the padding around the old image
	$oldImg.parent().parent().animate(
		{
			"padding-top":		"+=" + paddingToDecrease,
			"padding-right":	"+=" + paddingToDecrease,
			"padding-bottom":	"+=" + paddingToDecrease,
			"padding-left":		"+=" + paddingToDecrease
		},
		animationSpeedMS
	);
}

function animateNewImage(dir, $oldImg, $newImg) {
	// increase the the size of the new image (the one which will be selected)
	$newImg.animate({width: imgBigW, height: imgBigH}, animationSpeedMS, function() {
			$(this).parent().parent().parent().addClass("sel");
			setTimeout("isAnimating = false;", 100);
		}
	);
	// decrease the padding around the new image
	$newImg.parent().parent().animate(
		{
			"padding-top":		"-=" + paddingToDecrease,
			"padding-right":	"-=" + paddingToDecrease,
			"padding-bottom":	"-=" + paddingToDecrease,
			"padding-left":		"-=" + paddingToDecrease
		},
		animationSpeedMS
	);
}