var schools = [];
var gmap = null;
var schoolIcon = null;
var schoolTopIcon = null;

function school2dom(school) {
	var row = document.createElement("tr");



	cell = document.createElement("td");
	var ahref = document.createElement("a");
	ahref.href = school.url;
	ahref.appendChild(document.createTextNode(school.naam));
	cell.appendChild(ahref);
	row.appendChild(cell);



	cell = document.createElement("td");
	cell.appendChild(document.createTextNode(school.wijk));
	row.appendChild(cell);

	cell = document.createElement("td");
	cell.appendChild(document.createTextNode(school.omvang));
	row.appendChild(cell);

	cell = document.createElement("td");
	cell.appendChild(document.createTextNode((school.onderwijsvorm) ? school.onderwijsvorm : " "));
	row.appendChild(cell);

	cell = document.createElement("td");
	cell.appendChild(document.createTextNode(school.profiel));
	row.appendChild(cell);

	cell = document.createElement("td");
	cell.appendChild(document.createTextNode(school.buitenschoolse));
	row.appendChild(cell);

	cell = document.createElement("td");
	cell.appendChild(document.createTextNode(school.leerresultaten));
	row.appendChild(cell);

	return row;
}

function script_load(url) {
	var script = document.createElement("script");
	script.type = "text/javascript";
	script.setAttribute("src", url);
	document.body.appendChild(script);
}

var initLoad = null;
/**
 * Used to set the initLoad global variable. initialize() will load a default
 * search result. By default /cms/json-search.php is loaded with no zip code
 * specified. Use setInitLoad to load a different url in initialize()
 */
function setInitLoad(url) {
	initLoad = url;
}

function initialize() {
	var defaultLoad = "/cms/json-search.php?callback=zipSearchResult";
	
	if (GBrowserIsCompatible()) {
		gmap = new GMap2(document.getElementById("map-canvas"));
		gmap.setCenter(new GLatLng(52.1549, 5.39), 14);
		gmap.addControl(new GScaleControl());
		gmap.addControl(new GLargeMapControl());

		schoolIcon = new GIcon();
		schoolIcon.image = templateurl + "images/house.png";
		schoolIcon.shadow = templateurl + "images/house-shadow.png";
		schoolIcon.iconSize = new GSize(30, 29);
		schoolIcon.shadowSize = new GSize(59, 32);
		schoolIcon.iconAnchor = new GPoint(15, 29);
		schoolIcon.infoWindowAnchor = new GPoint(15, 15);

		schoolTopIcon = new GIcon(schoolIcon);
		schoolTopIcon.image = templateurl + "images/house-top.png";
	}

	// load the default result set
	script_load((initLoad != null) ? initLoad : defaultLoad);

	Event.observe($("zip-search"), "submit", function(e) {
		var zip = "" +  $("postcode-cijfers").value;
		var searchURL = "/cms/json-search.php?callback=zipSearchResult&zip=" + zip;

		script_load(searchURL);

		Event.stop(e);
	})
}

function zipSearchResult(resultSet) {
	schools = resultSet;

	var tBody = $("schools").getElementsByTagName("tbody")[0];

	// remove old rows
	var rows = tBody.getElementsByTagName("tr");
	for (var i=rows.length-1; i>=0; i--) {
		tBody.removeChild(rows[i]);
	}

	// remove overlays from map
	if (gmap) gmap.clearOverlays();

	var top = [];
	var other = [];

	/*
	for (var j=0; j<schools.length; j++) {
		alert_shool_string(schools[j]);
	}*/

	for (var i=0; i<schools.length; i++) {
		if (!schools[i]) {
			continue;
		}
		
		var row = school2dom(schools[i]);
		row.object = schools[i];
		
		
		if (schools[i].location.lat != "" && schools[i].location.long != "") {
			
			row.onmouseover = function() {
				this.object.marker.openInfoWindow(this.object.naam);
				this.object.marker.setImage(templateurl + "images/house-active.png");
			}
			row.onmouseout = function() {
				this.object.marker.closeInfoWindow();
				this.object.marker.setImage(this.object.top == 2 ? templateurl + "images/house-top.png" : templateurl + "images/house.png");
			}

			schools[i].marker = new GMarker(
			new GLatLng(schools[i].location.lat, schools[i].location.long),
			{ icon: (schools[i].top == 2) ? schoolTopIcon : schoolIcon }
			);
		
			schools[i].marker.object = schools[i];
			GEvent.addListener(schools[i].marker, "click", function() {
				this.openInfoWindow(this.object.naam);
			});

			if (gmap) {
				try { // to prevent errors in IE
					gmap.addOverlay(schools[i].marker);
				} catch (e) {
					row.onmouseover = function() {};
					row.onmouseout = function() {};
					gmap.removeOverlay(schools[i].marker);
				}
			}	
		} 
		
		
		if (schools[i].top == 2) {
			top[top.length] = row;
		} else {
			other[other.length] = row;
		}
	}

	Element.addClassName(top[top.length - 1], "top-sepp");
	for (var i=0; i<top.length; i++) {
		Element.addClassName(top[i], "top");
		Element.addClassName(top[i], ((i+1)%2 == 0) ? "even" : "odd");
		tBody.appendChild(top[i]);
	}
	for (var i=0; i<other.length; i++) {
		Element.addClassName(other[i], ((i+1)%2 == 0) ? "even" : "odd");
		tBody.appendChild(other[i]);
	}	
}

Event.observe(window, "load", initialize);
Event.observe(window, "load", function() {
	var links = $("toggle-map").getElementsByTagName("a");
	for (var i=0; i<links.length; i++) {
		links[i].onclick = function() {
			$("map-canvas").toggle();
			Element.toggleClassName(this.parentNode, "map-visible");
			if (Element.hasClassName(this.parentNode, "map-visible")) {
				gmap.setCenter(new GLatLng(52.1549, 5.39), 14);
				$("search").style.display = "block";
			} else {
				$("search").style.display = "none";
			}

			return false;
		}
	}
});