var Tabbox = function(id)
{
	this.element = $('#' + id);
	var scope = this;

	this.element.find('li a').each(function(index, link)
	{
		if($(link).className == 'active') { scope.activeTab = $(link); }
		$(link).click(function(e) { scope.tabClickEvent(e) });
	});

	this.element.find('div.tabcontent > div').each(function(index, content) { content.style.display = 'none'; });

	if(window.location.hash) { this.selectTabByName(window.location.hash.substring(1)); }
    else {
            if(this.element.find('ul.tabs li')[0]){
                var el = this.element.find('ul.tabs li')[0];
                el = el.children[0];
                if(el) { name = el.name.match(/(.+)/i)[1]; }
                if(name) { this.selectTabByName(name); }
            }
        }
};

Tabbox.prototype.tabClickEvent = function(e) { this.selectTabByName(e.target.name.match(/(.+)/i)[1]); }

Tabbox.prototype.selectTabByName = function(name)
{
	if(this.activeTab != null && this.activeContent != null)
	{
		this.hideContent(this.activeContent);
		this.activeTab.toggleClass('active');
		this.activeContent = null;
		this.activeTab = null;
	}
	this.showContent(this.activeContent = $('#tb_' + name));
	this.activeTab = this.element.find('ul.tabs li a[name*=' + name + ']').toggleClass('active');
}
/* change these two functions if you want */
Tabbox.prototype.showContent = function(element) { element.fadeIn('medium'); }
Tabbox.prototype.hideContent = function(element) { element.css({ 'display' : 'none'}) }