/*	***********************************************************
 *
 *	KONINKLIJK HUIS :: MIJN FAMILIE
 *	
 *	JavaScript voor Nijntje stamboom-controle
 *	
 *	V1.0 - eend - 02 november 2006
 *
 *	Inhoud:
 *	- Dispatch om DOM compatible scripts aan events te hangen.
 *	- Diverse scripts om gedrag aan website te koppelen.
 *	
 *	*********************************************************** */

/*	***********************************************************
 *
 *	DISPATCH: haak routines in het DOM event model
 *
 */
function dispatch(targetElement,eventName,handlerName)
{ 
	if (targetElement.addEventListener) { 
		targetElement.addEventListener(eventName, function() { return targetElement[handlerName](); }, false);
	} else if (targetElement.attachEvent) { 
		targetElement.attachEvent("on" + eventName, function() { return targetElement[handlerName](); });
	} else { 
		var originalHandler = targetElement["on" + eventName]; 
		if (originalHandler) { 
			targetElement["on" + eventName] = function() { originalHandler(); return targetElement[handlerName](); }
		} else { 
			targetElement["on" + eventName] = function() { return targetElement[handlerName](); } 
		} 
	}
}



/*	***********************************************************
 *
 *	GOED OF FOUT: hang de stamboomcheck in het DOM
 *
 */

// Zet enkele variabelen.
var alles_goed = "<p style=\"font-weight:bold;color:#fff\">Je hebt alles goed! Je mag de kleurplaat ophalen. Klik op het plaatje hieronder.</p><a href=\"multimedia/khimg/kleurplaat-kroon.png\"><img src=\"multimedia/khimg/kleurplaat-kroon_klein.gif\" width=\"131\" height=\"200\" alt=\"kleurplaat\" title=\"kleurplaat\" /></a></p>";
var alle_zes_goed = 0;
var goede_antwoorden = new Array(5,2,4,1,3,6);
var fout_antwoord = "<p style=\"font-weight:bold;color:#fff;width:60px;height:60px;margin:0;padding:0;float:left;\">Probeer het opnieuw.</p>";


//	Init script.
//
function initNijntjeCheck()
{
	// Check of de nijntje div op de pagina staat.
	var nijntje_div = (document.getElementById('nijntje')) ? document.getElementById('nijntje') : null;

	if (nijntje_div)
	{
		// Haal extra items op.
		var nijntje_inputs = nijntje_div.getElementsByTagName('input');
		
		for (var i=0; i < nijntje_inputs.length; i++)
		{
			if (nijntje_inputs[i].getAttributeNode('type').value == 'radio')
			{
				// Hang het hover- en clickscript aan de extra items.
				nijntje_inputs[i].targetClickHandler = radioClick;
				dispatch(nijntje_inputs[i], "click", "targetClickHandler");
			}
		}
		
		// Zet verzendknop uit.
		var nijntje_verstuur = (document.getElementById('verstuur')) ? document.getElementById('verstuur') : null;
		
		if (nijntje_verstuur) nijntje_verstuur.style.visibility = 'hidden';
	}
}


// Feitelijke functie: input is gewijzigd, check of het goed is.
//
function radioClick()
{
	// Haal de id op van de gekozen radiobutton.
	var antwoord_id = parseInt(this.id.charAt(2));
	var antwoord_char = String.fromCharCode(96+antwoord_id);
	var foto_char = this.id.substring(0,1);
	var foto_id = (this.id.charCodeAt(0) - 97);
	
	if (antwoord_id == goede_antwoorden[foto_id])
	{
		// Bepaal de stamboom en foto waarover we praten.
		var foto_group = document.getElementById('fo-' + antwoord_char);
		var foto_code = foto_group.getElementsByTagName('legend')[0].innerHTML;
		var foto_alt = foto_group.getElementsByTagName('img')[0].getAttribute("alt");
		var stamboom_tak = document.getElementById('st-' + antwoord_char);
		var stamboom_elem = stamboom_tak.getElementsByTagName('strong')[0];
		var stamboom_alt = document.getElementById('na-' + antwoord_char);
		
		// Zet afbeelding op de goede plek in stamboom.
		stamboom_elem.innerHTML = foto_code;
		
		// Plaats de alt-tekst onder de foto in de stamboom.
		stamboom_alt.innerHTML = foto_alt;
		
		// Zet de fieldset van het goede antwoord uit.
		foto_group.style.visibility = 'hidden';
				
		// Check of dit het laatste goede antwoord is.
		alle_zes_goed++;
		
		if (alle_zes_goed == 6)
		{
			// Alles goed, dus je mag de kleurplaat ophalen!
			var goed_zo_div = (document.getElementById('goed-zo')) ? document.getElementById('goed-zo') : null;
			if (goed_zo_div) goed_zo_div.innerHTML = alles_goed;
		}
	}
	else
	{
		// Bepaal de plek in de stamboom en foto waarover we praten.
		var foto_group = this.parentNode.parentNode.parentNode;
		var foto_group_char = foto_group.id.substring(3,4);
		var foto_elem = foto_group.getElementsByTagName('legend')[0];
		
		// Bewaar oude inhoud (foto).
		if (!foto_elem.oudeInnerHTML) foto_elem.oudeInnerHTML = foto_elem.innerHTML;
		
		// Toon foutboodschap.
		foto_elem.innerHTML = fout_antwoord;
		
		// En begin timeout om foto terug te zetten.
		var fotoTerug = "zetFotoTerug('" + foto_group_char + "')";
		setTimeout(fotoTerug,1500);
	}
}

// Feitelijke functie: input is gewijzigd, check of het goed is.
//
function zetFotoTerug(foto_group_char)
{
	// Haal het betreffende legend op.
	var foto_group = document.getElementById('fo-'+foto_group_char);
	var foto_elem = foto_group.getElementsByTagName('legend')[0];
	
	// Set foto terug.
	foto_elem.innerHTML = foto_elem.oudeInnerHTML;
	foto_elem.oudeInnerHTML = "";
}

//	Hang de handler in het DOM.
//
window.targetLoadHandler = initNijntjeCheck;
dispatch(window, "load", "targetLoadHandler");