window.onload = FormOnLoad;

var lastPcChecked = null;
var lastHuisnrChecked = null;

var idVoorletters;
var idPostcode;
var idWoonplaats
var idStraatnaam;
var idHuisnr;

var e_zipcode_retrieve = "Deze postcode kan niet gevonden worden. Voer aub uw straat en woonplaats in.";


function FormOnLoad() {
    jsSearch();
    boxReset("zoekHylo");
    
	if(idVoorletters) {
        var elmVoorletters = document.getElementById(idVoorletters);
		if(document.addEventListener) {
			elmVoorletters.addEventListener("blur", voorlettersChanged, false);
		} else {
			elmVoorletters.attachEvent("onblur", voorlettersChanged);
		}
	}

    if (idPostcode && idHuisnr && idStraatnaam && idWoonplaats) {
        var elmPostcode = document.getElementById(idPostcode);
        if (elmPostcode) {
            elmPostcode.onchange = postcodeChanged;
            elmPostcode.onblur = postcodeChanged;
        }
        var elmHuisnr = document.getElementById(idHuisnr);
        if (elmHuisnr) {
                elmHuisnr.onchange = postcodeChanged;
                elmHuisnr.onblur = postcodeChanged;
        }
        if (elmPostcode && elmHuisnr) {
            setTimeout("postcodeChanged()", 50);
        }               
    }
    
	if (document.getElementById("kieslotenFlash")) {
		setTimeout("NrOfLotsChanged()", 50);
	}
}

function enableFields() {
    //Enable woonplaats + straatnaam, otherwise sessionvalues will be empty
    if (idWoonplaats) {
        var elmWoonplaats = document.getElementById(idWoonplaats);
        if (elmWoonplaats) {
            elmWoonplaats.disabled = false;
        }
    }

    if (idStraatnaam) {
        var elmStraatnaam = document.getElementById(idStraatnaam);
        if (elmStraatnaam) {
            elmStraatnaam.disabled = false;
        }
    }
}

function voorlettersChanged(e) {
    var elmVoorletters = document.getElementById(idVoorletters);
	var voorletters = elmVoorletters.value;

	if(voorletters != null && voorletters != "") {
		var voorletters_length = 5;
		var voorletters_pattern = /[^a-z]/ig;

		var voorletters = voorletters.replace(voorletters_pattern, '');
		var voorletters = voorletters.toUpperCase();
		var voorletters_formatted = '';

		for(var i = 0; i < voorletters.length && i < voorletters_length; i++) {
			voorletters_formatted += voorletters.charAt(i) + '.';
		}

		voorletters_formatted = voorletters_formatted.replace(/^\s+/, '');
		voorletters_formatted = voorletters_formatted.replace(/\s+$/, '');

		elmVoorletters.value = voorletters_formatted;
	}
}

/**
 * Event handling for postcode changes
 */
function postcodeChanged(e) {
  var elmPostcode = document.getElementById(idPostcode);
  var elmHuisnr = document.getElementById(idHuisnr);
  var elmStraatnaam = document.getElementById(idStraatnaam);
  var elmWoonplaats = document.getElementById(idWoonplaats);
  if(elmPostcode && elmHuisnr && elmStraatnaam && elmWoonplaats) {
    var postcode        = elmPostcode.value;
    var huisnummer  = elmHuisnr.value;
    if (postcode != null && postcode != "") {
      postcode = postcode.toUpperCase();
      postcode = postcode.replace(" ", "");
      postcode = postcode.substr(0,6);
      elmPostcode.value = postcode;
    }
    if (elmStraatnaam && elmWoonplaats && (postcode != lastPcChecked || huisnummer != lastHuisnrChecked)) {
      if (postcode != null && postcode != "" && huisnummer != null && huisnummer != "") {
        lastPcChecked = postcode;
        lastHuisnrChecked = huisnummer;
        testPostcode(postcode, huisnummer, elmStraatnaam.value, elmWoonplaats.value);
      } else {
        elmStraatnaam.value= "";
        elmWoonplaats.value= "";
        elmStraatnaam.disabled = true;
        elmWoonplaats.disabled = true;
      }
    }
  }
}


/**
 * Sets the errors in a fieldset by the fieldset id. Shows them if they are present, hides them otherwise.
 */
function setErrorsById (setid, errors) {
    var elSet = document.getElementById(setid);
    return setErrors(elSet, errors);
}

/**
 * Sets the error in a fieldset by an formelement id in the fieldset. Shows them if they are present, hides them otherwise.
 */
function setErrorByElement (id, error) {
    var fieldSet = getFieldSet(id);
    if(fieldSet) {
        if (error) {
                    var errors = new Array(1);
                    errors[0] = error;
                    setErrors(fieldSet, errors);
        } else {
            setErrors(fieldSet);
        }
    } else {
        alert(error);
    }
}

/**
 * Sets the error of a form.
 */
function setFormError(formid, error) {
    if(error != null && error != "" && error != "null") {
        alert(error);
    } else {
        alert(e_form_default);
    }
}

/**
 * Sets the errors in a fieldset. Shows them if they are present, hides them otherwise.
 */
function setErrors (elSet, errors) {
    valid = errors == null || errors.length == 0;
    if(elSet) {
        if(!valid) {
            showErrors(elSet, errors);
        } else {
            hideErrors(elSet);
        }
    } else if (!valid){
        alert(errors.join('\n'));
    }

    return valid;
}

/**
 * Shows the errors in a fieldset.
 */
function showErrors (elSet, errors) {
    addClass(elSet, "error");
    var elError = getErrorElement(elSet);
    if(elError != null) {
        elError.innerHTML = errors.join("<br />");
    }
}

/**
 * Hides errors in a fieldset.
 */
function hideErrors (elSet) {
    removeClass(elSet, "error");
    var elError = getErrorElement(elSet);
    if(elError != null) {
        elError.innerHTML = "";
    }
}

/**
 * Determine the first decendant of an element with class errorMessage.
 */
function getErrorElement(element) {
    if(element != null) {
        var elements = element.getElementsByTagName("*");
        if(elements != null && elements.length != 0) {
            for(var i=0; i<elements.length; i++) {
                if(elements[i].className == "errorMessage") {
                    return elements[i];
                }
            }
        }
    }
}

/**
 * Determine the fieldset element based on the id of a formelement.
 */
function getFieldSet(id) {
  var fieldSet = document.getElementById(id);
  var fieldSetFound = false;
  var maxLoop = 10;
  while(fieldSet.parentNode && !fieldSetFound && maxLoop >= 0) {
    fieldSet = fieldSet.parentNode;
    if(fieldSet.tagName == 'FIELDSET'){
      fieldSetFound = true;
    }
    maxLoop--;
  }

  if(fieldSetFound) {
    return fieldSet;
  } else {
    return null;
  }
}

/**
 * Retrieves an address based on a zipcode and housenumber
 */
function testPostcode(postcode, huisnummer, street, city) {
	if (street == null) {
		street = "";
	}
	if (city == null) {
		city = "";
	}
  var myPostcodeScript = "/web/wcbservlet/nl.gx.ngdl.ngdlformcomponents.servlet.zipcodexmlhttprequestservlet?zipcode=" + postcode + "&housenumber=" + huisnummer + "&street=" + street + "&city=" + city;
  if (0 > postcode.search(/[0-9]{4}[A-Za-z]{2}/)) {
    return false;
  }
  var xmlHttp = null;
  if (typeof XMLHttpRequest != 'undefined') {
    xmlHttp = new XMLHttpRequest();
  }
  if (!xmlHttp) {
    try {
      xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch(e) {
      try {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
      } catch(e) {
      xmlHttp = null;
      }
    }
  }
  if (xmlHttp) {
    xmlHttp.open('GET', myPostcodeScript, true);
    xmlHttp.onreadystatechange = function () {
      if (xmlHttp.readyState == 4) {
        var responseString = xmlHttp.responseText;
        setAddress(responseString)
      }
    };
    xmlHttp.send(null);
  } else {
    return false;
  }
}

/**
 * Sets the address in the form (address is of format streetname|city)
 */
function setAddress(address) {
    var elmStraatnaam = document.getElementById(idStraatnaam);
    var elmWoonplaats = document.getElementById(idWoonplaats);
    
    if (elmStraatnaam && elmWoonplaats) {
        var strClassStraat = elmStraatnaam.className? elmStraatnaam.className.split(" ")[0]: "";
        var strClassPlaats = elmWoonplaats.className? elmWoonplaats.className.split(" ")[0]: "";
    
        if(address != "") {
            var myPlaats = address.split("|");
            var wasValid = elmStraatnaam.disabled && elmWoonplaats.disabled;
            elmStraatnaam.value = myPlaats[0];
            elmWoonplaats.value = myPlaats[1];
            
            if (myPlaats[2] == 'true') {
                elmStraatnaam.disabled = true;
                elmWoonplaats.disabled = true;
                elmStraatnaam.className = strClassStraat + ' readOnly';
                elmWoonplaats.className = strClassPlaats + ' readOnly';
                setLabel(elmStraatnaam.parentNode,"readOnly");
                setLabel(elmWoonplaats.parentNode,"readOnly");
                setErrorByElement(idPostcode);
            } else {
                elmStraatnaam.disabled = false;
                elmWoonplaats.disabled = false;
                elmStraatnaam.className = strClassStraat;
                elmWoonplaats.className = strClassPlaats;
                setLabel(elmStraatnaam.parentNode,"");
                setLabel(elmWoonplaats.parentNode,"");
                
                if (wasValid || elmStraatnaam.value == '' || elmWoonplaats.value == '') {
                	setErrorByElement(idPostcode, e_zipcode_retrieve);
                }
            }
        }
    }
}

/**
 * Sets the label of an element
 */
function setLabel(labelElement,classElement) {
  var labelElements = labelElement.getElementsByTagName('label');
  for(var i = 0; i < labelElements.length; i++) {
    labelElements[i].className = classElement;
  }
}

/**
 * Adds a class to an element.
 */

function addClass(target, classValue)
{
    if(target != null) {
        var pattern = new RegExp("(^| )" + classValue + "( |$)");

        if (!pattern.test(target.className)) {
            if (target.className == "") {
                target.className = classValue;
            } else {
                target.className += " " + classValue;
            }
        }
    }

    return true;
}

/**
 * Removes a class from an element.
 */

function removeClass(target, classValue)
{
    if(target != null) {
        var removedClass = target.className;
        var pattern = new RegExp("(^| )" + classValue + "( |$)");

        removedClass = removedClass.replace(pattern, "$1");
        removedClass = removedClass.replace(/ $/, "");

        target.className = removedClass;

        return true;
    }
}

/**
 * Checks if a value is empty.
 */
function isEmpty(value) {
    return value == null || value == "";
}

/**
 * Trims a string.
 */
function trim(value) {
   value = value.replace(/^\s+/,'');
   value = value.replace(/\s+$/,'');
   return value;
}

/**
 * Add value to an array
 */
function addValue(values, value) {
    var newValues;
    if(values == null) {
        newValues = new Array(1);
        newValues[0] = value;
    } else {
        newValues = new Array(values.length + 1);
        for(var i=0; i<values.length; i++) {
            newValues[i] = values[i];
        }
        newValues[values.length] = value;
    }
    return newValues;
}

/**
 * Generic method for adding onload funtions
 */
function addOnLoadEvent(func) {
  if (typeof window.addEventListener != 'undefined') {
    window.addEventListener('load', func, false);
  } else if (typeof document.addEventListener != 'undefined') {
    document.addEventListener('load', func, false);
  } else if (typeof window.attachEvent != 'undefined') {
    window.attachEvent('onload', func);
  } else {
    var oldfunc = window.onload;
    if (typeof window.onload != 'function') {
      window.onload = func;
    } else {
      window.onload = function() {
        oldfunc();
        func();
      };
    }
  }
}

/**
 * Tooltip functions
 */
function tooltip(obj,txt) {
  txt = (typeof txt == 'undefined') ? obj.title : txt;
  myPosition = findPos(obj);
  myTooltip = document.getElementById('spmTooltip');
  var elmTxt = myTooltip.getElementsByTagName("div")[1]? myTooltip.getElementsByTagName("div")[1]: null;
  if (elmTxt) {
  	elmTxt.innerHTML = txt;
  }
  myTooltip.style.left = (myPosition[0] - 38)+"px";
  myTooltip.style.top = (myPosition[1] - myTooltip.offsetHeight)+"px";
  myTooltip.style.visibility = "visible";
}

function tooltipHide() {
  document.getElementById('spmTooltip').style.visibility = "hidden";
}

function ttpKeepAlive(obj) {
  document.getElementById(obj.id).style.visibility = "visible";
}

function ttpHide(obj) {
  document.getElementById(obj.id).style.visibility = "hidden";
}

function findPos(obj) {
  var curleft = curtop = 0;
  if (obj.offsetParent) {
    curleft = obj.offsetLeft
    curtop = obj.offsetTop
    while (obj = obj.offsetParent) {
      curleft += obj.offsetLeft
      curtop += obj.offsetTop
    }
  }
  return [curleft,curtop];
}


//--------------------------------------------------------
// Copy from NPL: function setFormularError(formElement, isFout, message, toonMessage)
//  d.d.20090316: change: use BGL solution for showing errors
//--------------------------------------------------------
//
//  This function finds the parent div 'formular' and encapsulates it in a div class="formularError".
//  This will result in a red box around formular.
//  input:
//      - formElement -> the element which contains (or doesn't contain) a error
//      - isFout -> boolean tests is the formelement is fout
//      - message -> the message to show when it's isFout (else the old message is cleared and the red box is removed)
//      - toonMessage -> als deze op true staat dan tonen we de error message in het form...anders in een alertbox
//
function setFormularError(formElement, isFout, message, toonMessage)
{
    var strId = formElement? formElement.id: "";
    if (!formElement) {
        if (isFout && toonMessage && message != "@errormessage@") { 
            alert(message);
        }
        return false;
    }
    
    if(isFout && toonMessage) {
        setErrorByElement(strId, message);
    } else {
        setErrorByElement(strId);
    }
}

//
// RESET FUNCTIONALITY FOR INPUT FIELDS...
// INITIALIZE WITH boxReset(id,id...)
//

var inpBox = new Object();

function boxReset(){
    var myElem;
    for(var i=0;i<arguments.length;i++) {
        myElem = document.getElementById(arguments[i]);

        if (myElem) {
            inpBox[myElem.id] = myElem.value;


            if (document.addEventListener) {
              // REGISTERING THE EVENTS FOR DOM COMPLIANT BROWSERS
                myElem.addEventListener("focus",boxGotFocus,false);
                myElem.addEventListener("blur",boxLostFocus,false);
            } else {
              // REGISTERING THE EVENTS FOR IE
                myElem.attachEvent("onblur",boxLostFocus);
                myElem.attachEvent("onfocus",boxGotFocus);
            }

        }
    }
}

function boxGotFocus(e)
{
  myBox = (!window.event) ? e.target:window.event.srcElement;

  if (myBox.value == inpBox[myBox.id])
  {
    myBox.value = "";
  }
}

function boxLostFocus(e)
{
  myBox = (!window.event) ? e.target:window.event.srcElement;

  if (myBox.value == "")
  {
    myBox.value = inpBox[myBox.id];
  }
}

function jsSearch(){
	zoek = document.getElementById('zoek');
	if(zoek != null){
		zoekknop = zoek.form.getElementsByTagName('a')[0];
		zoek.onfocus=function(){
			if(this.second==null){
				this.value='';
				this.second=true;
			}
		}
		zoekknop.onclick=function(){
			zoek = document.getElementById('zoek').value;
			//if(zoek!=''&&zoek!='Zoek of stel uw vraag...'){
				document.getElementById('searchFormTop').submit();
			//}
			return false;
		}
	}
}