// JavaScript Document
var showModal = function(backgroundColour, options) {
	
    var options = $merge({
        zIndex: 10000000,
        opacity: .6,
        events: $empty()
    }, options);

   /* if (!$type(backgroundColour) && !$("modalBg"))
        return false;*/
		
		
		var scrollSizeY = Browser.Engine.webkit?window.getScrollSize().y+window.getScroll().y:window.getScrollSize().y;

		/*bg*/
		if ($('modalBg')){
			$("modalBg").setStyles({
							   height: scrollSizeY,
							   width: window.getScrollSize().x,
							   display : "block",
							   opacity: options.opacity});
		}else{

			new Element("div", {
				id: "modalBg",
				styles: {
					position: "absolute",
					top: 0,
					left: 0,
					width: window.getScrollSize().x,
					height: scrollSizeY,
					background: backgroundColour,
					"z-index": options.zIndex
				},
				opacity: options.opacity,
				events: options.events
			}).inject(document.body);
		}
		
		
		/* contenu */
		if ($("modalContent")){
			$("modalContent").setStyles({
							   top: window.getScroll().y + 100,
							   width: window.getScrollWidth(),
							   display : "block",
							   opacity:1});
		}else{	
		
			//cré le conteneur centré
			return new Element("div", {
				id: "modalContent",
				styles: {
					position: "absolute",
					top: window.getScroll().y + 100,
					left: 0,
					width: window.getScrollWidth(),
					"z-index": options.zIndex + 1
				}
			}).inject(document.body);
		
		}

} // end toggleModal

var hideModal = function(){
	if ($("modalBg")) {
       $("modalBg").setStyle("diplay", "none");
	   $("modalContent").setStyle("diplay", "none");
       return false;
    }
};

var fadeHideModal = function(){
	if ($("modalBg")) {
       $("modalBg").fade(0); // want to gently fade it out
	   $("modalContent").fade(0); // want to gently fade it out
		// do other stuff/cleanup here
		(function() { hideModal(); }).delay(500); // removes the layer itself after fade done
	}
};


// example usage
/*toggleModal("#fff"); // create a white modal, default options.
// ... do stuff
toggleModal(); // close it.

// something more fancy...
toggleModal("#555", {
    zIndex: 1000,
    events: {
        click: function() {
            $("modal").fade(0); // want to gently fade it out
            // do other stuff/cleanup here
            (function() { toggleModal(); }).delay(500); // removes the layer itself after fade done
        }
    }
});

// the function also returns the object so you can tweak it from the outside:
toggleModal("#fff").adopt(new Element("div", {"class": "intro", text: "Hi from modal land!"}).addClass("modals");
*/
