// ///////////////////////////////////////////////////////////// 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 ($get("fortenDropDownLists")) {
        var fddl = $get("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);
        $get("list_forten-regio-noord").style.display = "none";
        $get("list_forten-regio-midden").style.display = "none";
        $get("list_forten-regio-zuid").style.display = "none";


        //Fill DropDowns with forten links li items from XML file
        var ulN = $get("ulNoord");
        var ulM = $get("ulMidden");
        var ulZ = $get("ulZuid");
        docXML = loadXMLDoc("/_handlers/DataFileRequestHandler.ashx?strFile=OpeningObjects.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 ($get("pnlMap")) {
        var obMap = $get("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 ($get("list_forten-regio-noord") && $get("butt_forten-regio-noord")) {
        listNoord = $get("list_forten-regio-noord");
        buttNoord = $get("butt_forten-regio-noord");
        listNoord.style.top = (Sys.UI.DomElement.getLocation(buttNoord).y - Sys.UI.DomElement.getLocation($get("listsContainer")).y) + "px";
    }
    if ($get("list_forten-regio-midden") && $get("butt_forten-regio-midden")) {
        listMidden = $get("list_forten-regio-midden");
        buttMidden = $get("butt_forten-regio-midden");
        listMidden.style.top = (Sys.UI.DomElement.getLocation(buttMidden).y - Sys.UI.DomElement.getLocation($get("listsContainer")).y) + "px";
    }
    if ($get("list_forten-regio-zuid") && $get("butt_forten-regio-zuid")) {
        listZuid = $get("list_forten-regio-zuid");
        buttZuid = $get("butt_forten-regio-zuid");
        listZuid.style.top = (Sys.UI.DomElement.getLocation(buttZuid).y - Sys.UI.DomElement.getLocation($get("listsContainer")).y) + "px";
    }
}

/// Drop down behavior
function showListNoord() {
    noordOn = true;
    $get("list_forten-regio-noord").style.display = "block";
    $get("list_forten-regio-midden").style.display = "none";
    $get("list_forten-regio-zuid").style.display = "none";
}
function showListMidden() {
    middenOn = true;
    $get("list_forten-regio-noord").style.display = "none";
    $get("list_forten-regio-midden").style.display = "block";
    $get("list_forten-regio-zuid").style.display = "none";
}
function showListZuid() {
    zuidOn = true;
    $get("list_forten-regio-noord").style.display = "none";
    $get("list_forten-regio-midden").style.display = "none";
    $get("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) $get("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) $get("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) $get("list_forten-regio-zuid").style.display = "none";
    }
}

// ///////////////////////////////////////////////////////////// END FORTEN LISTS ON TOERISTISCHE KAART PAGE ////////////
