var ie=document.all;
var nn6=document.getElementById&&!document.all;
var isdrag=false;
var x,y;
var dobj;

function remove_imagemap() {
	$("#ImageMap").empty();
	$("#hovermap").attr("src", "images/empty.gif");
}

function StringtoXML(text) {
	if (window.ActiveXObject){
		var doc=new ActiveXObject('Microsoft.XMLDOM');
		doc.async = false;
		doc.loadXML(text);
	} else {
		var parser = new DOMParser();
		var doc = parser.parseFromString(text, 'text/xml');
	}
	return doc;
}

function make_imagemap(imap, score_data, kenmerknaam) {
	var data = StringtoXML(imap);
	if (data) {
		var klikbaar = 1; // data.getElementsByTagName("klikbaar").length;
		var gebieden = data.getElementsByTagName("gebied");
		var imgMap = document.getElementById("ImageMap");
		var scores = new Array();
		for (var i = 0; i < score_data.length; i++) {
			scores[score_data[i].gebiedscode] = score_data[i].score;
		}
		for (var i = 0; i < gebieden.length; i++) {
			var naam = gebieden[i].getElementsByTagName("naam")[0].firstChild.nodeValue;
			var code = gebieden[i].getAttribute("code");
			var polys = gebieden[i].getElementsByTagName("poly");
			for (var j = 0; j < polys.length; j++) {
				var this_area = document.createElement("AREA");
				this_area.shape = "POLY";
				this_area.coords = polys[j].firstChild.nodeValue;
				this_area.setAttribute("code", code);
				this_area.title = code + " - " + naam;
				if (scores[code] != "undefined") this_area.title += " \n" + kenmerknaam + ": " + scores[code];
				this_area.setAttribute("klikbaar", klikbaar);
				imgMap.appendChild(this_area);
			}
		}
	}
}

function sortGebiedscode(a,b, o) {
	if (a[1] == b[1]) {
		if (o) {
			return (a[0] < b[0]) ? 1 : -1;
		} else {
			return (a[0] > b[0]) ? 1 : -1;
		}
	} else {
		return b[1] - a[1];
	}
}

function sortNumeric(a,b, o) {
	if (a[1] == b[1]) {
		if (o) {
			return b[0] - a[0];
		} else {
			return a[0] - b[0];
		}
	} else {
		return b[1] - a[1];
	}
}

function sortAlpha(a,b, o) {
	if (a[1] == b[1]) {
		if (o) {
			return (a[0] < b[0]) ? 1 : -1;
		} else {
			return (a[0] > b[0]) ? 1 : -1;
		}
	} else {
		return b[1] - a[1];
	}
}

function last_leaf(node) {
	while (node.children) node = node.firstChild;
	return node.nodeValue || node.innerHTML;
}

function cmpTRs(iCol, sDataType, order) {
	var f = function compareTRs(oTR1, oTR2) {
		var a = new Array();
		var b = new Array();
		a[0] = last_leaf(oTR1.cells[iCol]);
		a[1] = oTR1.getAttribute("niveau");
		b[0] = last_leaf(oTR2.cells[iCol]);
		b[1] = oTR2.getAttribute("niveau");
		switch(sDataType) {
			case "float":
				return sortNumeric(a,b, order);
			case "gcode":
				return sortGebiedscode(a,b, order);
			default:
				return sortAlpha(a, b, order);
		}
	}
	return f;
}

function set_arrow(kolom, order) {
	for (var i = 0; i < 4; i++) {
		var arrow = document.getElementById("arrow-" + i);
		if (arrow) {
			if (i == kolom) {
				if (document.all) {
					arrow.innerHTML = order ? "6" : "5";
				} else {
					arrow.innerHTML = order ? "&#9650;" : "&#9660;";
				}
			} else {
				arrow.innerHTML = "&nbsp;";
			}
		}
	}
}

function sortTable(sTableID, iCol, sDataType) {
	var oTable = document.getElementById(sTableID);
	var oTBody = oTable.tBodies[0];
	var colDataRows = oTBody.rows;
	var aTRs = new Array;
	for (var i=0; i < colDataRows.length; i++) { aTRs[i] = colDataRows[i]; }
	var order = oTable.sortOrder || 0;
	order = (oTable.sortCol == iCol) ? !order : 0;
	aTRs.sort(cmpTRs(iCol, sDataType, order));
	oTable.sortOrder = order;
	set_arrow(iCol, oTable.sortOrder);
	var oFragment = document.createDocumentFragment();
	for (var i=0; i < aTRs.length; i++) {
		aTRs[i].className = "tr" + (i%2) + ' niveau-' + aTRs[i].getAttribute("niveau");
		aTRs[i].style.background = (i%2) ? "#F5F5F5" : "#FFFFFF";
		oFragment.appendChild(aTRs[i]);
	}
	oTBody.appendChild(oFragment);
	oTable.sortCol = iCol;
}

function get_kaart(gebied, kenmerk, meting, sub) {
	var url = "makemap.mpl?gebied=" + encodeURIComponent(gebied);
	url += '&resultaatgebied=' + encodeURIComponent(resultaatgebied);
	url += '&kenmerk=' + encodeURIComponent(kenmerk);
	url += '&meting=' + encodeURIComponent(meting);
	url += '&sub=' + encodeURIComponent(sub);
	url += '&cache_version=' + encodeURIComponent(cache_version);
	var kaart = document.getElementById("kaart");
	kaart.src = url;
	kaart.style.display = '';
}

function get_bc_kaart(kenmerk, meting) {
	$("#overview_img").hide();
	var url = "makemap.mpl?gebied=buurten";
	url += '&kenmerk=' + encodeURIComponent(kenmerk);
	url += '&meting=' + encodeURIComponent(meting);
	url += '&cache_version=' + encodeURIComponent(cache_version);
	document.getElementById("overview_img").src = url;
	$("#overview_img").show();
}

function get_data(gebieden, kenmerk, meting, sub) {
	$.getJSON("getdata.mpl", { gebieden: gebieden, kenmerk:kenmerk, meting:meting, sub:sub, nr:Math.random() }, function(data){
		tabel(data.scores, data.metadata.niveau);
		metadata(data.metadata);
		var submsg = "";
		if (data.metadata.sub == "0" && data.scores.length) {
			$("#gemiddelde-1-div").show();
			if (data.metadata.niveau < 2) {
				$("#gemiddelde-2-div").hide();
			} else {
				$("#gebiedsnaam").html(data.metadata.gebiedsnaam);
				$("#gemiddelde-2-div").show();
			}
			for (var i = 1; i <= data.metadata.niveau; i++) {
				for (var j = 0; j < data.scores.length; j++) {
					if (data.scores[j].niveau == i) {
//						toon_gemiddelde(i, data.metadata.kenmerktype, data.scores[j].score, data.criteria);
						break;
					}
				}
			}
		} else {
			$("#gemiddelde-1-div").hide();
			$("#gemiddelde-2-div").hide();
			submsg += "Op de kaart staan de cijfers van het subkenmerk. De thematische kaart betreft het hoofdkenmerk.";
		}
		make_imagemap(data.imagemap, data.scores, data.metadata.titel);
		$("#backbtn").toggle((data.metadata.niveau == 2));
		if (submsg) { $("#submsg").html(submsg).removeClass("hidden"); } else { $("#submsg").addClass("hidden"); }
	});
}

function get_detail(gebied) {
	$.getJSON("getdetail.mpl", { resultaatgebied: resultaatgebied, gebied: gebied }, function(data){
		$("#vraag").html(data.gebiedsnaam || gebied);
		var $thead = $("#kenmerkoverzicht thead:first").empty();
		var $tbody = $("#kenmerkoverzicht tbody:first").empty();
		var s = '<th class="none">&nbsp;</th>';
		$(data.metingen).each(function(i, n){
			s += '<th>' + n.label + '</th>';
		});
		$thead.append('<tr>' + s + '</tr>');
		s = '';
		$(data.kenmerken).each(function(i1, n1){
			s += '<tr><td class="kop">' + n1.kop + '<td></tr>';
			$(n1.kenmerken).each(function(i2, n2){
				s += '<tr><td class="linked kenmerk" title="Klik om het overzicht op stadsdeelniveau te zien voor dit kenmerk" kenmerk="' + n2.kenmerk + '">' + n2.naam + '</td>';
				$(n2.scores).each(function(i3, n3) {
					s += '<td class="score" style="background-color:#' + (n3.kleur||"fff") + ';">' + n3.score + '</td>';
				});
				s += '</tr>';
				if (n2.subs) {
					$(n2.subs).each(function(i3, n3) {
						s += '<tr><td class="linked sub" niveau="2" title="Klik om het overzicht op stadsdeelniveau te zien voor dit subkenmerk" kenmerk="' + n2.kenmerk + '" sub="' + n3.kenmerk + '">' + n3.naam + '</td>';
						$(n3.scores).each(function(i4, n4) {
							s += '<td class="score">' + n4.score + '</td>';
						});
						s += '</tr>';
						if (n3.subsubs) {
							$(n3.subsubs).each(function(i4, n4) {
								s += '<tr><td class="linked subsub" niveau="3" title="Klik om het overzicht op stadsdeelniveau te zien voor dit subkenmerk" kenmerk="' + n2.kenmerk + '" sub="' + n4.kenmerk + '">' + n4.naam + '</td>';
								$(n4.scores).each(function(i5,n5){
									s += '<td class="score">' + n5.score + '</td>';
								});
								s += '</tr>';
							});
						}
					});
				}
			});
		});
		$tbody.append(s);
		gebiedskaart(gebied);
		$("#ovmap").attr("src", "buurten/" + gebied + ".png");
		$(".buurtnaam").html(data.gebiedsnaam || gebied);
		$(".stadsdeelnaam").html(data.stadsdeel || gebied.substr(0,1));
	});
}

function replace_options(box, options, selected, from) {
	return;
	box.options.length = 0;
	if (options.items.length>from) {
		for (var i = 0; i < options.items.length; i++) {
			var prefix = '';
			if (options.items[i].niveau == 1) prefix = '   ' + prefix;
			if (options.items[i].niveau == 2) prefix = '      ' + prefix;
			box.options[box.options.length] = new Option(prefix + options.items[i][options.label], options.items[i][options.value]);
			if (options.items[i][options.value] == selected) box.options[box.options.length-1].selected = true;
		}
		box.style.display = '';
	} else {
		box.style.display = 'none';
	}
}

function activate_metingen(metingen, meting) {
//	console.log(metingen);
	var $metingen = $("#metingen ul");
	$metingen.find("li").addClass("disabled");
	$metingen.find(".selected").removeClass("selected");
	$.each(metingen, function(i, n){
		var $meting = $metingen.find("li[rel='" + n.meting + "']").removeClass("disabled");
		if (n.meting == meting) $meting.addClass("selected");
	});
}

function metadata(data) {
	document.getElementById("vraag").innerHTML = data.label;
	document.getElementById("titel").innerHTML = data.titel;
	document.getElementById("subtitel").innerHTML = data.gebiedsnaam + ", " + data.metinglabel;
	document.getElementById("kolom-2").innerHTML = data.metinglabel;
	document.getElementById("kolom-3").innerHTML = data.prevlabel || "&nbsp;";
	$("#overview_sub").html(data.label + "<br/>" + data.metinglabel);
	var form = document.forms['avi'];
	activate_metingen(data.metingen, data.meting);
	$("#meting").val(data.meting);
	$("#metingen a.selection").html(data.metinglabel);
	$("#plattegrond").attr("src", "plattegronden/AVI 2005/" + data.gebied + ".png").show();
}

function toon_gemiddelde(niveau, type, score, criteria) {
	return;
	var item = document.getElementById("gemiddelde-" + niveau);
	var kleur;
	var min = 9999999;
	var max = -9999999;
	if (resultaatgebied == "buurtcijfers") {
		item.style.width = 0;
		item.style.background = '#ffffff';
	} else {
		for (var i = 0; i < criteria.length; i++) {
			score = score - 0;
			var van = criteria[i].van - 0;
			var tot = criteria[i].tot - 0;
			if (van < min) min = van;
			if (tot > max) max = tot;
			if ((score >= van) && (score < tot)) {
				kleur = criteria[i].kleur;
			} else if ((score == criteria[i].tot) && (i == (criteria.length-1))) {
				kleur = criteria[i].kleur;
			}
		}
		if (type == "percentage") {
			item.style.width = Math.round(score) + "%";
		} else if (type == "rapportcijfer") {
			item.style.width = Math.round(score*10) + "%";
		} else if (type == "indexcijfer") {
			item.style.width = "10%";
		} else {
			item.style.width = Math.round(((score-min)/(max-min))*100) + "%";
		}
		item.style.background = "#" + kleur;
	}
	item.innerHTML = Math.round(score);
}

function update_map_opacity(opacity) {
	$("#kaart").css("opacity", (100-opacity)/100);
}

function movemouse(e){
	e = e || window.event;
	if (isdrag){
		dobj.style.left = tx + e.clientX - x + "px";
		dobj.style.top  = ty + e.clientY - y + "px";
		return false;
	}
}

function stopdrag(e){
	e = e || window.event;
	$(document).unbind('mousemove', movemouse);
	$(document).unbind('mouseup', stopdrag);
	isdrag = false;
}

function selectmouse(e){
	e = e || window.event;
	t = e.target || e.srcElement;
	if (t.id && (t.id.indexOf("overview")>-1)) {
		isdrag = true;
		dobj = document.getElementById("overview");
		var coords = $(dobj).offset();
		tx = coords.left;
		ty = coords.top;
		x = e.clientX;
		y = e.clientY;
		$(document).bind('mousemove', movemouse);
		$(document).bind('mouseup', stopdrag);
		if (e.preventDefault) e.preventDefault();
		return false;
	}
}

function toggle_overview(actie, check) {
	var elem = document.getElementById("overview");
	if (arguments.length == 0) actie = (elem.style.display == "none");
	elem.style.display = (actie) ? "" : "none";
	if (arguments.length == 2) var t = document.forms['avi'].bc.checked = false;
	if (elem.style.display == "none") {
		$(document).unbind('mousedown', selectmouse);
	} else {
		var form = document.forms["avi"];
		var kenmerk = form.kenmerk.value;
		var meting = form.meting.value;
		var gebiedscode = "buurten";
		get_bc_kaart(kenmerk, meting);
		$(document).bind('mousedown', selectmouse);
	}
}

function tabel( scores, niveau ) {
	var body = document.getElementById("tabelbody");
	var $tbody = $("#tabelbody").empty();
	var trElem, tdElem, txtNode;
	set_arrow(0, 0);
	if (scores.length) {
		for (var k = 0; k < scores.length; k++) {
//			if ((scores[k].niveau > niveau) || (scores[k].niveau == 1)) {
			if (scores[k].niveau) {
				var gcode = scores[k].gebiedscode;
				var naam = scores[k].gebiedsnaam;
				var toelichting = scores[k].toelichting || 0;
				trElem = body.insertRow(body.rows.length);
				trElem.className = "tr" + (k%2);
				trElem.setAttribute("niveau", scores[k].niveau);
				trElem.className += ' niveau-' + scores[k].niveau;
				tdElem = trElem.insertCell(trElem.cells.length);
				tdElem.className = "col0";
				if (toelichting) {
					txtNode = document.createTextNode(gcode + " *)");
					tdElem.appendChild(txtNode);
					tdElem.setAttribute('toelichting', "<strong>" + naam + "</strong><br>" + toelichting);
				} else {
					txtNode = document.createTextNode(gcode);
					tdElem.appendChild(txtNode);
				}
				tdElem.appendChild(txtNode);
				tdElem = trElem.insertCell(trElem.cells.length);
				tdElem.className = "col1";
				tdElem.innerHTML = naam;
				tdElem = trElem.insertCell(trElem.cells.length);
				tdElem.className = "col2";
				txtNode = document.createTextNode(scores[k].score);
				tdElem.appendChild(txtNode);
				if (scores[k].prev) {
					tdElem = trElem.insertCell(trElem.cells.length);
					tdElem.className = "col3";
					txtNode = document.createTextNode(scores[k].prev);
					tdElem.appendChild(txtNode);
				}
				trElem.id = "row-" + gcode;
			}
		}
	} else {
		$tbody.html('<tr><td colspan=4>Geen gegevens beschikbaar</td></tr>');
	}
    var oTable = $("#tabel").attr("sortCol", 9);
	sortTable('tabel',0, "gcode");
}

function kaart_loaded() {
	return;
	var form = document.forms["avi"];
	var kenmerk = $("#kenmerken .selected").html();
	var meting = $("#metingen .selected").html();
	var gebiedscode = form.gebied.value;
	if (kenmerk && meting && gebiedscode) pageTracker._trackPageview('/' + form.gebied.value + "/" + kenmerk + "/" + meting );
}

function update(is_sub) {
	var form = document.forms["avi"];
	var kenmerk = form.kenmerk.value;
	var sub = form.sub.value;
	var meting = form.meting.value;
	var gebiedscode = form.gebied.value;
	remove_imagemap();
	$("#kaart").attr("src", "images/empty.gif");
	$("#plattegrond").attr("src", "images/empty.gif");
	$(".detail").hide();
	$(".overzicht").show();
	$("#kenmerken").removeClass("disabled");
	$("#metingen").removeClass("disabled");
	if (form.rel.value == '') { $("#infobtn").addClass("hidden"); } else {$("#infobtn").removeClass("hidden");};
	get_data("ASD,"+gebiedscode, kenmerk, meting, sub);
	get_kaart(gebiedscode, kenmerk, meting, sub);
	if (document.getElementById("overview").style.display != "none") get_bc_kaart(kenmerk, meting);
	document.getElementById("kaart").style.cursor = 'default';
}

function kies_gebied(code, titel) {
	var form = document.forms["avi"];
	$("#gebied").val(code);
	titel = titel || $("#geo li[rel=" + code + "]").text();
	$("#geo a.selection").html(titel);
	if (code.length>1) {
		if (code == "stadsdelen") {
			update();
		} else {
			$(".overzicht").hide();
			$("#kenmerkoverzicht thead:first").empty();
			$("#kenmerkoverzicht tbody:first").empty();
			$(".detail").show();
			var form = document.forms["avi"];
			$("#kenmerken").addClass("disabled");
			$("#metingen").addClass("disabled");
			get_detail(code);
		}
	} else {
		update();
	}
}

function kies_meting(code) {
	$("#meting").val(code);
	update();
}

function goto(rubriek) {
	var gebiedscode = document.forms['avi'].gebied.value;
	var url = "index.mpl?resultaatgebied=" + rubriek + "&gebied=" + gebiedscode;
	document.location.href = url;
}