var map;
var geocoder;
var zoomThing;
var oWizard;
var openWizard;
var maxPointers = 100;

function initialize() {

  if (GBrowserIsCompatible()) {
	map = new GMap2(document.getElementById("map") );
	map.defaultZoomLevel = 7;
	if(!shouldOpenStatement)
		map.setCenter(new GLatLng(52.363077, 5.262637), map.defaultZoomLevel);
	else
		map.setCenter(new GLatLng(statementLat, statementLng), 18);
	
	map.imgExt = ie6 ? 'gif' : 'png' ; // Set which extension to use for transparent images 
	map.setMapType(G_SATELLITE_MAP);
	//map.setMapType(G_NORMAL_MAP);
	map.hybridThreshold = 16;
	map.addControl(new BottomControl());
	map.addControl(new LeftControl());
	map.addControl(new RightControl());
	map.addControl(new TopControl());
	map.addControl(new CustomPanControl());
	
	if(!shouldOpenStatement){
		map.addControl(new CounterControl());
	}
	map.msgPopup = new CustomPopup();
	// Add the custom zoomcontrol
	zoomThing = new CustomZoomControl()
	map.addControl(zoomThing);
	oWizard = new AddOpinionWizard
	map.addControl(oWizard);

	GEvent.addListener(map, "dragend", firePositionChangeEvents);
	GEvent.addListener(map, "zoomend", firePositionChangeEvents);	

	GEvent.addListener(map, "movestart", map.msgPopup.hide); // Hide the message popup when user starts to move page
	GEvent.addListener(map, "zoomend", map.msgPopup.hide);
	
	
	GEvent.addListener(map, "zoomend", function(){
		
		// Take care of switching between maptypes for different zoomlevels
		if(map.getZoom() >= map.hybridThreshold ){
			map.setMapType(G_HYBRID_MAP);	
		}else{
			map.setMapType(G_SATELLITE_MAP);	
		}
		
		// Hide counterMsg for deeper zoomlevels
		if(map.getZoom() > 7){
			document.getElementById("countermsg").style.display = 'none';
		}else{
			document.getElementById("countermsg").style.display = 'block';
		}
	});
	
	if(openWizard){
		oWizard.openWizard();
	}

	firePositionChangeEvents();
	
	return true;
	
  }
}

/*
 *	Bottom, Left, Right and Top form the screen overlay
 */
function BottomControl(){
}

BottomControl.prototype = new GControl();

BottomControl.prototype.initialize = function(map) {
  var container = document.createElement("div");

  var bottomDiv = document.createElement("div");
  var bottomImg = document.createElement("img");
  bottomImg.src = "/img/map/screen/south." + map.imgExt;
  bottomImg.height = 70 ;
  bottomImg.width = 1024;
  bottomImg.alt = 'tv-scherm onder';
  bottomDiv.appendChild(bottomImg);
  container.appendChild(bottomDiv);
  map.getContainer().appendChild(container);
  return container;
}

BottomControl.prototype.getDefaultPosition = function() {

	if(navigator.appName != 'Microsoft Internet Explorer')
		return new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(0, -4));
	else
		return new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(0, 0));
}

function LeftControl(){
}

LeftControl.prototype = new GControl();

LeftControl.prototype.initialize = function(map) {
  var container = document.createElement("div");

  var LeftDiv = document.createElement("div");
  var LeftImg = document.createElement("img");
  LeftImg.src = "/img/map/screen/west." + map.imgExt;
  LeftImg.height = 605 ;
  LeftImg.width = 85;
  LeftImg.alt = 'tv-scherm onder';
  LeftDiv.appendChild(LeftImg);
  container.appendChild(LeftDiv);

  map.getContainer().appendChild(container);
  return container;
}

LeftControl.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(0,70));
}

function RightControl(){
}

RightControl.prototype = new GControl();

RightControl.prototype.initialize = function(map) {
  var container = document.createElement("div");

  var RightDiv = document.createElement("div");
  var RightImg = document.createElement("img");
  RightImg.src = "/img/map/screen/east." + map.imgExt;
  RightImg.height = 605 ;
  RightImg.width = 85;
  RightImg.alt = "tv-scherm rechts";
  RightDiv.appendChild(RightImg);
  container.appendChild(RightDiv);
  map.getContainer().appendChild(container);
  return container;
}

RightControl.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(0,70));
}

function TopControl(){
}

TopControl.prototype = new GControl();

TopControl.prototype.initialize = function(map) {
  var container = document.createElement("div");

  var TopDiv = document.createElement("div");
  var TopImg = document.createElement("img");
  TopImg.src = "/img/map/screen/north." + map.imgExt;
  TopImg.height = 70;
  TopImg.width = 1024;
  TopImg.alt = "tv-scherm boven";
  TopDiv.appendChild(TopImg);
  container.appendChild(TopDiv);
  map.getContainer().appendChild(container);
  return container;
}

TopControl.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(0,0));
}

function CounterControl(){
	
}
CounterControl.prototype = new GControl();

CounterControl.prototype.initialize = function(){
	var container = document.createElement("div");
	container.id = "counterinfo";
	var counterHTML = document.getElementById("counterTemp").innerHTML;
	container.innerHTML = counterHTML;

	 map.getContainer().appendChild(container);
	return container;
}

CounterControl.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(410,70));
}
/**************	Zoom Control ****************/

var indicator;
function CustomZoomControl(){
}

CustomZoomControl.prototype = new GControl();

CustomZoomControl.prototype.initialize = function(map) {
	this.minZoomLevel = 7;
	this.maxZoomLevel = 19;

	// Create zoomcontrol container
	var container = document.createElement("div");

	// Insert banner above zoombar
	var bannerImg =				 	document.createElement ("img");
	bannerImg.src =				 	"/img/map/screen/geenslachtoffer." + map.imgExt;
	bannerImg.height = 				45;
	bannerImg.width = 				175;
	bannerImg.alt = 				'Word geen slachtoffer van je eigen wapen';
	bannerImg.style.display = 		"block";
	bannerImg.style.marginBottom = 	"8px";
	bannerImg.style.marginLeft = 	"1px";
	container.appendChild(bannerImg);

	// Create zoomOut button
	var zoomOutImg = document.createElement("img");
	zoomOutImg.className = 'zoombar'; 
	zoomOutImg.src = "/img/map/screen/zoomout." + map.imgExt;	
	zoomOutImg.alt = "Uitzoomen";	
	zoomOutImg.id = 'zoomout';
	zoomOutImg.width = 24;
	zoomOutImg.height = 17;
	zoomOutImg.title = "Uitzoomen";
	zoomOutImg.onclick = function(){
		if(map.getZoom() != zoomThing.minZoomLevel){
			map.zoomOut();	
		}	
	};
	container.appendChild(zoomOutImg);

	 // Create zoombar
	var zoomBar = document.createElement("div");
	zoomBar.style.backgroundImage = "url(/img/map/screen/zoombar_bg." + map.imgExt + ")";
	zoomBar.className =	'zoombar';
	zoomBar.style.backgroundRepeat = "repeat-x";
	
	// Create zoomlevel indicator and make sure it is updated after a zoom ends
	indicator = document.createElement("img");
	indicator.id = 'indicator';
	zoomBar.appendChild(indicator);
	container.appendChild(zoomBar);
	GEvent.addListener(map, "zoomend", function() {
		zoomThing.adjustBar();
		return;
	});
	this.adjustBar();
	
	// Create zoomIn button
	var zoomInImg = document.createElement("img");
	zoomInImg.src = "/img/map/screen/zoomin." + map.imgExt;
	zoomInImg.id = "zoomin";
	zoomInImg.alt = "Inzoomen";	
	zoomInImg.className = 'zoombar';
	zoomInImg.title = "Inzoomen";	
	zoomInImg.width = 24;
	zoomInImg.height = 17;
	
	// Both doubleClick and zoomBar should use the following function
	var constrainedZoom = function(){
		
		if(map.getZoom() < zoomThing.maxZoomLevel){
			map.zoomIn();	
		}	
	}
	zoomInImg.onclick = constrainedZoom;
	
	var handleZoom = function(s, e){
	
		if (e >= zoomThing.maxZoomLevel){
			map.disableDoubleClickZoom();
		}else{
			map.enableDoubleClickZoom();
		}
	}
	GEvent.addListener(map, "zoomend", handleZoom);	
	container.appendChild(zoomInImg);
	map.getContainer().appendChild(container);
	return container;
}

CustomZoomControl.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(100, 65));
}

// Sync left margin of blue indicator with zoomlevel
CustomZoomControl.prototype.adjustBar = function(){
	var barWidth = 128;
	var zoomLevels = 13;
	var dist = barWidth/zoomLevels ;

	indicator.style.marginLeft = Math.round(dist * (map.getZoom() - this.minZoomLevel)) + 'px' ;
}

/**************	Panning ****************/

function CustomPanControl(){
	
}
CustomPanControl.prototype = new GControl();

CustomPanControl.prototype.initialize = function(map) {
  	var container = document.createElement("div");
	
	var north = document.createElement('img');
	north.className = 'north';
	north.src = '/img/map/screen/pan_north.gif';
	north.onclick = function(){	map.panDirection(0,1)};
	container.appendChild(north);
	
	var west = document.createElement('img');
	west.className = 'west';
	west.src = '/img/map/screen/pan_west.gif';
	west.onclick = function(){	map.panDirection(1,0)};
	container.appendChild(west);

	var east = document.createElement('img');
	east.className = 'east';
	east.src = '/img/map/screen/pan_east.gif';
	east.onclick = function(){	map.panDirection(-1, 0)};
	container.appendChild(east);
	
	var south = document.createElement('img');
	south.className = 'south';
	south.src = '/img/map/screen/pan_south.gif';
	south.onclick = function(){	map.panDirection(0,-1)};
	container.appendChild(south);
			
  	map.getContainer().appendChild(container);
	return container;
}
CustomPanControl.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(290, 64));
}

/**************	Icon ****************/

function CustomIcon(type){
	this.type = parseInt(type);
	this.init();
}

CustomIcon.prototype = new GIcon( G_DEFAULT_ICON );

CustomIcon.prototype.init = function(){
	
	this.image 		= '/img/map/icons/pin.png'; // Icon image must be a square
	this.shadow 	= null;
	this.shadowSize = null;
	
	// Scale icon based on type
	var icoSize = this.type * 2 + 10;
	this.iconSize = new GSize(icoSize,icoSize);
	this.iconAnchor = new GPoint(icoSize/2,icoSize);
}

/**************	Popup ****************/

function CustomPopup(){
	this.popupHeight = 223;
	this.pointerOffset = 111; // Distance from leftsize of box to pointer of the popup
	this.mapHeight = 745;
	this.mapWidth = 1024 ;
}

CustomPopup.prototype = new GControl();

CustomPopup.prototype.initialize = function(){
	 var container = document.createElement("div");
	 container.id = 'msgPopup';
	 container.style.backgroundImage  = 'url("/img/map/popup/popup_bg.' + map.imgExt + '")';
	 map.getContainer().appendChild(container);
	 return container;
}

CustomPopup.prototype.getDefaultPosition = function() {
	
	var offsetLeft 	= (this.mapWidth / 2) - this.pointerOffset;
	var offsetTop 	= (this.mapHeight / 2) - this.popupHeight;
	return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(offsetLeft, offsetTop)); 
}

CustomPopup.prototype.show = function(marker){
	map.addControl(map.msgPopup);
	this.setContent(marker);
	urchinTracker('Statement geopend');
	map.msgPopup.visible = true;
}

CustomPopup.prototype.hide = function(){
	if(!map.msgPopup.visible){
		return;
	}
		
	map.removeControl(map.msgPopup);
	map.msgPopup.visible = false;
}

CustomPopup.prototype.setContent = function(marker){
	var popupDiv = document.getElementById('msgPopup');

	var img = document.createElement('img');
	img.src 		= marker.popup.avatar;
	img.className 	= 'avatarImg';
	popupDiv.appendChild(img);
	
	// right floating container
	var floater = document.createElement('div');
	floater.className = 'popupFloat';
	
	var but = document.createElement('img');
	but.className	= 'closePopup';
	but.src			='/img/layout/button_close.' + map.imgExt;
	but.alt			= 'Venster sluiten';
	but.title		= 'Venster sluiten';
	but.onclick = function(){map.msgPopup.hide();};
	floater.appendChild(but);
	
	var h3 = document.createElement('h3');
	var h3Text = document.createTextNode(marker.popup.title);
	h3.appendChild(h3Text);
	floater.appendChild(h3);
	
	var p1 = document.createElement('p');
	p1.className = 'date';
	var p1Text = document.createTextNode(marker.popup.date);
	p1.appendChild(p1Text);
	floater.appendChild(p1);
	
	var p2 	= document.createElement('p');
	p2.id  = 'popupP';
//	alert(marker.popup.descr+' '+unescape(marker.popup.descr));
//	var p2Text = document.createTextNode(unescape(marker.popup.descr));
	
	var br = document.createElement('br');

	floater.appendChild(p2);
	

	popupDiv.appendChild(floater);
	
	// We set some content afterwards for html_entities purpose
	document.getElementById('popupP').innerHTML = marker.popup.descr;
	
	// Get friends
	var url = "/call/friends.php?id=" + marker.popup.id;
	var request = YAHOO.util.Connect.asyncRequest('GET', url, {	success:function(o){
		var span = document.createElement('DIV');
		span.innerHTML = o.responseText;
		document.getElementById('popupP').appendChild(span);
			
		},
		failure:null});	

}

/**************	Add Opinion Wizard ****************/

function AddOpinionWizard(){
	this.wStatus = 0;
}

AddOpinionWizard.prototype = new GControl();

AddOpinionWizard.prototype.initialize = function(){
	// init geocoder
	geocoder = new GClientGeocoder();
	
	this.container = document.createElement("div");
	this.container.id = 'addOpinion';
	this.addButton = document.createElement("img");
	this.addButton.src = '/img/map/screen/addopinion.' + map.imgExt;
	this.addButton.height = 65;
	this.addButton.width = 206; 
	this.addButton.alt= 'Plaats je statement en ontvang de tag'; 
	this.addButton.onclick = function(){
		oWizard.openWizard();
	};
	this.container.appendChild(this.addButton);

	map.getContainer().appendChild(this.container);	
	return this.container;
}
AddOpinionWizard.prototype.getDefaultPosition = function() {
  return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(100, 65));
}

AddOpinionWizard.prototype.addDraggableMarker = function(){
	
	if(this.dMarker) // Only one draggable marker should be added
		return;
	
	// Set dMarker properties and add it to the map 
	var addIcon = new GIcon(  );//G_DEFAULT_ICON
	var size = 37;
	addIcon.image = '/img/map/icons/add.png';
	addIcon.iconSize = new GSize(size,size);
	addIcon.iconAnchor = new GPoint(size/2,size);
	var latlng  = map.getCenter();
	this.dMarker = new GMarker(latlng,{icon:addIcon, draggable:true, bouncy:true, title:'Sleep dit icoon naar de gewenste locatie'});
	map.addOverlay(this.dMarker);

	this.updateLatLng();
	GEvent.addListener(this.dMarker,  "drag", this.updateLatLng);
	
}

AddOpinionWizard.prototype.updateLatLng = function(){
		var coor = oWizard.dMarker.getLatLng();
		document.getElementById('lat').value = coor.lat();
		document.getElementById('lng').value = coor.lng();
}

AddOpinionWizard.prototype.closeWizard = function(){
	oWizard.addButton.style.display = 'block';
	oWizard.wizard.style.display = 'none';
	oWizard.dMarker.hide();	
	firePositionChangeEvents();
}
	
/*
 * 		Opens the wizard and sets most event handlers for functionality within the wizard
 */
AddOpinionWizard.prototype.openWizard= function(){
	map.msgPopup.hide();
	

	if(!this.wizard){	
		
		this.addButton.style.display = 'none';
		this.addDraggableMarker();
		// Get wizard html and append to container
		var wizardContent = document.getElementById("wizardTempContainer").innerHTML;
		this.wizard = document.createElement("div");
		this.wizard.id = 'wizard';
		this.wizard.onclick = null;
		this.wizard.innerHTML = wizardContent;
		this.container.appendChild(this.wizard);
	
		// Attach events for GeoRequest
		this.geoInput = document.getElementById("geoInput");
		YAHOO.util.Event.addListener(document.getElementById("geoButton"), "click", oWizard.makeGeoReq); 
		YAHOO.util.Event.addListener(this.geoInput, "click", function() { this.value=''; } ); 
		// 
		YAHOO.util.Event.addListener(document.getElementById("centerMarker"), "click", function(){
			oWizard.dMarker.setLatLng(map.getCenter());
			oWizard.updateLatLng();
			
		}); 		
		
		// Enable switching between steps by clicking on h4 links
		var steps = getElementsByClassName(this.wizard, 'div', 'step');
		for(var i = 0; i<steps.length; i++){
			var h4 = steps[i].getElementsByTagName('h4')[0];
			YAHOO.util.Event.addListener(h4, "click", function() { 
				var thisStep = this.parentNode.id.charAt(4);
				oWizard.setStatus(parseInt(thisStep));				
			});
		}	
	
		// Attach events for OK buttons)
		var buttons = getElementsByClassName(this.wizard, 'img', 'nextButton');
		for (var i= 0; i<buttons.length; i++){
			YAHOO.util.Event.addListener(buttons[i], "click", function() { 
				// ids should be 'button1', 'button2' and so on
				var thisStep = this.id.charAt(6);
				var nextStep = parseInt(thisStep) + 1;
				oWizard.setStatus(nextStep);
			 } ); 
		}

		// Handlers for uploading Avatar and submitting Wizard
		YAHOO.util.Event.addListener(document.getElementById("upload"), "click", this.uploadImage ); 
		YAHOO.util.Event.addListener(document.getElementById("remove"), "click", this.removeImage ); 
		YAHOO.util.Event.addListener(document.getElementById("submitWizard"), "click", this.submit ); 
					
		// Event for closing the wizard
		YAHOO.util.Event.addListener(document.getElementById("closeWizard"), "click", this.closeWizard ); 
		
		/*
		// BEGIN Zipcode Events
		var handleZipReq = {
			success: function(req){
				if(req.responseText == 'err'){
					document.getElementById('dynamicAddress').innerHTML = 'Postcode kon niet worden gevonden';
				}else{
					// Get first and lastname
					var ln = document.getElementById('lastname').value;
					var fn = document.getElementById('firstname').value;
					var arr 	= req.responseText.split('|||');
					var city 	= arr[0];
					var street	= arr[1];							
					var zip		= arr[2];
					// Store values in submit form
					document.getElementById('cityHolder').value = city;
					document.getElementById('streetHolder').value = street;
					document.getElementById('zipHolder').value = zip;

					var number  = document.getElementById('houseNr').value != '' ? '<span id="dynamicNumber">' + document.getElementById('houseNr').value + '</span><br />' : '<span id="dynamicNumber"></span><br />';
					// Span is added so we can store housenumber later 
					document.getElementById('dynamicAddress').innerHTML = fn + ' ' + ln + '<br />' + street + number + zip + ' ' + city;							
				}
			},failure:null
		};
		
		YAHOO.util.Event.addListener(document.getElementById("zip"), "keyup", 
		function(){
			if(this.value.length < 6){ // Empty dynamic address and return when zip isn't complete
				document.getElementById('dynamicAddress').innerHTML = '';
				return;
			}

			var numbers = this.value.substr(0,4);
			var letters = this.value.substr(4,2);
			
			var url = '/call/get/address/' + numbers + '|' + letters;
			var req = YAHOO.util.Connect.asyncRequest('GET', url, handleZipReq );
		} ); 	
		
		// Fill in the housenumber 
		YAHOO.util.Event.addListener(document.getElementById("houseNr"), "keyup",
		function(){
			var elToUpdate = document.getElementById('dynamicNumber');
			
			if(!elToUpdate || (!this.value.substr(0,1).isNumeric() && this.value != '') )
				return;
			else{
				elToUpdate.innerHTML = this.value;
			}
		}
		 );
		
		// END Zipcode Events
		*/
		
	
		// When first opened always start step 1
		oWizard.setStatus(1);

	}else{
		this.addButton.style.display = 'none';
		this.wizard.style.display = 'block';
		this.dMarker.show();
	}
	
		// Clear all markers 
		for (var i=0; i<markers.length; i++){
			if(markers[i] != undefined){
			map.removeOverlay(markers[i]);
			}
		}
		
	
}

AddOpinionWizard.prototype.setStatus = function(s){	
	
	if(!s)
		return;

	// Validate all fields to correctly display check-icon
	var nrOfSteps = 5;

	for(var i = 1; i<=5;i++){
		if(this.validateStep(i))
			this.setAsCompleted(i);
		else
			this.setAsIncomplete(i);
	}
	
	// Steps 1,2,3 should always be completed in order to proceed to the next step
	if( this.wStatus == 1 || this.wStatus == 2 || this.wStatus == 3 ){

		// Validate previous steps
		for(var i = 1; i< s; i++ ){
			if(!this.validateStep(i)){
				this.inCompleteStepFeedback(i);
				return;
			}
		}
	}
	
	// We make sure the user can't proceed to step 4 or higher, if steps 1-3 aren't completed yet
	if(this.wStatus != 0 ){
		if( s > 3){
			var stepsToCheck = new Array(1,2,3);
			for(var i = 1; i< stepsToCheck.length + 1; i++){
				if(!this.validateStep(i)){
					this.inCompleteStepFeedback(i);
					return;
				}
			}
		}
	}

	// If user is currently in uploadStep, check if he forgot to upload the image 
	if(this.wStatus == 4 && document.getElementById('avatar').value != ''){
		oWizard.uploadImage();
		return;
	}
	
	if(this.wStatus != s ){
		this.hideStep(this.wStatus);
	}else{
		var cont = this.getStepContainer(s);
		if (cont.expanded)
			this.hideStep(s);
		else
			this.showStep(s);
		return;
	}
	
	switch(s){
		
		case 1:		if(!this.wizard)this.openWizard();
					this.showStep(1);
					break;
		case 2:		
					this.showStep(2);
					break;
		case 3:		
					this.showStep(3);
					break;			
		case 4:		
					this.showStep(4);
					break;	
		case 5:		
					this.showStep(5);
					break;	
		case 6:	
					this.showStep(6);
					break;		
		case 7:	
					this.showStep(7);
					break;			
		default:	
					break;
	}
	
	urchinTracker('Plaats je statement: stap ' + s.toString() + ' geopend');
	this.wStatus = s;
}

AddOpinionWizard.prototype.setAsCompleted = function(step){
	var cont = this.getStepContainer(step);
	var els = getElementsByClassName(cont, 'span', 'stepCompleted');
	var icon = els[0];
	icon.style.display = 'block';
}
AddOpinionWizard.prototype.setAsIncomplete = function(step){
	var cont = this.getStepContainer(step);
	var els = getElementsByClassName(cont, 'span', 'stepCompleted');
	var icon = els[0];
	icon.style.display = 'none';
}

AddOpinionWizard.prototype.inCompleteStepFeedback = function(step){
	var o = document.getElementById("step"+step);
	if(o) {
		showInfoPopup(o, "Veld vergeten", 'Vul eerst stap ' + step.toString() + ' in om verder te gaan.')
	}
}

AddOpinionWizard.prototype.validateStep = function(step){
	switch(step){
		case 1:
				if(document.getElementById("lat").value != 0 && document.getElementById("lng").value != 0)
					return true;
				break;
		case 2:
				if(document.getElementById("statement").value != '' && document.getElementById("statement").value != 'Ik draag geen wapen omdat' )
					return true;
				break;
		case 3:
				if((document.getElementById("firstname").value != '' || document.getElementById("lastname").value != '') && document.getElementById("emailWizard").value != '')
					return true;
				break;
		case 4:
				//if(document.getElementById("avatarFilename").value != '' )
					return true;
				break;
		case 5:
				//var value = document.getElementById("cellPhone").value;
				//if( value.length == 10 &&  value.isNumeric() )
					return true;		
				break;						
		case 6:
				//if(document.getElementById("cityHolder").value != '' && document.getElementById("streetHolder").value != '' && document.getElementById("zipHolder").value != '' &&  document.getElementById("houseNr").value != '')
					  return true;
				break;																		
	}

	return false;	
}

AddOpinionWizard.prototype.getStepContainer = function(step){
	return document.getElementById('step' + step.toString());
}

AddOpinionWizard.prototype.hideStep = function(step){
	var cont = this.getStepContainer(step);
	if(!cont || !cont.expanded || step == 0){
		return false;
	}
	var els = getElementsByClassName(cont, 'div', 'stepDescr');
	
	var anim = new YAHOO.util.Anim(els[0]);
    anim.attributes.height = { from:200, to: 0 }; 
   
    anim.method = YAHOO.util.Easing.easeOut;
    anim.duration = 1;
	anim.animate();
	
	cont.className = 'step';
	cont.expanded = false;
		
}
AddOpinionWizard.prototype.showStep = function(step){

	var cont = this.getStepContainer(step);
	if(!cont || cont.expanded || step==0){
		return false;
	}
	var els = getElementsByClassName(cont, 'div', 'stepDescr');

	var anim = new YAHOO.util.Anim(els[0]);
   	anim.attributes.height = { from: 0, to: 200 }; 
   	anim.method = YAHOO.util.Easing.easeOut;
   	anim.duration = 0.5;
	anim.animate();
	
	cont.className = 'step currentStatus';
	cont.expanded = true;	

}

AddOpinionWizard.prototype.uploadImage = function(){
	
	var form = document.getElementById('avatarForm');
	var fileInput = document.getElementById('avatar');
	if(fileInput.value == '' )
		return false;
	
	if(!fileInput.value.endsWith('.jpg'))
		alert('Je kunt alleen een jpg-bestand uploaden.');
	
	var callback = {
		upload:function(r){
			
			var result = r.responseText.split('|', 2);

			if(r.responseText == '1'){
				// Wrong file extension (no JPEG)
				alert('Je kunt alleen .jpg bestanden uploaden.');
				return
			}
			if(r.responseText == 'error' || result[0] != 'success'){
				// File could't be uploaded
				alert('Het bestand kon niet worden geupload. Waarschijnlijk is je foto te groot.');
				return;
			}
			
			var path = result[1];
			// After uploading show the image
			var img = document.getElementById('uploadedImg');
			img.src = unescape(path);
			img.height = 80;
			img.width = 80;
			img.style.display = 'block';
			
			// Hide file-input form
			document.getElementById('avatarForm').reset();
			document.getElementById('upload').style.display = 'none';
			form.style.display = 'none';
			
			// Show the remove button
			document.getElementById('remove').style.display = 'inline';
			
			// Set url for submitting			
			document.getElementById('avatarFilename').value = path;
	
			return;
		},
		
		failure:function(){
			alert('Er iets iets fout gegaan bij het uploaden van het plaatje');
		}
	};
	
	YAHOO.util.Connect.setForm(form, true);
	var cObj = YAHOO.util.Connect.asyncRequest('POST', '/call/save/avatar/', callback);
}

AddOpinionWizard.prototype.removeImage = function(){
	
	document.getElementById('avatarForm').style.display = 'block';
	document.getElementById('remove').style.display = 'none';
	document.getElementById('upload').style.display = 'block';
	var img = document.getElementById('uploadedImg');
	img.src = '/img/noavatar.gif';
	
	// Remove url for submitting			
	document.getElementById('avatarFilename').value = '';
	
}

AddOpinionWizard.prototype.makeGeoReq = function(e){
	if(oWizard.geoInput.value != ''){
		if(document.getElementById('cityHolder').value == '0'){
			document.getElementById('cityHolder').value = oWizard.geoInput.value;
		}
		geocoder.setBaseCountryCode( 'NL' );
		geocoder.getLatLng( oWizard.geoInput.value + ', Netherlands', oWizard.setGeo );
	}
}

AddOpinionWizard.prototype.setGeo = function(point){
	//Pan to location, then zoom in
	if (!point){
		alert("Deze plaats kon niet worden gevonden");
	}else {
		var geoPanHandler = GEvent.addListener(map, "moveend", function(){
			
			GEvent.removeListener(geoPanHandler);
			
			map.setZoom(13);
			oWizard.dMarker.setLatLng(map.getCenter());
			oWizard.updateLatLng();
		})		
		map.panTo(point);
   }
}

AddOpinionWizard.prototype.submit = function(){

	// Get statement attrs
	var lat  			= document.getElementById('lat').value;
	var lng  			= document.getElementById('lng').value;
	var email			= document.getElementById('emailWizard').value;
	var firstname  		= document.getElementById('firstname').value;
	var lastname  		= document.getElementById('lastname').value;
	var mobile  		= '';//document.getElementById('cellPhone').value;
	var statement  		= document.getElementById('statement').value;
	var avatarUrl  		= document.getElementById('avatarFilename').value;	
	var street			= '';//document.getElementById('streetHolder').value;
	var city 			= '';//document.getElementById('cityHolder').value;
	var zip				= '';//document.getElementById('zipHolder').value;
	var number			= '';//document.getElementById('houseNr').value;

	var callback = {
		success: function(r){
			
			var returnArr = r.responseText.split('|');
			if(returnArr.length > 1 && returnArr[0] != '' ){
				var step =  parseInt(returnArr[0]);	
				var msg = returnArr[1];
			}
			
			if(step == 0 && msg == 'success' ){
				// Statement was succesfully saved
				
				var lastStep = document.getElementById("step5");
				var stepDescr = getElementsByClassName(lastStep, 'div', 'stepDescr');
				var ps = stepDescr[0].getElementsByTagName('p');
				if(ps.length > 0){
					p = ps[0];
					p.innerHTML = 	'<strong>Bedankt voor het toevoegen van jouw statement!<br />' +
												'Je ontvangt nu een e-mail waarmee je jouw statement kunt bevestigen.</strong><br />';
					var closeIt = document.createElement('a');
					closeIt.href = '#map';
					closeIt.onclick = oWizard.closeWizard;
					var text = document.createTextNode('Sluiten');
					closeIt.appendChild(text);
					p.appendChild(closeIt);
				}else{
					alert('Bedankt voor het toevoegen van jouw statement! Je ontvangt nu een e-mail waarmee je jouw statement kunt bevestigen.');
				}

				var submit = document.getElementById("submitWizard");
				if(submit)
					submit.style.display = 'none';
				
				oWizard.dMarker.hide();
				
			}else if(step < 5){ 
				// There has been an error - var step tells us in which step the error has occured  
				stepEl = document.getElementById("step"+step);
				if(stepEl){
					showInfoPopup(stepEl, 'Fout bij opslaan', msg);
				}else{
					alert(msg);
				}
				
			}else{
				alert('Er is een onbekende fout opgetreden, probeer het aub later nogmaals.');
			}		
		} ,
		failure: function(r){
			alert('Er is een onbekende fout opgetreden, probeer het aub later nogmaals.');
		}
	}

	
	var postData = '';
	//postData +=	"mobile=" 		+ mobile;
	postData +=	"statement=" 	+ statement;
	postData +=	"&firstname=" 	+ firstname;
	postData +=	"&lastname=" 	+ lastname;		
	postData +=	"&email="		+ email;
	postData +=	"&latitude=" 	+ lat;
	postData +=	"&longitude=" 	+ lng;
	postData +=	"&avatarUrl=" 	+ avatarUrl;
	//postData +=	"&zipcode=" 	+ zip;
	//postData +=	"&street=" 		+ street;
	//postData +=	"&number="	 	+ number;			
	postData +=	"&city="	 	+ city;		
	var req = YAHOO.util.Connect.asyncRequest('POST', '/call/save/statement/', callback, postData);
}

function showInfoPopup(anchorPoint, title, msg) {
	var o = document.getElementById("wizardinfopopup");
	if(o) {
		o.style.display = "block";
		var hs = o.getElementsByTagName("h3");
		if(hs.length > 0) {
			hs[0].innerHTML = title;
		}
		var ps = o.getElementsByTagName("p");
		if(ps.length > 0) {
			ps[0].innerHTML = msg;
		}
		var pos = getElementPosition(anchorPoint);
		o.style.top = (pos.top - 110) + "px";
		o.style.left = (pos.left - 262) + "px";
		
		// Attach event for closing the wizard
		var closeA = document.getElementById("closeWizardInfo");
		if(closeA){
			YAHOO.util.Event.addListener(closeA, "click", closeWizardInfoPopup);
		}
	}
}

function closeWizardInfoPopup() {
	var o = document.getElementById("wizardinfopopup");
	if(o) {
		o.style.display = "none";
	}
}