var zindex=1000;
var popup_opened=0;

function showPopup(id) {
    if($(id)) {
        var popup=$(id).getParent('.popup');
        if(popup) {
            var calque=$('calque');
            if (calque) {
                popup_opened++;
                calque.setStyle('display','block');
                size=window.getScrollSize();
                calque.setStyles({'width':size.x, 'height':size.y});
            }

            popup.setStyle('display','block');
            $(id).setStyles({'display':'block'});
            var scroll = document.getScroll();
            var dsize = document.getSize();
            var psize = popup.getSize();
            popup.setStyles({'position':'absolute', 'top':scroll.y+Math.floor(dsize.y/4), 'left':scroll.x+Math.floor((dsize.x-psize.x)/2), 'z-index':zindex++}); // psize, 0/0 ???
        }
        else {
            $(id).setStyles({'display':'block'});
        }
    }
}

function hidePopup(id) {
    if($(id)) {
        var popup=$(id).getParent('.popup');
        if(popup) {
            var calque=$('calque');
            if (calque) {
                popup_opened--;
                if(Math.max(popup_opened,0)==0) {
                    popup_opened=0;
                    calque.setStyle('display','none');
                }
            }
            popup.setStyle('display', 'none');
        }
        else {
            $(id).setStyles({'display':'none'});
        }
    }
}

function makePopup(target) {
    size=target.getSize();

    var popup=new Element("div", {'class':'popup'});
    popup.appendChild(new Element("div", {'class':'popup-left-top-corner floatleft'}));
    popup.appendChild(new Element("div", {'class':'popup-top-middle floatleft'}).setStyle('width',size.x));
    var closer = new Element("div", {'id':'closer-'+target.id, 'class':'popup-right-top-corner floatleft'});
    closer.addEvents({
    'click': function(){
        hidePopup(target.id)
    }
    });
    popup.appendChild(closer);
    popup.appendChild(new Element("div", {'style':'clear: both;'}));

    var left = new Element("div", {'class':'popup-left-middle'});
    var right = new Element("div", {'class':'popup-right-middle'});
    var container=new Element("div", {'id':target.id+'_content', 'class':'popup-content'});

    right.appendChild(container);
    left.appendChild(right);
    popup.appendChild(left);
    popup.appendChild(new Element("div", {'style':'clear: both;'}));
    popup.appendChild(new Element("div", {'class':'popup-left-bottom-corner floatleft'}));
    popup.appendChild(new Element("div", {'class':'popup-bottom-middle floatleft'}).setStyle('width',size.x));
    popup.appendChild(new Element("div", {'class':'popup-right-bottom-corner floatleft'}));

    $$('body')[0].appendChild(popup);

    container.grab(target);

}

document.addEvent('domready', function() {
    var fakepopups = document.getElements('div.fakepopup');
    for(var i=0;i<fakepopups.length;i++) {
        makePopup(fakepopups[i]);
    }
    var calque=new Element("div", {'id':'calque','class':'calque'});
    $$('body')[0].adopt(calque);
});