/**
  * @version 1.2 
 */

//==== my functionality
jQuery(document).ready(function(){
	buildTabs("#demo");});

  

function buildTabs(section_id){
    jQuery(section_id + " .yui-nav li").removeClass("selected"); //Remove any "active" class	
	jQuery(section_id + " .yui-nav li:first").addClass("selected").show(); //Activate first tab
	jQuery(section_id + " .yui-content .tab-content").hide(); //Hide all content
	jQuery(section_id + " .yui-content .tab-content:first").show(); //Show first tab content

	var new_tabs = jQuery(section_id + " .yui-nav li");
	new_tabs.click(function(e) {
	
	   var prev_selected_li = jQuery(section_id + " .yui-nav li.selected");
	   var prev_activeTab = jQuery(prev_selected_li.find("a").attr("href") + '_j');
	   
	   jQuery(section_id + " .yui-nav li").removeClass("selected"); //Remove any "active" class	
	   jQuery(this).addClass("selected"); //Add "active" class to selected tab
	   
	   jQuery(section_id + " .yui-content .tab-content").hide(); //Hide all tab content
	   
	   //prev_selected_li.addClass('selected');
	   prev_activeTab.show();

		var activeTab = jQuery(jQuery(this).find("a").attr("href") + '_j'); //Find the href attribute value to identify the active tab + content
		
		
		tabs_trans_slide(activeTab, prev_activeTab);
		//jQuery(activeTab).show();
		
		return false;
	});	
	return new_tabs;
}


function tabs_trans_opacity(my_active_tab, prev_selected){
  if(prev_selected){				    
		 
		 my_active_tab.show();		   
	     my_active_tab.addClass('selected-tab');
		 my_active_tab.css("opacity", "0");		
		 
		 my_active_tab.animate({'opacity':'1'},{duration:250, complete: function(){
		 
		 } })
	  }
	   
	   

}

function tabs_trans_slide(my_active_tab, prev_selected){
 
	if(prev_selected){	
	    prev_selected.stop();
		
		var init_height = my_active_tab.height();		
		 
		prev_selected.animate({"opacity": "0", "height":init_height + 'px'},{duration:250, complete: function(){
		    prev_selected.hide();
			prev_selected.css("opacity", "1");
			prev_selected.css('height','auto');
		    tabs_trans_opacity(my_active_tab, prev_selected);
			
		 } })
	  }
	else{
	   
	   my_active_tab.show();		   
	   my_active_tab.addClass('selected-tab');
	}

}