$(document).ready(function() {
	var sliderId = '#mainSlider';
	var container = $(sliderId).find('.supa_slider');
	var items = $(sliderId).find('.s_item');
	var itemsOriginals = [];
	var animStarted = false;
	var item_width = 406;
	var activityZone = $(sliderId).width() * 0.3;
	var direction = 0;
	var duration = 2;
	var slideSize = 10;
	var timer = 0;
	var curPos = 0;
	
	var curWidth = item_width * items.length;
	$(container).width(curWidth);
	
	for (var i = 0; i < items.length; i++) {
		itemsOriginals.push($(items[i]).clone(true));
	}
	
	var itemFirst = 0;
	var cloneFirst = function() {
		var img = $(itemsOriginals[itemFirst]).clone(true);
		items.push(img);
		curWidth += item_width;
		$(container).width(curWidth);
		$(img).appendTo(container);
		itemFirst++;
		if (itemFirst >= itemsOriginals.length) {
			itemFirst = 0;
		}
	}
	
	var itemLast = 0;
	var cloneLast = function() {
		var img = $(itemsOriginals[itemsOriginals.length - 1 - itemLast]).clone(true);
		curWidth += item_width;
		$(container).width(curWidth);
		var offset = $(container).offset();
		if (offset) {
			$(container).css('marginLeft', $(container).offset().left - item_width);
		}
		else {
			$(container).css('marginLeft', -item_width);
		}
		$(img).insertBefore(items[0]);
		items = $(sliderId).find('.s_item');
		itemLast++;
		if (itemLast >= itemsOriginals.length) {
			itemLast = 0;
		}
	}
	
	var startAnimation = function() {
		var doAnimation = function () {
			var z = '+';
			if (direction < 0) z = '-';
			$(container).animate({
				'marginLeft': z + '=' + slideSize
			}, duration, function() {
				curPos += direction * slideSize;
				if (direction < 0) {
					if ($(container).offset().left + curWidth <= $(sliderId).width()) {
						cloneFirst();
					}
				}
				else {
					if ($(container).offset().left >= - slideSize * 2) {
						cloneLast();
					}
				}
			});
		}
		animStarted = true;
		timer = setInterval(doAnimation, duration);
	}
	
	var mouseFunction = function(evt) {
		if (animStarted) return;
		direction = 0;
		if (evt.clientX < activityZone) {
			direction = 1;
		}
		if (evt.clientX > $(sliderId).width() - activityZone) {
			direction = -1;
		}
		if (direction != 0) {
			startAnimation();
		}
	}
	
	var stopAnimation = function() {
		$(container).stop(true);
		clearInterval(timer);
		animStarted = false;
	}
	
	$(sliderId).mousemove(mouseFunction);
	$(sliderId).mouseover(mouseFunction);
	$(sliderId).mouseout(stopAnimation);
	cloneLast();
});