// ///////////////////////////////////////////////////////////// FORTEN LISTS ON TOERISTISCHE KAART PAGE ////////////

var IntervalId = 0;
var X = 0;

var noordOn = false;
var middenOn = false;
var zuidOn = false;

function loadXMLDoc(dname) {
    var xmlDoc;
    if (window.XMLHttpRequest) {
        xmlDoc = new window.XMLHttpRequest();
        xmlDoc.open("GET", dname, false);
        xmlDoc.send("");
        return xmlDoc.responseXML;
    }
    // IE 5 and IE 6
    else if (ActiveXObject("Microsoft.XMLDOM")) {
        xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async = false;
        xmlDoc.load(dname);
        return xmlDoc;
    }
    alert("Error loading document");
    return null;
}

function createFortenLists() {
    if (document.getElementById("fortenDropDownLists")) {
        var fddl = document.getElementById("fortenDropDownLists");

        // Create 3 drop-downs
        var divNoord = document.createElement("div");
        var divMidden = document.createElement("div");
        var divZuid = document.createElement("div");
        var ulNoord = document.createElement("ul");
        var ulMidden = document.createElement("ul");
        var ulZuid = document.createElement("ul");
        ulNoord.id = "ulNoord";
        ulMidden.id = "ulMidden";
        ulZuid.id = "ulZuid";
        divNoord.id = "list_forten-regio-noord";
        divMidden.id = "list_forten-regio-midden";
        divZuid.id = "list_forten-regio-zuid";
        divNoord.appendChild(ulNoord);
        divMidden.appendChild(ulMidden);
        divZuid.appendChild(ulZuid);
        fddl.appendChild(divNoord);
        fddl.appendChild(divMidden);
        fddl.appendChild(divZuid);
        document.getElementById("list_forten-regio-noord").style.display = "none";
        document.getElementById("list_forten-regio-midden").style.display = "none";
        document.getElementById("list_forten-regio-zuid").style.display = "none";


        //Fill DropDowns with forten links li items from XML file
        var ulN = document.getElementById("ulNoord");
        var ulM = document.getElementById("ulMidden");
        var ulZ = document.getElementById("ulZuid");
        docXML = loadXMLDoc("/_handlers/DataFileRequestHandler.ashx?strFile=Objects.xml");
        var i, rootElement;
        if (docXML != null) {
            rootElement = docXML.documentElement;
            if (rootElement != null) {
                for (i = 0; i < rootElement.childNodes.length; i++) {
                    if (rootElement.childNodes[i].nodeType == 1 && rootElement.childNodes[i].getAttribute("location") != "") {
                        newLi = document.createElement("li");
                        newA = document.createElement("a");
                        newText = document.createTextNode(rootElement.childNodes[i].getAttribute("name"));
                        newA.href = rootElement.childNodes[i].getAttribute("href");
                        newA.onmouseover = function() { hiliteDot(this.innerHTML); }
                        newA.appendChild(newText);
                        newLi.appendChild(newA);
                        if (rootElement.childNodes[i].getAttribute("location") == "Noord") {
                            ulN.appendChild(newLi)
                        }
                        if (rootElement.childNodes[i].getAttribute("location") == "Midden") {
                            ulM.appendChild(newLi)
                        }
                        if (rootElement.childNodes[i].getAttribute("location") == "Zuid") {
                            ulZ.appendChild(newLi)
                        }
                    }
                }
            }
        }

        // Create 3 buttons
        var aNoord = document.createElement("a");
        var aMidden = document.createElement("a");
        var aZuid = document.createElement("a");
        aNoord.href = location.href;
        aMidden.href = location.href;
        aZuid.href = location.href;
        aNoord.onclick = function() { window.focus(); return false; }
        aMidden.onclick = function() { window.focus(); return false; }
        aZuid.onclick = function() { window.focus(); return false; }
        aNoord.id = "butt_forten-regio-noord";
        aMidden.id = "butt_forten-regio-midden";
        aZuid.id = "butt_forten-regio-zuid";
        fddl.appendChild(aNoord);
        fddl.appendChild(aMidden);
        fddl.appendChild(aZuid);

        aNoord.onmouseover = function() { showListNoord(); }
        aNoord.onmouseout = function() { hideListNoord(); }
        divNoord.onmouseover = function() { showListNoord(); }
        divNoord.onmouseout = function() { hideListNoord(); }

        aMidden.onmouseover = function() { showListMidden(); }
        aMidden.onmouseout = function() { hideListMidden(); }
        divMidden.onmouseover = function() { showListMidden(); }
        divMidden.onmouseout = function() { hideListMidden(); }

        aZuid.onmouseover = function() { showListZuid(); }
        aZuid.onmouseout = function() { hideListZuid(); }
        divZuid.onmouseover = function() { showListZuid(); }
        divZuid.onmouseout = function() { hideListZuid(); }

    }
    positionFortenLists();
}

function hiliteDot(dot) {
    if (document.getElementById("pnlMap")) {
        var obMap = document.getElementById("pnlMap");
        var as = obMap.getElementsByTagName("a");
        for (var i = 0; i < as.length; i++) {
            if (as[i].title == dot) {
                as[i].className = "mapItemSelected";
            } else {
                as[i].className = "mapItem";
            }
        }
    }
}

/* position drop-out-list forten */
function positionFortenLists() {
    if (document.getElementById("list_forten-regio-noord") && document.getElementById("butt_forten-regio-noord")) {
        listNoord = document.getElementById("list_forten-regio-noord");
        buttNoord = document.getElementById("butt_forten-regio-noord");
		//listNoord.style.top = Sys.UI.DomElement.getLocation(buttNoord).y + "px"; // IE8 goes 2px wrong here
		$(listNoord).css("top", $(buttNoord).offset().top);
    }
    if (document.getElementById("list_forten-regio-midden") && document.getElementById("butt_forten-regio-midden")) {
        listMidden = document.getElementById("list_forten-regio-midden");
        buttMidden = document.getElementById("butt_forten-regio-midden");
        //listMidden.style.top = Sys.UI.DomElement.getLocation(buttMidden).y + "px"; // IE8 goes 2px wrong here
		$(listMidden).css("top", $(buttMidden).offset().top);
    }
    if (document.getElementById("list_forten-regio-zuid") && document.getElementById("butt_forten-regio-zuid")) {
        listZuid = document.getElementById("list_forten-regio-zuid");
        buttZuid = document.getElementById("butt_forten-regio-zuid");
        // listZuid.style.top = Sys.UI.DomElement.getLocation(buttZuid).y + "px"; // IE8 goes 2px wrong here
		$(listZuid).css("top", $(buttZuid).offset().top);
    }
}

/// Drop down behavior
function showListNoord() {
    noordOn = true;
    document.getElementById("list_forten-regio-noord").style.display = "block";
    document.getElementById("list_forten-regio-midden").style.display = "none";
    document.getElementById("list_forten-regio-zuid").style.display = "none";
}
function showListMidden() {
    middenOn = true;
    document.getElementById("list_forten-regio-noord").style.display = "none";
    document.getElementById("list_forten-regio-midden").style.display = "block";
    document.getElementById("list_forten-regio-zuid").style.display = "none";
}
function showListZuid() {
    zuidOn = true;
    document.getElementById("list_forten-regio-noord").style.display = "none";
    document.getElementById("list_forten-regio-midden").style.display = "none";
    document.getElementById("list_forten-regio-zuid").style.display = "block";
}

function hideListNoord() {
    noordOn = false;
    X = 5;
    IntervalId = setInterval("aftellenNoord()", 700);
}
function aftellenNoord() {
    if (0 < X) {
        X--;
    } else {
        clearInterval(IntervalId);
        if (noordOn == false) document.getElementById("list_forten-regio-noord").style.display = "none";
    }
}
function hideListMidden() {
    middenOn = false;
    X = 5;
    IntervalId = setInterval("aftellenMidden()", 700);
}
function aftellenMidden() {
    if (0 < X) {
        X--;
    } else {
        clearInterval(IntervalId);
        if (middenOn == false) document.getElementById("list_forten-regio-midden").style.display = "none";
    }
}
function hideListZuid() {
    zuidOn = false;
    X = 5;
    IntervalId = setInterval("aftellenZuid()", 700);
}
function aftellenZuid() {
    if (0 < X) {
        X--;
    } else {
        clearInterval(IntervalId);
        if (zuidOn == false) document.getElementById("list_forten-regio-zuid").style.display = "none";
    }
}

// ///////////////////////////////////////////////////////////// END FORTEN LISTS ON TOERISTISCHE KAART PAGE ////////////
