function tabBoxInit() {

	var boxes = document.getElementsByClassName('tabBox');
	for(i=0; i<boxes.length; i++) {

       tabBox = new tabBox(boxes[i]);

	}

}

function tabBox(tabBoxElem) {

    this.tabBoxElem = tabBoxElem;
	this.tabPages = [];

    this.activateTab = function(tabIndex) { 

		var labels = this.getLabelElements();
	    for(var i=0; i < labels.length; i++) {

           if (i==tabIndex) 
		      labels[i].className = "active";
		   else
		      labels[i].className = "";

		}

		for(var i=0; i<this.tabPages.length; i++) {

			if (i==tabIndex) {
				this.tabPages[i].style.display = 'block';
			} else {
				this.tabPages[i].style.display = 'none';
			}

		}

	}

    this.getLabelElements = function() {

		return this.tabBoxElem.getElementsByClassName('tabSelect')[0].getElementsByTagName('li');

	}


    this.initialize = function() {

		// Attaching events
		var labels = this.getLabelElements();

		for(var i=0; i < labels.length; i++) {

			// reference to this object
			labels[i].tabBoxParent = this;
			labels[i].className = ' ';
			labels[i].tabBoxIndex = i;	
			var oldEvent = labels[i].onclick;
			var myself = this;

			Event.observe(labels[i], 'click', function(event) { myself.activateTab(this.tabBoxIndex); } );

		}

		this.tabPages = this.tabBoxElem.getElementsByClassName('tabPage');
		

		// Making the first tab active
	    if (match = document.location.toString().match(/#tab([0-9]+)/)) {
			this.activateTab(match[1]);
		} else {
			this.activateTab(0);
		}

	}

	this.initialize();

}

AppInit.addEvent(tabBoxInit);