var gmap = null;
	var mapExtension = null;
	var boundsKortrijk = null;
	var gOverlays = [];
	var gOverlaysTariefzones = [];
	var gOverlaysBewonerskaartzones = [];
	var gOverlaysParkings = [];
  var gOverlaysBijzondereParkings = [];
  var allStreets = null; 
	var allTariefZonesInfo = [];
	var allTariefZonesInfoOrdered = [];
	
	var findStreetTask = null;
	var paramsFindStreetTask = null;
	
	var findHouseNumbersTask = null;
	var paramsFindHouseNumbersTask = null;
	
	var queryBewonerskaartzoneTask = null;
  var queryBewonerskaartzone = null;
	
	var queryBewonerskaartzoneHiddenTask = null;
  var queryBewonerskaartzoneHidden = null;
	
	var allHouseNumbers = [];
	var allHouseNumbersWithLatLong = []; // zal telkens een array bevatten [huisnummer , feature]
	
	var queryAllBewonerskaartzones = null;
	var currentBewonerskaartZone = null;
	
	var queryParkingsTask = null;
	var queryAllParkings = null;
  
  var queryMindervalidenParkingsTask = null;
  var queryMindervalidenParkings = null;
	
	var findOneParkingTask = null;
	var paramsFindOneParkingTask = null;
	
	var queryTariefzoneTask = null;
	var queryAllTariefzones = null;
	var currentTariefZone = null;
	
	var findOneTariefZoneTask = null;
	var paramsOneFindTariefZoneTask = null;
	
	//////////////////////////////////////////////////////////////////
	//////////////////////////////////////////////////////////////////
	//////////////////////////////////////////////////////////////////
	//////////////////////////////////////////////////////////////////
	//////////////////////////////////////////////////////////////////
	//////////////////////////////////////////////////////////////////
	//////////////////////////////////////////////////////////////////

	function initialize() {
		// GMap construction && add MapExtension ESRI
		gmap = new GMap2(document.getElementById('gmap'));
		GEvent.addListener(gmap, "infowindowopen", reloadThickBox); // Hierdoor zijn de links in infowindows, met tickbox-class, gekend bij de tickbox.
		gmap.setCenter(new GLatLng(50.827991, 3.265028), 14);
		gmap.setUIToDefault();
		mapExtension = new esri.arcgis.gmaps.MapExtension(gmap);
		
		var swKortrijk = new GLatLng(50.819424, 3.238478);	// in productie breiden we dit gebied enorm uit om alle tariefzones te vinden.
		var neKortrijk = new GLatLng(50.841109, 3.289289);
		
		swKortrijk = new GLatLng(50.69450035913112, 3.1836318969726562);
		neKortrijk = new GLatLng(50.92208192289137, 3.4349441528320312);
		
		boundsKortrijk = new GLatLngBounds(swKortrijk, neKortrijk);
		
		allStreets = getAllStreets(); // uit externe hulpfile
		
    $("#streetList").autocomplete(allStreets,{
								matchContains: true
								});
    
    /*
    $("#streetList").autocomplete(allStreets,{
								matchContains: true,
								minChars: 0
								});
		*/
    
    
		/*    FIND STREETTASK*/ 
		findStreetTask = new esri.arcgis.gmaps.FindTask("http://81.95.112.130/ArcGIS/rest/services/BE_KOR/parko4/MapServer");
		GEvent.addListener(findStreetTask, "executecomplete", function() {
		});
			paramsFindStreetTask = new esri.arcgis.gmaps.FindParameters();
			paramsFindStreetTask.contains = "FALSE";
			paramsFindStreetTask.layerIds = [1];	// STRAATPUNTENLAAG LBE
			paramsFindStreetTask.searchFields = ["STRAATNM1"];
			paramsFindStreetTask.returnGeometry = "TRUE";
		 
		 /* FIND HOUSENUMBERS*/ 
		findHouseNumbersTask = new esri.arcgis.gmaps.FindTask("http://81.95.112.130/ArcGIS/rest/services/BE_KOR/parko4/MapServer");
		GEvent.addListener(findHouseNumbersTask, "executecomplete", function() {
		});
			paramsFindHouseNumbersTask = new esri.arcgis.gmaps.FindParameters();
			paramsFindHouseNumbersTask.contains = "FALSE";
			paramsFindHouseNumbersTask.layerIds = [0];	// ADRESPUNTENLAAG
			paramsFindHouseNumbersTask.searchFields = ["STRAATNM1","HUISNR"];
			paramsFindHouseNumbersTask.returnGeometry = "TRUE";
			
		/*  QUERY : FIND BEWONERSKAARTZONE op basis van HOUSENUMBER GEOMETRY */
		queryBewonerskaartzoneHiddenTask = new esri.arcgis.gmaps.QueryTask("http://81.95.112.130/ArcGIS/rest/services/BE_KOR/parko4/MapServer/3"); // de laag met hidden bewonerskaartzones !!!
			queryBewonerskaartzoneHidden = new esri.arcgis.gmaps.Query();
			queryBewonerskaartzoneHidden.returnGeometry = true;
			queryBewonerskaartzoneHidden.outFields = ["NAAM"];
			
		/*  QUERY : FIND BEWONERSKAARTZONES */
		queryBewonerskaartzoneTask = new esri.arcgis.gmaps.QueryTask("http://81.95.112.130/ArcGIS/rest/services/BE_KOR/parko4/MapServer/4"); // de laag met zichtbare bewonerskaartzones
			queryBewonerskaartzone = new esri.arcgis.gmaps.Query();
			queryBewonerskaartzone.queryGeometry = boundsKortrijk;
			queryBewonerskaartzone.returnGeometry = true;
			queryBewonerskaartzone.outFields = ["NAAM"];
			
		/*  QUERY : FIND TARIEFZONES */
		queryTariefzoneTask = new esri.arcgis.gmaps.QueryTask("http://81.95.112.130/ArcGIS/rest/services/BE_KOR/parko4/MapServer/5");
			queryAllTariefzones = new esri.arcgis.gmaps.Query();
			queryAllTariefzones.queryGeometry = boundsKortrijk;
			queryAllTariefzones.returnGeometry = false;
			queryAllTariefzones.outFields = ["tarief","kleur","URL","SMS","omschr","volgorde"];
		
		/* FIND ONE TARIEF ZONE*/ 
		findOneTariefZoneTask = new esri.arcgis.gmaps.FindTask("http://81.95.112.130/ArcGIS/rest/services/BE_KOR/parko4/MapServer");
			paramsFindOneTariefZoneTask = new esri.arcgis.gmaps.FindParameters();
			paramsFindOneTariefZoneTask.contains = "FALSE";
			paramsFindOneTariefZoneTask.layerIds = [6];	// ALLE ZONES !! 
			paramsFindOneTariefZoneTask.searchFields = ["kleur"];
			paramsFindOneTariefZoneTask.returnGeometry = "TRUE";
			
		/* FIND ONE BEWONERSKAARTZONE */ 
		findOneBewonerskaartZoneTask = new esri.arcgis.gmaps.FindTask("http://81.95.112.130/ArcGIS/rest/services/BE_KOR/parko4/MapServer");
			paramsFindOneBewonerskaartZoneTask = new esri.arcgis.gmaps.FindParameters();
			paramsFindOneBewonerskaartZoneTask.contains = "FALSE";
			paramsFindOneBewonerskaartZoneTask.layerIds = [4];	// ZONES Zichtbaar
			paramsFindOneBewonerskaartZoneTask.searchFields = ["NAAM"];
			paramsFindOneBewonerskaartZoneTask.returnGeometry = "TRUE";
			
		/*  QUERY : FIND PARKINGS */
		queryParkingsTask = new esri.arcgis.gmaps.QueryTask("http://81.95.112.130/ArcGIS/rest/services/BE_KOR/parko4/MapServer/2"); // de laag met parkings
			queryAllParkings = new esri.arcgis.gmaps.Query();
			queryAllParkings.queryGeometry = boundsKortrijk;
			queryAllParkings.returnGeometry = true;
			queryAllParkings.outFields = ["Naam","URL","Soort"];
      
    /*  QUERY : FIND MINDERVALIDEN PARKINGS */
		queryMindervalidenParkingsTask = new esri.arcgis.gmaps.QueryTask("http://81.95.112.130/ArcGIS/rest/services/BE_KOR/parko4/MapServer/7"); // de laag met parkings mindervaliden
			queryMindervalidenParkings = new esri.arcgis.gmaps.Query();
			queryMindervalidenParkings.queryGeometry = boundsKortrijk;
			queryMindervalidenParkings.returnGeometry = true;
      queryMindervalidenParkings.searchText = '%';
			queryMindervalidenParkings.outFields = ["Straatnaam","Huisnummer"];
		
		/* FIND ONE PARKING */ 
		findOneParkingTask = new esri.arcgis.gmaps.FindTask("http://81.95.112.130/ArcGIS/rest/services/BE_KOR/parko4/MapServer");
			paramsFindOneParkingTask = new esri.arcgis.gmaps.FindParameters();
			paramsFindOneParkingTask.contains = "FALSE";
			paramsFindOneParkingTask.layerIds = [2];	// PARKINGs
			paramsFindOneParkingTask.searchFields = ["Naam","URL","Soort"];
			paramsFindOneParkingTask.returnGeometry = "TRUE";
	}
	
	
	/* GO TO STREET */
	function goToStreet() {
		paramsFindStreetTask.searchText = $("#streetList").val();
		if(paramsFindStreetTask.searchText != ''){
			clearAllResults();
			findStreetTask.execute(paramsFindStreetTask, findStreetTaskGoToStreetCompleteCallback);
			executeFindHouseNumbers(paramsFindStreetTask.searchText);
		}
	}
	
	function findStreetTaskGoToStreetCompleteCallback(results) {			
			
			var baseIcon = new GIcon(G_DEFAULT_ICON);
			//baseIcon.image = "http://www.leiedal.be/images/parko-pin.png";
			//baseIcon.shadow = "http://www.leiedal.be/images/parko-pin-shadow.png";
			baseIcon.iconSize = new GSize(20, 34);
			baseIcon.shadowSize = new GSize(34, 23);
			baseIcon.iconAnchor = new GPoint(10, 34);
			baseIcon.infoWindowAnchor = new GPoint(9, 2);
		var  myMarkerOptions = { icon:baseIcon };
		var myPoint = new GLatLng(50.827991, 3.265028);
		var marker = new GMarker(myPoint, myMarkerOptions)
		var myOverlayOptions = { markerOptions: myMarkerOptions };
		var straatnaam = $("#streetList").val();
		var windowContent = "<div id='insideInfoWindow'>straat "+straatnaam+"</div>";
		var infoWindowOptions = {
		  content:windowContent	  
		};
			
			//gOverlays.push(mapExtension.addToMap(results,overlayOptions,windowOptions));
			gOverlays.push(mapExtension.addToMap(results,myOverlayOptions,infoWindowOptions));
			
			// we gaan ervan uit dat hier maar 1 result is (of dat we het eerste result nemen)
			var findResult = results.findResults[0];
			gmap.setCenter(findResult.feature.geometry[0].getLatLng(),15);
			
			// if @ tariefzone --> show all tariefzones
			if($("#div_tariefzones").is(':visible'))
			{
				$(".tariefzone").attr("checked","checked");
				gOverlaysTariefzones = [];
				for(var i = 1; i < allTariefZonesInfoOrdered.length; i++){
					toggleTariefZone('checkTarief'+i);
				}
			}
	}
	
	/* GET STREET NUMBERS */
	function executeFindHouseNumbers(streetName) {
		paramsFindHouseNumbersTask.searchText = streetName;
		findHouseNumbersTask.execute(paramsFindHouseNumbersTask, findHouseNumbersTaskCompleteCallback);
	}
		  
	function findHouseNumbersTaskCompleteCallback(results) {
		var tempArr = [];
		allHouseNumbersWithLatLong = [];
		for (var x = 0; x < results.findResults.length; x++) {		  
			var findResult = results.findResults[x];
			tempArr.push(findResult.feature.attributes["HUISNR"]);
			var HouseNumberWithLatLong= [findResult.feature.attributes["HUISNR"],findResult.feature];
			allHouseNumbersWithLatLong.push(HouseNumberWithLatLong);
		}
		//dubbels uit de array halen
		var tempUniqueArr = unique(tempArr);
		//ordenen (doordat we deze functie meegeven als argument, komt 7 voor 24)
		tempUniqueArr.sort(function(a,b){return a - b});
		var printVar = "";
		for(var i = 0; i < tempArr.length; i++) {
			printVar = printVar+"<option value='"+tempUniqueArr[i]+"'>"+tempUniqueArr[i]+"</option>\n";
		}
		printVar = printVar.substring(0,printVar.length-3);
		$("#select_houseNumbers").html(printVar);
		$("#legende_bewonerskaartzones").slideDown();
	}
	
	function zoomToHouseNumber(){
		$("#select_houseNumbers").attr("disabled","disabled");
		
		for(var bkz in gOverlaysBewonerskaartzones){
			mapExtension.removeFromMap(gOverlaysBewonerskaartzones[bkz]);
		}
		$(".bewonerskaartzone").attr("checked","");
		clearMap(gOverlays);
		
		var baseIcon = new GIcon(G_DEFAULT_ICON);
			//baseIcon.image = "http://www.leiedal.be/images/parko-pin.png";
			//baseIcon.shadow = "http://www.leiedal.be/images/parko-pin-shadow.png";
			baseIcon.iconSize = new GSize(20, 34);
			baseIcon.shadowSize = new GSize(34, 23);
			baseIcon.iconAnchor = new GPoint(10, 34);
			baseIcon.infoWindowAnchor = new GPoint(9, 2);
		var  myMarkerOptions = { icon:baseIcon };
		var myPoint = new GLatLng(50.827991, 3.265028);
		var marker = new GMarker(myPoint, myMarkerOptions)
		var myOverlayOptions = { markerOptions: myMarkerOptions };
		
		var houseNumber = $("#select_houseNumbers").val();
		var windowContent = "<div id='insideInfoWindow'>huisnummer "+houseNumber+"</div>";
		var infoWindowOptions = {
		  content:windowContent	  
		};
		var i = 0;
		var zoomToHouseNumber = new Boolean(true);
		while ( zoomToHouseNumber && i < allHouseNumbersWithLatLong.length){
			if(allHouseNumbersWithLatLong[i][0] == houseNumber)
			{
			rs = allHouseNumbersWithLatLong[i][1];
			gOverlays.push(mapExtension.addToMap(rs,myOverlayOptions,infoWindowOptions));
			zoomToHouseNumber = Boolean(false);
			}
		i++;
		}
		i--;
		//zoek de bewonerskaartzone waarin feature ligt !! Hidden laag gebruiken
		queryBewonerskaartzoneHidden.queryGeometry = allHouseNumbersWithLatLong[i][1].geometry;
		// zoom naar huisnr op kaart
		gmap.setCenter(allHouseNumbersWithLatLong[i][1].geometry[0].getLatLng(),15);
		queryBewonerskaartzoneHiddenTask.execute(queryBewonerskaartzoneHidden, false, queryBewonerskaartzoneHiddenTaskCallback);
		$("#select_houseNumbers").removeAttr("disabled");
	}
	
	function queryBewonerskaartzoneHiddenTaskCallback(results) {
		var fe = results.features;
		var feature = fe[0];
		if(feature != undefined){
			var att = feature.attributes;
			$("#myBewonerskaartzone").text("Uw bewonerszone is \"" + att.NAAM + "\""); // de bewonerskaartzones zijn zó ingetekend dat elke adrespunt maar in 1 zone ligt !
			$("input[value='"+att.NAAM+"']").attr("checked","checked");
			toggleFindOneBewonerskaartZone($("input[value='"+att.NAAM+"']").attr("id"));	
		}
		else{
			$("#myBewonerskaartzone").text("Dit adres behoort niet tot een bewonerszone.");
		}
	}
	
	/* SHOW ALL BEWONERSKAARTZONES */
	
	function getAllBewonerskaartzones() {
        queryBewonerskaartzoneTask.execute(queryBewonerskaartzone, false, callbackGetAllBewonerskaartzones);
    }
	  
	function mijnsorteerfunctie(a,b){
		var nameA = a.attributes.NAAM.toLowerCase( );
		var nameB = b.attributes.NAAM.toLowerCase( );
		if (nameA < nameB) {return -1}
		if (nameA > nameB) {return 1}
		return 0;
	}
	  
	function callbackGetAllBewonerskaartzones(results) {
		var fe = results.features;
		var toPrint;
		var tempArr = [];
		for (var x = 0; x < fe.length; x++) {
			var tempFeature = fe[x];
			tempArr.push(tempFeature);
		}
		tempArr.sort(mijnsorteerfunctie);
		toPrint = '<ul>';
		for(var i = 0; i < tempArr.length; i++) {
			var feature = tempArr[i];
			var att = feature.attributes;
			toPrint = toPrint + '<li><input type=checkbox id="checkZone' + i +'" class="bewonerskaartzone" onClick="toggleFindOneBewonerskaartZone(\'checkZone' + i +'\');" value="'+att.NAAM+'"> ' + att.NAAM +'</li>';
		}
		toPrint = toPrint + '</ul>';
		$("#legende_all_bewonerskaartzones").html(toPrint);
	}
	
	/* SHOW ALL PARKINGS */
	
	function getAllParkings() {
        queryParkingsTask.execute(queryAllParkings, false, callbackGetAllParkings);
    }
	
  function toggleMindervalidenParkings(){
    if($("#checkMindervalidenParkings").attr("checked")){
			toonMindervalidenParkings();
		}
		else{
			verbergMindervalidenParkings();
		}
  }
  
  function toonMindervalidenParkings(){
    //clearAllResults();
    //clearMap(gOverlays);
    getMindervalidenParkings();
  }
  
  function verbergMindervalidenParkings(){
    for(var i in gOverlaysBijzondereParkings){
      mapExtension.removeFromMap(gOverlaysBijzondereParkings[i]);
    }
  }
  
  function getMindervalidenParkings(){
    queryMindervalidenParkingsTask.execute(queryMindervalidenParkings, false, callbackGetMindervalidenParkings);
  }
  
  function callbackGetMindervalidenParkings(results){
    var feature = null;
    var straatnaam = '';
    var huisnummer = '';
    var baseIcon = null;
    var myMarkerOptions = null;
    var myPoint = null;
    var marker = null;
    var myOverlayOptions = null;
    var windowContent = null;
    for( var i in results.features){
      feature = results.features[i];
      straatnaam = feature.attributes.Straatnaam;
      huisnummer = feature.attributes.Huisnummer;
      baseIcon = new GIcon(G_DEFAULT_ICON);
      baseIcon.image = "http://drk4.drk.be/appparko/imgs/Pmindervaliden.gif";
      baseIcon.shadow = null;
			baseIcon.iconSize = new GSize(16, 16);
			baseIcon.shadowSize = null;
			baseIcon.iconAnchor = new GPoint(9, 34);
			baseIcon.infoWindowAnchor = new GPoint(9, 2);
      myMarkerOptions = { icon:baseIcon };
      myPoint = new GLatLng(50.827991, 3.265028);
      marker = new GMarker(myPoint, myMarkerOptions)
      myOverlayOptions = { markerOptions: myMarkerOptions };
      windowContent = "<div id='insideInfoWindow'><b>P personen met een handicap</b><br/><small>ter hoogte van</small><br />"+straatnaam+" "+huisnummer+"</div>";
      infoWindowOptions = {
        content:windowContent
      };
      gOverlaysBijzondereParkings[i] = mapExtension.addToMap(feature,myOverlayOptions,infoWindowOptions);
    }
  }
  
	function callbackGetAllParkings(results) {
		var fe = results.features;
		var toPrint;
		toPrint = '<ul>';
		for (var x = 0; x < fe.length; x++) {
			var feature = fe[x];
			var att = feature.attributes;
			toPrint = toPrint + '<li><input type=checkbox id="checkParking' + x +'" class="parking" onClick="toggleFindOneParking(\'checkParking' + x +'\');" value="'+att.Naam+'" checked="checked"> P ' + att.Naam +'</li>';
			findOneParking(att.Naam);
		}
		toPrint = toPrint + '</ul>' 
		$("#legende_all_parkings").html(toPrint);
	}
	
	/* CLICKING LEGEND PARKINGS */ 
	
	function toggleFindOneParking(elementName){
		if($("#"+ elementName).attr("checked")){
			findOneParking($("#"+ elementName).attr("value"));
		}
		else{
			mapExtension.removeFromMap(gOverlaysParkings[$("#"+ elementName).attr("value")]);
		}
	}
	
	function findOneParking(searchText) {
		paramsFindOneParkingTask.searchText = searchText;
		findOneParkingTask.execute(paramsFindOneParkingTask, findOneParkingTaskCompleteCallback);
	}
	
	function findOneParkingTaskCompleteCallback(results) {
		
		// we mogen er hier van uit gaan dat we 1 result terugkrijgen
		var huidigeNaam = results.findResults[0].feature.attributes.Naam;
		var huidigeURL = results.findResults[0].feature.attributes.URL;
		var huidigeSoort = results.findResults[0].feature.attributes.Soort;
		
		var baseIcon = new GIcon(G_DEFAULT_ICON);
			if(huidigeSoort == "ondergronds")
				{baseIcon.image = "http://drk4.drk.be/appparko/imgs/E9parkingoverdekt.png";}
			else
				{baseIcon.image = "http://drk4.drk.be/appparko/imgs/E9parking.png";}
			baseIcon.shadow = null;
			baseIcon.iconSize = new GSize(24, 36);
			baseIcon.shadowSize = null;
			baseIcon.iconAnchor = new GPoint(9, 34);
			baseIcon.infoWindowAnchor = new GPoint(9, 2);
		var myMarkerOptions = { icon:baseIcon };
		var myPoint = new GLatLng(50.827991, 3.265028);
		var marker = new GMarker(myPoint, myMarkerOptions)
		var myOverlayOptions = { markerOptions: myMarkerOptions };
		if(huidigeURL !="")
			{var windowContent = "<div id='insideInfoWindow'><b>P " + huidigeNaam + "</b><br/><a href=\"/appparko/iframe.html?url=" + huidigeURL + "&keepThis=true&TB_iframe=true&height=600&width=995\" title=\"P " + huidigeNaam + "\" class=\"thickbox\">Meer info</a> </div>";}
		else
			{var windowContent = "<div id='insideInfoWindow'><b>P " + huidigeNaam + "</b></div>";}
		//JS literal class esri.arcgis.gmaps.InfoWindowOptions without tabs
		var infoWindowOptions = {
		  onOpenFn:reloadThickBox,
		  content:windowContent
		};
		
		gOverlaysParkings[huidigeNaam] = mapExtension.addToMap(results,myOverlayOptions,infoWindowOptions);
	}
	
	/* CLICKING LEGEND BEWONERSKAARTZONES */ 
	
	function toggleFindOneBewonerskaartZone(elementName){
		if($("#"+ elementName).attr("checked")){
			findOneBewonerskaartZone($("#"+ elementName).attr("value"));
		}
		else{
			mapExtension.removeFromMap(gOverlaysBewonerskaartzones[$("#"+ elementName).attr("value")]);
		}
	}
	
	function findOneBewonerskaartZone(searchText) {
		paramsFindOneBewonerskaartZoneTask.searchText = searchText;
		findOneBewonerskaartZoneTask.execute(paramsFindOneBewonerskaartZoneTask, findOneBewonerskaartZoneTaskCompleteCallback);
	}
	
	function findOneBewonerskaartZoneTaskCompleteCallback(results) {
		// we mogen er hier van uit gaan dat we 1 result terugkrijgen
		var huidigeNaam = results.findResults[0].feature.attributes.NAAM;
		var overlayOptions = {
				  strokeColor:"#009099",
				  strokeWeight:3,
				  strokeOpacity:0.5,
				  fillColor:"#006066",
				  fillOpacity:0.5
				};
		//JS literal class esri.arcgis.gmaps.InfoWindowOptions without tabs
		var infoWindowOptions = {
		  content:"<div id='insideInfoWindow'><p>Bewonerszone : <b>" + huidigeNaam + "</b></p><p><a href='/appparko/print.html?KBZ=" + huidigeNaam + "' target=_blank>Print een kaart van deze zone.</a></p> </div>"
		};
		
		gOverlaysBewonerskaartzones[huidigeNaam] = mapExtension.addToMap(results,overlayOptions,infoWindowOptions);
	}

	
	/* SHOW ALL TARIEFZONES */
	
	function getAlleTariefzones() {
        queryTariefzoneTask.execute(queryAllTariefzones, false, callbackGetAlleTariefzones);
    }
	
	function callbackGetAlleTariefzones(results) {
		
		var fe = results.features;

		var toPrint = '';
		var grijsPrint = '';
		var currentTarief = [];
		for (var x = 0; x < fe.length; x++) {
			var feature = fe[x];
			var att = feature.attributes;	
			currentTarief = [];
			currentTarief["kleur"] = att.kleur;
			currentTarief["tarief"] = att.tarief;
			currentTarief["SMS"] = att.SMS;
			currentTarief["URL"] = att.URL;
			currentTarief["omschr"] = att.omschr;
			currentTarief["volgorde"] = att.volgorde;
			allTariefZonesInfo[att.kleur] = currentTarief;
			allTariefZonesInfoOrdered[att.volgorde] = currentTarief;
		}
		
		for ( var i = 1; i < allTariefZonesInfoOrdered.length; i++)
		{
			toPrint = toPrint + '<div class="sms">' + allTariefZonesInfoOrdered[i]["SMS"] + '</div><div class="kleur ' + allTariefZonesInfoOrdered[i]["kleur"].toLowerCase() + '"> <input type=checkbox id="checkTarief' + i +'" class="tariefzone" onClick="toggleTariefZone(\'checkTarief' + i +'\');" value="'+allTariefZonesInfoOrdered[i]["kleur"]+'"> </div><div class="omschrijving_legende"><a href="/appparko/iframe.html?url=' + allTariefZonesInfoOrdered[i]["URL"] + '&keepThis=true&TB_iframe=true&height=650&width=1000" class="thickbox">' + allTariefZonesInfoOrdered[i]["omschr"] +'</a></div><div class="clear"></div>';
		} 
		$("#legende_all_tariefzones").html(toPrint);
		reloadThickBox();
	}
	
	/* CLICKING LEGEND TARIEFZONES */ 
	
	function toggleTariefZone(elementName, searchText){
		currentTariefZone = elementName.substring(11,elementName.length); //(checkTarief er af halen)
		if($("#"+ elementName).attr("checked")){
			findOneTariefZone($("#"+ elementName).attr("value"));
		}
		else{
			kleurke = $("#"+ elementName).attr("value");
			mapExtension.removeFromMap(gOverlaysTariefzones[kleurke]);
		}	
	}
	
	function findOneTariefZone(searchText) {
		paramsFindOneTariefZoneTask.searchText = searchText;
		findOneTariefZoneTask.execute(paramsFindOneTariefZoneTask, findOneTariefZoneTaskCompleteCallback);
	}
	
	function findOneTariefZoneTaskCompleteCallback(results) {
		// we mogen er hier van uit gaan dat alle results hetzelfde kleur hebben
		var huidigeKleur = results.findResults[0].feature.attributes.kleur;
		switch(huidigeKleur.toLowerCase())
			{
			case "oranje":
				var overlayOptions = {
				  strokeColor:"#F4700B",
				  strokeWeight:0,
				  strokeOpacity:0.5,
				  fillColor:"#F4700B",
				  fillOpacity:0.7
				};
			  break;
			case "rood":
				var overlayOptions = {
				  strokeColor:"#F20216",
				  strokeWeight:0,
				  strokeOpacity:0.5,
				  fillColor:"#F20216",
				  fillOpacity:0.7
				};
			  break;
			case "roze":
				var overlayOptions = {
				  strokeColor:"#F70BE7",
				  strokeWeight:0,
				  strokeOpacity:0.5,
				  fillColor:"#F70BE7",
				  fillOpacity:0.7
				};
			  break;
			case "blauw":
				var overlayOptions = {
				  strokeColor:"#270BF7",
				  strokeWeight:0,
				  strokeOpacity:0.5,
				  fillColor:"#270BF7",
				  fillOpacity:0.7
				};
			  break;
			case "grijs":
				var overlayOptions = {
				  strokeColor:"#6E6D72",
				  strokeWeight:0,
				  strokeOpacity:0.5,
				  fillColor:"#6E6D72",
				  fillOpacity:0.7
				};
			  break;
			case "groen":
				var overlayOptions = {
				  strokeColor:"#33CC33",
				  strokeWeight:0,
				  strokeOpacity:0.5,
				  fillColor:"#33CC33",
				  fillOpacity:0.7
				};
			  break;
			default:
				var overlayOptions = {
				  strokeColor:"#009099",
				  strokeWeight:0,
				  strokeOpacity:0.5,
				  fillColor:"#006066",
				  fillOpacity:0.7
				};
			}
		//JS literal class esri.arcgis.gmaps.InfoWindowOptions without tabs
		var strOmschr = allTariefZonesInfo[huidigeKleur]["omschr"];
		var txtBallonTitel = strOmschr.indexOf("zone") == -1 ? 'Zone '+strOmschr : strOmschr ;
		var strSMS = allTariefZonesInfo[huidigeKleur]["SMS"];
		var txtBallonSMS = trim(strSMS) == '' ? '' : 'SMS code: '+strSMS ;
		
		var contentInfoWindow = "<div id='insideInfoWindow'><b>" + txtBallonTitel + "</b><br/>" + txtBallonSMS + "<br/>Binnen deze zone geldt het tarief:\"<em>" + allTariefZonesInfo[huidigeKleur]["tarief"] + "</em>\".<br/><a href=\"/appparko/iframe.html?url=" + allTariefZonesInfo[huidigeKleur]["URL"] + "&keepThis=true&TB_iframe=true&height=650&width=1000\" title=\"" + txtBallonTitel + "\" class=\"thickbox\">Meer info</a></p></div>";
		var infoWindowOptions = {
		  content:contentInfoWindow
		};
		gOverlaysTariefzones[huidigeKleur] = mapExtension.addToMap(results,overlayOptions,infoWindowOptions);
	}
	
	function toggle(elementName){
		$("#"+elementName).slideToggle();
	}
	
	function toggleFast(elementName){
		$("#"+elementName).toggle();
	}
		
	function getElementsByClassName(cl) {
		var retnode = [];
		var myclass = new RegExp('\\b'+cl+'\\b');
		var elem = document.getElementsByTagName('*');
		for (var i = 0; i < elem.length; i++) {
			var classes = elem[i].className;
			if (myclass.test(classes)) retnode.push(elem[i]);
		}
		return retnode;
	}
	
	function verberglegende(){
		if($("#legende_all_bewonerskaartzones").is(':visible')){
			$("#legende_all_bewonerskaartzones").hide();
		}
	}
	
	$(document).ready(function(){
		if(version != "bewonerskaartzones")
		{
			$("#div_bewonerskaartzones").hide();
			$("#toggleDesignsTZ").hide();
			$("#legende_bewonerskaartzones").hide();
			var broodkruimels = getElementsByClassName("breadcrumb");
			var broodkruimel = broodkruimels[0];
			broodkruimel.style.display = "none";
			
			var paginatitels = getElementsByClassName("title");
			var paginatitel = paginatitels[0];
			paginatitel.style.display = "none";
		}
		else
		{
			$("#div_tariefzones").hide();
			$("#toggleDesignsBKZ").hide();
			$("#legende_tariefzones").hide();
			$("#legende_bewonerskaartzones").hide();
			$("#legende_all_parkings").hide();
		}
		
    $("#legende_bijzondere_parkings").hide();
    
		$("#toggleDesignsBKZ").click(function () { 
			toggleFast('toggleDesignsBKZ');
			toggleFast('toggleDesignsTZ');
			toggle('div_tariefzones');
			toggle('div_bewonerskaartzones');
			clearAllResults();
			clearMap(gOverlays);
			document.getElementById('streetList').value = '';
			});
		
		$("#toggleDesignsTZ").click(function () { 
			toggleFast('toggleDesignsBKZ');
			toggleFast('toggleDesignsTZ');
			toggle('div_tariefzones');
			toggle('div_bewonerskaartzones');
			clearAllResults();
			clearMap(gOverlays);
			toggle('legende_bewonerskaartzones');
			document.getElementById('streetList').value = '';
			});
		
		
		initialize();
		$("#select_houseNumbers").change(function(){zoomToHouseNumber();});
		getAllBewonerskaartzones();
		getAlleTariefzones();
		getAllParkings();

			$("#legende h4").click(function () { 
        if( this.className != 'alwayscollapsed' ){
          this.className = (this.className == 'collapsed') ? 'expanded':'collapsed';
        }
        $(this).siblings().slideToggle();
			});
			
	});