var PopupPanel = new Class({
	
	initialize: function(handleId, contentUrl) {
	    this.handle = $(handleId);
	    
	    this.handle.addEvent("click", this.toggle.bind(this));
	    
	    var handlePosition = this.handle.getPosition();
	    
	    //Create Panel
	    this.container = new Element("div", {
	        id:handleId + "Container",
	        styles:{
	            position:"absolute",
	            "background-color":"#fff",
	            left: handlePosition["x"],
	            top: handlePosition["y"],
	            display: "none"
	        }
	    });
	    this.container.inject($(document.body));
	    this.loaded = false;	    
    },
    toggle: function(){
        if (!this.loaded){
            this.container.set("html", "Loading...");
            var request = new Request.HTML({
	            onSuccess: this.onPanelLoaded.bind(this)
	        });
	        request.get(this.handle.getProperty("href") + "?exclude=true");
	        this.loaded = true;
        }
    
        if (this.container.getStyle("display") == "block"){
            this.container.setStyle("display", "none");
        }
        else{
            this.container.setStyle("display", "block");
        }
        return false;
    },
    onPanelLoaded: function(responseTree, responseElements, responseHTML, responseJavaScript){
        this.container.empty();
	responseElements[0].inject(this.container, "bottom");
        var closeButton = new Element("a", {
	        href:"#",
	        "class":"panelToggle",
	        events:{
	            "click":this.toggle.bind(this)
	        },
	        html:"Close"
	    });
	    closeButton.inject(this.container, "top");
    }    
});

