/**
 * gestion d'onglet
 * 
 * @author Laurent Chaloupe 
 * @date   fevrier 2010
 */
var tab = new Class({
  Implements: Options,
  options: {
    url           : new Array(),
    cursor        : '',
    cursor_stop   : 0,
    cursor_activ  : 0,
    cursor_delay  : 4000,
    onglet_id     : '',
    onglet_class  : '',
    contenu_class : '',
    css_class     : {}
    },
  
  
  initialize : function( options ) {
    this.setOptions( options );
    
    this.onglet  = $$( '#' + this.options.onglet_id + ' ' + this.options.onglet_class );
    this.contenu = $$( '#' + this.options.onglet_id + ' ' + this.options.contenu_class );
    this.total   = this.onglet.length;
    
    this.ev();
    },
    
    
  /**
   * Ajoute les évenements sur les onglets
   */
  ev: function() {
    
    this.onglet.each( function( item ) {
      
      item.addEvent( 'mouseover', function() {
        this.options.cursor_stop = 1;
        this.affiche( this.position( item ));
        }.bind( this ));
      
      }.bind( this ));
    
    if( this.options.url.length )
      {
      this.onglet.each( function ( item ) {
        
        item.addEvent( 'click', function() {
          location.href = this.options.url[ this.position( item ) ];
          }.bind( this ));
        
        }.bind( this ));
      }
    },
  
    
  /**
   * Récup la position dans un tableau 
   * 
   * @param uid unique id
   * @return la position 
   */
  position: function( item ) {
    for( var i = 0; i < this.total; i++ )
      {
      if( this.onglet[ i ].uid == item.uid )
        return i;
      }
    
    return 0;
    },
    
    
  /**
   * Interverti un CSS par un autre
   */
  swap: function ( val, key, actif, bool ) {
    var nom = this.onglet[ actif ].id;
    
    if( bool )
      {
      $$( '#' + nom + ' ' + key ).removeClass( val[ 0 ] );
      $$( '#' + nom + ' ' + key ).addClass( val[ 1 ] );
      }
    else
      {
      $$( '#' + nom + ' ' + key ).removeClass( val[ 1 ] );
      $$( '#' + nom + ' ' + key ).addClass( val[ 0 ] );
      }
    },
    
    
  /**
   * Passe à l'onglet suivant, suivant un temps donné
   * 
   * @param actif
   */
  cursor_ft: function ( actif ) {
    if( this.options.cursor ) 
      $clear( this.options.cursor );
    
    if( this.options.cursor_stop != 1)
      {
      if( actif == ( this.total -1 ))
        actif = 0;
      else
        actif++;
      
      this.options.cursor = (function () {
        this.affiche( actif );
        }).periodical( this.options.cursor_delay, this );
      }
    },
    
    
  /**
   * Affiche est active l'onglet
   * 
   * @param actif
   */
  affiche: function( actif ) {
    var contenu = this.contenu[ actif ];

    for( var i = 0; i < this.total; i++ )
      this.contenu.setStyle( 'display', 'none' );
    
    for( i = 0; i < this.total; i++ )
      {
      $each( this.options.css_class, function ( val, key ) {
        this.swap( val, key, i, 1 );
        }.bind( this ));
      }
    
    contenu.setStyle( 'display', 'block' );
    
    $each( this.options.css_class, function ( val, key ) {
      this.swap( val, key, actif, 0 );
      }.bind( this ));
    
    if( this.options.cursor_activ )
      this.cursor_ft( actif );
    }
  });