Carousel = function(id) {
	var _self = this;
	this.id = id;
	this.el = $('#' + id);

	this.productWidth = 140;
	this.products = new Array();
	
	this.currentProduct = 0;

	$('.parallax', _self.el).css('opacity','0.03');

	this.slider = null;

	this.addProduct = function(alt, url, imgPath, content) {
		$('ul.items', _self.el).append('<li><img id="' + _self.id + '_img' + _self.products.length + '" src="' + imgPath + '" alt="' + alt + '" /></li>');
		newProduct = new Array();
		newProduct['el'] = $('#' + _self.id + "_img" + _self.products.length);
		
		newProduct['el'].bind('click', function(e) {
			$('.slider', _self.el).slider('moveTo', $(this).position().left - 100);
		});
		
		newProduct['content'] = content;
		newProduct['url'] = url;

		_self.products[_self.products.length] = newProduct;
		
		_self.products[_self.currentProduct].el.bind("click", function(e){
			window.location = _self.products[_self.currentProduct].url;
		});
	};

	this.init = function() {
		if (this.products.length < 1) {
			return;
		}
		
		_self.updateOpacities(0);
		
		_self.slider = $('.slider', _self.el).slider({
			handle: '.handle',
			min: 0, 
			max: (_self.productWidth * this.products.length) - (_self.productWidth * 0.5),
			startValue: 0,
			slide: function (ev, ui) {
				$('ul', _self.el).css('left', '-' + ui.value + 'px');
				$('.parallax', _self.el).css('left', '-' + (ui.value / 2) + 'px');

				_self.updateOpacities(ui.value);
				_self.displayProductInfo();
			},
			stop: function (ev, ui) {
				$('ul', _self.el).animate({ 'left' : '-' + ui.value + 'px' }, 'slow', 'swing');
				$('.parallax', _self.el).animate({ 'left' : '-' + Math.round(ui.value/2) + 'px' }, 'slow', 'swing');

				_self.updateOpacities(ui.value);
				_self.displayProductInfo();
			}
		});

	};

	this.updateOpacities = function(uivalue)
	{
		for (i = 0; i < _self.products.length; i++) {
			product = _self.products[i]['el'];
			productPosition = product.position();
			productX = productPosition.left;
			productOpacity = 0.2;
			
			if (productX + _self.productWidth - uivalue >= (_self.productWidth * 2)) {
				viewportWidth = $('ul', _self.el).width();
				productOpacity = Math.max(0.2, Math.min(1, (70 - ((productX + _self.productWidth - uivalue) / (viewportWidth - (_self.productWidth * 2))) * 70) / 100));
				product.css({
					'width': 90
				});
				
				product.bind("click", function(e){
					$('.slider', _self.el).slider('moveTo', $(this).position().left - 100);
				});
			} else if (productX + _self.productWidth - uivalue >= _self.productWidth) {
				productOpacity = 1;
				product.css({
					'width': 100
				});
				_self.currentProduct = i;
				
				product.bind("click", function(e){
					window.location = _self.products[_self.currentProduct].url;
				});

			} else if (productX + _self.productWidth - uivalue >= 0) {
				productOpacity = Math.max(0.2, Math.min(((productX + _self.productWidth - uivalue) / _self.productWidth) * 0.5));
				product.css({
					'width': 90
				});
				
				product.bind("click", function(e){
					$('.slider', _self.el).slider('moveTo', $(this).position().left - 100);
				});
			}
			
			product.css({
				'opacity': productOpacity
			});
		}
	}

	this.displayProductInfo = function()
	{
		document.getElementById('product_panel').innerHTML = _self.products[_self.currentProduct].content;
	}
};