/**
 * @class Tab
 * @param {Object} config
 *  id: id of a dom element
 *  childCls: css class name of children items
 *  trigger: the event name that triggers event
 *  triggerState: state of trigger that 
 *  active: state of item 
 */
meltmedia.Tab = Class.create({
  
  initialize: function(config) {
    this.activeIndex = typeof config.activeIndex != "undefined"? config.activeIndex : 0; 
    if(typeof config.autoRotate != "undefined"){
      this.autoRotate = true;
      this.autoRotateSpeed = config.autoRotate.speed;
    }else{
      this.autoRotate = false;
    };
    this.items = config.items;
    this.createItems(config.items);
  },
  
  createItems: function(items){
    
    items.each(function(item,i){
      item.index = i;
      /** setting the dom element from id */
      item.dom = $(item.id);
      item.tagName = item.dom.tagName;
      /** setting default values for each */
      if(typeof item.active=="undefined")item.active=false;
      if(item.trigger=="check"){
        item.triggerState=(typeof item.triggerState=="undefined")? true: item.triggerState;
      }
      
      /** getting elements based on childCls(class name) 
       *  and setting them to each items
       */
      var children = []; 
      if(typeof item.childCls!="undefined"){
        item.childCls.each(function(cls){
          var childEls = $$("."+cls);
          if(childEls.length>0)children.push(childEls);
        });  
      }
      item.children = children.flatten(); 
    }.bind(this));
    
    this.initItems();
  },
  
  /** initializing all elements based on the config */
  initItems: function(){ 
    this.items.each(function(item){ 
      if (item.dom != null) {
        var isActive = (item.trigger == "check") ? item.dom.checked == item.triggerState : item.active;
        
        if (isActive) {
          this.activateItem(item);
        }
        
        this.initItemEvents(item);
      }
    }.bind(this));
    this.activateOneItem(this.activeIndex);
    if(this.autoRotate) this.initAutoRotate();
    
  },
  
  initAutoRotate: function(){
    var length = this.items.length;
    var timer = setInterval(function(){
       if(this.autoRotate){ 
         this.activateOneItem(length>this.activeIndex+1? this.activeIndex+1:0);
       }else{
         clearInterval(timer);
       }
   }.bind(this),this.autoRotateSpeed);
  },
  
  initItemEvents: function(item){ 
    if (item.dom != null) {
      var evName = typeof item.trigger == "undefined"? "click": item.trigger;
      var handler = this.triggerHandler;
      switch (item.trigger) {
        case "check":
          evName = "click";
          break;
      }
      item.dom.observe(evName, handler.bindAsEventListener(this,item.tagName));
    }
  },
  
  triggerHandler: function(ev){
    this.autoRotate = false;
    var tagName = $A(arguments)[1];
    var el = ev.findElement(tagName); 
    var tgItem = this.getItemById(el.id);
    var isActive = tgItem.active;
    if(!isActive){
      if(tgItem.trigger=="check"){
        isActive = tgItem.dom.checked!=tgItem.triggerState;
      }
      /** deactivating all items */
      this.deactivateAllItems();
      this.activateItem(tgItem);
    }
  },
  
  
  activateItem: function(tgItem){ //console.info(typeof tgItem);
    if(typeof tgItem == "number") tgItem = this.items[tgItem];
    var el = tgItem.dom;
    el.addClassName("tab-active-item");
    el.removeClassName("tab-deactive-item");
    tgItem.active = true;
    tgItem.children.each(function(child){
      child.removeClassName("hide");
      child.addClassName("tab-active-item-child");
      child.removeClassName("tab-deactive-item-child");
    });
    this.activeIndex = tgItem.index;
  },
  
  deactivateItem: function(tgItem){
    if(typeof tgItem == "number") tgItem = this.items[tgItem];
    tgItem.dom.removeClassName("tab-active-item");
    tgItem.dom.addClassName("tab-deactive-item");
    tgItem.active = false;
    
    tgItem.children.each(function(child){
      child.addClassName("hide");
      child.removeClassName("tab-active-item-child");
      child.addClassName("tab-deactive-item-child");
    });
    
  },
  
  deactivateAllItems: function(){
    this.items.each(function(item){ 
      this.deactivateItem(item);
    }.bind(this));
  },
  
  getCurrentActiveIndex: function(){
    
  },
  
  activateOneItem: function(index){
    this.deactivateAllItems();
    this.activateItem(index);
  },
  
  getItemById: function(tgId){
    var tgItem = null;
    this.items.each(function(item){ 
      if(item.id==tgId){
        tgItem = item;
        throw $break;
      } 
    });
    return tgItem;
  }
  
})