function fixPNG(){
	$$('img[src$=png]').each(function(el){
		var coord = el.getCoordinates();
		el.setStyles({
			width: coord.width,
			height: coord.height,
			filter: 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + el.src + '", sizingMethod="scale")',
			visibility: 'hidden'
		});
		el.src = 'clear.gif';
		el.addEvent('load',function() {
			el.setStyle('visibility','visible');
		});
	});
}
if(window.ie6) window.addEvent('domready', fixPNG);

var CartItem = new Class({
	initialize: function( indexNo, cartImg, count ) {
		this.indexNo = indexNo;
		this.cartSrc = cartImg.src;
		this.cartAlt = cartImg.alt;
		this.cartImg = cartImg;
		this.count = count;
	},

	getImage: function() {
		/*
		var cartImg = document.createElement("img");
		cartImg.src = this.cartSrc;
		cartImg.alt = this.cartAlt;
		*/
		return this.cartImg;
	},

	getStruct: function() {
		var cartStruct = new Object();
		cartStruct.indexNo = this.indexNo;
		cartStruct.imgSrc = this.cartSrc;
		cartStruct.imgAlt = this.cartAlt;
		cartStruct.count = this.count;
		return cartStruct;
	}

});
CartItem.fromStruct = function(struct) {
	//var img = document.createElement("img");
	var newImg = new Element("img");
	newImg.src = struct.imgSrc;
	newImg.alt = struct.imgAlt;
	//alert(img);
	return new CartItem( struct.indexNo, newImg, struct.count );
};

var Cart = new Class({
	initialize: function(cartEle) {
		this.items = {};
		this.newRows = {};
		this.cookieName = "CartCookie";/**/

		this.cartBox = cartEle;
		this.sumTable = cartEle.getElement(".summaryTable tbody");
		this.cartSubmit = cartEle.getElement("#cartSubmit");
		this.first = true;

		if (Cookie.get(this.cookieName)) {
			this.items = new Array();
			this.desirialize(Cookie.get(this.cookieName));
			//alert(Cookie.get(this.cookieName));
		}
	},

	add: function(indexNo, item) {
		if (!item)
			return;
		this.items[indexNo] = item;
		item.getImage().setStyles({
			'width': 40,
			'height': 56
		});
		var self = this;
		var newRow = new Element('tr', {'class':'orderRow'});
		
		
		var col2 = new Element('td', {'class': 'col2'});
		var col3 = new Element('td', {'class': 'col3'});
		var col1 = new Element('td', {'class': 'col1'});
		
		newRow.visualRemove = function() {
			var fx = new Fx.Style(newRow, 'opacity', {duration:500, wait: true});
			fx.set(1);

			fx.start(0).chain(function() {
				newRow.remove();
				delete(self.items[indexNo]);
				delete(self.newRows[indexNo]);
				delete(item);
				Cookie.set(self.cookieName, self.serialize());
			});
			delete (newRow);
		}

		var submitVal = new Element('input', {
			'type': 'hidden',
			'value': item.count,
			'name': 'prods[' + indexNo + '][count]'
		});
		var prodName = new Element('input', {
			'type': 'hidden',
			'value': item.getImage().alt,
			'name': 'prods[' + indexNo + '][name]'
		});
		var prodPic = new Element('input', {
			'type': 'hidden',
			'value': item.getImage().src,
			'name': 'prods['+ indexNo + '][imgsrc]'
		});
		var prodPid = new Element('input', {
			'type': 'hidden',
			'value': (indexNo / 100).toFixed(0),
			'name': 'prods['+ indexNo + '][srcpid]'
		});
		
		var imgProdPlus = new Element('img', {
			'src': '/fileadmin/templates/audioservice/img/btn_cart_plus.gif'
		});
		var imgProdMinus = new Element('img', {
			'src': '/fileadmin/templates/audioservice/img/btn_cart_minus.gif'
		});
		var lng_piece = new Element('span', {
			'class': 'lng_piece'
		});
		var count = new Element('span', {
			'class': 'count'
		});
		count.injectInside(col3);
		count.setText(item.count);
		lng_piece.injectInside(col3);
		lng_piece.setText("Stück");
		
		imgProdPlus.injectInside(col3);
		
		imgProdPlus.addEvent('click', function() {
			self.visualAdd(indexNo);
		});
		imgProdMinus.injectInside(col3);
		imgProdMinus.addEvent('click', function() {
			item.count = item.count - 2;
			self.visualAdd(indexNo);
			if (! item.count)
				newRow.visualRemove();
		});

		newRow.injectAfter(this.sumTable.getLast());
		item.getImage().inject(col1);

		col1.injectInside(newRow);
		col2.injectInside(newRow);
		col3.injectInside(newRow);

		col2.setText(item.getImage().alt);
		//col3.setText(item.count);
		//prodPlus.injectInside(col3);
		submitVal.inject(this.cartSubmit);
		prodName.inject(this.cartSubmit);
		prodPic.inject(this.cartSubmit);
		prodPid.inject(this.cartSubmit);
		this.setRow(indexNo, newRow);

		Cookie.set(this.cookieName, this.serialize());
		if (this.first) {
			this.cartBox.getElement(".emptybasket").setStyle('display', 'none');
			this.first = false;
		}
	},

	increase: function(indexNo) {
		this.get(indexNo).count++;
		Cookie.set(this.cookieName, this.serialize());
	},

	get: function(indexNo) {
		return this.items[indexNo];
	},

	serialize: function() {
		var answer = new Array();
		//this.items.each(function(item) {
		$each(this.items, function(item) {
			if(item) {
				answer.push(item.getStruct());
				//alert(item);
			}
		});
		return Json.toString(answer);
	},

	desirialize: function(serialized) {
		var list = Json.evaluate(serialized);
		list.each(function(item) {
			var cartItem = CartItem.fromStruct(item);
			this.add(cartItem.indexNo, cartItem);
		}, this);
	},

	getRow: function(indexNo) {
		if(this.newRows[indexNo])
			return this.newRows[indexNo];
		else
			return false;
	},

	setRow: function(indexNo, val) {
		this.newRows[indexNo] = val;
	},

	visualAdd: function(indexNo, img, fx) {
		//var cartImg = img.clone();

		if (this.get(indexNo)) {
			this.increase(indexNo);
			col3 = this.getRow(indexNo).getElement('.col3');
			
			count = col3.getElement('.count');
			count.setText(this.get(indexNo).count);
			prodCount = this.cartSubmit['prods['+indexNo+'][count]'];
			prodCount.value = (parseInt(col3.getText()));
			col2 = this.getRow(indexNo).getElement('.col2');

			if (fx) {
				colFx = new Fx.Style(col2, 'background-color', {duration:500, wait: true});
				colFx.set('#bfbfbf');
				colFx.start('#ededed');
				colFx = new Fx.Style(col3, 'background-color', {duration:500, wait: true});
				colFx.set('#bfbfbf');
				colFx.start('#ededed');
			}
		}
		else {
			var item = new CartItem(indexNo, img, 1);
			this.add(indexNo, item);
			var col3 = this.getRow(indexNo).getElement('.col3');
			var col2 = this.getRow(indexNo).getElement('.col2');

			if (fx) {
				colFx = new Fx.Style(col2, 'opacity', {duration:500, wait: true});
				colFx.set(0);
				colFx.start(1);
				colFx = new Fx.Style(col3, 'opacity', {duration:500, wait: true});
				colFx.set(0);
				colFx.start(1);
			}
		}
	},

	deleteCart: function() {
		$$('#cartSubmit input').each(function(ele) {
			ele.remove();
		});
		$$('.summaryTable .orderRow').each(function(ele) {
			ele.remove();
		});
		this.first = true;
		Cookie.remove(this.cookieName);
		this.items = new Array();
		this.newRows = new Array();
		//newRows = [];
		this.cartBox.getElement(".emptybasket").setStyle('display', 'block');
	}
});

window.addEvent('domready', function() {

	var mailFormSubmit = $('mailformformtype_mail');
		
	if (mailFormSubmit)
	mailFormSubmit.addEvent('click', function() {
		Cookie.remove("CartCookie");
	});
	
	var cartEle = document.getElement("#cart");
	if (cartEle) {
		var sumTable = cartEle.getElement(".summaryTable tbody");
		//cart.getElement(".summaryTable").setStyle('display', 'none');
		//var newRows = [];
		var tip = $('tip');

		var cartBox = new Cart(cartEle);

	// 	var fxTool = new Fx.Style(tip, 'opacity', {duration:500, wait: true});
	// 	fxTool.set(0);

		$$('.orderItem').each(function(orderItem, index) {
			index += PID*100;
			//alert(index);
			var img = orderItem.getElement(".orderItemImg img");
			var button = orderItem.getElement(".addToCart");
			var imgCopy = img.clone();
			var cartImg = img.clone();
			imgCopy.setStyles({
				'position' : 'absolute'
			});
			imgCopy.setStyles(img.getCoordinates());
			cartImg.setStyles({
				'width': 40,
				'height': 56
			});

			var fx = new Fx.Styles(imgCopy, {duration:1000, wait: false, transition: Fx.Transitions.Quart.easeOut});
			if (button) {
  			button.addEvent('click', function(e) {
  				e = new Event(e).stop();

  				imgCopy.inject(document.body);
  				if (cartBox.getRow(index)) {
  					startedFX = fx.start({
  						'top' : cartBox.getRow(index).getElement('.col1').getTop(),
  						'left' : cartEle.getLeft() + 16,
  						'height' : 56,
  						'width': 40
  					});
  				}
  				else {
  					if (cartBox.first)
  					startedFX = fx.start({
  						'top' : sumTable.getLast().getCoordinates().bottom,
  						'left' : cartEle.getLeft() + 16,
  						'height' : 56,
  						'width': 40
  					});
  					else
  					startedFX = fx.start({
  						'top' : cartEle.getTop() + 46,
  						'left' : cartEle.getLeft() + 16,
  						'height' : 56,
  						'width': 40
  					});
  				}
  				startedFX.chain(function() {
  					imgCopy.remove();
  					imgCopy.setStyles(img.getCoordinates());

  					cartBox.visualAdd(index, cartImg, true);
  				});
			 });
			}
		});

		$('submitCart').addEvent('click', function(){
			document.forms.cartSubmit.submit();
		});
		$('deleteCart').addEvent('click', function(){
			cartBox.deleteCart();
		});
		
		$$('.showroom_detail').each(function (showroom, outerIndex) {
			var img  = showroom.getElement('.prodImage');

			showroom.getElements('.orderbutton').each(function (button, innerIndex) {
				var progress = {};
				var index = outerIndex * 10 + innerIndex;
				index += PID*1000;
				if (! img)
					return;
				var btnImage = button.getElement('.alt_prod_image');
				if (!btnImage)
					btnImage = img.clone();
				
				var fx = new Fx.Styles(btnImage, {duration:1000, wait: false, transition: Fx.Transitions.Quart.easeOut});
				btnImage.alt = button.getElement('input').value;
				var cartImg = btnImage.clone();
				btnImage.setStyles({
					'position' : 'absolute'
				});

				button.addEvent('click', function(e) {
					e = new Event(e).stop();
					if (progress[index]) {
						cartBox.visualAdd(index, progress[index], true);
						delete progress[index];
					}
					progress[index] = cartImg;
					btnImage.setStyles(img.getCoordinates());

					btnImage.inject(document.body);
					if (cartBox.getRow(index)) {
						startedFX = fx.start({
							'top' : cartBox.getRow(index).getElement('.col1').getTop(),
							'left' : cartEle.getLeft() + 16,
							'height' : 56,
							'width': 40
						});
					}
					else {
						if (cartBox.first)
						startedFX = fx.start({
							'top' : sumTable.getLast().getCoordinates().bottom,
							'left' : cartEle.getLeft() + 16,
							'height' : 56,
							'width': 40
						});
						else
						startedFX = fx.start({
							'top' : cartEle.getTop() + 46,
							'left' : cartEle.getLeft() + 16,
							'height' : 56,
							'width': 40
						});
					}
					startedFX.chain(function() {
						btnImage.remove();
						btnImage.setStyles(img.getCoordinates());


						delete progress[index];
						cartBox.visualAdd(index, cartImg, true);
					});


					//cartBox.visualAdd(index, btnImage);
				});
			});
		});
	}
});
