// JavaScript Document

var xh, naam, email, woonplaats, bericht;

function addEvent(el, ev, fn, cap) {
	if (window.addEventListener) {
		el.addEventListener(ev, fn, cap);
		return true;
	} else if (window.attachEvent) {
		el.attachEvent('on'+ev, fn);
	} else {
		el['on'+ev] = fn;
	}
}

function createXH() {
	xh = (window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
}

function init() {
	if (document.getElementById && document.getElementById('reactieformclick')) {
		var frmStart = document.getElementById('reactieformclick');
		var btnSubmit = document.getElementById('btnSubmit');
		var txtBericht = document.getElementById('bericht');

		addEvent(frmStart, 'click', showForm, false);
		addEvent(btnSubmit, 'click', startReq, false);
		addEvent(txtBericht, 'keyup', startCount, false);
	}
}

function startCount() {
	
	var maxlength = 1000;
	var txt = document.getElementById('bericht').value;
	var s = new String(txt);
	var tlen = maxlength - s.length;
	var teller = document.getElementById('teller');
	teller.innerHTML = "Nog " + tlen + " tekens beschikbaar";
}

function startReq() {
	createXH();
	var data = getData(); 
	if (!data) {
		return false;
	}
	var url = 'scripts/doReacties.php';
	xh.onreadystatechange = callBack;
	xh.open("POST",url,true);
	xh.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
	xh.send(data);
}

function getData() {
	naam = convert(document.getElementById('naam').value);
	email = convert(document.getElementById('email').value);
	woonplaats = convert(document.getElementById('woonplaats').value);
	bericht = convert(document.getElementById('bericht').value);
	if (naam == '' || bericht == '') {
		alert("U moet minstens uw naam en een bericht achterlaten.");
		return false;
	}
	var datastring="naam=" + naam + "&email=" + email + "&woonplaats=" + woonplaats + "&bericht=" + bericht;
	return datastring;
}

function convert(str) {
	var s = new String(str);
	var letter;
	for (var i = 0; i < s.length; i++) {
		letter = s.charCodeAt(i);
		s[i]=letter; 
	}
	return s;
}
function callBack() {
	if (xh.readyState == 4) {
		if (xh.status == 200) {
			handleXML();
		}
	}
}

function handleXML() {
	//alert (xh.responseText);
	var reactieDiv = document.getElementById('reactie');
	while (reactieDiv.hasChildNodes()) {
		reactieDiv.removeChild(reactieDiv.childNodes[0]);
	}
	if (xh.responseText == "succes") {
		var datum = new Date();
		var dag = datum.getDate();
		var maand = datum.getMonth() + 1;
		var jaar = datum.getFullYear();
		datum = dag + "-" + maand + "-" +jaar;
		var msg ="<h2>Ontvangen!</h2><p>Uw bericht is ontvangen en geplaatst. Dank voor uw betrokkenheid.</p>";
		msg += "<p><strong>" + naam + " - " + woonplaats + "</strong> - <em>" + datum + "</em></p>";
		msg += "<p>" + bericht + "</p>";
		reactieDiv.innerHTML = msg;
	} else {
		reactieDiv.innerHTML = xh.responseText;
	}
}

function showForm() {
	var frm = document.getElementById('reactieform');
	if (frm.style.display == 'block') {
		frm.style.display = 'none';
	} else {
		frm.style.display = 'block';
	}
}

addEvent(window,'load',init,false);