var Shop = {

	start : function(){
		if(document.id('products')) Shop.makeScrollbar();
		if (!Browser.Engine.trident) {
			if($('cartselect')) Shop.initPrice();
			Shop.Tiptoes();
		}
		else {
			if (!Browser.Engine.trident4) {
				Shop.Tiptoes();
			}
			if($('cartselect') && $('country')){
				dynSelect('country', 'blades_id', 'shafts_id');
			}
		}
		if(document.id('masker')) {
			var sliders = document.id('masker').getElements('img');
			if(sliders.length>1) Shop.PlaySliders(sliders);
		}
		//Shop.setUpScrollAnchors();

		if(document.id('btn_buy')) Shop.buy();
		
		if(document.id('btn-paddle')) {
			document.id('btn-paddle').addEvent('click', function(e) {
				e.stop();
				Shop.AddtoCart('paddle');
			});

		}
	},

	PlaySliders : function(sliders) {

		var slideshow  = new viewer(sliders, {
			mode: 'alpha',
			interval: 3500
		});
		var controller= document.id('controller');
		controller.setStyle('display','block')
		controller.addEvent('click', function(e) {
			e.stop();
			if(controller.getStyle('background-position')=='0px 0px') {
				controller.setStyle('background-position','0px -32px')
				slideshow.play();
			}
			else {
				controller.setStyle('background-position','0px 0px')
				slideshow.stop();
			}
			
		});
	
	
	},

	Tiptoes : function() {
		var regExpressionNonObj= /;;/g;
		$$('a.tipz').each(function(element,index) {
			var content=element.get('title');
			if(content) {
				var content=content.replace(regExpressionNonObj, '<br />');
				var content = content.split('::');
				element.store('tip:title', content[0]);
				element.store('tip:text', content[1]);
			}
		});
		
		//create the tooltips
		var tipz = new Tips('.tipz',{
			className: 'tipz',
			fixed: false,
			offsets:{'x':0, 'y':0},
			hideDelay: 50,
			showDelay: 50
		});
		/*
		tipz.addEvents({
			'show': function(tip) {
				tip.fade('in');
			},
			'hide': function(tip) {
				tip.fade('out');
			}
		});
		*/
	},


	makeScrollbar:function(){
		var ProdScroll = new ScrollBar('products', 'bar', 'knob', {
			slider: {
				offset: -1,
				onComplete: function(pos){
					Shop.LightProds(pos);
				}
			}
		});
		ProdScroll.set(0);
		Shop.InitProds();
	},

	InitProds:function(position) {
		var racings = $$("#products li a img.racing");
			racings.each(function(el, i){
				el.fade(1);
				el.addClass('fullhover');
			}, this);
	},

	LightProds: function(position) {
		//console.log(position);
		var alls= $$("#products li a img");
		var racings = $$("#products li a img.racing");
		var tourings = $$("#products li a img.touring");
		var wws = $$("#products li a img.whitewater");
		var canoes = $$("#products li a img.canoe-raft");
		var outriggers = $$("#products li a img.outrigger");
		var sups = $$("#products li a img.sup");

		alls.each(function(el, i){
			el.fade(0.7);
		}, this);

		if( position < 100) {

			tourings.each(function(el, i){
				el.setProperty('class', 'touring');
			}, this);
			wws.each(function(el, i){
				el.setProperty('class', 'whitewater');
			}, this);
			canoes.each(function(el, i){
				el.setProperty('class', 'canoe-raft');
			}, this);
			outriggers.each(function(el, i){
				el.setProperty('class', 'outrigger');
			}, this);
			sups.each(function(el, i){
				el.setProperty('class', 'sup');
			}, this);
			racings.each(function(el, i){
				el.fade(1);
				el.addClass('fullhover');
			}, this);
		}
		// touring middle pos=283
		if(position >= 100 && position < 580) {
			racings.each(function(el, i){
				el.setProperty('class', 'racing');
			}, this);
			wws.each(function(el, i){
				el.setProperty('class', 'whitewater');
			}, this);
			canoes.each(function(el, i){
				el.setProperty('class', 'canoe-raft');
			}, this);
			outriggers.each(function(el, i){
				el.setProperty('class', 'outrigger');
			}, this);
			sups.each(function(el, i){
				el.setProperty('class', 'sup');
			}, this);
			tourings.each(function(el, i){
				el.fade(1);
				el.addClass('fullhover');
			}, this);
		}
		// whitewater middle pos=680
		if(position >= 580 && position < 705) {
			racings.each(function(el, i){
				el.setProperty('class', 'racing');
			}, this);
			tourings.each(function(el, i){
				el.setProperty('class', 'touring');
			}, this);
			canoes.each(function(el, i){
				el.setProperty('class', 'canoe-raft');
			}, this);
			outriggers.each(function(el, i){
				el.setProperty('class', 'outrigger');
			}, this);
			sups.each(function(el, i){
				el.setProperty('class', 'sup');
			}, this);
			wws.each(function(el, i){
				el.fade(1);
				el.addClass('fullhover');
			}, this);
		}
		// canoe/raft middle pos=680
		if(position >= 705 && position < 920) {
			racings.each(function(el, i){
				el.setProperty('class', 'racing');
			}, this);
			tourings.each(function(el, i){
				el.setProperty('class', 'touring');
			}, this);
			wws.each(function(el, i){
				el.setProperty('class', 'whitewater');
			}, this);
			outriggers.each(function(el, i){
				el.setProperty('class', 'outrigger');
			}, this);
			sups.each(function(el, i){
				el.setProperty('class', 'sup');
			}, this);
			canoes.each(function(el, i){
				el.fade(1);
				el.addClass('canoehover');
			}, this);
		}
		// outrigger middle pos=1017
		if(position >= 920 && position < 1080) {
			racings.each(function(el, i){
				el.setProperty('class', 'racing');
			}, this);
			tourings.each(function(el, i){
				el.setProperty('class', 'touring');
			}, this);
			wws.each(function(el, i){
				el.setProperty('class', 'whitewater');
			}, this);
			canoes.each(function(el, i){
				el.setProperty('class', 'canoe-raft');
			}, this);
			sups.each(function(el, i){
				el.setProperty('class', 'sup');
			}, this);
			outriggers.each(function(el, i){
				el.fade(1);
				el.addClass('canoehover');
			}, this);
		}
		if(position >= 1080) {
			racings.each(function(el, i){
				el.setProperty('class', 'racing');
			}, this);
			tourings.each(function(el, i){
				el.setProperty('class', 'touring');
			}, this);
			wws.each(function(el, i){
				el.setProperty('class', 'whitewater');
			}, this);
			canoes.each(function(el, i){
				el.setProperty('class', 'canoe-raft');
			}, this);
			outriggers.each(function(el, i){
				el.setProperty('class', 'outrigger');
			}, this);
			sups.each(function(el, i){
				el.fade(1);
				el.addClass('fullhover');
			}, this);
		}

	},
	
	CartAccept:function() {
		var acceptlbl=$('accept');
		var is_checked=$('acceptance').checked;
		if(is_checked == false) {
			alert('Vous devez accepter les conditions de vente.');
			return false;
		}
		else {
			$('lost').submit();
		}
	
	},
	UpdateLength : function(specs, specoptions, lengths, lengthoptions) {

		// get selectedIndex
		var i, shaftslt=specs.options[specs.selectedIndex];

		// let's init the list to the single first option
		for(i=(lengthoptions.length - 1); i>=1; i--){
			lengths.remove(i);
		}

		if(specs.options[specs.selectedIndex].value==0) {
			for (var i = 0; i < lengthoptions.length; i++) {
				if (lengthoptions[i].hasClass('select')) {
					// Clone the option from the hidden option pool and append it to the dynamic select box
					lengths.appendChild(lengthoptions[i].cloneNode(true));
				}
			}
		}
		else {
			if(shaftslt.hasClass('vario')) {
				for (var i = 0; i < lengthoptions.length; i++) {
					if (lengthoptions[i].hasClass('vario')) {
						// Clone the option from the hidden option pool and append it to the dynamic select box
						lengths.appendChild(lengthoptions[i].cloneNode(true));
					}
				}
			}
			if(shaftslt.hasClass('fixed')) {
				for (var i = 0; i < lengthoptions.length; i++) {
					if (lengthoptions[i].hasClass('fixed')) {
						// Clone the option from the hidden option pool and append it to the dynamic select box
						lengths.appendChild(lengthoptions[i].cloneNode(true));
					}
				}
			}
			if(shaftslt.hasClass('ergo')) {
				for (var i = 0; i < lengthoptions.length; i++) {
					if (lengthoptions[i].hasClass('ergo')) {
						// Clone the option from the hidden option pool and append it to the dynamic select box
						lengths.appendChild(lengthoptions[i].cloneNode(true));
					}
				}
			}
		}


	},

	UpdatePrice : function(what, countryval, items, specs, itemoptions, specoptions) {
		// let's write the php euro list
		var expeuro = $('zoneuro'), expworld = $('zoneworld');
		var listeuro = new Array('DE','AT','BE','ES','FI','FR','GR','IE','IT','LU','NL','PT','HU','PL','CY','CZ','DK','LV','GB','LT','SK','EE','SI','MT','SE','MC');		var i, j;

		if(what=='blades') {
			// let's init the list to the single first option
			for(i=(itemoptions.length - 1); i>=1; i--){
				items.remove(i);
			}
			for(j=(specoptions.length - 1); j>=1; j--){
				specs.remove(j);
			}
			if(countryval==0) {
				expeuro.setStyles({'display' : 'none', 'opacity': 0});
				expworld.setStyles({'display' : 'none', 'opacity': 0});
	
				for (var i = 0; i < itemoptions.length; i++) {
					if (itemoptions[i].hasClass('select')) {
						// Clone the option from the hidden option pool and append it to the dynamic select box
						items.appendChild(itemoptions[i].cloneNode(true));
					}
				}
				for (var j = 0; j < specoptions.length; j++) {
					if (specoptions[j].hasClass('select')) {
						// Clone the option from the hidden option pool and append it to the dynamic select box
						specs.appendChild(specoptions[j].cloneNode(true));
					}
				}
			}
			else {
				// let's inject according to country 
				if (new RegExp('^(' + listeuro.join('|') + ')$').test(countryval)) {
					expworld.setStyles({'display' : 'none', 'opacity': 0});
					expeuro.setStyles({'display' : 'block', 'opacity': 1});
					for (var i = 0; i < itemoptions.length; i++) {
						if (itemoptions[i].hasClass('euro')) {
							// Clone the option from the hidden option pool and append it to the dynamic select box
							items.appendChild(itemoptions[i].cloneNode(true));
						}
					}
					for (var j = 0; j < specoptions.length; j++) {
						if (specoptions[j].hasClass('euro')) {
							// Clone the option from the hidden option pool and append it to the dynamic select box
							specs.appendChild(specoptions[j].cloneNode(true));
						}
					}
					// let's display the right notes about price
				}
				else {
					expeuro.setStyles({'display' : 'none', 'opacity': 0});
					expworld.setStyles({'display' : 'block', 'opacity': 1});
					for (var i = 0; i < itemoptions.length; i++) {
						if (itemoptions[i].hasClass('world')) {
							// Clone the option from the hidden option pool and append it to the dynamic select box
							items.appendChild(itemoptions[i].cloneNode(true));
						}
					}
					for (var j = 0; j < specoptions.length; j++) {
						if (specoptions[j].hasClass('world')) {
							// Clone the option from the hidden option pool and append it to the dynamic select box
							specs.appendChild(specoptions[j].cloneNode(true));
						}
					}
				}
			}
		}
		else {
			// case regular products
			var selects = $('cartselect').getElements('select'), i,j;
			var countries =document.getElements('input[name=country]');

			// let's init the list to the single first option
			for (var i = 1; i<selects.length; i++) {
				for(j=(itemoptions[i].length - 1); j>=1; j--){
					selects[i].remove(j);
				}
			}
			countries.setProperty('value', countryval);
			if(countryval==0) {
				expeuro.setStyles({'display' : 'none', 'opacity': 0});
				expworld.setStyles({'display' : 'none', 'opacity': 0});
				for (var i = 1; i < selects.length; i++) {
					for (var j = 0; j < itemoptions[i].length; j++) {
						if (itemoptions[i][j].hasClass('select')) {
							// Clone the option from the hidden option pool and append it to the dynamic select box
							selects[i].appendChild(itemoptions[i][j].cloneNode(true));
						}
					}
				}
			}
			else {
				if (new RegExp('^(' + listeuro.join('|') + ')$').test(countryval)) {
					expworld.setStyles({'display' : 'none', 'opacity': 0});
					expeuro.setStyles({'display' : 'block', 'opacity': 1});
					for (var i = 1; i < selects.length; i++) {
						for (var j = 0; j < itemoptions[i].length; j++) {
							if (itemoptions[i][j].hasClass('euro')) {
								// Clone the option from the hidden option pool and append it to the dynamic select box
								selects[i].appendChild(itemoptions[i][j].cloneNode(true));
							}
						}
					}
				}
				else {
					expeuro.setStyles({'display' : 'none', 'opacity': 0});
					expworld.setStyles({'display' : 'block', 'opacity': 1});
					for (var i = 1; i < selects.length; i++) {
						for (var j = 0; j < itemoptions[i].length; j++) {
							if (itemoptions[i][j].hasClass('world')) {
								// Clone the option from the hidden option pool and append it to the dynamic select box
								selects[i].appendChild(itemoptions[i][j].cloneNode(true));
							}
						}
					}
				}
			}
		}

	},
	initPrice : function() {
		if(document.id('blades_id')) {
			var items = document.id('blades_id'), specs = document.id('shafts_id'), itemoptions=items.getElements('option'), specoptions=specs.getElements('option');
			var selects = $('cartselect').getElements('select');
			if(selects[0].id=='country') {
				countryslt=document.id('country');
				countrycontainer=countryslt.getParent('p.steps');
				countryslt.addEvent('change', function(){
					Shop.UpdatePrice('blades', selects[0].value, items, specs, itemoptions, specoptions);
					if(countrycontainer.hasClass('warn') && countryslt.value!='0' ) {
						countrycontainer.removeClass('warn');
					}
					
				});
				// let's init the function on domready
				Shop.UpdatePrice('blades', selects[0].value, items, specs, itemoptions, specoptions);
			}
			itemcontainer=items.getParent('p.steps');
			items.addEvent('change', function(){
				Shop.CalculatePrice(items, specs);
				if(itemcontainer.hasClass('warn') && items.value!='0' ) {
					itemcontainer.removeClass('warn');
				}
			});
			
			specscontainer=specs.getParent('p.steps');
			specs.addEvent('change', function(){
				if(specscontainer.hasClass('warn') && specs.value!='0' ) {
					specscontainer.removeClass('warn');
				}
			});
	
			if(document.id('paddle_lengths')) {
				var lengths=document.id('paddle_lengths'),  lengthoptions=lengths.getElements('option') ;
				lengthcontainer=lengths.getParent('p.steps');
				specs.addEvent('change', function(){
					Shop.UpdateLength(specs, specoptions, lengths, lengthoptions);
					Shop.CalculatePrice(items, specs);
					var checklength=Shop.Checklength();
					if(lengthcontainer.hasClass('warn') && checklength ) {
						lengthcontainer.removeClass('warn');
					}
				});
				// let's init the function on domready
				Shop.UpdateLength(specs, specoptions, lengths, lengthoptions);
			}
			document.id('showprice').setStyle('opacity',0);
		}
		else {
			var selects = $('cartselect').getElements('select');
			var tempoptions=new Array();
			for (var i = 1; i<selects.length; i++) {
				tempoptions[i]=selects[i].getElements('option');
			}
			if(selects[0].id=='country') {
				countryslt=selects[0];
				countrycontainer=countryslt.getParent('p.steps');
				countryslt.addEvent('change', function(){
					Shop.UpdatePrice('prods', countryslt.value, null, null, tempoptions);
					if(countrycontainer.hasClass('warn') && countryslt.value!='0' ) {
						countrycontainer.removeClass('warn');
					}
				});
			
				// let's init the function on domready
				Shop.UpdatePrice('prods', countryslt.value, null, null, tempoptions);
			}
		
		}

	},

	CalculatePrice : function(items, specs) {
	
		var bladeprice=items.options[items.selectedIndex].value;
		var shaftprice=specs.options[specs.selectedIndex].value;
		if(bladeprice!=0 && shaftprice!=0) {
			var tmpblade=bladeprice.split("/");
			var tmpshaft=shaftprice.split("/");
			var paddleprice=tmpblade[3].toInt()+tmpshaft[3].toInt();
			if(document.id('pprice')) {
				document.id('pprice').set('text', paddleprice);
				document.id('showprice').setStyle('opacity','1').highlight('#959595', '#E20A16');
			}
			document.id('price').value=paddleprice;
		}
	},

	buy : function () {
		// let's first hide the network stuff...
		var formcart= document.id('formcart'), cartchooser=document.id('cartchooser'), buycontainer=document.id('buycontainer'), buys = $$(".buy");
		var reduceblock = new Fx.Morph(buycontainer, {
			duration: 1500
		});
		var raisformcart = new Fx.Morph(formcart, {
			duration: 500
		});
		// change height value according to countrylist !
		var selects = $('cartselect').getElements('select');
		if(selects[0].id=='country') {
			//var raisheight=235;
			var raisheight=500;
			var buyheight=210;
		}
		else {
			//var raisheight=135;
			var raisheight=600;
			var buyheight=110;
		}
		var ShowCart = new Fx.Morph(buycontainer, {
			duration: 750,
			link: 'chain',
			transition: 'quad:in',
				onStart: function() {
					buys.each(function(el, i){
							el.fade(0);
					}, this);
					reduceblock.start({
						opacity: [1, 0],
						height: [buycontainer.getStyle('height'), buyheight]
					});
				},
				onComplete: function() {
					buycontainer.setStyles({'height': '0', 'display':'none'});
					formcart.setStyles({'height': raisheight,'opacity': '0', 'display':'block'});
					raisformcart.start({
						height: ['150', raisheight],
						opacity: [0, 1]
					});
				}
		});

		$('btn_buy').addEvent('click', function() {
			ShowCart.start();
		});
		
		
	},
	
	Checklength : function () {
		// let's first check if paddle_lengths = $('paddle_lengths').value;
		if($('paddle_lengths').value==0) {
			if($('lengthcustom').value.trim() !='') {
				// check if is int
				if ($('lengthcustom').value.toInt()) {
					$$('p.steps.four').removeClass('warn');
					return true;
				}
				else {
					$$('p.steps.four').addClass('warn');
					return false;
				}
			}
			else {
				$$('p.steps.four').addClass('warn');
				return false;
			}
		}
		else {
			$$('p.steps.four').removeClass('warn');
			return true;
		}
	},

	CheckAngle : function () {
		// let's first check if paddle_lengths = $('paddle_lengths').value;
		if($('crossing_angle').value.trim() !='') {
			// check if is int
			if ($('crossing_angle').value.toInt()) {
				$$('p.steps.five').removeClass('warn');
				return true;
			}
			else {
				$$('p.steps.five').addClass('warn');
				return false;
			}
		}
		else {
			$$('p.steps.five').addClass('warn');
			return false;
		}
	},
	
	AddtoCart : function (kind) {
		// we should build both product combo of prodid / itemid / combid /price
		// and we need to check if all elements needed are ok...
		if ($('prodid')) 
			var prodid = $('prodid').value;

		if(kind=='paddle') {
			// everything is ok before checking process;
			var sltcountry=document.id('country'), blade=document.id('blades_id'), shaft=document.id('shafts_id'), length = document.id('paddle_lengths'), lengthcustom=document.id('lengthcustom'), crossing=document.id('crossing_angle'); ;
			
			var countrye=true;
			var bladee=true;
			var shafte=true;
			var lengthe=true;
			var crossinge=true;
			var anglee=true;

			if(sltcountry==null) {
				var countrye = true;
			}
			else {
				countrye=true;
				countryvalue = sltcountry.value;
				countrycontainer=sltcountry.getParent('p.steps');
				if(countryvalue==0) {
					countrycontainer.addClass('warn');
					countrye=false;
				}
				else {
					countrycontainer.removeClass('warn');
					countrye=true;
				}
			}
			if (blade!=null) {
				var blades_id = blade.value;
				var bladecontainer=blade.getParent('p.steps');
			}
			if (shaft!=null) {
				var shafts_id = shaft.value;
				var shaftcontainer=shaft.getParent('p.steps');
			}
			/*
			if ($('price')) {
				var price = $('price').value;
				var step3=$$('p.steps.three');
			*/
			if(length!=null) {
				var paddle_lengths = length.value;
				var lengthcontainer=length.getParent('p.steps');
				if(paddle_lengths==0) {
					lengthcontainer.addClass('warn');
				}
				else {
					lengthcontainer.removeClass('warn');
				}
			}
			if(lengthcustom!=null)  {
				var checklength=Shop.Checklength();
				if(!checklength) {
					lengthcontainer.addClass('warn');
				}
				else {
					lengthcontainer.removeClass('warn');
				}
			}
			if(crossing!=null)  {
				var angle=document.id('crossing_angle');
				var crossing_angle = angle.value;
				var crossingcontainer=angle.getParent('p.steps');
				var checkangle=Shop.CheckAngle();
				if(document.id('crossing_right'))  {
					if (document.id('crossing_right').getProperty('checked')==true) {
						var crossingvalue='right';
					}
				}
				if(document.id('crossing_left'))  {
					if (document.id('crossing_left').getProperty('checked')==true) {
						var crossingvalue='left';
					}
				}
				if(!crossingvalue) {
					crossing=false;
					crossingcontainer.addClass('warn');
				}
				else {
					crossing=true;
					crossingcontainer.removeClass('warn');
				}

			}


			/*
			if ($('combo')) {
				var combo = $('combo');
				var combovalue = combo.value;
				var combid=combo.options[combo.selectedIndex].className;
				$('combid').value=combid;
				$('product').value='0/0/'+combid+'/'+$('price').value;
			}
			*/

			if(blades_id==0) {
				bladecontainer.addClass('warn');
				bladee=false;
			}
			else {
				bladecontainer.removeClass('warn');
				bladee=true;
			}
			if(shafts_id==0) {
				shaftcontainer.addClass('warn');
				shafte=false;
			}
			else {
				shaftcontainer.removeClass('warn');
				shafte=true;
			}

			if(paddle_lengths==0 && !checklength)  {
				lengthcontainer.addClass('warn');
				lengthe=false;
			}
			else {
				lengthcontainer.removeClass('warn');
				lengthe=true;
				var lengthvalue=(paddle_lengths==0) ? document.id('lengthcustom').value : paddle_lengths;
			}
			if(crossing!=null)  {
				if(!countrye || !bladee || !shafte || !lengthe || !crossinge || !anglee ) {
					return false;
				}
				else {
					// let's build specs...
					document.id('specs').value=lengthvalue+'/'+crossing_angle+'/'+crossingvalue;
					document.id('product').value=blades_id+'-'+shafts_id;
					document.id('cartselect').submit();
				}
			}
			else {
				if(!bladee || !shafte || !lengthe ) {
					return false;
				}
				else {
					// let's build specs...
					document.id('specs').value=lengthvalue;
					document.id('product').value=blades_id+'-'+shafts_id;
					document.id('cartselect').submit();
				}
			}
		}
	},

	refreshprice : function (sel1, sel2) {
		
		var prodid = $('prodid').value;

		var bladesid=sel1.options[sel1.selectedIndex].value;

		var shaftsid=sel2.options[sel2.selectedIndex].value;
		var combo= prodid+"-"+bladesid+"|"+shaftsid;

		var combsel = document.getElementById('combo');
		var combsel = document.getElementById('combo');
		var combseloptions = combsel.getElementsByTagName("option");
		for(s=0;s<combseloptions.length;s++) {
			if(combseloptions[s].value==combo) {
				var fullprice='Le prix de votre %s sur-mesure est de : &lt;span id=&quot;pprice&quot;&gt;&lt;/span&gt; &euro; '+' '+combseloptions[s].text+' '+unescape('EUROS') ;
				$('showprice').setHTML(fullprice);
				$('price').value=combseloptions[s].text;
				combsel.selectedIndex=s;
				break;
			}
			else {
				$('showprice').setHTML('');
				$('price').value='0';
			}
		}
	}

};

window.addEvent('domready', function(){
	Shop.start();
});

function dynSelect(id1, id2, id3) {
	// based on bobby van der luis unobtrusive dynamic select boxes
	// http://www.bobbyvanderluis.com
	// Browser and feature tests to see if there is enough W3C DOM support
	var agt = navigator.userAgent.toLowerCase();
	var is_ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1));
	var is_mac = (agt.indexOf("mac") != -1);
	if (!(is_ie && is_mac) && document.getElementById && document.getElementsByTagName) {
		// Obtain references to select boxes
		var sel1 = document.getElementById(id1);
		var sel2 = document.getElementById(id2);
		var sel3 = document.getElementById(id3);
		// Clone the dynamic select box
		var clone2 = sel2.cloneNode(true);
		var clone3 = sel3.cloneNode(true);
		// Obtain references to all cloned options 
		var cloned2Options = clone2.getElementsByTagName("option");
		var cloned3Options = clone3.getElementsByTagName("option");
		// Onload init: call a generic function to display the related options in the dynamic select box
		refreshdynSelectOptions(sel1, sel2, sel3,  cloned2Options, "init");
		// Onchange of the main select box: call a generic function to display the related options in the dynamic select box
		sel1.onchange = function() {
			refreshdynSelectOptions(sel1, sel2, sel3, cloned2Options, "sel1");
			$('showprice').setHTML('');
			if(sel1.value=="0") {
				$$('p.steps.one').addClass('warn');
			}
			else {
				$$('p.steps.one').removeClass('warn');
			}

		};
		sel2.onchange = function() {
			refreshdynSelectOptions(sel1, sel2, sel3, cloned3Options, "sel2");
			$('showprice').setHTML('');
			Shop.refreshprice(sel1, sel2);
			if(sel2.value=="0") {
				$$('p.steps.two').addClass('warn');
			}
			else {
				$$('p.steps.two').removeClass('warn');
			}
		};
		sel3.onchange =function() {
			var inputcustomlength=document.getElementById('lengthcustom');
			inputcustomlength.value='';
			if($('paddle_lengths').value==0 )  {
				$$('p.steps.four').addClass('warn');
			}
			else {
				$$('p.steps.four').removeClass('warn');
			}
		}
	}
}
function dynSelect(id1, id2, id3) {
	// based on bobby van der luis unobtrusive dynamic select boxes
	// http://www.bobbyvanderluis.com
	// Browser and feature tests to see if there is enough W3C DOM support
	var agt = navigator.userAgent.toLowerCase();
	var is_ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1));
	var is_mac = (agt.indexOf("mac") != -1);
	if (!(is_ie && is_mac) && document.getElementById && document.getElementsByTagName) {
		// Obtain references to select boxes
		var sel1 = document.getElementById(id1);
		var sel2 = document.getElementById(id2);
		var sel3 = document.getElementById(id3);
		// Clone the dynamic select box
		var clone2 = sel2.cloneNode(true);
		// Obtain references to all cloned options 
		var cloned2Options = clone2.getElementsByTagName("option");
		var clone3 = sel3.cloneNode(true);
		var cloned3Options = clone3.getElementsByTagName("option");
		// Onload init: call a generic function to display the related options in the dynamic select box
		refreshdynSelectOptions(sel1, sel2, sel3,  cloned2Options, cloned3Options, "init");
		// Onchange of the main select box: call a generic function to display the related options in the dynamic select box
		sel1.onchange = function() {
			refreshdynSelectOptions(sel1, sel2, sel3, cloned2Options, cloned3Options, "sel1");
		};
	}
}
function refreshdynSelectOptions(sel1, sel2, sel3, clonedOptions, cloned3Options, action) {
	var expeuro = $('zoneuro'); var expworld = $('zoneworld');
	while (sel2.options.length) {
		sel2.remove(0);
	}
	while (sel3.options.length) {
		sel3.remove(0);
	}
	var listeuroo = new Array('DE','AT','BE','ES','FI','FR','GR','IE','IT','LU','NL','PT','HU','PL','CY','CZ','DK','LV','GB','LT','SK','EE','SI','MT','SE','MC');	var pattern1 = /( |^)(select)( |$)/;
	// Iterate through all cloned options
	if(action=="init" || sel1.options[sel1.selectedIndex].value==0 ) {

			expeuro.setStyles({'display' : 'none', 'opacity': 0});
			expworld.setStyles({'display' : 'none', 'opacity': 0});

			for (var i = 0; i < clonedOptions.length; i++) {
				if (clonedOptions[i].className.match(pattern1) ) {
					sel2.appendChild(clonedOptions[i].cloneNode(true));
				}
			}
			for (var j = 0; j < cloned3Options.length; j++) {
				if (cloned3Options[j].className.match(pattern1)) {
					sel3.appendChild(cloned3Options[j].cloneNode(true));
				}
			}
	}
	else {

		if (new RegExp('^(' + listeuroo.join('|') + ')$').test(sel1.options[sel1.selectedIndex].value)) {

			expworld.setStyles({'display' : 'none', 'opacity': 0});
			expeuro.setStyles({'display' : 'block', 'opacity': 1});

			for (var i = 0; i < clonedOptions.length; i++) {
				if (clonedOptions[i].className.match(pattern1) || clonedOptions[i].className.match('euro')) {
					sel2.appendChild(clonedOptions[i].cloneNode(true));
				}
			}
			for (var j = 0; j < cloned3Options.length; j++) {
				if (cloned3Options[j].className.match(pattern1) || cloned3Options[j].className.match('euro')) {
					sel3.appendChild(cloned3Options[j].cloneNode(true));
				}
			}
		}
		else {
			expeuro.setStyles({'display' : 'none', 'opacity': 0});
			expworld.setStyles({'display' : 'block', 'opacity': 1});
			for (var i = 0; i < clonedOptions.length; i++) {
				if (clonedOptions[i].className.match(pattern1) || clonedOptions[i].className.match('world')) {
					sel2.appendChild(clonedOptions[i].cloneNode(true));
				}
			}
			for (var j = 0; j < cloned3Options.length; j++) {
				if (cloned3Options[j].className.match(pattern1) || cloned3Options[j].className.match('world')) {
					sel3.appendChild(cloned3Options[j].cloneNode(true));
				}
			}
		}
	}
}
var ScrollBar = new Class({
	
	Extends: Slider,

	options: {
		scroll: {/*
			onStart: $empty,
			onComplete: $empty*/
		},
		slider: {/*
			onChange: $empty(intStep),
			onComplete: $empty(strStep)*/
		},
		knob: {/*
			onStart: $empty*/
		}
	},

	initialize: function(scroller, slider, knob, options){
		this.knob = document.id(knob).set('tween', options.knob);
		this.slider = document.id(slider);
		this.scroller = document.id(scroller);
		this.scrollElement = this.scroller.getFirst();
		this.parent(this.slider, this.knob, options.slider);
		this.steps = this.scrollElement.getSize()[this.axis] - this.scroller.getSize()[this.axis];
		this.scroll = new Fx.Scroll(this.scroller, options.scroll);
		this.ratio = this.steps / (this.slider.getSize()[this.axis] - this.knob.getSize()[this.axis]);
	},
	
	move2: function(amount){
		this.set(this.knob.getPosition(this.slider)[this.axis] + amount);
	},

	set: function(position){
		if($type(position) === 'element') position = position.getPosition(this.scrollElement)[this.axis] / this.ratio;
		position = position.limit(-this.options.offset, this.full -this.options.offset);
		this.move(position * this.ratio);
		this.knob.tween(this.property, position).get('tween').chain(function(){
			this.fireEvent('complete', Math.round(position * this.ratio) + '');
		}.bind(this));
	},

	move: function(position){
		var to = $chk(position) ? position : this.step;
		if (this.options.mode === 'vertical') this.scroll.cancel().start(0, to);
		else this.scroll.cancel().start(to, 0);
	},

	draggedKnob: function(){
		this.parent();
		if (this.options.mode === 'vertical') this.scroll.cancel().set(0, this.step);
		else {
			this.scroll.cancel().set(this.step);
			Shop.LightProds(this.step);
		}
	},

	clickedElement: function(event){
		if (event.target === this.knob){
			this.knob.get('tween').cancel();
			return;
		}
		var position = event.page[this.axis] - this.element.getPosition()[this.axis] - this.half;
		position = position.limit(-this.options.offset, this.full -this.options.offset);
		this.set(position);
	}

});