var headings = document.getElementsByTagName('h2');

var html = '<ul>';
var tabs = 0;
var currentTab = location.hash.substring(1);

var length = headings.length;
for(var i = 0; i < length; i++)
{
	var heading = headings[0];
	
	html += '<li><h2><a onclick="showTab(' + i + ');this.blur()" href="#' + i + '" id="tab-thumb-' + i + '">' + heading.innerHTML + '</a></h2></li>';
	
	heading.parentNode.removeChild(heading);
}

var divs = document.getElementsByTagName('div');
length = divs.length;
for(var i = 0; i < length; i++)
{
	var div = divs[i];
	if(div.className == 'stage')
	{
		div.id = 'tab-' + tabs++;
	}
}

html += '</ul>';

var tabArea = document.getElementById('tabs');

tabArea.innerHTML = html + tabArea.innerHTML;

var stage;

function showTab(n)
{
	for(var i = 0; i < tabs; i++)
	{
	  var tab = document.getElementById('tab-' + i);
	  var tabThumb = document.getElementById('tab-thumb-' + i);
	  tab.style.display = i == n ? '' : 'none';
	  tabThumb.className = i == n ? 'selected' : '';
	}
	
	currentTab = n;
}

showTab(currentTab);

window.onload = function()
{
	document.getElementById('next').onclick = function()
	{
	  if(currentTab < 3)
	  {
	    showTab(currentTab - -1);
	    return false;
	  }
	  return true;
	}
}