/* Create NETR namespace */
if(typeof NETR == "undefined"){ var NETR = {}; }

NETR.Tabbox = function (el) {

	var self = this;
	this.el = el;
	
	this.tabNav = $('<div class="tab-nav"><ul class="cf"></ul></div>');
	this.el.prepend(this.tabNav);
	this.el.find('.tab-h').addClass('structural');

	this.tabs = {};
	var first = null;

	this.el.children('.tab').each(function(){
		var $this = $(this);
		var tab = {};
		tab.content = $this.find('.tab-c');
		tab.title = $this.find('.tab-h h2').text();
		tab.label = $this.attr('id');
		self.setupBox(tab, first);
		self.tabs[$this.attr('id')] = tab;
		if (!first) {
			first = tab;
		}
	});

	if (this.tabs[location.hash.replace('#', '')]) {
		this.activateBox(this.tabs[location.hash.replace('#', '')]);
	} else {
		this.activateBox(first);
	}

};

NETR.Tabbox.prototype = {
	setupBox: function (tab, first) {
		var self = this;
		if (!first) {
			this.tabNav.find('ul').append('<li class="first"><a href="#'+tab.label+'" class="'+tab.label+'">'+tab.title+'</a></li>');
		} else {
			this.tabNav.find('ul').append('<li><a href="#'+tab.label+'" class="'+tab.label+'">'+tab.title+'</a></li>');
		}

		if (location.hash == '#'+tab.label) {
			this.activateBox(tab);
		}

		$('.'+tab.label).click(function(e){
			e.preventDefault();
			self.activateBox(tab);
			return false;
		});
	},
	activateBox: function (tab) {
		if (!$('.'+tab.label).is('.active')) {
			this.el.find('.tab-nav a').removeClass('active');
			this.el.find('.tab').removeClass('active').addClass('hide-me');
			$('.'+tab.label+', #'+tab.label).addClass('active').removeClass('hide-me');
		}
	}
};