
var NaMooTabs = new Class({
	
	Implements: [Options, Events],
	
	options: {
		on: 'click',
		premier: 0,
		duration: 400,
		transition: Fx.Transitions.Cubic.easeOut
	},
	
	/**
	 * @brief Lance le fonctionnement du module
	 * @param container Id du Ul contenant toutes les Tabs dans des Li par exemple. Indique une balise parent et cherche les enfants pour en faire les tabs
	 * @param menus Class des éléments de menu.
	 * @param Options
	 */
	initialize: function(container, menus, options){
		this.setOptions(options);
		this.container 	= $(container);
		if(this.container != undefined){
			this.largeur	= this.container.getSize().x;
			this.menus		= menus;
			this.addPanneaux();
			this.addMenus();
			this.newDiv = new Element('div', {'class':'namootabs', 'styles':{'overflow':'hidden', 'width':this.largeur+'px'}}).inject(this.container, 'before').grab(this.container);
			this.showDirect(this.options.premier);
		}
	},
	
	panneaux: [],
	onglets: [],
	
	addPanneaux: function(){
		this.container.getChildren().each(function(panneau, index){
			this.panneaux.include(panneau);
			var indice = (index +2)*2;
			panneau.h = panneau.getSize().y;
			panneau.y = panneau.getPosition(this.container).y;
		}.bind(this));
	},
	
	addMenus: function(){
		$$(this.menus).each(function(menu, index){
			menu.setStyle('cursor', 'pointer');
			this.onglets.include(menu);
			menu.addEvent(this.options.on, function(event){
				this.change(event, index);
			}.bind(this));
		}.bind(this));
	},
	
	show: function (id){
		this.changeCurrent(id);
		if(this.ie7etInf()){
			this.patch(id);
		} else {
			effectContainer 	= new Fx.Morph(this.container, 	{duration: this.options.duration, transition: this.options.transition});
			effectNewDiv 		= new Fx.Morph(this.newDiv, 	{duration: this.options.duration, transition: this.options.transition});
			effectNewDiv.start({
				'height': this.panneaux[id].h
			});
			effectContainer.start({
				'margin-top': -this.panneaux[id].y
			});
		}
	},
	
	showDirect: function (id){
		this.changeCurrent(id);
		this.newDiv.setStyle('height', this.panneaux[id].h + 'px');
		if(this.ie7etInf()){
			this.patch(id);
		} else {
			this.container.setStyle('margin-top', '-' + this.panneaux[id].y + 'px');
		}
	},
	
	patch: function(id){
		if(this.ie7etInf()){
			this.panneaux.each(function(panneau, index){
				panneau.setStyle('display','none');
			}.bind(this));
		}
		this.panneaux[id].setStyle('display','block');
	},
	
	changeCurrent: function(id){
		this.onglets.each(function(onglet, id){
			onglet.removeClass('current');
		});
		this.onglets[id].addClass('current');
	},
	
	change: function(event, id){
		event.stop();
		this.show(id);
	},
	
	ie7etInf: function(){
		if(Browser.Engine.name == 'trident' && Browser.Engine.version < 6){
			return true;
		}
		return false;
	}
  
});
