var ChampionsMove = function() {
	var self = this;
	var $prev = $('<a class="arrow" />').addClass('arrow-prev').appendTo($('body')).hide();
	var $next = $('<a class="arrow" />').addClass('arrow-next').appendTo($('body')).hide();

	var $wrapper = $('#champions');
	var $inner = $('#champions-inner');
	var $lines = $('.champion-line');
	var $boxes = $('.champion-box');
	var $firstLineBoxes = $('.champion-box', $('.champion-line').eq(0));
	
	var actualIndex = 0;
	var maxMoveIndex = $firstLineBoxes.length - 1;
	
	var boxHeight = $boxes.eq(0).outerHeight();
	var boxWidth = $boxes.eq(0).outerWidth() + parseInt($boxes.eq(0).css('marginRight'));
	
	$wrapper.height($lines.length * boxHeight);
	$wrapper.css({position: 'relative', overflow: 'visible'});
	$inner.css({position: 'absolute', left: 0, top: 0});
	
	this.recountPositions = function() {
		var needed = ($firstLineBoxes.length * boxWidth) - parseInt($boxes.eq(0).css('marginRight')) + $wrapper.offset().left;
		var isWindowSizeOk = (needed <= $(window).width());
		
		var maxArrowPosition = $wrapper.offset().top + $wrapper.outerHeight();
		var centeredArrowPosition = ($(window).height() / 2) + $(window).scrollTop();
		var arrowPosition = maxArrowPosition < centeredArrowPosition ? maxArrowPosition : centeredArrowPosition;
		$('.arrow').css('top', arrowPosition + 'px');
		
		if (isWindowSizeOk) {
			$('.arrow').hide();
		} else {
			if (actualIndex == maxMoveIndex) {
				$prev.show();
				$next.hide();
			} else if (actualIndex == 0) {
				$prev.hide();
				$next.show();
			} else {
				$('.arrow').show();
			}
		}
	}
	
	this.moveTo = function(newIndex, speed) {
		var speed = speed == undefined ? 'slow' : speed;
		var leftOffset = newIndex * boxWidth * -1;
		if (speed == 0) {
			$inner.stop(true).css('left', 0);
			$boxes.stop(true).css('left', 0);
		} else {
			$inner.animate({left: leftOffset + 'px'}, speed, 'easeOutQuad');
			for (var i = 0; i < $lines.length; i++) {
				if (actualIndex < newIndex) {
					$boxes.eq(actualIndex + ($firstLineBoxes.length * i)).animate({left: $wrapper.offset().left * -1 + 'px'}, speed, 'easeOutQuad');
				} else {
					$boxes.eq(newIndex + ($firstLineBoxes.length * i)).animate({left: 0}, speed, 'easeOutQuad');
				}
				
			}
		}
		actualIndex = newIndex;
	}
	
	this.move = function(indexCount) {
		var newIndex = actualIndex + indexCount;
		if (newIndex < 0) {
			return false;
		} else if (newIndex > maxMoveIndex) {
			return false;
		}
		this.moveTo(newIndex);
		this.recountPositions();
	}
	
	this.recountPositions();
	
	$prev.click(function(event){
		self.move(-1);
		event.preventDefault();
	});
	$next.click(function(event){
		self.move(1);
		event.preventDefault();
	});
	$(window).resize(function(){
		self.moveTo(0, 0);
		self.recountPositions()
	});
	$(window).scroll(function(){
		self.recountPositions()
	});
}
