var smoothtabs = new Class({

  div_height : Array(),
  orig_div : Array(),
  
  initialize: function() {

    // data divs
    dd = $$('[class^="tab_content_data"]');

    // display our content divs so we can get the height
    for (i=1; i<dd.length; i++) {
      dd[i].setStyle('display', 'block');
    }

    tabs = $$('#tab_menu li');
    
    // get the height of each one of our content divs
    tabs.each(function(tab) {
      var base_name = tab.id.replace(/_current/, '');
      this.div_height[base_name] = $(base_name + '_data').scrollHeight;
      this.orig_div[base_name] = $(base_name + '_data').cloneNode(true);
    }.bind(this));

    // now that we know the height, hide the divs
    for (i=1; i<dd.length; i++) {
      dd[i].setStyle('display', 'none');
      dd[i].setOpacity(0);
    }
    
	
	
	tabs.each(function(tab) {
		var seltab = tab.id.replace(/_current/,'');
		this.mouseOverClass = "active";	
	
		tab.addEvent('click', this.select_tab.pass(tab, this));
		
		tab.addEvent('mouseover', function() {
			if(tab.id == seltab)
			{
				tab.addClass(this.mouseOverClass);
			}
		}.bind(this));
		
		tab.addEvent('mouseout', function() {
			if(tab.id == seltab)
			{
				tab.removeClass(this.mouseOverClass);
			}
		}.bind(this));
	}.bind(this));
	
  },

  select_tab: function(tab) {

	tabs.each(function(tabb) {
		if (tabb.hasClass(this.mouseOverClass)){ tabb.removeClass(this.mouseOverClass)};
	}.bind(this));

	$(tab).addClass(this.mouseOverClass);

    tab_id = tab.id.replace(/_current/,'');

    slide = $('tab_content').effect('height', {duration: 500, wait:false, transition: Fx.Transitions.linear});

    var cur_data = $E('[class="tab_content_data_current"]');
    var sel_data = $(tab_id + '_data');


    if ( cur_data.id == sel_data.id ) { return; }

    var cur_base = cur_data.id.substr(0, cur_data.id.indexOf('_data'));
    var sel_base = tab_id;
	
    var height = this.div_height[sel_base]+2;
    var orig = this.orig_div[sel_base];
    
    orig.setStyle('display', 'block');
    
    $(cur_base + '_current').id = cur_base;
    $(tab_id).id = tab_id + '_current';

	
    // out with the old, in with the new
    new Fx.Style(cur_data, 'opacity').start(0.0).chain(function () {

      slide.start(parseInt(height)).chain(function () {
        
       cur_data.setStyle('display', 'none');
               
       orig.setStyles({
                        display: 'block',
                        height: height + 'px'
                      });                          

        sel_data.setOpacity(0);

        new Fx.Style(sel_data, 'opacity').start(1.0).chain(function () {
          orig.className = 'tab_content_data_current';
          cur_data.className = 'tab_content_data';

          sel_data.replaceWith(orig);       
        })
      })
    });

  }

});