function showPopup(body, anchor, position) {
    if(anchor.popup) {
        removeElement(anchor.popup);
        anchor.popup = undefined;
    } else {
        var close = BUTTON({"class": "button button-close"}, SPAN("sluiten"));
        var popup = DIV({"class": "popup"}, close, DIV({"class": "body"}, body));
        connect(close, "onclick", function() {
            removeElement(anchor.popup);
            anchor.popup = undefined;
        });
        setElementPosition(popup, position);
        insertSiblingNodesBefore(document.body.firstChild, popup);
        anchor.popup = popup;
    }
}

function getMousePosition(event) {
    if(event.pageX && event.pageY) {
        return new Coordinates(event.pageX, event.pageY);
    } else {
        return new Coordinates(event.clientX + document.documentElement.scrollLeft, event.clientY + document.documentElement.scrollTop);
    }
}

function showBasicPopup(anchor, event, contents) {
    var position = getMousePosition(event);
    var body = $(contents).cloneNode(true).childNodes;
    showPopup(body, anchor, position);
}

function showPropertyPopup(anchor, event, property) {
    var url = anchor.href;
    var position = getMousePosition(event);
    if(url.indexOf(";") == -1) {
        url = url + "/eigenschap/" + property;
    } else {
        url = url.substring(0, url.indexOf(";")) + "/eigenschap/" + property + url.substring(url.indexOf(";"));
    }
    doXHR(url).addCallback(function (xhr) {
        if(xhr.status == 200 && xhr.getResponseHeader("Content-Type").indexOf("text/plain") == 0) {
            showPopup(textToHTML(P(), xhr.responseText), anchor, position);
        }
    });
}


