/*  ==================================================================================================================
FILE 			:cyclocross.js 
COMPATIBILITY 		:IE6+  ; FF 
AUTHOR 			: Davy Logie - Sept , 2007
==================================================================================================================*/
arrfotoKiezen = new Array();
locatie = "";
test = "0";
hoeveelheidfotos = 0;
nummerComm = 1;
bes = "";

function init(){
	document.getElementById('koksijde men 11').onclick = new Function('ladenFiguren("koksijde men 11", ' + 118 + ', "Koksijde Elite 26 november");');
	document.getElementById('koksijde dames 11').onclick = new Function('ladenFiguren("koksijde dames 11", ' + 100 + ', "Koksijde Dames 26 november");');
	document.getElementById('gavere 11').onclick = new Function('ladenFiguren("gavere 11", ' + 115 + ', "Asper-Gavere 20 november");');
	document.getElementById('wendel fun').onclick = new Function('ladenFiguren("wendel fun", ' + 39 + ', "Fun at Sankt Wendel");');
	document.getElementById('wk wendel zon').onclick = new Function('ladenFiguren("wk wendel zon", ' + 85 + ', "WK Sankt Wendel 30 januari");');
	document.getElementById('wk wendel zat').onclick = new Function('ladenFiguren("wk wendel zat", ' + 40 + ', "WK Sankt Wendel 29 januari");');
	document.getElementById('hoogerheide 11').onclick = new Function('ladenFiguren("hoogerheide 11", ' + 70 + ', "Hoogerheide 23 januari");');
	document.getElementById('beernem 2').onclick = new Function('ladenFiguren("beernem 2", ' + 55 + ', "Beernem 25 december deel 2");');
	document.getElementById('beernem 1').onclick = new Function('ladenFiguren("beernem 1", ' + 73 + ', "Beernem 25 december deel 1");');
	document.getElementById('koksijde prof').onclick = new Function('ladenFiguren("koksijde prof", ' + 51 + ', "Koksijde Elite 27 november");');
	document.getElementById('koksijde dames').onclick = new Function('ladenFiguren("koksijde dames", ' + 39 + ', "Koksijde Dames 27 november");');
	document.getElementById('koksijde u23').onclick = new Function('ladenFiguren("koksijde u23", ' + 30 + ', "Koksijde U23 27 november");');
	document.getElementById('gavere prof').onclick = new Function('ladenFiguren("gavere prof", ' + 49 + ', "Gavere Elite 21 november");');
	document.getElementById('gavere u23').onclick = new Function('ladenFiguren("gavere u23", ' + 48 + ', "Gavere U23 21 november");');
	document.getElementById('gavere dames').onclick = new Function('ladenFiguren("gavere dames", ' + 20 + ', "Gavere Dames 21 november");');
	document.getElementById('gavere jun').onclick = new Function('ladenFiguren("gavere jun", ' + 16 + ', "Gavere Juniors 21 november");');
	document.getElementById('gavere nieuw').onclick = new Function('ladenFiguren("gavere nieuw", ' + 22 + ', "Gavere Nieuwelingen 21 november");');



}

function ladenFiguren(map, aantalFotos, beschrijving){
	bes = beschrijving;
	locatie = map;
	hoeveelheidfotos = aantalFotos;
	for( var teller = 1; teller < aantalFotos; teller ++){
		arrfotoKiezen[teller] = teller + ".jpg";
	}
	aanmakenRij(map, aantalFotos, beschrijving);
}

function aanmakenRij(map ,aantalFotos, beschrijving){
	var attr = document.getElementById(locatie.toString()).getAttribute('href');
	attr = attr + '?fotonr=1';
	//alert(attr);
	document.getElementById(locatie.toString()).setAttribute('href', attr);
	
	var div = document.createElement("div");
	div.setAttribute("id", "thumbnails");
	/*var ul = document.createElement("ul");
	for( var teller = 1; teller < aantalFotos; teller++){
		var li = document.createElement("li");
		li.onclick = new Function('clickThumbnails( ' + teller + ');');
		var afbeelding = new Image();
		afbeelding.src = "images/street/" + map + "/" + arrfotoKiezen[teller];
		li.appendChild(afbeelding);
		ul.appendChild(li);
	}
	div.appendChild(ul);*/
	
	var tbl = document.createElement("table");
	
	var tblHead = document.createElement('thead');
	var tblFoot = document.createElement('tfoot');
	var tblBody = document.createElement('tbody'); // Je MOET een body hebben om ervoor te zorgen dat de tabel toont in IE
	var tr = document.createElement('tr');
	for( var teller = 1; teller < aantalFotos; teller++){
		var td = document.createElement('td');
		td.onclick = new Function('clickThumbnails( ' + teller + ');');
		var afbeelding = new Image();
		afbeelding.src = "images/cyclocross/" + map + "/" + arrfotoKiezen[teller];
		td.appendChild(afbeelding);
		tr.appendChild(td);
	}
	tblBody.appendChild(tr);
	//tbl.appendChild(tblHead);
	//tbl.appendChild(tblFoot);
	tbl.appendChild(tblBody);
	div.appendChild(tbl);
	
	document.getElementById("fotos").innerHTML = "";
	document.getElementById("fotos").appendChild(div);
	aanmakenCommentaarbalk(beschrijving);
	if(test == "0"){
	ladenEersteGroteFoto();
	}
}

function aanmakenCommentaarbalk(beschrijving){	
	var divBalk = document.createElement("div");
	divBalk.setAttribute("id", "commentaarbalk");
	var spanCommentaar = document.createElement("div");
	spanCommentaar.setAttribute("id", "commentaar");
	spanCommentaar.appendChild(document.createTextNode(beschrijving));
	var spanback = document.createElement("a");
	spanback.appendChild(document.createTextNode("back"));
	spanback.setAttribute("href", "cyclocross.htm");
	spanback.setAttribute("id", "spanback");
	var links = document.createElement("a");
	var rechts = document.createElement("a");
	var commentaarbalklinks = new Image();
	var commentaarbalkrechts = new Image();
	links.setAttribute("id", "links");
	rechts.setAttribute("id", "rechts");
	commentaarbalklinks.setAttribute("id", "commentaarbalklinks");
	commentaarbalkrechts.setAttribute("id", "commentaarbalkrechts");

	divNummer = document.createElement("div");
	divNummer.setAttribute("id", "divNummer");
	divNummer.appendChild(document.createTextNode(nummerComm));
	
	//links.src = "images/links.gif";
	//rechts.src = "images/rechts.gif";
	commentaarbalklinks.src = "images/commentaarbalklinks.gif";
	commentaarbalkrechts.src = "images/commentaarbalkrechts.gif";
		links.onclick = new Function('linksFiguur();');
		rechts.onclick = new Function('RechtsFiguur();');
	divBalk.appendChild(links);
	divBalk.appendChild(divNummer);
	divBalk.appendChild(commentaarbalklinks);
	divBalk.appendChild(spanCommentaar);
	divBalk.appendChild(spanback);
	divBalk.appendChild(commentaarbalkrechts);
	divBalk.appendChild(rechts);
	document.getElementById("fotos").appendChild(divBalk);
}

function clickThumbnails(nummer){
	document.getElementById("fotos").removeChild(document.getElementById('commentaarbalk'));
	nummerComm = nummer;
	aanmakenCommentaarbalk(bes);
	
	test = "1";
	var attr = document.location;
	attr = attr.toString();
	attr = attr.substring(0 , attr.indexOf('?'));
	attr = attr + "?fotonr=" + nummer;
	document.location = attr;
	
	var divGroot = document.createElement("div");
	divGroot.setAttribute("id", "fotoGroot");
	var afbeeldingGroot = new Image();
	afbeeldingGroot.src = "images/cyclocross/" + locatie + "/groot/" + nummer + ".jpg";
	afbeeldingGroot.onclick = new Function('RechtsFiguur();');
	//alert(document.getElementById('fotos').lastChild);
	document.getElementById('fotos').removeChild(document.getElementById('fotoGroot'));
	divGroot.appendChild(afbeeldingGroot);
	document.getElementById("fotos").appendChild(divGroot);
}

function ladenEersteGroteFoto(){
	var divGroot = document.createElement("div");
	divGroot.setAttribute("id", "fotoGroot");
	var afbeeldingGroot = new Image();
	afbeeldingGroot.src = "images/cyclocross/" + locatie + "/groot/1.jpg";
	afbeeldingGroot.onclick = new Function('RechtsFiguur();');
	divGroot.appendChild(afbeeldingGroot);
	document.getElementById("fotos").appendChild(divGroot);
}
	
function linksFiguur(){
	var attr = document.location;
	attr = attr.toString();
	var nummerFoto = attr.substring(attr.indexOf('=') + 1, attr.length);
	nummerFoto = parseInt(nummerFoto, 10);
	nummerFoto = nummerFoto - 1;
	if(nummerFoto > 0){
	clickThumbnails(nummerFoto);
	}
}
	
function RechtsFiguur(){
	var attr = document.location;
	attr = attr.toString();
	var nummerFoto = attr.substring(attr.indexOf('=') + 1, attr.length);
	nummerFoto = parseInt(nummerFoto, 10);
	nummerFoto = nummerFoto + 1;
	if(hoeveelheidfotos > nummerFoto){
	clickThumbnails(nummerFoto);
	}
}
