﻿function AddListener(p_objElement, p_strType, p_fun) {
    if (p_objElement.addEventListener) {
        p_objElement.addEventListener(p_strType, p_fun, false); 
    }
    else if (p_objElement.attachEvent) {
        p_objElement.attachEvent("on" + p_strType, p_fun); 
    }
}

function RemoveValidationError(p_objElement) {
    //Remove exisiting validation error
    var l_objValidationError = document.getElementById("divValidationError" + p_objElement.name);
    while (l_objValidationError) {
        l_objValidationError.parentNode.removeChild(l_objValidationError);
        l_objValidationError = document.getElementById("divValidationError" + p_objElement.name);
    }
}

function ValidateElement(p_objElement) {
    if (!p_objElement.name.length) {
        return true; 
    }
    var l_strValidation;
    if (p_objElement.tagName.toLowerCase() == "input" && (p_objElement.type == 'checkbox' || p_objElement.type == 'image')) {
        if (p_objElement.type == 'checkbox' && p_objElement.checked && (!p_objElement.value || !p_objElement.value.length)) {
            p_objElement.value = "true";
        }
        return true;
    }
    else if (p_objElement.type == 'radio' && p_objElement.tagName.toLowerCase() == "input") {
        var l_blnChecked = false,
            l_arrRadio = document.getElementsByName(p_objElement.name),
		    l_intIndex = l_arrRadio.length;
        while (l_intIndex--) {
            if (l_arrRadio[l_intIndex].checked) {
                l_blnChecked = true;
                break;
            }
        }
        l_strValidation = p_objElement.getAttribute("validation", 0);
        if (l_strValidation && !l_blnChecked && !l_strValidation.indexOf("Verplicht ")) {
            AddValidationError(p_objElement);
            return false;
        }
    } else {
        var l_strValue = p_objElement.value,
	        l_strMask = null;
        l_strValidation = p_objElement.getAttribute("validation", 0);
        if (l_strValidation && !l_strValue.length && !l_strValidation.indexOf("Verplicht ")) {
            AddValidationError(p_objElement);
            return false;
        }
        switch (p_objElement.className) {
            case "email":
                l_strMask = "^\\S+@.+\\.(biz|com|net|edu|mil|gov|org|.{2})$";
                break;
            case "getal":
            case "tinyint":
            case "smallint":
            case "int":
            case "bigint":
                l_strMask = "^-?\\d+$";
                break;
            case "datum":
                l_strMask = "^\\d{1,2}-\\d{1,2}-(\\d{2}|\\d{4})$";
                break;
            case "postcode":
                l_strMask = "^\\d{4}\\s?[a-z]{2}$";
                break;
            case "huisnummer":
                l_strMask = "^\\d+\\s?[a-z]?$";
                break;
            case "guid":
                l_strMask = "^\\{?[a-z0-9]{8}-[a-z0-9]{4}-[a-z0-9]{4}-[a-z0-9]{4}-[a-z0-9]{12}\\}?$";
                break;
        }
        if (l_strMask && l_strValue.length) {
            var l_objRegExp = new RegExp(l_strMask, "gi");
            if (!l_objRegExp.test(l_strValue)) {
                AddValidationError(p_objElement, "Ongeldige " + ((l_strMask == "^-?\\d+$") ? "getal" : p_objElement.className) + " notatie");
                return false;
            } else if (l_strMask == "^-?\\d+$") {
                var l_intValue = parseInt(l_strValue, 10),
	                l_intMinValue = null,
	                l_intMaxValue = null;
                switch (p_objElement.className) {
                    case "tinyint":
                        l_intMinValue = 0;
                        l_intMaxValue = Math.pow(Math.pow(2, 8), 1);
                        break;
                    case "smallint":
                        l_intMinValue = -1 * (Math.pow(Math.pow(2, 8), 2) / 2);
                        l_intMaxValue = (Math.pow(Math.pow(2, 8), 2) / 2) - 1;
                        break;
                    case "int":
                        l_intMinValue = -1 * (Math.pow(Math.pow(2, 8), 4) / 2);
                        l_intMaxValue = (Math.pow(Math.pow(2, 8), 4) / 2) - 1;
                        break;
                    case "bigint":
                        l_intMinValue = -1 * (Math.pow(Math.pow(2, 8), 8) / 2);
                        l_intMaxValue = (Math.pow(Math.pow(2, 8), 8) / 2) - 1;
                        break;
                }
                if (l_intMinValue && l_intValue < l_intMinValue) {
                    AddValidationError(p_objElement, "Ongeldige getal waarde (< " + l_intMinValue + ")");
                    return false;
                } else if (l_intMaxValue && l_intValue > l_intMaxValue) {
                    AddValidationError(p_objElement, "Ongeldige getal waarde (> " + l_intMaxValue + ")");
                    return false;
                }
            }
        }
    }
    RemoveValidationError(p_objElement);
    return true;
}

function AddValidationError(p_objElement, p_strMessage) {
    if (!p_strMessage) {
        p_strMessage = p_objElement.getAttribute("validation", 0);
    }

    var l_intLeft = document.documentElement.offsetLeft,
        l_intTop = document.documentElement.offsetTop,
	    l_objElement = p_objElement;
    if (l_objElement.offsetParent) {
        l_intLeft = l_objElement.offsetLeft;
        l_intTop = l_objElement.offsetTop;
        while (l_objElement = l_objElement.offsetParent) {
            l_intLeft += l_objElement.offsetLeft;
            l_intTop += l_objElement.offsetTop;
        };
    };
    //If the element that is validated is contained within a table cell, display the validation dialog at the end of the row
    l_objElement = p_objElement;
    if (l_objElement.parentNode && !l_objElement.offsetWidth && l_objElement.parentNode.tagName && l_objElement.parentNode.tagName.toLowerCase() == "td") {
        l_objElement = l_objElement.parentNode.parentNode;
    }
    l_intLeft += l_objElement.offsetWidth;

    RemoveValidationError(p_objElement);

    var l_objDiv = document.createElement("div");
    l_objDiv.id = "divValidationError" + p_objElement.name;
    l_objDiv.className = "ValidationError";
    l_objDiv.innerHTML = "<--&nbsp;" + p_strMessage;
    l_objDiv.style.whiteSpace = "nowrap";
    l_objDiv.style.margin = "0 4";
    l_objDiv.style.padding = "1 4";
    l_objDiv.style.backgroundColor = "#C00";
    l_objDiv.style.border = "#C00 1px solid";
    l_objDiv.style.fontWeight = "bold";
    l_objDiv.style.color = "#FFF";
    l_objDiv.style.position = "absolute";
    l_objDiv.style.left = l_intLeft + "px";
    l_objDiv.style.top = l_intTop + "px";
    l_objDiv.style.filter = "alpha(opacity=75)";
    l_objDiv.style.opacity = 0.75;
    document.body.appendChild(l_objDiv);
    AddListener(p_objElement, "blur", function () { ValidateElement(p_objElement); });
    return l_objDiv;
}


function ValidateArray(p_arrElement) {
    var l_blnReturnValue = true,
        l_intIndex = p_arrElement.length;
    while (l_intIndex--) {
        if (!ValidateElement(p_arrElement[l_intIndex])) {
            if (l_blnReturnValue) {
                p_arrElement[l_intIndex].focus();
                l_blnReturnValue = false;
            }
        }
    }
    return l_blnReturnValue;
}
var m_objForm;
function Validate(p_objEvent, p_objElement, p_objForm) {
    p_objEvent = p_objEvent || event;
    p_objElement = p_objElement || p_objEvent.srcElement || p_objEvent.target;

    if (!p_objForm) {
        var l_objParent = p_objElement.parentNode;
        while (l_objParent && l_objParent.tagName && l_objParent.tagName.toLowerCase() != "form") {
            l_objParent = l_objParent.parentNode;
        }
        if (l_objParent && l_objParent.tagName && l_objParent.tagName.toLowerCase() == "form") {
            p_objForm = l_objParent;
        }
    }
    if (p_objForm) {
        m_objForm = p_objForm;
        var l_arrDiv = document.getElementsByTagName("div"),
            l_intLength = l_arrDiv.length;
        for (var l_intIndex = l_intLength - 1; l_intIndex >= 0; l_intIndex--) {
            var l_objElement = l_arrDiv[l_intIndex];
            if (l_objElement.className == "ValidationError") {
                l_objElement.parentNode.removeChild(l_objElement);
            }
        }
        if (!ValidateArray(p_objForm.getElementsByTagName("input"))) {
            return false; 
        }
        if (!ValidateArray(p_objForm.getElementsByTagName("select"))) {
            return false; 
        }
        if (!ValidateArray(p_objForm.getElementsByTagName("textarea"))) {
            return false; 
        }
        return true;
    }
}

function GetElementNode(p_objNode) {
    while (p_objNode && p_objNode.nodeType != 1) {
        p_objNode = p_objNode.nextSibling;
    }
    return p_objNode;
}

function IsCaptionNode(p_objNode) {
    var l_objNode = p_objNode.firstChild;
    if (l_objNode) {
        if (l_objNode.nodeType == 3) {
            l_objNode = l_objNode.nextSibling;
        }
        if (l_objNode && l_objNode.tagName) {
            return false;
        }
    }
    return true;
}

function NodeIsSpaceClaimer(p_objNode) {
    if (!p_objNode) { return false; }
    return (p_objNode.tagName.toLowerCase() == "div" && p_objNode.style.clear == "left");
}

function NodeIsFirstOnLine(p_objNode) {
    if (!p_objNode) { return false; }
    var l_objPreviousSibling = p_objNode.previousSibling;
    while (l_objPreviousSibling && l_objPreviousSibling.nodeType != 1) {
        l_objPreviousSibling = l_objPreviousSibling.previousSibling;
    }
    if (!l_objPreviousSibling) { return true; }
    return NodeIsSpaceClaimer(l_objPreviousSibling);
}

function ResizeLabels(p_objNode) {
    var l_objParentNode = p_objNode.parentNode,
        l_intWidth = 1,
        l_intIndex = l_objParentNode.childNodes.length,
        l_objChildNode,
        l_objFirstChild,
        l_objSecondChild;
    while (l_intIndex--) {
        l_objChildNode = l_objParentNode.childNodes[l_intIndex];
        if (l_objChildNode.nodeType == 1 && l_objChildNode.tagName.toLowerCase() == "div" && l_objChildNode.style.clear != "left") {
            l_objFirstChild = GetElementNode(l_objChildNode.firstChild);
            l_objSecondChild = GetElementNode(l_objFirstChild.nextSibling);
            l_objFirstChild.style.width = "1px";
            if (l_objSecondChild && l_objFirstChild.scrollWidth > l_intWidth && l_objSecondChild.style.clear != "left" && NodeIsFirstOnLine(l_objChildNode) && IsCaptionNode(l_objFirstChild)) {
                l_intWidth = l_objFirstChild.scrollWidth;
            }
            l_objFirstChild.style.width = l_objFirstChild.scrollWidth;
        }
    }
    l_intIndex = l_objParentNode.childNodes.length;
    while (l_intIndex--) {
        l_objChildNode = l_objParentNode.childNodes[l_intIndex];
        if (l_objChildNode.nodeType == 1 && l_objChildNode.tagName.toLowerCase() == "div" && l_objChildNode.style.clear != "left") {
            l_objFirstChild = GetElementNode(l_objChildNode.firstChild);
            l_objSecondChild = GetElementNode(l_objFirstChild.nextSibling);
            if (l_objSecondChild && l_objSecondChild.style.clear != "left" && NodeIsFirstOnLine(l_objChildNode) && IsCaptionNode(l_objFirstChild)) {
                l_objFirstChild.style.width = l_intWidth;
            }
        }
    }
    return true;
}

function GetRadioValue(p_strName) {
    var l_objRadio = document.getElementsByName(p_strName),
        l_intIndex = l_objRadio.length;
    if (!l_intIndex) {
        return l_objRadio.checked ? l_objRadio.value : null;
    } else {
        while (l_intIndex--) {
            if (l_objRadio[l_intIndex].checked) { return l_objRadio[l_intIndex].value; }
        }
    }
    return null;
}

function TagNameForType(p_strType) {
    switch (p_strType) {
        case "text":
        case "checkbox":
        case "radio":
        case "file":
        case "password":
        case "submit":
            return "input";
        default:
            return p_strType;
    }
}

function SetVisibility(p_objEvent, p_strStyle) {
    if (!p_strStyle) {
        p_objEvent = p_objEvent || event;
        var l_objElement = p_objEvent.srcElement || p_objEvent.target;
        p_strStyle = l_objElement.value;
    }
    document.getElementById('divCaption').style.visibility = (p_strStyle == 'hidden' || p_strStyle == 'option') ? 'hidden' : 'visible';
    document.getElementById('divName').style.visibility = (p_strStyle == 'option' || p_strStyle == 'label') ? 'hidden' : 'visible';
    document.getElementById('divValue').style.visibility = (p_strStyle == 'checkbox' || p_strStyle == 'file' || p_strStyle == 'label') ? 'hidden' : 'visible';
    document.getElementById('divMaxLength').style.visibility = (p_strStyle == 'text' || p_strStyle == 'password' || p_strStyle == 'select' || p_strStyle == 'textarea') ? 'visible' : 'hidden';
    document.getElementById('divMaxRows').style.visibility = (p_strStyle == 'textarea') ? 'visible' : 'hidden';
    document.getElementById('divWidth').style.visibility = (p_strStyle == 'text' || p_strStyle == 'select' || p_strStyle == 'textarea') ? 'visible' : 'hidden';
    document.getElementById('divRequired').style.visibility = (p_strStyle == 'submit' || p_strStyle == 'dropdown' || p_strStyle == 'hidden' || p_strStyle == 'option' || p_strStyle == 'label') ? 'hidden' : 'visible';
    document.getElementById('divType').style.visibility = (p_strStyle == 'text') ? 'visible' : 'hidden';
}

function GetElement(p_strType, p_strClass, p_strName, p_strId, p_strMaxLength, p_strMaxRows, p_strWidth, p_strValue, p_blnRequired) {
    var l_objElement = null,
        l_strTagName = TagNameForType(p_strType);
    if (l_strTagName) {
        try {
            l_objElement = document.createElement("<" + l_strTagName + " name='" + p_strName + "'>");
        } catch (l_objException) {
            l_objElement = document.createElement(l_strTagName);
            l_objElement.name = p_strName;
        }
        if (p_strId) { l_objElement.id = p_strId; }
        if (l_strTagName == "input") {
            l_objElement.type = p_strType;
            l_objElement.value = p_strValue;
            if (p_strMaxLength && (p_strType == "text" || p_strType == "password") && p_strMaxLength.length) {
                l_objElement.maxLength = p_strMaxLength;
            } else if (p_strType == "radio") {
                var l_colElements = document.getElementsByName(p_strName),
                    l_intMaxValue = 0,
                    l_intIndex = l_colElements.length;
                while (l_intIndex--) {
                    var l_intValue = parseInt(l_colElements.item(l_intIndex).value, 10);
                    if (!isNaN(l_intValue) && l_intValue > l_intMaxValue) { l_intMaxValue = l_intValue; }
                }
                l_objElement.value = ++l_intMaxValue;
            }
        } else if (l_strTagName == "select") {
            if (p_strMaxLength && p_strMaxLength.length) {
                l_objElement.size = p_strMaxLength;
            }
            var l_objOption = document.createElement("OPTION");
            l_objOption.value = "";
            l_objOption.text = p_strValue;
            l_objElement.options.add(l_objOption);
        } else if (l_strTagName == "textarea") {
            l_objElement.cols = p_strMaxLength;
            l_objElement.rows = p_strMaxRows;
        }
        if (p_strWidth && p_strWidth.length && p_strType != "checkbox" && p_strType != "radio") {
            l_objElement.style.width = p_strWidth;
        }
        var l_strValidation = "",
            l_strSeparator = "";
        if (p_blnRequired) {
            l_strValidation += "Verplicht";
            l_strSeparator = " ";
        }
        if (p_strType == "text" && p_strClass && p_strClass.length) {
            l_objElement.className = p_strType;
            l_strValidation += l_strSeparator + p_strType;
            l_strSeparator = " ";
        } else if (p_strType == "checkbox" || p_strType == "radio") {
            l_objElement.className = "checkbox";
        }
        if (p_strType != "hidden" && p_strType != "submit" && p_strType != "label" && l_strValidation.length) {
            l_strValidation += l_strSeparator + "veld";
            var l_objAttribute = document.createAttribute("validation");
            l_objAttribute.value = l_strValidation;
            l_objElement.attributes.setNamedItem(l_objAttribute);
        }
        l_objElement.style.margin = "0px 5px";
    }
    return l_objElement;
}

function GetDiv(p_objContent) {
    var l_objDiv = document.createElement("div");
    l_objDiv.style.styleFloat = "left";
    l_objDiv.style.cssFloat = "left";
    l_objDiv.style.whiteSpace = "nowrap";
    l_objDiv.style.overflow = "visible";
    if (p_objContent) {
        if (typeof (p_objContent) == "string") {
            if (!p_objContent.length) { p_objContent = "&nbsp;"; }
            l_objDiv.innerHTML = p_objContent;
            return l_objDiv;
        }
        l_objDiv.appendChild(p_objContent);
    }
    return l_objDiv;
}

function GetSpaceClaimer() {
    var l_objDiv = document.createElement("div"),
        l_objContent = document.createComment("");
    l_objDiv.style.clear = "left";
    l_objDiv.appendChild(l_objContent);
    return l_objDiv;
}

function NodeIsLastOnLine(p_objNode) {
    if (p_objNode) {
        var l_objNextSibling = p_objNode.nextSibling;
        while (l_objNextSibling && l_objNextSibling.nodeType != 1) {
            l_objNextSibling = l_objNextSibling.nextSibling;
        }
        if (!l_objNextSibling || (l_objNextSibling.tagName.toLowerCase() == "div" && l_objNextSibling.style.clear == "left")) { return true; }
    }
    return false;
}

function SelectForNode(p_objNode) {
    if (p_objNode) {
        var l_objDiv = p_objNode.firstChild;
        if (!l_objDiv.firstChild || l_objDiv.firstChild.nodeType == 3) {
            l_objDiv = l_objDiv.nextSibling;
        }
        if (l_objDiv.style.clear != "left") {
            var l_objElement = l_objDiv.firstChild;
            if (l_objElement.tagName.toLowerCase() == "select") {
                return l_objElement;
            }
        }
    }
    return null;
}

function GetSelected() {
    var l_objContainer = document.getElementById("divTarget"),
        l_intIndex = l_objContainer.childNodes.length;
    while (l_intIndex--) {
        var l_objDiv = l_objContainer.childNodes[l_intIndex];
        if (l_objDiv.nodeType == 1 && l_objDiv.className == "selected") { return l_objDiv; }
    }
}

function SelectFormElement(p_objEvent, p_objElement, p_blnAllowToggle) {
    p_blnAllowToggle = p_blnAllowToggle || true;
    p_objEvent = p_objEvent || event;
    p_objElement = p_objElement || p_objEvent.srcElement || p_objEvent.target;
    while (p_objElement && (
                p_objElement.nodeType != 1 || !(
                p_objElement.tagName.toLowerCase() == "div" &&
                p_objElement.parentNode &&
                p_objElement.parentNode.id == "divTarget" &&
                p_objElement.parentNode.tagName.toLowerCase() == "div"
                )
            )
        ) {
        p_objElement = p_objElement.parentNode;
    }
    if (p_objElement) {
        var l_objContainer = p_objElement.parentNode,
            l_intIndex = l_objContainer.childNodes.length;
        while (l_intIndex--) {
            var l_objDiv = l_objContainer.childNodes[l_intIndex];
            if (l_objDiv != p_objElement && l_objDiv.nodeType == 1 && l_objDiv.style.clear != "left") {
                l_objDiv.removeAttribute("className");
                l_objDiv.removeAttribute("class");
            }
        }
        if (!p_objElement.className || !p_objElement.className.length) {
            p_objElement.className = "selected";
        }
        else if (p_blnAllowToggle) {
            p_objElement.removeAttribute("className");
            p_objElement.removeAttribute("class");
        }
    }
}

function Remove() {
    var l_objSelectedNode = GetSelected();
    if (l_objSelectedNode) {
        var l_strType = GetRadioValue("type");
        if (l_strType == "option") {
            var l_objSelect = SelectForNode(l_objSelectedNode);
            if (l_objSelect && l_objSelect.selectedIndex) {
                var l_intSelectedIndex = l_objSelect.selectedIndex;
                l_objSelect.options.remove(l_intSelectedIndex);
                if (l_intSelectedIndex < l_objSelect.options.length) {
                    l_objSelect.selectedIndex = l_intSelectedIndex;
                }
                return;
            }
        }
        var l_blnNodeIsLastOnLine = NodeIsLastOnLine(l_objSelectedNode),
            l_objNextSibling = l_objSelectedNode.nextSibling;
        while (l_objNextSibling && (l_objNextSibling.nodeType != 1 || NodeIsSpaceClaimer(l_objNextSibling))) {
            l_objNextSibling = l_objNextSibling.nextSibling;
        }
        var l_objPreviousSibling = l_objSelectedNode.previousSibling;
        while (l_objPreviousSibling && l_objPreviousSibling.nodeType != 1) {
            l_objPreviousSibling = l_objPreviousSibling.previousSibling;
        }
        while (l_objPreviousSibling && NodeIsSpaceClaimer(l_objPreviousSibling)) {
            var l_objDeleteNode = l_objPreviousSibling;
            l_objPreviousSibling = l_objPreviousSibling.previousSibling;
            while (l_objPreviousSibling && l_objPreviousSibling.nodeType != 1) {
                l_objPreviousSibling = l_objPreviousSibling.previousSibling;
            }
            if (l_blnNodeIsLastOnLine) { l_objDeleteNode.parentNode.removeChild(l_objDeleteNode); }
        }
        l_objSelectedNode.parentNode.removeChild(l_objSelectedNode);
        l_objSelectedNode = l_objNextSibling ? l_objNextSibling : l_objPreviousSibling;
        if (l_objSelectedNode) { SelectFormElement(null, l_objSelectedNode, false); }
    }
}

function Add() {
    var l_objSelectedNode = GetSelected(),
        l_objParentNode = (l_objSelectedNode) ? l_objSelectedNode.parentNode : document.getElementById("divTarget"),
        l_strCaption = document.getElementById("caption").value,
        l_strWidth = document.getElementById("width").value,
        l_strValue = document.getElementById("value").value,
        l_strMaxLength = document.getElementById("maxlength").value,
        l_strMaxRows = document.getElementById("maxrows").value,
        l_strName = document.getElementById("_name").value,
        l_strId = document.getElementById("_id").value,
        l_blnRequired = document.getElementById("required").checked,
        l_strType = GetRadioValue("type"),
        l_strClass = document.getElementById("type").value;

    if (l_strType == "option") {
        var l_objSelect = SelectForNode(l_objSelectedNode);
        if (l_objSelect) {
            var l_intMaxValue = 0,
                l_intIndex = l_objSelect.options.length;
            while (l_intIndex--) {
                var l_intValue = parseInt(l_objSelect.options.item(l_intIndex).value, 10);
                if (!isNaN(l_intValue) && l_intValue > l_intMaxValue) { l_intMaxValue = l_intValue; }
            }
            var l_objOption = l_objSelect.ownerDocument.createElement("OPTION");
            l_objOption.value = ++l_intMaxValue;
            l_objOption.text = l_strValue;
            l_objOption.selected = true;
            l_objSelect.options.add(l_objOption);
            return;
        }
    }

    var l_objDiv = GetDiv(),
        l_objElement = null;
    if (l_strType == "label" || l_strCaption.length) {
        var l_objLabelDiv = GetDiv(l_strCaption);
        l_objLabelDiv.className = l_strType == "label" ? "w3s_Label" : "w3s_Caption";
        l_objDiv.appendChild(l_objLabelDiv);
    }

    if (l_strType != "label") {
        //Only add an input element when type is not eual to label
        l_objElement = GetElement(l_strType, l_strClass, l_strName, l_strId, l_strMaxLength, l_strMaxRows, l_strWidth, l_strValue, l_blnRequired);
        l_objDiv.appendChild(GetDiv(l_objElement));
    }
    if (l_strType == "radio" && l_strValue.length) {
        var l_objTextDiv = GetDiv(l_strValue);
        l_objTextDiv.className = "w3s_Text";
        //For radio input element, also add a caption for the radio when it is specified
        l_objDiv.appendChild(l_objTextDiv);
    }

    l_objDiv.appendChild(GetSpaceClaimer());
    var l_objNewLineDiv;
    if (l_objSelectedNode) {
        var l_blnNodeIsFirstOnLine = NodeIsFirstOnLine(l_objSelectedNode);
        l_objParentNode.insertBefore(l_objDiv, l_objSelectedNode);
        if (l_blnNodeIsFirstOnLine) {
            l_objNewLineDiv = GetSpaceClaimer();
            if (l_objSelectedNode.previousSibling) {
                l_objParentNode.insertBefore(l_objNewLineDiv, l_objSelectedNode);
            } else {
                l_objParentNode.insertBefore(l_objNewLineDiv, l_objDiv);
            }
        }
    } else {
        l_objParentNode.appendChild(l_objDiv);
        if (l_objDiv.previousSibling) {
            l_objNewLineDiv = GetSpaceClaimer();
            l_objParentNode.insertBefore(l_objNewLineDiv, l_objDiv);
        }
    }

    ResizeLabels(l_objDiv);

    if (l_objElement && l_strType == "submit") {
        l_objElement.onclick = "return Validate(event);";
        AddListener(l_objElement, "click", function (event) { Validate(event); });
    }

    return l_objDiv;
}

function Set() {
    var l_objSelectedNode = GetSelected();
    if (l_objSelectedNode) {
        var l_strType = GetRadioValue("type"),
            l_objSelect = null;
        if (l_strType == "select" || l_strType == "option") {
            l_objSelect = SelectForNode(l_objSelectedNode);
            if (l_strType == "option" && l_objSelect.selectedIndex > -1) {
                l_objSelect.options[l_objSelect.selectedIndex].text = document.getElementById("value").value;
                return;
            }
        }
        var l_blnIsLastNode = (!l_objSelectedNode.nextSibling && NodeIsLastOnLine(l_objSelectedNode));
        Remove();
        l_objSelectedNode = GetSelected();
        if (l_blnIsLastNode && l_objSelectedNode) {
            //If the selected node is the last node, toggle the newly selected node to unselected in order to append the new node at the end
            SelectFormElement(null, l_objSelectedNode, true);
        }
        l_objSelectedNode = Add();
        SelectFormElement(null, l_objSelectedNode, false);
        if (l_objSelect && l_strType == "select") {
            var l_objOptions = l_objSelect.options;
            l_objSelect = SelectForNode(l_objSelectedNode);
            var l_intIndex = l_objOptions.length;
            while (l_intIndex--) {
                var l_obj = l_objOptions[l_intIndex];
                var l_objOption = l_objSelect.ownerDocument.createElement("OPTION");
                l_objOption.value = l_obj.value;
                l_objOption.text = l_obj.text;
                l_objOption.selected = l_obj.selected;
                l_objSelect.options.add(l_objOption);
            }
        }
    } else {
        alert("Selecteer eerst een element om de eigenschappen aan te passen.");
    }
}

function TypeForElement(p_objElement) {
    if (!p_objElement || !p_objElement.tagName) { return "label"; }
    switch (p_objElement.tagName.toLowerCase()) {
        case "input":
            return p_objElement.type.toLowerCase();
        case "select":
        case "textarea":
            return p_objElement.tagName.toLowerCase();
        default:
            return "label";
    }
}

function Get() {
    var l_objSelectedNode = GetSelected();
    if (l_objSelectedNode) {
        var l_objDiv = GetElementNode(l_objSelectedNode.firstChild),
            l_strText = "",
            l_objElement = GetElementNode(l_objDiv.firstChild),
            l_strType = TypeForElement(l_objElement);
        if (l_strType == "label") {
            //Label div
            l_strText = l_objDiv.innerHTML;
            l_objDiv = GetElementNode(l_objDiv.nextSibling);
        }
        l_strType = null;
        if (l_objDiv.style.clear != "left") {
            l_objElement = GetElementNode(l_objDiv.firstChild);
            l_strType = TypeForElement(l_objElement);
            if (l_strType == "select" && l_objElement.selectedIndex) {
                l_strType = "option";
                l_objElement = l_objElement.options[l_objElement.selectedIndex];
            }

            var l_strValue = null,
                l_strMaxLength = "",
                l_strMaxRows = "",
                l_strWidth = "";
            switch (l_strType) {
                case "text":
                    l_strValue = l_objElement.value;
                    l_strMaxLength = l_objElement.maxLength;
                    if (l_strMaxLength == (Math.pow(2, 32) / 2) - 1 || l_strMaxLength == "-1") { l_strMaxLength = ""; }
                    if (l_objElement.className && l_objElement.className.length) {
                        document.getElementById("type").value = l_objElement.className;
                    }
                    break;
                case "radio":
                    if (l_objDiv.nextSibling) {
                        l_strValue = l_objDiv.nextSibling.innerText;
                    }
                    break;
                case "textarea":
                    l_strValue = l_objElement.innerText;
                    l_strMaxLength = l_objElement.cols;
                    l_strMaxRows = l_objElement.rows;
                    break;
                case "select":
                    l_strValue = l_objElement.options[0].text;
                    if (l_objElement.size > 1) { l_strMaxLength = l_objElement.size; }
                    break;
                case "option":
                    l_strText = l_objElement.text;
                    l_strValue = l_objElement.value;
                    break;
                default:
                    l_strValue = l_objDiv.innerHTML;
                    break;
            }
            l_strWidth = l_objElement.style.width;
            document.getElementById("value").value = l_strValue;
            var l_strId = l_objElement.id && l_objElement.id.length ? l_objElement.id : l_objElement.uniqueID;
            document.getElementById("_id").value = l_strId;
            var l_strName = l_objElement.name && l_objElement.name.length ? l_objElement.name : l_strId;
            document.getElementById("_name").value = l_strName;
            document.getElementById("maxlength").value = l_strMaxLength;
            document.getElementById("maxrows").value = l_strMaxRows;
            document.getElementById("width").value = l_strWidth;
            var l_strValidation = l_objElement.getAttribute("validation", 0);
            document.getElementById("required").checked = l_strValidation && !l_strValidation.indexOf("Verplicht ");
        } else {
            l_strType = "label";
        }
        document.getElementById("caption").value = l_strText;
        document.getElementById(l_strType).checked = true;
        SetVisibility(null, l_strType);
    } else {
        alert("Selecteer eerst een element om de eigenschappen uit te lezen.");
    }
}

function MoveUp() {
    var l_objSelectedDiv = GetSelected(),
        l_blnSelectedNodeIsFirstOnLine = NodeIsFirstOnLine(l_objSelectedDiv),
        l_blnSelectedNodeIsLastOnLine = NodeIsLastOnLine(l_objSelectedDiv),
        l_objNewLineDiv;
    if (l_objSelectedDiv && (
            l_objSelectedDiv.previousSibling || (
                l_blnSelectedNodeIsFirstOnLine && !l_blnSelectedNodeIsLastOnLine
            )
        )
    ) {
        var l_objParentNode = l_objSelectedDiv.parentNode,
            l_objPreviousNode = l_objSelectedDiv.previousSibling;
        if (!l_objPreviousNode && l_blnSelectedNodeIsFirstOnLine && !l_blnSelectedNodeIsLastOnLine) {
            l_objNewLineDiv = GetSpaceClaimer();
            l_objParentNode.insertBefore(l_objNewLineDiv, l_objSelectedDiv.nextSibling);
        } else {
            l_objSelectedDiv = l_objParentNode.removeChild(l_objSelectedDiv);
            l_objSelectedDiv = l_objParentNode.insertBefore(l_objSelectedDiv, l_objPreviousNode);
            if (l_blnSelectedNodeIsFirstOnLine && !l_blnSelectedNodeIsLastOnLine) {
                l_objNewLineDiv = GetSpaceClaimer();
                l_objParentNode.insertBefore(l_objNewLineDiv, l_objSelectedDiv);
            } else if (NodeIsSpaceClaimer(l_objPreviousNode) && (NodeIsSpaceClaimer(l_objPreviousNode.nextSibling) || !l_objPreviousNode.nextSibling)) {
                l_objParentNode.removeChild(l_objPreviousNode);
            }
        }
        ResizeLabels(l_objSelectedDiv);
    }
}

function MoveDown() {
    var l_objSelectedDiv = GetSelected(),
        l_blnSelectedNodeIsFirstOnLine = NodeIsFirstOnLine(l_objSelectedDiv),
        l_blnSelectedNodeIsLastOnLine = NodeIsLastOnLine(l_objSelectedDiv),
        l_objNewLineDiv;
    if (l_objSelectedDiv && (
            l_objSelectedDiv.nextSibling || (
                l_blnSelectedNodeIsLastOnLine && !l_blnSelectedNodeIsFirstOnLine
            )
        )
    ) {
        var l_objParentNode = l_objSelectedDiv.parentNode,
            l_objNextNode = l_objSelectedDiv.nextSibling,
            l_objBeforeNode = l_objNextNode ? l_objNextNode.nextSibling : null;
        if (!l_objBeforeNode && l_blnSelectedNodeIsLastOnLine && !l_blnSelectedNodeIsFirstOnLine) {
            l_objNewLineDiv = GetSpaceClaimer();
            l_objParentNode.insertBefore(l_objNewLineDiv, l_objSelectedDiv);
        } else {
            l_objSelectedDiv = l_objParentNode.removeChild(l_objSelectedDiv);
            if (l_objBeforeNode) {
                l_objParentNode.insertBefore(l_objSelectedDiv, l_objBeforeNode);
                if (l_blnSelectedNodeIsLastOnLine && !l_blnSelectedNodeIsFirstOnLine) {
                    l_objNewLineDiv = GetSpaceClaimer();
                    l_objParentNode.insertBefore(l_objNewLineDiv, l_objBeforeNode);
                } else if (NodeIsSpaceClaimer(l_objNextNode) && (NodeIsSpaceClaimer(l_objNextNode.previousSibling) || !l_objNextNode.previousSibling)) {
                    l_objParentNode.removeChild(l_objNextNode);
                }
            } else {
                l_objParentNode.appendChild(l_objSelectedDiv);
            }
        }
        ResizeLabels(l_objSelectedDiv);
    }
}

function ElementOpenTagToLower(p_strMatch, p_strTag, p_strAttributes) {
    return "<" + p_strTag.toLowerCase() + p_strAttributes + ">";
}

function GetHtml(p_objDiv) {
    p_objDiv = p_objDiv || document.getElementById("divTarget");
    var l_strHtml = p_objDiv.innerHTML;
    //Todo: implement MakeXhtmlCompliant function here!
    l_strHtml = l_strHtml.replace(/<([^\s>]+)([^>]*)>/ig, ElementOpenTagToLower); //Replace all uppercase element open- and closing tags with lowercase
    l_strHtml = l_strHtml.replace(/(<(?:div|input)(?=\s)[^>]*)\scontentEditable=true(?=\s|>)/gi, "$1");
    l_strHtml = l_strHtml.replace(/(<(?:div)(?=\s)[^>]*)\sclass=selected(?=\s|>)/gi, "$1");
    return l_strHtml;
}

function trim(p_strValue) {
    return p_strValue.replace(/^\s+/, '').replace(/\s+$/, '');
}

function SetNameId() {
    var l_strCaption = document.getElementById("caption").value,
        l_strType = GetRadioValue("type");
    if (l_strCaption && trim(l_strCaption).length) {
        var l_strName = l_strCaption.replace(/\W/gi, ""),
            l_strId = l_strName;
        document.getElementById("_name").value = l_strName;
        while (document.getElementById(l_strId)) {
            var l_objRegExp = new RegExp(/^(.*)_(\d+)$/),
                l_objMatch = l_objRegExp.exec(l_strId),
                l_intNumber = 2;
            if (l_objMatch) {
                l_strId = l_objMatch[1];
                l_intNumber = parseInt(l_objMatch[2], 10) + 1;
            }
            l_strId = l_strId + "_" + l_intNumber;
        }
        document.getElementById("_id").value = l_strId;
        if (l_strType != "radio") {
            //For non-radio element, create unique name
            document.getElementById("_name").value = l_strId;
        }
    }
}
