$(function(){
	function PromoPanel(controller)
	{
		this.controller = controller;
		this.itemArr = [];
	}
	PromoPanel.prototype = {
		controller: null,
		itemArr: null,
		
		switchTo: function(id)
		{
			var l = this.itemArr.length;
			for (var i = 0; i < l; i++) {
				this.itemArr[i].hide();
			}
			this.itemArr[id].show();
		},
		
		addNew: function($promotion)
		{
			this.itemArr.push($promotion);
		}
	}
	
	function Pagination(controller)
	{
		var _this = this;
		
		this.itemArr = [];
		this.controller = controller;
		this.$pagination = $("<div class=\"pagination ready\"><a href=\"#\" class=\"pagination-prev\">Previous</a><div class=\"pagination-container\"><ul class=\"clearfix\"></ul></div><a href=\"#\" class=\"pagination-next\">Previous</a></div>");
		this.$pagination.find("a.pagination-prev").click(function(e){
			_this.controller.switchToPrev();
			$(this).blur();
			return false;
		});
		this.$pagination.find("a.pagination-next").click(function(e){
			_this.controller.switchToNext();
			$(this).blur();
			return false;
		});
	}
	Pagination.prototype = {
		spanFirst: 0,
		spanLast: 5,
		itemArr: null,
		controller: null,
		$pagination: null,
		
		switchTo: function(id)
		{
			var $paginationItems = this.$pagination.find("li");
			$paginationItems.removeClass("act");
			this.itemArr[id].addClass("act");
		},

		switchToLeft: function(id)
		{
			if (id < this.spanFirst) {
				this.slideRight(id);
			}
			this.switchTo(id);
		},
		
		switchToRight: function(id)
		{
			if (id > this.spanLast) {
				this.slideLeft(id);
			}
			this.switchTo(id);
		},
		
		slideLeft: function(id)
		{
			var $itemList = this.$pagination.find("ul");
			var margin = -85 * (this.spanFirst + 1);
			$itemList.animate({marginLeft: margin + "px"}, 300);
			this.spanFirst++;
			this.spanLast++;
		},
		
		slideRight: function(id)
		{
			var $itemList = this.$pagination.find("ul");
			var margin = -85 * (this.spanFirst - 1);
			$itemList.animate({marginLeft: margin + "px"}, 300);
			this.spanFirst--;
			this.spanLast--;
		},
		
		addNew: function($promotion)
		{
			var _this = this;

			// prepare the item
			$thumbnail = $promotion.find("img.thumbnail");
			$thumbnail.remove();
			var $item = $("<li></li>");
			$item.append($thumbnail);
			this.itemArr.push($item);
			this.$pagination.find("ul").append($item);
			
			// prepare event handler for the item
			var id = this.itemArr.length - 1;
			$item
				.click(function(e){
					_this.controller.switchTo(id);
					$(this).blur();
					return false;
				})
				.hover(
					function(e){$(this).addClass("hover");},
					function(e){$(this).removeClass("hover");}
				);
		},
		
		getJQ: function()
		{
			return (this.itemArr.length > 0) ? this.$pagination : $();
		}
	}
	
	function Controller($node, selector)
	{
		// prepare private this for functions called in different scope
		var _this = this;

		$promotions = $node.find(selector);
		
		// don't rotate promotions when mouse is over them
		$(".m-carousel")
			.mouseenter(function(e) {
				_this.stopRotation();
			})
			.mouseleave(function(e) {
				_this.startRotation();
		});
		
		// create pagination and promotion panel objects
		var promoPanel = new PromoPanel(this);
		var pagination = new Pagination(this);
		
		// add promotions to pagination and promotion panel
		$promotions.each(function(id, node) {
			var $node = $(node);
			pagination.addNew($node);
			promoPanel.addNew($node);
		});
		$node.find(".pagination").replaceWith(pagination.getJQ());
		
		this.maxId = $promotions.size() - 1;
		this.promoPanel = promoPanel;
		this.pagination = pagination;
		this.$promotions = $promotions;
		
		this.switchTo(0);
		this.startRotation();
	}
	Controller.prototype = {
		curId: 0,
		maxId: 0,
		timeoutId: 0,
		promoPanel: null,
		pagination: null,
		$promotions: null,
		
		switchTo: function(id)
		{
			if (id > this.maxId || id < 0) {
				return;
			}
			this.promoPanel.switchTo(id);
			if (id < this.curId) {
				this.pagination.switchToLeft(id);
			} else if (id > this.curId) {
				this.pagination.switchToRight(id);
			}
			this.curId = id;
		},
		
		switchToNext: function()
		{
			this.switchTo(this.curId + 1);
		},
		
		switchToPrev: function()
		{
			this.switchTo(this.curId - 1);
		},
		
		startRotation: function()
		{
			var _this = this;
			this.timeoutId = setTimeout(function(){
				_this.switchToNext();
				_this.startRotation();
			}, 3000);
		},
		
		stopRotation: function()
		{
			clearTimeout(this.timeoutId);
		}
	}
	
	var promoCtrl = new Controller($(".m-carousel .regular"), ".promotion");
});