/**

*/

var FogManager = new Class({
	
	Implements: [Options, Events],

	options: {
		onStartOpen: $empty(),
		onCompleteOpen: $empty(),
		onStartClose: $empty(),
		onCompleteClose: $empty(),
		duration: 200,
		styles: {
			backgroundColor: "",
			opacity: "0.7"
		},
		locked: false,
		noAnimation: false,
		setTo: null,
		loading: false,
		keepClose: false,
		name : "",
		ieFixedPosition: true
	},
	
	
    initialize : function (element, options){
		this.setOptions(options)
		
		// ferme par defaut
		this.isOpen = false;
		this.ctnElement = $(element);
		// creation de la structure
		// ifr pour ie6
		if(Browser.Engines.trident && Browser.Engine.version <= 4){
			this.ifr = new Element('iframe');
			this.ifr.src = "";
			$(document.body).adopt(this.ifr);
		}
		
		
		this.elm = new Element("div", {'class': 'fog hidden'});
		$(document.body).adopt(this.elm);
		this.elm.setStyles(this.options.styles);
		// au resize, on repositionne
		window.addEvent("resize", function (){
			if(!this.fogs) this.setToElm(this.lastElm);
		}.bind(this))
		
		this.addEvent('onCompleteClose', 
			function (){
				if(!this.elm) return;
				this.isOpen = false;
				this.elm.addClass("hidden");
				this.elm.dispose();
				if(this.ifr) this.ifr.dispose();
				if(this.interval) clearInterval(this.interval);
				// this.elm = null;
				// Object.reset(this);
				// this.setOptions(FogManager.prototype.options);
			}
		)
		
		if(!this.options.locked) this.elm.addEvent('click', function (){this.close();}.bind(this));
		if(this.options.loading) this.elm.addClass("loading");
		if(!this.options.keepClose) this.open();
	},
    
    toggle: function(){
		this.isOpen == true ? this.close() : this.open(oOpts);
    },
    
    open: function (){
		
		this.setToElm();
		
		if(this.options.noAnimation) {
			this.elm.removeClass('hidden');
			this.ctnElement.removeClass('hidden');
			this.fireEvent("onCompleteOpen", this.elm, $(this.options.setTo));
			return;
		}
		
		if(this.ctnElement){
			elm = $(this.ctnElement);
			
			elm.getElements(".layerClose").addEvent("click", function (e){e.stop();this.close();}.bind(this))
			
			// ajout de l'anim sur le ctn
			this.currentContent = elm;
			var myFx2 = new Fx.Tween(elm, {
				onStart: function (){
					this.element.removeClass("hidden");
					this.element.setStyle("marginLeft", -this.element.offsetWidth/2)
					this.element.setStyle("marginTop", this.element.offsetHeight/2)
				},
				duration: this.options.duration
			});
			myFx2.set("zIndex", "7000");
			myFx2.set("opacity", "0");
			myFx2.start("opacity", "1");
			this.fixTopPosition();
		}
		else {
			this.currentContent = null;
		}
		
		var _self = this;
		// ouverture du fog
		var myFx = new Fx.Tween(this.elm, {
			onStart: function (){
				this.fireEvent("onStartOpen", this.elm, $(this.options.setTo));
				this.elm.removeClass("hidden");
				
			}.bind(this),
			onComplete: function (){
				this.fireEvent("onCompleteOpen", this.elm, $(this.options.setTo));
				this.isOpen = true;
				//this.createIfr();
			}.bind(this),
			duration: this.options.duration
		});
		myFx.set("opacity", "0");
		myFx.start("opacity", this.options.styles.opacity);
		
	},
	
	close: function (){
		if(this.options.noAnimation) {
			this.fireEvent("onCompleteClose", this.elm, $(this.options.setTo));
			return;
		}
		// fermeture du fog
		var myFx = new Fx.Tween(this.elm, {
			onStart: function (){
				this.fireEvent("onStartClose", this.elm, $(this.options.setTo));
			},
			onComplete: function (){
				this.fireEvent("onCompleteClose", this.elm, $(this.options.setTo));
			}.bind(this),
			duration: this.options.duration + 10
		});
		myFx.set("opacity", this.options.styles.opacity);
		myFx.start("opacity", "0");
		
		if(this.ctnElement){
			var myFx2 = new Fx.Tween($(this.ctnElement), {
				onStart: function (){}.bind(this),
				onComplete: function (){
				}.bind(this),
				duration: this.options.duration
			});
			myFx2.set("zIndex", "-1");
			myFx2.set("opacity", "1");
			myFx2.start("opacity", "0");
		}
	},
	
	setToElm: function (){
		
		if(this.options.setTo && $(this.options.setTo)){
			var coo = $(this.options.setTo).getCoordinates();
			this.elm.setStyles({
				"width": coo.width,
				"height": coo.height,
				"top": coo.top,
				"left": coo.left})
		}
		else {
			var coo = $(document.body).getCoordinates();
			//console.log(this.options.styles.width)
			if(!this.options.styles.width || !this.options.styles.width === 0) this.elm.setStyle('width', document.body.scrollWidth)
			if(!this.options.styles.height ||!this.options.styles.height === 0) this.elm.setStyle('height', document.body.scrollHeight)
			if(!this.options.styles.top ||!this.options.styles.top === 0) this.elm.setStyle('top', 0)
			if(!this.options.styles.left ||!this.options.styles.left === 0) this.elm.setStyle('left', 0)
		}
		if(Browser.Engines.trident && Browser.Engine.version <= 4){
			this.ifr.setStyles({
				"width": document.body.scrollWidth,
				"height": document.body.scrollHeight,
				"top": 0,
				"left": 0,
				"zIndex": 5998,
				"position": "absolute",
				"filter": "mask()",
				"visibility": "visible"
				})
		}
	},
	
	fixTopPosition: function (){
		var myBrowser = Browser.detect();
		this.interval = setInterval(function (oSelf){
			return function (){
				if (myBrowser.name=="webkit"){
					var scrollTop = document.body.scrollTop
				}else{
					var scrollTop = document.documentElement.scrollTop
				}
				var wHeight = document.documentElement.clientHeight;
				oSelf.currentContent.setStyle("marginTop",  scrollTop + (wHeight / 2) - (oSelf.currentContent.offsetHeight/2))
			}
		}(this), 1);
	}
	
	
});


function displayMDP(){
// construit contenu
new FogManager('mdp', {locked:true})
}