if (!window.EasyWidgets) {
	EasyWidgets = {};
}

/**
 * Parameters:
 *	config:Object {
 *		container:HTMLElement
 *		imageWidth:Number
 *		imageHeight:Number
 *		items:Array(item)
 *	}
 *
 * item:Object {
 * 	imageUrl,
 *	productUrl,
 *	label	
 * }
 */
EasyWidgets.ProductSlider = function(config) {

	var me = this;

	this.items = config.items;
	
	this.imageWidth = config.imageWidth;
	this.imageHeight = config.imageHeight;
	
	this.width = $(config.container).width();
	
	this.sliderWidth = this.items.length * this.imageWidth;
	this.initialOffset = this.width - this.sliderWidth;
	
	
	$(config.container).css({
		overflow: "hidden",
		height: me.imageHeight + "px",
		position: "relative"
	});
	
	this.inMotion = true;
	
	this.$slidingDiv = $("<div/>").css({
			position: "absolute",
			height: me.imageHeight + "px",
			width: me.sliderWidth + "px",
			left: me.initialOffset + "px"
		}).mouseenter(function() {
			me.inMotion = false;
		}).mouseleave(function() {
			me.inMotion = true;
		}).appendTo(config.container);
	
	$.each(this.items, function() {		
		var $img = $("<img/>").attr("src", this.imageUrl).attr("alt", this.label).attr("width", me.imageWidth).attr("height", me.imageHeight);
		var $a = $("<a/>").attr("href", this.productUrl).attr("title", this.label).append($img);
		$a.appendTo(me.$slidingDiv)
	});
	
	var x = me.initialOffset;
	
	var animate = function() {
		if (me.inMotion) {
			x += 2;
			if (x >= 0) {
				x = me.initialOffset;
			}
			me.$slidingDiv[0].style.left = 	x + "px";
		}
	};
	
	this.timer = window.setInterval(animate, 50);
	
	var listeners = [];
	
	this.on = function(listener) {
		listeners.push(listener);
	};
	
	var notifyListeners = function(evt) {
		$.each(listeners, function() {
			if (this[evt]) {
				this[evt]();
			}
		});
	};
	
};

