/* Dans Event observe*/

	Event.observe(window,"load", function(){
		if($("languages")) {
			new DomElementsController("languages", "languageschoice");
		}
	});


	var DomElementsController = Class.create({
	
	  initialize: function(handler, target) {
	  
		this.handler  			= $(handler);
		this.target 			= $(target);
		this.uid				= parseInt(Math.random(new Date().getTime(), 10) * 10000);
		this.window				= (window.event) ? document.body : window; // IE Hack
		
		// default state
		this.target.isOpen 		= false;
		
		// default parameters
		this.eventChoice 		= 'mouseover';
		this.toggleClassName 	= 'hidden';
		this.targetClassName 	= 'targetsubmenu';
		this.targetZIndex		= 10;
		this.targetStyle		= false;
		this.targetAlign		= false;
		this.effectDuration		= 0.2;
		
		// callbacks functions
		this.afterCreate 		= function(){};
		this.afterOpen 			= function(){};
		this.afterClose 		= function(){};
		
		
		// options ?
		if(arguments[2]) {
			this.options = arguments[2];
			
			// parameters
			if(this.options.event)				this.eventChoice 		= this.options.event;				// string
			if(this.options.toggleClassName) 	this.toggleClassName 	= this.options.toggleClassName;		// string
			if(this.options.targetClassName) 	this.targetClassName 	= this.options.targetClassName;		// string
			if(this.options.targetZIndex) 		this.targetZIndex 		= this.options.targetZIndex;		// number
			if(this.options.targetStyle) 		this.targetStyle 		= this.options.targetStyle;			// {} -> no style
			if(this.options.targetAlign) 		this.targetAlign 		= this.options.targetAlign;			// right / middle /left
			if(this.options.effectDuration) 	this.effectDuration		= this.options.effectDuration;		// time in second
			
			
			// callbacks
			if(this.options.afterCreate) 		this.afterCreate 		= this.options.afterCreate;
			if(this.options.afterOpen) 			this.afterOpen 			= this.options.afterOpen;
			if(this.options.afterClose) 		this.afterClose 		= this.options.afterClose;
		}
		
		// link both element with same class name
		this.handler.addClassName(this.uid);
		this.target.addClassName(this.uid).addClassName(this.targetClassName);
		
		// move target to the bottom of the dom tree
		document.body.appendChild(this.target);
		
		// set target styles
		this.setTargetDefaultStyle();
		
		// listeners callbacks
		this.opener = this.open.bind(this); 
		this.closer = this.shouldIClose.bind(this); 
		
		// listener initiated
		this.eltListenerSwitcher(this.handler, 'on', this.opener);
		this.afterCreate();
		
	  },
   
	  open: function() {
		this.target.setStyle({'opacity' : 0});
		this.target.removeClassName(this.toggleClassName);
		this.eltListenerSwitcher(this.handler, 'off', this.opener);
		this.eltListenerSwitcher(this.window, 'on', this.closer);
		this.afterOpenFinished = function(){this.target.isOpen = true; this.afterOpen();};
		this.target.appear({duration: this.effectDuration, afterFinish: this.afterOpenFinished.bind(this)});
	  },
	  
	  close: function() {
		this.target.addClassName(this.toggleClassName);
		this.eltListenerSwitcher(this.handler, 'on', this.opener);
		this.eltListenerSwitcher(this.window, 'off', this.closer);
		this.target.isOpen = false;
		this.afterClose();
	  },
	  
	  shouldIClose: function(event){
	  	var element = Event.element(event);
		if (this.eventChoice == 'click') { // when click event chosen, handler does toggle target
			if ( (element === this.handler) && this.target.isOpen || !element.hasClassName(this.uid) ) this.close();
		} else {
			if( !(element.hasClassName(this.uid) || element.up('.' + this.uid)) ) this.close();
		}
	  },
	  
	  eltListenerSwitcher : function(element, choice, callback){
	  	if('off' == choice) {
			Event.stopObserving(element, this.eventChoice, callback);
		} else {
			Event.observe(element, this.eventChoice, callback);
		}
	  },
	  
	  setTargetDefaultStyle: function(){
	  
	  	if (this.targetStyle) {
		
			this.target.stylecss = this.targetStyle;
			
		} else {
		
			this.handler.position 		= this.handler.cumulativeOffset();
			this.handler.dimensions		= this.handler.getDimensions();
			this.target.position 		= this.target.cumulativeOffset();
			this.target.dimensions		= this.target.getDimensions();
			
			this.handler.dimensions.width += parseInt( this.target.getStyle('border-left-width') ) + parseInt( this.target.getStyle('border-right-width') );
			this.handler.dimensions.height += parseInt( this.target.getStyle('border-top-width') ) + parseInt( this.target.getStyle('border-bottom-width') );
			
			var position	= 'absolute';
			
			if(this.targetAlign == 'right') {
				var left = parseInt(this.handler.position.left + this.handler.dimensions.width - this.target.dimensions.width) + 'px';
			} else if (this.targetAlign == 'middle'){
				var left = parseInt( this.handler.position.left - (this.target.dimensions.width - this.handler.dimensions.width)/2 ) + 'px';
			} else {
				var left = this.handler.position.left + 'px';
			}
			
			var top			= parseInt(this.handler.position.top + this.handler.dimensions.height) + 'px';
			var zIndex		= this.targetZIndex;

			this.target.stylecss = {
				'position'	: position,
				'left'		: left,
				'top'		: top,
				'z-index'	: zIndex
			};
		
	  	}
		
		this.target.setStyle( this.target.stylecss );
		
	  }
	  
	});;