// nodig voor het vinden van de huidige pos van de muis
var posx;
var posy;
function getMouse(e){
	posx=0;
	posy=0;
	var ev=(!e)?window.event:e;//IE:Moz
	if (ev.pageX){//Moz
		posx=ev.pageX+window.pageXOffset;
		posy=ev.pageY+window.pageYOffset;
	}
	else if(ev.clientX){//IE
		//compliant mode vs. quirk mode
		var sLeft=document.documentElement?document.documentElement.scrollLeft:document.body.scrollLeft;
		var sTop=document.documentElement?document.documentElement.scrollTop:document.body.scrollTop;
		posx=ev.clientX+sLeft;
		posy=ev.clientY+sTop;
	}
	else{return false}//old browsers
}
document.onmousemove = getMouse;

// rate functie voor het raten met sterren
function rate(elementWidth, hoverdiv, bgdiv, bindID, action){
	//huidige positie opzoeken
	var curleft = curtop = 0;
	if (bgdiv.offsetParent) {
		do {curleft += bgdiv.offsetLeft;
			curtop += bgdiv.offsetTop;
			} while (bgdiv = bgdiv.offsetParent);
		}	
	// posities definieren
	var inElement = (posx-curleft)+1;
	var factor = 100 / elementWidth; 
	var procent = inElement*factor;
	var no = Math.round(procent / 10);
	
	// de width terugzetten naar 2 seconden van het bindID
	var Field = document.getElementById(bindID);
	var Hover = document.getElementById(hoverdiv);
	if(action=='out'){
		inElement = (Field.value*10) / factor;
	}
	//document.getElementById('output').innerHTML += "kut "+action+"| ";
	// de waarde van het form aanpassen
	if(action=='click'){
		Field.value = no;
	} 
		
	// de width veranderen en zo de illusie maken om sterretjes te laten zien			  
	Hover.style.width = inElement+'px';  
}
// functie voor het mooi schrijven van een ster id
function createStar(starDivID,formElementID,disabled){
	disabled = (disabled ? disabled : false);
	// divs creeeren en style goed zetten
	var starDiv 		= document.getElementById(starDivID);
	var starBG 			= document.createElement('div');
	var starHO 			= document.createElement('div');		
	starBG.id 			= starDivID+'_bg';
	starBG.className	= 'sterBG';
	starHO.id 			= starDivID+'_ho';
	starHO.className	= 'sterHover';
	starDiv.className	= 'sterDiv';
	starDiv.appendChild(starBG);
	starDiv.appendChild(starHO);
	// mouse event handlers toewijzen	
	starBG				= document.getElementById(starDivID+'_bg');
	if(!disabled){
		starBG.onclick		= function(){rate(70, starDivID+'_ho', this ,formElementID, 'click');};
		starBG.onmousemove	= function(){rate(70, starDivID+'_ho', this ,formElementID, 'move');};
		starBG.onmouseout	= function(){rate(70, starDivID+'_ho', this ,formElementID, 'out');};
	}
	// initiele waarden setten
	rate(70, starDivID+'_ho', starBG ,formElementID, 'out');
	
}