var stars = 5; /** Aantal sterren **/

var src_blanco = "http://" + location.hostname + "/images/blanco_ster.jpg";
var src_vol = "http://" + location.hostname + "/images/vol_ster.jpg";
var src_half = "http://" + location.hostname + "/images/half_ster.jpg";
var sliderMoved = new Array(0,0,0,0,0,0,0);

var velden=new Array("natuur","cultuur","stranden","kindvriendelijk","restaurants","uitgaan","winkels");

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

	var updateStars = function(step, el) {
		var half = step % 2;
		var star = Math.ceil(step / 2);
				
		if (step == 0)
			el.getElements('img[rel^=star]').setProperty('src', src_blanco);
		
		for (var i = star; i <= stars; i++)
			el.getElements('img[rel^=star'+i+']').setProperty('src', src_blanco);
			
		if (half) {
			for (var i = 0; i < star; i++)
				el.getElements('img[rel^=star'+i+']').setProperty('src', src_vol);
				
			el.getElements('img[rel^=star'+star+']').setProperty('src', src_half);
		} else {
			for (var i = 0; i <= star; i++)
				el.getElements('img[rel^=star'+i+']').setProperty('src', src_vol);
		}
	}
	
	$$('div.slider.advanced').each(function(el, i){
		var slider = new Slider(el, el.getElement('.knob'), {
			steps: 10,  // Steps from 0 to 255
			wheel: true, // Using the mousewheel is possible too
			onChange: function(){
				// Based on the Slider values set an RGB value in the color array
				updateStars(this.step, el.getParent('div.slideElement'));
				document.formulier.elements[velden[i]].value = this.step;
				sliderMoved[i]=1;
				// and update the output to the new value
			}
		}).set(document.formulier.elements[velden[i]].value);
		
	});
	
  for (i=0; i < sliderMoved.length; i++) sliderMoved[i]=0;
});