function el(id) {
	if (document.getElementById) {
		return document.getElementById(id);
	} else if (window[id]) {
		return window[id];
	}
	return null;
}

function toggleBox(box){
	var thisbox = el(box);
	if(thisbox.style.display=='none')
	  showBox(thisbox);
	else
	  hideBox(thisbox);
}

function hideBox(box){
  box.style.display='none';
}
function showBox(box){
  box.style.display='block';	
}

function showcomments(nb){
	var xhr; 
  var commentblock = el('comments-'+nb);
  var showbtn = el('btn-show-'+nb);
  var hidebtn = el('btn-hide-'+nb);
  var text="";
  try {  xhr = new ActiveXObject('Msxml2.XMLHTTP');   }
  catch (e) {
    try {   xhr = new ActiveXObject('Microsoft.XMLHTTP');    }
    catch (e2){
      try {  xhr = new XMLHttpRequest();     }
      catch (e3) {  xhr = false;   }
    }
  }
  xhr.onreadystatechange  = function(){ 
    if(xhr.readyState  == 4 ){
      if( xhr.status  == 200) {
        var xmlDoc = xhr.responseXML;
        var x=xmlDoc.getElementsByTagName("NEWS_REACTION_ITEM");
        for (var i=0;i<x.length;i++){ 
        	text += "<div class=\"comment\">";
          text += "<div class=\"comment-icon\">";
          text += "<img alt=\"\" src=\""+x[i].getElementsByTagName("NEWS_REACTION_POSTER_IMG")[0].childNodes[0].nodeValue+"\" style=\"max-width=45px;max-height:45px;\" />";
          text += "</div>";
          text += "<div class=\"comment-content\">";
          text += "<div class=\"poster\">"+x[i].getElementsByTagName("NEWS_REACTION_POSTER")[0].childNodes[0].nodeValue+"</div><div class=\"datum\"> "+x[i].getElementsByTagName("NEWS_REACTION_DATE")[0].childNodes[0].nodeValue+"</div><div class=\"comment-break\"></div>";
          text += "<p>"+x[i].getElementsByTagName("NEWS_REACTION_TEXT")[0].childNodes[0].nodeValue+"</p>";
          text += "</div>";
          text += "<div class=\"comment-break\"></div>";
          text += "</div>";
        }
        text +="<div class=\"comment\">";
        text +="<form>";
        text +="<input type=\"text\" size=\"50\" name=\"reaction"+nb+"\" id=\"reaction"+nb+"\"/>";
        text +="<input type=\"button\" onclick=\"submitForm("+nb+");\" value=\"verzenden\"/>";
				text +="</form>";
				text +="</div>";
        commentblock.innerHTML = text;
       	showBox(commentblock);
				hideBox(showbtn);
				showBox(hidebtn);	
         }
    }
    resize_ventje();
  }; 
  xhr.open("GET", "./includes/xml.php?type=news_reaction&news_id="+nb,  true);
  xhr.send(null);
}

function hidecomments(nb){
	var commentblock = el('comments-'+nb);
  var showbtn = el('btn-show-'+nb);
  var hidebtn = el('btn-hide-'+nb);
	hideBox(commentblock);
	showBox(showbtn);
	hideBox(hidebtn);
	resize_ventje();	
}

function submitForm(nb){ 

 var xhr; 
  try {  xhr = new ActiveXObject('Msxml2.XMLHTTP');   }
  catch (e) {
    try {   xhr = new ActiveXObject('Microsoft.XMLHTTP');    }
    catch (e2){
      try {  xhr = new XMLHttpRequest();     }
      catch (e3) {  xhr = false;   }
    }
  }
  
  xhr.onreadystatechange  = function(){ 
    if(xhr.readyState  == 4){
      if(xhr.status  == 200){ 
      	  showcomments(nb);
      }else{
        alert('Error code' + xhr.status);
      }
    }
  }; 
    xhr.open("POST", "./includes/xml.php?type=addnews_reaction&news_id="+nb,  true);
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");   
    var reaction = el('reaction'+nb).value;
 		reaction = reaction.replace(/&/gi,"%26");
		reaction = reaction.replace(/=/gi,"%3D");
 	  data= "reaction="+reaction;
	  xhr.send(data);
}


function getHTTPObject(){
	if(window.XMLHttpRequest)
		return new XMLHttpRequest();
	else if(window.ActiveXObject)
		return new ActiveXObject("Microsoft.XMLHTTP");
	else
	{
		alert("Your browser does not support AJAX. Please make sure the latest version of your browser is installed.");
		return null;
	}
}

function setHLinfo(){
	if(httpObject.readyState == 4)
	{
		el('infoblock').innerHTML = httpObject.responseText;
	}
}

function changeHLinfo(hlName){
	httpObject = getHTTPObject();
	if(httpObject != null)
	{
		if(hlName == '')
		{
			hlNameInfo = null;
			httpObject.open("GET", "./includes/hlInfo.php?", true);
		}
		else
		{
			hlNameInfo = hlName;
			httpObject.open("GET", "./includes/hlInfo.php?hlNameInfo="+hlNameInfo, true);
		}
		httpObject.send(null);
		httpObject.onreadystatechange = setHLinfo;
	}
}

if (document.images){
	image_default = new Image(700,300);
	image_default.src = "./images_hl/hl_groep_default.jpg";

	image_benjamin = new Image(700,300);
	image_benjamin.src = "./images_hl/hl_groep_benjamin.jpg";
	image_berdien = new Image(700,300);
	image_berdien.src = "./images_hl/hl_groep_berdien.jpg";
	image_christophe = new Image(700,300);
	image_christophe.src = "./images_hl/hl_groep_christophe.jpg";
	image_dirk = new Image(700,300);
	image_dirk.src = "./images_hl/hl_groep_dirk.jpg";
	image_elise = new Image(700,300);
	image_elise.src = "./images_hl/hl_groep_elise.jpg";
	image_ellen = new Image(700,300);
	image_ellen.src = "./images_hl/hl_groep_ellen.jpg";
	image_griet = new Image(700,300);
	image_griet.src = "./images_hl/hl_groep_griet.jpg";
	image_katrien = new Image(700,300);
	image_katrien.src = "./images_hl/hl_groep_katrien.jpg";
	image_koen = new Image(700,300);
	image_koen.src = "./images_hl/hl_groep_koen.jpg";
	image_leen = new Image(700,300);
	image_leen.src = "./images_hl/hl_groep_leen.jpg";
	image_liesbeth = new Image(700,300);
	image_liesbeth.src = "./images_hl/hl_groep_liesbeth.jpg";
	image_steven = new Image(700,300);
	image_steven.src = "./images_hl/hl_groep_steven.jpg";
	image_tom = new Image(700,300);
	image_tom.src = "./images_hl/hl_groep_tom.jpg";
}

function changeHLimage(hlImName){
	if(document.images && hlNameInfo == null)
	{
		img_src = eval("image_" + hlImName + ".src");
		el('hl_info_img').src = img_src;
	}
}

var httpObject = null;
var hlNameInfo = null;

function resize_ventje(){
   document.getElementById("ventje").style.height = document.getElementById("mainpage").scrollHeight + "px";
 }