var menuAnimating = 0;
var timer = null;
var menuopen = null;
var menuShouldOpen = null;

document.observe('dom:loaded', function() {
    $$("div.submenu").invoke('hide');

    /*
    $$("a.menubutton").invoke('observe', 'click', function (event) {
        event.stop();
        if(menuAnimating == 1)
            return false;
        else
            menuAnimating = 1;

        var aElement = Event.findElement(event, "a");
        var liElement = aElement.up('li');
        var subDivElement = liElement.down("div.submenu");
        hideAll();

        if(timer)
            clearTimeout(timer);
                                            
        Effect.SlideDown(subDivElement, {
            duration: 0.5,
            afterFinish: function(e) {
                menuAnimating = 0;
                timer = setTimeout("hideAll()", 20000);
            }
        });
    });
    */
    $$("a.menubutton").invoke('observe', 'mouseover', function (event) {

        var aElement = Event.findElement(event, 'a.menubutton');
        var liElement = aElement.up('li.mainmenuli');
        if(liElement) {
            menuShouldOpen = liElement.down("div.submenu");
            openMenu();
        }
    });


    // lightbox for welke/waar button
    $$("a.lightboxbutton").invoke('observe', 'click', function(event) {
        event.stop();
        var element = Event.findElement(event, "a");
        var imgElement = element.down("img");
        if(imgElement) {
            var objectid = imgElement.getAttribute("alt");
            Lightbox2.create(contextpath + "/lightbox.jsp?objectid=" + objectid);
        }
    });
    // support for the search page
    var searchForm = $("sbasearch_form");
    if(searchForm) {
        searchForm.insert({bottom: new Element("input", {type: "hidden", name: "ajax", value: "true"})});
        searchForm.select(".formfield").each(function(e) { e.observe("change",
            function(event) {
                event.stop();
                var url = searchForm.getAttribute("action");
                var calloptions = {
                    method: "post",
                    onSuccess: function (e) {
                        $("content_area").update(e.responseText);
                        addMapTab();
                    },
                    parameters: searchForm.serialize(true)
                };
                new Ajax.Request(url, calloptions);
            }
        )});

        searchForm.select("input[type=submit]").invoke("hide");

        // add second tab Maps for the JavaScript users;
        addMapTab();
    }

 	var link = new Element('link', {
		rel: 'stylesheet',
		media: 'all',
		href: contextpath + '/styles/' + style + '/roundcorner.css'
	});
	$$('head').invoke('insert', {bottom: link });

});

function openMenu() {

    if((menuopen == null || menuShouldOpen != menuopen) && menuAnimating == 0) {
        menuAnimating = 1;
        if(menuopen != null && menuopen != menuShouldOpen) {
            Effect.SlideUp(menuopen, {
                duration: 0.25,
                afterFinish: function(e) {
                    menuopen = menuShouldOpen;
                    Effect.SlideDown(menuopen, {
                        duration: 0.25,
                        afterFinish: function(e) {
                            timer = setTimeout("hideAll()", 20000);
                            menuAnimating = 0;
                            openMenu();
                        }
                    });
                }
            });
        } else {
            menuopen = menuShouldOpen;
            Effect.SlideDown(menuopen, {
                duration: 0.25,
                afterFinish: function(e) {
                    timer = setTimeout("hideAll()", 20000);
                    menuAnimating = 0;
                    openMenu();
                }
            });
        }
    }
}

function hideAll() {
    $$("div.submenu").each(function(e) {
        if(e.visible())
            Effect.SlideUp(e, {duration: 0.5});
    });
    menuopen = null;
}

function addMapTab() {
    var mapDiv = new Element("div", { id: "map"});
    $("tabcontent").insert({ bottom: mapDiv });

    var tabLi = new Element("li", {id: "map_tab"});
    var tabSpan = new Element("span");
    tabSpan.update("Kaart");
    tabLi.update(tabSpan);

    $("tabselector").insert({bottom: tabLi});

    $("tabselector").select("li").invoke("observe", "click", function (event) {
        var element = Event.findElement(event, 'li');
        $("tabselector").select("li").each(function(e) {
            e.removeClassName("selected");
            $(e.getAttribute("id").substr(0, e.getAttribute("id").length-4)).hide();
        });
        element.addClassName("selected");
        $(element.getAttribute("id").substr(0, element.getAttribute("id").length-4)).show();
    });

    // add map
     createMap(mapDiv);

    var addresses = $$("div.mapdetails");
    if(addresses.length > 0) {
        var e = addresses[0];
        
        var address = e.down("div.address").innerHTML;
        var zipcode = e.down("div.zipcode").innerHTML;
        var city    = e.down("div.city").innerHTML;
        var objectid= e.down("div.objectid").innerHTML;

        addMarkers(addresses, 0);
    }

    mapDiv.hide();
}